@khanacademy/perseus 6.7.0 → 7.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.
package/dist/index.d.ts CHANGED
@@ -55,7 +55,6 @@ export * as Dependencies from "./dependencies";
55
55
  export { Errors, Log } from "./logging/log";
56
56
  export { PerseusError } from "./perseus-error";
57
57
  export { default as JiptParagraphs } from "./jipt-paragraphs";
58
- export { default as KeypadContext } from "./keypad-context";
59
58
  export { default as KhanMath } from "./util/math";
60
59
  export { default as LoadingContext } from "./loading-context";
61
60
  export { default as mediaQueries } from "./styles/media-queries";
@@ -87,7 +86,7 @@ export { default as WIDGET_PROP_DENYLIST } from "./mixins/widget-prop-denylist";
87
86
  export type { PerseusOptions } from "./init";
88
87
  export type { ILogger, LogErrorOptions, ErrorKind } from "./logging/log";
89
88
  export type { ServerItemRenderer as ServerItemRendererComponent } from "./server-item-renderer";
90
- export type { Alignment, APIOptions, APIOptionsWithDefaults, ChangeHandler, DeviceType, DomInsertCheckFn, EditorMode, FocusPath, Hint, ImageDict, ImageUploader, JiptLabelStore, JiptRenderer, KEScore, LinterContextProps, PerseusDependencies, PerseusScore, RendererInterface, Version, VideoData, VideoKind, WidgetDict, WidgetExports, WidgetInfo, } from "./types";
89
+ export type { Alignment, APIOptions, APIOptionsWithDefaults, ChangeHandler, DeviceType, DomInsertCheckFn, EditorMode, FocusPath, Hint, ImageDict, ImageUploader, JiptLabelStore, JiptRenderer, LinterContextProps, PerseusDependencies, PerseusScore, Version, VideoData, VideoKind, WidgetDict, WidgetExports, WidgetInfo, } from "./types";
91
90
  export type { ParsedValue } from "./util";
92
91
  export type { MathFormat, InputNumberWidget, PerseusImageBackground, PerseusInteractiveGraphWidgetOptions, PerseusRadioWidgetOptions, PerseusExpressionWidgetOptions, PerseusRenderer, } from "./perseus-types";
93
92
  export type { Coord } from "./interactive2/types";
