@khanacademy/math-input 0.4.1 → 0.5.2

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 (176) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/README.md +1 -1
  3. package/{build/math-input.css → dist/es/index.css} +0 -150
  4. package/dist/es/index.js +7798 -0
  5. package/dist/es/index.js.map +1 -0
  6. package/dist/index.css +586 -0
  7. package/dist/index.d.ts +2 -0
  8. package/dist/index.js +7768 -0
  9. package/dist/index.js.flow +2 -0
  10. package/dist/index.js.map +1 -0
  11. package/dist/strings.js +71 -0
  12. package/index.html +20 -0
  13. package/less/echo.less +56 -0
  14. package/less/main.less +5 -0
  15. package/less/overrides.less +129 -0
  16. package/less/popover.less +22 -0
  17. package/less/tabbar.less +6 -0
  18. package/package.json +60 -89
  19. package/src/actions/index.js +57 -0
  20. package/src/components/__tests__/gesture-state-machine_test.js +437 -0
  21. package/src/components/__tests__/node-manager_test.js +89 -0
  22. package/src/components/__tests__/two-page-keypad_test.js +42 -0
  23. package/src/components/app.js +73 -0
  24. package/src/components/common-style.js +47 -0
  25. package/src/components/compute-layout-parameters.js +157 -0
  26. package/src/components/corner-decal.js +56 -0
  27. package/src/components/echo-manager.js +160 -0
  28. package/src/components/empty-keypad-button.js +49 -0
  29. package/src/components/expression-keypad.js +323 -0
  30. package/src/components/fraction-keypad.js +176 -0
  31. package/src/components/gesture-manager.js +226 -0
  32. package/src/components/gesture-state-machine.js +283 -0
  33. package/src/components/icon.js +74 -0
  34. package/src/components/iconography/arrow.js +22 -0
  35. package/src/components/iconography/backspace.js +29 -0
  36. package/src/components/iconography/cdot.js +29 -0
  37. package/src/components/iconography/cos.js +30 -0
  38. package/src/components/iconography/cube-root.js +36 -0
  39. package/src/components/iconography/dismiss.js +25 -0
  40. package/src/components/iconography/divide.js +34 -0
  41. package/src/components/iconography/down.js +16 -0
  42. package/src/components/iconography/equal.js +33 -0
  43. package/src/components/iconography/exp-2.js +29 -0
  44. package/src/components/iconography/exp-3.js +29 -0
  45. package/src/components/iconography/exp.js +29 -0
  46. package/src/components/iconography/frac.js +44 -0
  47. package/src/components/iconography/geq.js +33 -0
  48. package/src/components/iconography/gt.js +33 -0
  49. package/src/components/iconography/index.js +45 -0
  50. package/src/components/iconography/jump-into-numerator.js +41 -0
  51. package/src/components/iconography/jump-out-base.js +30 -0
  52. package/src/components/iconography/jump-out-denominator.js +41 -0
  53. package/src/components/iconography/jump-out-exponent.js +30 -0
  54. package/src/components/iconography/jump-out-numerator.js +41 -0
  55. package/src/components/iconography/jump-out-parentheses.js +33 -0
  56. package/src/components/iconography/left-paren.js +33 -0
  57. package/src/components/iconography/left.js +16 -0
  58. package/src/components/iconography/leq.js +33 -0
  59. package/src/components/iconography/ln.js +29 -0
  60. package/src/components/iconography/log-n.js +29 -0
  61. package/src/components/iconography/log.js +29 -0
  62. package/src/components/iconography/lt.js +33 -0
  63. package/src/components/iconography/minus.js +32 -0
  64. package/src/components/iconography/neq.js +33 -0
  65. package/src/components/iconography/parens.js +33 -0
  66. package/src/components/iconography/percent.js +49 -0
  67. package/src/components/iconography/period.js +26 -0
  68. package/src/components/iconography/plus.js +32 -0
  69. package/src/components/iconography/radical.js +36 -0
  70. package/src/components/iconography/right-paren.js +33 -0
  71. package/src/components/iconography/right.js +16 -0
  72. package/src/components/iconography/sin.js +30 -0
  73. package/src/components/iconography/sqrt.js +32 -0
  74. package/src/components/iconography/tan.js +30 -0
  75. package/src/components/iconography/times.js +33 -0
  76. package/src/components/iconography/up.js +16 -0
  77. package/src/components/input/__tests__/context-tracking_test.js +177 -0
  78. package/src/components/input/__tests__/math-wrapper.jsx +33 -0
  79. package/src/components/input/__tests__/mathquill_test.js +747 -0
  80. package/src/components/input/cursor-contexts.js +29 -0
  81. package/src/components/input/cursor-handle.js +137 -0
  82. package/src/components/input/drag-listener.js +75 -0
  83. package/src/components/input/math-input.js +924 -0
  84. package/src/components/input/math-wrapper.js +959 -0
  85. package/src/components/input/scroll-into-view.js +72 -0
  86. package/src/components/keypad/button-assets.js +492 -0
  87. package/src/components/keypad/button.js +106 -0
  88. package/src/components/keypad/button.stories.js +29 -0
  89. package/src/components/keypad/index.js +64 -0
  90. package/src/components/keypad/keypad-page-items.js +106 -0
  91. package/src/components/keypad/keypad-pages.stories.js +32 -0
  92. package/src/components/keypad/keypad.stories.js +35 -0
  93. package/src/components/keypad/numeric-input-page.js +100 -0
  94. package/src/components/keypad/pre-algebra-page.js +98 -0
  95. package/src/components/keypad/trigonometry-page.js +90 -0
  96. package/src/components/keypad-button.js +366 -0
  97. package/src/components/keypad-container.js +303 -0
  98. package/src/components/keypad.js +154 -0
  99. package/src/components/many-keypad-button.js +44 -0
  100. package/src/components/math-icon.js +65 -0
  101. package/src/components/multi-symbol-grid.js +182 -0
  102. package/src/components/multi-symbol-popover.js +59 -0
  103. package/src/components/navigation-pad.js +139 -0
  104. package/src/components/node-manager.js +129 -0
  105. package/src/components/popover-manager.js +76 -0
  106. package/src/components/popover-state-machine.js +173 -0
  107. package/src/components/prop-types.js +82 -0
  108. package/src/components/provided-keypad.js +103 -0
  109. package/src/components/styles.js +38 -0
  110. package/src/components/svg-icon.js +25 -0
  111. package/src/components/tabbar/__tests__/tabbar_test.js +65 -0
  112. package/src/components/tabbar/icons.js +69 -0
  113. package/src/components/tabbar/item.js +138 -0
  114. package/src/components/tabbar/tabbar.js +61 -0
  115. package/src/components/tabbar/tabbar.stories.js +60 -0
  116. package/src/components/tabbar/types.js +3 -0
  117. package/src/components/text-icon.js +52 -0
  118. package/src/components/touchable-keypad-button.js +146 -0
  119. package/src/components/two-page-keypad.js +99 -0
  120. package/src/components/velocity-tracker.js +76 -0
  121. package/src/components/z-indexes.js +9 -0
  122. package/src/consts.js +74 -0
  123. package/src/data/key-configs.js +349 -0
  124. package/src/data/keys.js +72 -0
  125. package/src/demo.js +8 -0
  126. package/src/fake-react-native-web/index.js +12 -0
  127. package/src/fake-react-native-web/text.js +56 -0
  128. package/src/fake-react-native-web/view.js +91 -0
  129. package/src/index.js +14 -0
  130. package/src/native-app.js +84 -0
  131. package/src/store/index.js +505 -0
  132. package/src/utils.js +18 -0
  133. package/tools/svg-to-react/convert.py +111 -0
  134. package/tools/svg-to-react/icons/math-keypad-icon-0.svg +32 -0
  135. package/tools/svg-to-react/icons/math-keypad-icon-1.svg +32 -0
  136. package/tools/svg-to-react/icons/math-keypad-icon-2.svg +32 -0
  137. package/tools/svg-to-react/icons/math-keypad-icon-3.svg +32 -0
  138. package/tools/svg-to-react/icons/math-keypad-icon-4.svg +32 -0
  139. package/tools/svg-to-react/icons/math-keypad-icon-5.svg +32 -0
  140. package/tools/svg-to-react/icons/math-keypad-icon-6.svg +32 -0
  141. package/tools/svg-to-react/icons/math-keypad-icon-7.svg +32 -0
  142. package/tools/svg-to-react/icons/math-keypad-icon-8.svg +32 -0
  143. package/tools/svg-to-react/icons/math-keypad-icon-9.svg +32 -0
  144. package/tools/svg-to-react/icons/math-keypad-icon-addition.svg +34 -0
  145. package/tools/svg-to-react/icons/math-keypad-icon-cos.svg +38 -0
  146. package/tools/svg-to-react/icons/math-keypad-icon-delete.svg +36 -0
  147. package/tools/svg-to-react/icons/math-keypad-icon-dismiss.svg +36 -0
  148. package/tools/svg-to-react/icons/math-keypad-icon-division.svg +36 -0
  149. package/tools/svg-to-react/icons/math-keypad-icon-equals-not.svg +50 -0
  150. package/tools/svg-to-react/icons/math-keypad-icon-equals.svg +48 -0
  151. package/tools/svg-to-react/icons/math-keypad-icon-exponent-2.svg +38 -0
  152. package/tools/svg-to-react/icons/math-keypad-icon-exponent-3.svg +38 -0
  153. package/tools/svg-to-react/icons/math-keypad-icon-exponent.svg +38 -0
  154. package/tools/svg-to-react/icons/math-keypad-icon-fraction.svg +42 -0
  155. package/tools/svg-to-react/icons/math-keypad-icon-greater-than.svg +46 -0
  156. package/tools/svg-to-react/icons/math-keypad-icon-jump-out-base.svg +44 -0
  157. package/tools/svg-to-react/icons/math-keypad-icon-jump-out-denominator.svg +48 -0
  158. package/tools/svg-to-react/icons/math-keypad-icon-jump-out-exponent.svg +44 -0
  159. package/tools/svg-to-react/icons/math-keypad-icon-jump-out-parentheses.svg +44 -0
  160. package/tools/svg-to-react/icons/math-keypad-icon-less-than.svg +46 -0
  161. package/tools/svg-to-react/icons/math-keypad-icon-log-10.svg +36 -0
  162. package/tools/svg-to-react/icons/math-keypad-icon-log-e.svg +36 -0
  163. package/tools/svg-to-react/icons/math-keypad-icon-log.svg +38 -0
  164. package/tools/svg-to-react/icons/math-keypad-icon-multiplication-cross.svg +40 -0
  165. package/tools/svg-to-react/icons/math-keypad-icon-multiplication-dot.svg +38 -0
  166. package/tools/svg-to-react/icons/math-keypad-icon-percent.svg +42 -0
  167. package/tools/svg-to-react/icons/math-keypad-icon-radical-2.svg +36 -0
  168. package/tools/svg-to-react/icons/math-keypad-icon-radical-3.svg +38 -0
  169. package/tools/svg-to-react/icons/math-keypad-icon-radical.svg +38 -0
  170. package/tools/svg-to-react/icons/math-keypad-icon-radix-character.svg +32 -0
  171. package/tools/svg-to-react/icons/math-keypad-icon-sin.svg +38 -0
  172. package/tools/svg-to-react/icons/math-keypad-icon-subtraction.svg +32 -0
  173. package/tools/svg-to-react/icons/math-keypad-icon-tan.svg +38 -0
  174. package/tools/svg-to-react/symbol_map.py +41 -0
  175. package/LICENSE.txt +0 -21
  176. package/build/math-input.js +0 -1
@@ -0,0 +1,71 @@
1
+ // @noflow
2
+ /**
3
+ * WARNING: This is an autogenerated file. Do not edit by hand.
4
+ * To regenerate, run: yarn extract-strings.
5
+ */
6
+
7
+ module.exports = [
8
+ i18n._("Cosine", {}),
9
+ // I18N: A label for a button that will cube (take to the third power)
10
+ i18n._("Cube", {}),
11
+ i18n._("Cube root", {}),
12
+ // I18N: A label for a button that will allow the user to input a custom
13
+ i18n._("Custom exponent", {}),
14
+ // I18N: A label for a decimal symbol.
15
+ i18n._("Decimal", {}),
16
+ // I18N: A label for a button that will delete some input.
17
+ i18n._("Delete", {}),
18
+ // I18N: A label for a button that will dismiss/hide a keypad.
19
+ i18n._("Dismiss", {}),
20
+ // I18N: A label for a division sign.
21
+ i18n._("Divide", {}),
22
+ i18n._("Down arrow", {}),
23
+ i18n._("Equals sign", {}),
24
+ // I18N: A label for a button that creates a new fraction next to the
25
+ // I18N: A label for a button that creates a new fraction next to the
26
+ i18n._("Fraction, excluding the current expression", {}),
27
+ // I18N: A label for a button that creates a new fraction and puts the
28
+ i18n._("Fraction, with current expression in numerator", {}),
29
+ i18n._("Greater than or equal to sign", {}),
30
+ // I18N: A label for a 'greater than' sign (represented as '>').
31
+ i18n._("Greater than sign", {}),
32
+ i18n._("Left arrow", {}),
33
+ i18n._("Left parenthesis", {}),
34
+ i18n._("Less than or equal to sign", {}),
35
+ // I18N: A label for a 'less than' sign (represented as '<').
36
+ i18n._("Less than sign", {}),
37
+ i18n._("Logarithm with base 10", {}),
38
+ i18n._("Logarithm with custom base", {}),
39
+ i18n._("Math input box", {}),
40
+ // I18N: A label for a minus sign.
41
+ i18n._("Minus", {}),
42
+ // I18N: A label for a multiplication sign (represented with an 'x').
43
+ // I18N: A label for a multiplication sign (represented as a dot).
44
+ i18n._("Multiply", {}),
45
+ i18n._("Natural logarithm", {}),
46
+ i18n._("Navigate right into the numerator of a fraction", {}),
47
+ i18n._("Navigate right out of a base", {}),
48
+ i18n._("Navigate right out of a set of parentheses", {}),
49
+ i18n._("Navigate right out of an exponent", {}),
50
+ i18n._("Navigate right out of the denominator of a fraction", {}),
51
+ i18n._("Navigate right out of the numerator and into the denominator", {}),
52
+ // I18N: A label for a minus sign.
53
+ i18n._("Negative", {}),
54
+ i18n._("Not-equals sign", {}),
55
+ // I18N: A label for a percent sign.
56
+ i18n._("Percent", {}),
57
+ i18n._("Pi", {}),
58
+ // I18N: A label for a plus sign.
59
+ i18n._("Plus", {}),
60
+ i18n._("Radical with custom root", {}),
61
+ i18n._("Right arrow", {}),
62
+ i18n._("Right parenthesis", {}),
63
+ i18n._("Sine", {}),
64
+ // I18N: A label for a button that will square (take to the second
65
+ i18n._("Square", {}),
66
+ i18n._("Square root", {}),
67
+ i18n._("Tangent", {}),
68
+ i18n._("Tap with one or two fingers to open keyboard", {}),
69
+ i18n._("Theta", {}),
70
+ i18n._("Up arrow", {}),
71
+ ];
package/index.html ADDED
@@ -0,0 +1,20 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1">
7
+ <title>Math Input</title>
8
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css">
9
+ <style>
10
+ body {
11
+ margin: 0;
12
+ }
13
+ </style>
14
+ </head>
15
+
16
+ <body>
17
+ <div id="root"></div>
18
+ </body>
19
+
20
+ </html>
package/less/echo.less ADDED
@@ -0,0 +1,56 @@
1
+ /**
2
+ * Styles for managing the popover animations.
3
+ *
4
+ * Ideally, we'd be generating these styles with Aphrodite (along with
5
+ * CSSTransitionGroup's support for custom classnames), but the generated
6
+ * styles have issues on mobile Safari.
7
+ * See: https://github.com/Khan/aphrodite/issues/68.
8
+ *
9
+ * If the animation durations change, the corresponding values in
10
+ * echo-manager.js must change as well.
11
+ */
12
+
13
+ // Variant A: Slide and fade.
14
+
15
+ .echo-slide-and-fade-enter {
16
+ opacity: 1 !important;
17
+ transform: translate3d(0, 0, 0) !important;
18
+
19
+ &.echo-slide-and-fade-enter-active {
20
+ opacity: 0 !important;
21
+ transform: translate3d(0, -33%, 0) !important;
22
+
23
+ /**
24
+ * TODO(charlie): These times are intentionally different, which means
25
+ * that the animation really "ends" after 400ms
26
+ * cubic-bezier(1, 0, 0.9, 1) (since the opacity goes to 0), even though
27
+ * the transform doesn't complete. There's probably a way to achieve the
28
+ * same effect by manipulating the transform's Bezier curve and total
29
+ * displacement.
30
+ */
31
+ transition: transform 800ms cubic-bezier(0, 1, 0.25, 1),
32
+ opacity 400ms cubic-bezier(1, 0, 0.9, 1) !important;
33
+ }
34
+ }
35
+
36
+ // Variant B: Fade, but don't slide.
37
+
38
+ .echo-fade-only-enter {
39
+ opacity: 1 !important;
40
+
41
+ &.echo-fade-only-enter-active {
42
+ opacity: 0 !important;
43
+ transition: opacity 300ms cubic-bezier(0.25, 0, 0.75, 1) !important;
44
+ }
45
+ }
46
+
47
+ // Variant C: Fade for a longer duration, but again, don't slide.
48
+
49
+ .echo-long-fade-only-enter {
50
+ opacity: 1 !important;
51
+
52
+ &.echo-long-fade-only-enter-active {
53
+ opacity: 0 !important;
54
+ transition: opacity 400ms cubic-bezier(0.75, 0, 0.75, 1) !important;
55
+ }
56
+ }
package/less/main.less ADDED
@@ -0,0 +1,5 @@
1
+ @import "echo.less";
2
+ @import "overrides.less";
3
+ @import "popover.less";
4
+ @import "../../../node_modules/mathquill/build/mathquill.css";
5
+ @import "tabbar.less";
@@ -0,0 +1,129 @@
1
+ @wonderBlocksBlue: #1865f2;
2
+ @offBlack16: rgba(33, 36, 44, 0.16);
3
+
4
+ @cursorWidth: 2px;
5
+ @cursorMargin: -1px;
6
+ @emptyBlockBorderRadius: 1px;
7
+ @emptyBlockPadding: 4px;
8
+
9
+ // NOTE(charlie): The 500ms animation length perfectly matches MathQuill's own
10
+ // frequency for toggling the application of the .mq-blink class. If we were to
11
+ // change this animation length at all, we'd need to modify MathQuill as well.
12
+ @cursorAnimationDuration: 500ms;
13
+
14
+ .keypad-input {
15
+ outline: none !important;
16
+
17
+ .mq-editable-field {
18
+ .mq-root-block {
19
+ overflow-x: scroll;
20
+ }
21
+
22
+ .mq-cursor:not(:only-child),
23
+ .mq-root-block.mq-hasCursor > .mq-cursor:only-child {
24
+ /* HACK(charlie): Magic numbers to properly size and position the vertical
25
+ cursor, which is visible whenever the cursor is not alone in its parent,
26
+ with the exception that it's also visible when the entire input is
27
+ empty. */
28
+ height: 20px !important;
29
+ width: @cursorWidth;
30
+ margin-top: -5px !important;
31
+ vertical-align: middle !important;
32
+ border-radius: 1px !important;
33
+ }
34
+
35
+ .mq-cursor {
36
+ border-left: @cursorWidth solid @wonderBlocksBlue !important;
37
+
38
+ margin-left: @cursorMargin !important;
39
+ margin-right: @cursorMargin !important;
40
+
41
+ // Fade the cursor out, overriding MathQuill's default behavior.
42
+ opacity: 1 !important;
43
+ transition: opacity @cursorAnimationDuration ease-out !important;
44
+ visibility: visible !important;
45
+
46
+ &.mq-blink {
47
+ // And fade the cursor back in.
48
+ opacity: 0 !important;
49
+ transition: opacity @cursorAnimationDuration ease-in !important;
50
+ visibility: visible !important;
51
+ }
52
+ }
53
+
54
+ .mq-non-leaf .mq-cursor:only-child {
55
+ // Set the cursor to a grey rectangle, rather than a vertical line.
56
+ border: @cursorWidth solid !important;
57
+ border-color: @wonderBlocksBlue !important;
58
+ border-radius: @emptyBlockBorderRadius;
59
+ opacity: 1 !important;
60
+ padding: 0 @emptyBlockPadding 0 @emptyBlockPadding;
61
+ transition: border-color @cursorAnimationDuration ease-out !important;
62
+
63
+ &.mq-blink {
64
+ // And animate it between blue and gray.
65
+ border-color: @wonderBlocksBlue !important;
66
+ opacity: 1 !important;
67
+ transition: border-color @cursorAnimationDuration ease-in !important;
68
+ }
69
+ }
70
+ }
71
+
72
+ .mq-empty {
73
+ background: transparent !important;
74
+ }
75
+
76
+ // Adds empty block styling to elements with .mq-hasCursor but without a
77
+ // cursor element (this happens where the cursor is when the math input
78
+ // loses focus).
79
+ .mq-empty:not(.mq-root-block):after,
80
+ .mq-hasCursor:empty:not(.mq-root-block):after {
81
+ border: @cursorWidth solid @offBlack16;
82
+ border-radius: @emptyBlockBorderRadius;
83
+ // Hides the 'c' content added by MathQuill to measure the width.
84
+ color: transparent;
85
+ display: inline-block;
86
+ margin-left: @cursorMargin;
87
+ margin-right: @cursorMargin;
88
+ padding: 0 @emptyBlockPadding 0 @emptyBlockPadding;
89
+ visibility: visible !important;
90
+ }
91
+
92
+ .mq-selection .mq-empty:not(.mq-root-block):after {
93
+ border-color: white;
94
+ }
95
+
96
+ .mq-hasCursor:empty:not(.mq-root-block):after {
97
+ // Place a 'c' inside for sizing the cursor (for the case explained
98
+ // above); normally, MathQuill already does this for .mq-cursor.
99
+ content: 'c';
100
+ }
101
+
102
+ .mq-math-mode .mq-selection,
103
+ .mq-editable-field .mq-selection {
104
+ .mq-non-leaf {
105
+ background: @wonderBlocksBlue !important;
106
+ border-color: white !important;
107
+ color: white !important;
108
+ }
109
+
110
+ .mq-scaled {
111
+ background: transparent !important;
112
+ border-color: transparent !important;
113
+ color: white !important;
114
+ }
115
+ }
116
+
117
+ .mq-selection {
118
+ background: @wonderBlocksBlue !important;
119
+ border-color: white !important;
120
+ color: white !important;
121
+ display: inline-block !important;
122
+ }
123
+ }
124
+
125
+ // The keypad sets its own color styles for KaTeX elements that are rendered in
126
+ // its keys, so prevent any external styling.
127
+ .keypad-container .katex {
128
+ color: inherit !important;
129
+ }
@@ -0,0 +1,22 @@
1
+ /**
2
+ * Styles for managing the popover animations.
3
+ *
4
+ * Ideally, we'd be generating these styles with Aphrodite (along with
5
+ * CSSTransitionGroup's support for custom classnames), but the generated
6
+ * styles have issues on mobile Safari.
7
+ * See: https://github.com/Khan/aphrodite/issues/68.
8
+ *
9
+ * If the animation durations change, the corresponding values in
10
+ * popover-manager.js must change as well.
11
+ */
12
+
13
+ @animationDuration: 200ms;
14
+
15
+ .popover-enter {
16
+ opacity: 0 !important;
17
+
18
+ &.popover-enter-active {
19
+ opacity: 1 !important;
20
+ transition: opacity @animationDuration ease-out !important;
21
+ }
22
+ }
@@ -0,0 +1,6 @@
1
+ .tabbar_item {
2
+ background-color: red;
3
+ &:focus {
4
+ background-color: green;
5
+ }
6
+ }
package/package.json CHANGED
@@ -1,91 +1,62 @@
1
1
  {
2
- "name": "@khanacademy/math-input",
3
- "publishConfig": {
4
- "access": "public"
5
- },
6
- "version": "0.4.1",
7
- "description": "",
8
- "main": "build/math-input.js",
9
- "files": [
10
- "build/"
11
- ],
12
- "scripts": {
13
- "test": "jest",
14
- "watch_test": "jest --watch",
15
- "build": "webpack --config webpack.config.externals.js",
16
- "watch": "webpack --config webpack.config.externals.js --watch",
17
- "start": "webpack-dev-server --open",
18
- "format": "prettier --write \"src/**\" \"test/**\" \"lib/**\"",
19
- "prepare": "install-peers",
20
- "prepublishOnly": "yarn build",
21
- "storybook": "start-storybook -p 6006",
22
- "build-storybook": "build-storybook"
23
- },
24
- "author": "",
25
- "license": "MIT",
26
- "dependencies": {
27
- "performance-now": "^0.2.0"
28
- },
29
- "devDependencies": {
30
- "@babel/cli": "^7.0.0",
31
- "@babel/core": "^7.0.0",
32
- "@babel/plugin-proposal-class-properties": "^7.7.4",
33
- "@babel/plugin-transform-template-literals": "^7.8.3",
34
- "@babel/polyfill": "^7.0.0",
35
- "@babel/preset-env": "^7.4.3",
36
- "@babel/preset-flow": "^7.8.3",
37
- "@babel/preset-react": "^7.0.0",
38
- "@babel/register": "^7.0.0",
39
- "@storybook/addon-actions": "^5.3.14",
40
- "@storybook/addon-backgrounds": "^5.3.14",
41
- "@storybook/addon-knobs": "^5.3.14",
42
- "@storybook/addon-links": "^5.3.14",
43
- "@storybook/addon-viewport": "^5.3.17",
44
- "@storybook/addons": "^5.3.14",
45
- "@storybook/react": "^5.3.14",
46
- "babel-core": "^7.0.0-bridge.0",
47
- "babel-loader": "7.1.1",
48
- "core-js": "^3.0.1",
49
- "css-loader": "^3.4.2",
50
- "enzyme": "^3.11.0",
51
- "enzyme-adapter-react-16": "^1.15.2",
52
- "exports-loader": "^0.6.3",
53
- "file-loader": "^4.0.0",
54
- "flow-bin": "^0.166.0",
55
- "flow-enums-runtime": "^0.0.6",
56
- "html-webpack-plugin": "^3.2.0",
57
- "install-peers-cli": "^2.2.0",
58
- "jest": "24",
59
- "jest-enzyme": "^7.1.2",
60
- "jsdom": "^8.4.0",
61
- "less": "^2.7.2",
62
- "less-loader": "^5.0.0",
63
- "less-plugin-autoprefix": "^1.5.1",
64
- "less-plugin-clean-css": "^1.5.1",
65
- "mini-css-extract-plugin": "^0.9.0",
66
- "prettier": "^1.19.1",
67
- "react": "^16.8.0",
68
- "react-dom": "^16.8.0",
69
- "terser-webpack-plugin": "^4.2.3",
70
- "webpack": "^4.32.2",
71
- "webpack-cli": "^3.3.2",
72
- "webpack-dev-server": "^3.4.1"
73
- },
74
- "peerDependencies": {
75
- "@khanacademy/wonder-blocks-clickable": "^2.2.0",
76
- "@khanacademy/wonder-blocks-color": "^1.1.19",
77
- "@khanacademy/wonder-blocks-core": "^3.2.0",
78
- "aphrodite": "^1.1.0",
79
- "jquery": "^2.1.1",
80
- "katex": "^0.11.1",
81
- "mathquill": "git+https://git@github.com/Khan/mathquill.git#a9ae54e057c5c1acc8244a5627acbff29901d992",
82
- "prop-types": "15.6.1",
83
- "react": "^16.8.0",
84
- "react-dom": "^16.8.0",
85
- "react-redux": "^7.2.6",
86
- "react-router": "^5.2.1",
87
- "react-router-dom": "^5.3.0",
88
- "react-transition-group": "^4.4.1",
89
- "redux": "^4.0.0"
90
- }
2
+ "name": "@khanacademy/math-input",
3
+ "description": "Khan Academy's new expression editor for the mobile web.",
4
+ "author": "Khan Academy",
5
+ "license": "MIT",
6
+ "version": "0.5.2",
7
+ "publishConfig": {
8
+ "access": "public"
9
+ },
10
+ "repository": {
11
+ "type": "git",
12
+ "url": "https://github.com/Khan/math-input.git"
13
+ },
14
+ "bugs": {
15
+ "url": "https://github.com/Khan/perseus/issues"
16
+ },
17
+ "module": "dist/es/index.js",
18
+ "main": "dist/index.js",
19
+ "source": "src/index.js",
20
+ "scripts": {},
21
+ "dependencies": {
22
+ "performance-now": "^0.2.0"
23
+ },
24
+ "devDependencies": {
25
+ "@khanacademy/wonder-blocks-clickable": "^2.2.0",
26
+ "@khanacademy/wonder-blocks-color": "^1.1.19",
27
+ "@khanacademy/wonder-blocks-core": "^3.2.0",
28
+ "@khanacademy/wonder-blocks-i18n": "^1.2.3",
29
+ "aphrodite": "^1.1.0",
30
+ "jquery": "^2.1.1",
31
+ "katex": "^0.11.1",
32
+ "mathquill": "git+https://git@github.com/Khan/mathquill.git#a9ae54e057c5c1acc8244a5627acbff29901d992",
33
+ "perseus-build-settings": "^0.0.2",
34
+ "prop-types": "15.6.1",
35
+ "react": "^16.8.0",
36
+ "react-dom": "^16.8.0",
37
+ "react-redux": "^7.2.6",
38
+ "react-router": "^5.2.1",
39
+ "react-router-dom": "^5.3.0",
40
+ "react-transition-group": "^4.4.1",
41
+ "redux": "^4.0.0"
42
+ },
43
+ "peerDependencies": {
44
+ "@khanacademy/wonder-blocks-clickable": "^2.2.0",
45
+ "@khanacademy/wonder-blocks-color": "^1.1.19",
46
+ "@khanacademy/wonder-blocks-core": "^3.2.0",
47
+ "@khanacademy/wonder-blocks-i18n": "^1.2.3",
48
+ "aphrodite": "^1.1.0",
49
+ "jquery": "^2.1.1",
50
+ "katex": "^0.11.1",
51
+ "mathquill": "git+https://git@github.com/Khan/mathquill.git#a9ae54e057c5c1acc8244a5627acbff29901d992",
52
+ "prop-types": "15.6.1",
53
+ "react": "^16.8.0",
54
+ "react-dom": "^16.8.0",
55
+ "react-redux": "^7.2.6",
56
+ "react-router": "^5.2.1",
57
+ "react-router-dom": "^5.3.0",
58
+ "react-transition-group": "^4.4.1",
59
+ "redux": "^4.0.0"
60
+ },
61
+ "keywords": []
91
62
  }