package/dist/index.js CHANGED
@@ -1492,6 +1492,10 @@ const ApiOptions = {
1492
1492
  nativeKeypadProxy: PropTypes__default["default"].func,
1493
1493
  // Indicates whether or not to use mobile styling.
1494
1494
  isMobile: PropTypes__default["default"].bool,
1495
+ // Whether to use v1 (Legacy) Keypad for MathInput mobile or
1496
+ // use the new v2 Keypad
1497
+ // TODO [LC-1088]: remove after v2 release
1498
+ useV2Keypad: PropTypes__default["default"].bool,
1495
1499
  // A function, called with a bool indicating whether use of the
1496
1500
  // drawing area (scratchpad) should be allowed/disallowed.
1497
1501
  // Previously handled by `Khan.scratchpad.enable/disable`
@@ -1530,6 +1534,7 @@ const ApiOptions = {
1530
1534
  defaults: {
1531
1535
  isArticle: false,
1532
1536
  isMobile: false,
1537
+ useV2Keypad: false,
1533
1538
  onInputError: function () {},
1534
1539
  onFocusChange: function () {},
1535
1540
  GroupMetadataEditor: StubTagEditor,
@@ -3002,7 +3007,7 @@ const defaultContext$2 = {
3002
3007
  assetStatuses: {},
3003
3008
  setAssetStatus: (assetKey, loaded) => {}
3004
3009
  };
3005
- const context$2 = /*#__PURE__*/React__namespace.createContext(defaultContext$2);
3010
+ const context$1 = /*#__PURE__*/React__namespace.createContext(defaultContext$2);
3006
3011
 
3007
3012
  /* eslint-disable @babel/no-invalid-this, getter-return, one-var */
3008
3013
  let supportsPassive = false;
@@ -17659,7 +17664,7 @@ class ZoomableTeX extends React__namespace.Component {
17659
17664
  return /*#__PURE__*/React__namespace.createElement(Zoomable, {
17660
17665
  readyToMeasure: this.state.isRendered,
17661
17666
  computeChildBounds: computeMathBounds
17662
- }, /*#__PURE__*/React__namespace.createElement(context$2.Consumer, null, _ref => {
17667
+ }, /*#__PURE__*/React__namespace.createElement(context$1.Consumer, null, _ref => {
17663
17668
  let {
17664
17669
  setAssetStatus
17665
17670
  } = _ref;
@@ -19787,7 +19792,7 @@ class Renderer extends React__namespace.Component {
19787
19792
  }, /*#__PURE__*/React__namespace.createElement(ErrorBoundary, null, /*#__PURE__*/React__namespace.createElement("div", {
19788
19793
  className: "perseus-block-math-inner",
19789
19794
  style: innerStyle
19790
- }, /*#__PURE__*/React__namespace.createElement(context$2.Consumer, null, _ref => {
19795
+ }, /*#__PURE__*/React__namespace.createElement(context$1.Consumer, null, _ref => {
19791
19796
  let {
19792
19797
  setAssetStatus
19793
19798
  } = _ref;
@@ -19812,7 +19817,7 @@ class Renderer extends React__namespace.Component {
19812
19817
  // wrap to the next line
19813
19818
  whiteSpace: "nowrap"
19814
19819
  }
19815
- }, /*#__PURE__*/React__namespace.createElement(ErrorBoundary, null, /*#__PURE__*/React__namespace.createElement("span", null), /*#__PURE__*/React__namespace.createElement(context$2.Consumer, null, _ref2 => {
19820
+ }, /*#__PURE__*/React__namespace.createElement(ErrorBoundary, null, /*#__PURE__*/React__namespace.createElement("span", null), /*#__PURE__*/React__namespace.createElement(context$1.Consumer, null, _ref2 => {
19816
19821
  let {
19817
19822
  setAssetStatus
19818
19823
  } = _ref2;
@@ -19843,7 +19848,7 @@ class Renderer extends React__namespace.Component {
19843
19848
  const responsive = !state.inTable;
19844
19849
  return /*#__PURE__*/React__namespace.createElement(ErrorBoundary, {
19845
19850
  key: state.key
19846
- }, /*#__PURE__*/React__namespace.createElement(context$2.Consumer, null, _ref3 => {
19851
+ }, /*#__PURE__*/React__namespace.createElement(context$1.Consumer, null, _ref3 => {
19847
19852
  let {
19848
19853
  setAssetStatus
19849
19854
  } = _ref3;
@@ -31908,7 +31913,7 @@ class LabelImage extends React__namespace.Component {
31908
31913
  // than its rendered in the widget, this would
31909
31914
  // result in a zoom of the image.
31910
31915
  selectedMarkerIndex !== -1 && styles$f.imageInteractionDisabled)
31911
- }, /*#__PURE__*/React__namespace.createElement(context$2.Consumer, null, _ref => {
31916
+ }, /*#__PURE__*/React__namespace.createElement(context$1.Consumer, null, _ref => {
31912
31917
  let {
31913
31918
  setAssetStatus
31914
31919
  } = _ref;
@@ -44177,13 +44182,9 @@ const ProvideKeypad = {
44177
44182
  },
44178
44183
  componentDidMount() {
44179
44184
  const _this = this;
44180
- if (
44181
- // @ts-expect-error [FEI-5003] - TS2339 - Property 'props' does not exist on type '{ readonly propTypes: { readonly apiOptions: React.PropType<{ customKeypad?: boolean | undefined; nativeKeypadProxy?: ((...a: readonly any[]) => unknown) | undefined; }>; readonly keypadStyle: Requireable<any>; }; readonly getInitialState: () => { ...; }; readonly componentDidMount: () => void; readonly componentWil...'.
44182
- _this.props.apiOptions &&
44183
- // @ts-expect-error [FEI-5003] - TS2339 - Property 'props' does not exist on type '{ readonly propTypes: { readonly apiOptions: React.PropType<{ customKeypad?: boolean | undefined; nativeKeypadProxy?: ((...a: readonly any[]) => unknown) | undefined; }>; readonly keypadStyle: Requireable<any>; }; readonly getInitialState: () => { ...; }; readonly componentDidMount: () => void; readonly componentWil...'.
44184
- _this.props.apiOptions.customKeypad &&
44185
44185
  // @ts-expect-error [FEI-5003] - TS2339 - Property 'props' does not exist on type '{ readonly propTypes: { readonly apiOptions: React.PropType<{ customKeypad?: boolean | undefined; nativeKeypadProxy?: ((...a: readonly any[]) => unknown) | undefined; }>; readonly keypadStyle: Requireable<any>; }; readonly getInitialState: () => { ...; }; readonly componentDidMount: () => void; readonly componentWil...'.
44186
- !_this.props.apiOptions.nativeKeypadProxy) {
44186
+ const apiOptions = _this.props.apiOptions;
44187
+ if (apiOptions && apiOptions.customKeypad && !apiOptions.nativeKeypadProxy) {
44187
44188
  var _document$body;
44188
44189
  // TODO(charlie): Render this and the wrapped component in the same
44189
44190
  // React tree. We may also want to add this keypad asynchronously
@@ -44192,7 +44193,7 @@ const ProvideKeypad = {
44192
44193
  _this._keypadContainer = document.createElement("div");
44193
44194
  // @ts-expect-error [FEI-5003] - TS2339 - Property '_keypadContainer' does not exist on type '{ readonly propTypes: { readonly apiOptions: React.PropType<{ customKeypad?: boolean | undefined; nativeKeypadProxy?: ((...a: readonly any[]) => unknown) | undefined; }>; readonly keypadStyle: Requireable<any>; }; readonly getInitialState: () => { ...; }; readonly componentDidMount: () => void; readonly componentWil...'.
44194
44195
  (_document$body = document.body) === null || _document$body === void 0 ? void 0 : _document$body.appendChild(_this._keypadContainer);
44195
- render( /*#__PURE__*/React__namespace.createElement(mathInput.LegacyKeypad, {
44196
+ render( /*#__PURE__*/React__namespace.createElement(mathInput.Keypad, {
44196
44197
  onElementMounted: element => {
44197
44198
  // NOTE(kevinb): The reason why this setState works is
44198
44199
  // b/c we're calling it manually from item-renderer.jsx
@@ -44208,7 +44209,8 @@ const ProvideKeypad = {
44208
44209
  }
44209
44210
  // @ts-expect-error [FEI-5003] - TS2339 - Property 'props' does not exist on type '{ readonly propTypes: { readonly apiOptions: React.PropType<{ customKeypad?: boolean | undefined; nativeKeypadProxy?: ((...a: readonly any[]) => unknown) | undefined; }>; readonly keypadStyle: Requireable<any>; }; readonly getInitialState: () => { ...; }; readonly componentDidMount: () => void; readonly componentWil...'.
44210
44211
  ,
44211
- style: _this.props.keypadStyle
44212
+ style: _this.props.keypadStyle,
44213
+ useV2Keypad: apiOptions.useV2Keypad
44212
44214
  }),
44213
44215
  // @ts-expect-error [FEI-5003] - TS2339 - Property '_keypadContainer' does not exist on type '{ readonly propTypes: { readonly apiOptions: React.PropType<{ customKeypad?: boolean | undefined; nativeKeypadProxy?: ((...a: readonly any[]) => unknown) | undefined; }>; readonly keypadStyle: Requireable<any>; }; readonly getInitialState: () => { ...; }; readonly componentDidMount: () => void; readonly componentWil...'.
44214
44216
  _this._keypadContainer);
@@ -45135,7 +45137,7 @@ _defineProperty(ItemRenderer, "defaultProps", {
45135
45137
  const defaultContext = {
45136
45138
  onRendered: isRendered => {}
45137
45139
  };
45138
- const context$1 = /*#__PURE__*/React__namespace.createContext(defaultContext);
45140
+ const context = /*#__PURE__*/React__namespace.createContext(defaultContext);
45139
45141
 
45140
45142
  const {
45141
45143
  mapObject
@@ -45406,7 +45408,7 @@ class ServerItemRenderer extends React__namespace.Component {
45406
45408
  assetStatuses: this.state.assetStatuses,
45407
45409
  setAssetStatus: this.setAssetStatus
45408
45410
  };
45409
- const questionRenderer = /*#__PURE__*/React__namespace.createElement(context$2.Provider, {
45411
+ const questionRenderer = /*#__PURE__*/React__namespace.createElement(context$1.Provider, {
45410
45412
  value: contextValue
45411
45413
  }, /*#__PURE__*/React__namespace.createElement(Renderer, {
45412
45414
  keypadElement: this.props.keypadElement,
@@ -45453,7 +45455,7 @@ const styles$3 = aphrodite.StyleSheet.create({
45453
45455
  marginLeft: 50
45454
45456
  }
45455
45457
  });
45456
- const ref = /*#__PURE__*/React__namespace.forwardRef((props, ref) => /*#__PURE__*/React__namespace.createElement(context$1.Consumer, null, _ref => {
45458
+ const ref = /*#__PURE__*/React__namespace.forwardRef((props, ref) => /*#__PURE__*/React__namespace.createElement(context.Consumer, null, _ref => {
45457
45459
  let {
45458
45460
  onRendered
45459
45461
  } = _ref;
@@ -45947,24 +45949,6 @@ var constants = /*#__PURE__*/Object.freeze({
45947
45949
  perseusFrameBorderWidth: perseusFrameBorderWidth
45948
45950
  });
45949
45951
 
45950
- /**
45951
- * KeypadContext provides a way to the Keypad and (Server)ItemRenderer to
45952
- * communicate.
45953
- *
45954
- * The KeypadContext.Provider wraps the ExerciseFooter while KeypadContext.Consumer
45955
- * wraps each (Server)ItemRenderer render site and the Keypad rendered in the
45956
- * ExerciseFooter.
45957
- */
45958
- // @ts-expect-error [FEI-5003] - TS2322 - Type 'Context<{ setKeypadElement: (keypadElement: HTMLElement | null | undefined) => void; keypadElement: null; setRenderer: (renderer: RendererInterface | null | undefined) => void; renderer: null; setScrollableElement: (scrollableElement: HTMLElement | ... 1 more ... | undefined) => void; scrollableElement: null; }>' is not assignable to type 'Context<KeypadContext>'.
45959
- const context = /*#__PURE__*/React__namespace.createContext({
45960
- setKeypadElement: keypadElement => {},
45961
- keypadElement: null,
45962
- setRenderer: renderer => {},
45963
- renderer: null,
45964
- setScrollableElement: scrollableElement => {},
45965
- scrollableElement: null
45966
- });
45967
-
45968
45952
  // TODO(FEI-4010): Remove `Perseus` prefix for all types here
45969
45953
  // TODO(FEI-4011): Use types generated by https://github.com/jaredly/generate-perseus-flowtypes
45970
45954
 
@@ -47107,10 +47091,9 @@ exports.InputNumber = InputNumber$1;
47107
47091
  exports.InteractiveGraphWidget = InteractiveGraph$1;
47108
47092
  exports.ItemRenderer = ItemRenderer;
47109
47093
  exports.JiptParagraphs = JiptParagraphs;
47110
- exports.KeypadContext = context;
47111
47094
  exports.KhanColors = KhanColors;
47112
47095
  exports.KhanMath = KhanMath;
47113
- exports.LoadingContext = context$1;
47096
+ exports.LoadingContext = context;
47114
47097
  exports.Log = Log;
47115
47098
  exports.MatrixWidget = Matrix$1;
47116
47099
  exports.MultiItems = MultiItems;
@@ -49,7 +49,6 @@ declare export * as Dependencies from "./dependencies";
49
49
  declare export { Errors, Log } from "./logging/log";
50
50
  declare export { PerseusError } from "./perseus-error";
51
51
  declare export { default as JiptParagraphs } from "./jipt-paragraphs";
52
- declare export { default as KeypadContext } from "./keypad-context";
53
52
  declare export { default as KhanMath } from "./util/math";
54
53
  declare export { default as LoadingContext } from "./loading-context";
55
54
  declare export { default as mediaQueries } from "./styles/media-queries";
@@ -86,11 +85,9 @@ export type {
86
85
  ImageUploader,
87
86
  JiptLabelStore,
88
87
  JiptRenderer,
89
- KEScore,
90
88
  LinterContextProps,
91
89
  PerseusDependencies,
92
90
  PerseusScore,
93
- RendererInterface,
94
91
  Version,
95
92
  VideoData,
96
93
  VideoKind,