@@ -0,0 +1,57 @@
1
+ // naming convention: verb + noun
2
+ // the noun should be one of the other properties in the object that's
3
+ // being dispatched
4
+
5
+ export const dismissKeypad = () => {
6
+ return {
7
+ type: "DismissKeypad",
8
+ };
9
+ };
10
+
11
+ export const activateKeypad = () => {
12
+ return {
13
+ type: "ActivateKeypad",
14
+ };
15
+ };
16
+
17
+ /**
18
+ * Configure the keypad with the provided configuration parameters.
19
+ *
20
+ * See: `prop-types.js#keypadConfigurationPropType`.
21
+ */
22
+ export const configureKeypad = (configuration) => {
23
+ return {
24
+ type: "ConfigureKeypad",
25
+ configuration,
26
+ };
27
+ };
28
+
29
+ export const setPageSize = (pageWidthPx, pageHeightPx) => {
30
+ return {
31
+ type: "SetPageSize",
32
+ pageWidthPx,
33
+ pageHeightPx,
34
+ };
35
+ };
36
+
37
+ export const removeEcho = (animationId) => {
38
+ return {
39
+ type: "RemoveEcho",
40
+ animationId,
41
+ };
42
+ };
43
+
44
+ // Input-related actions.
45
+ export const setKeyHandler = (keyHandler) => {
46
+ return {
47
+ type: "SetKeyHandler",
48
+ keyHandler,
49
+ };
50
+ };
51
+
52
+ export const setCursor = (cursor) => {
53
+ return {
54
+ type: "SetCursor",
55
+ cursor,
56
+ };
57
+ };