@khanacademy/perseus 33.0.0 → 33.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 (18) hide show
  1. package/dist/es/index.css +15 -44
  2. package/dist/es/index.js +393 -468
  3. package/dist/es/index.js.map +1 -1
  4. package/dist/index.css +15 -44
  5. package/dist/index.js +394 -471
  6. package/dist/index.js.map +1 -1
  7. package/dist/perseus-api.d.ts +0 -7
  8. package/dist/server-item-renderer.d.ts +0 -7
  9. package/dist/types.d.ts +1 -4
  10. package/dist/util/colors.d.ts +5 -13
  11. package/dist/widgets/expression/expression.d.ts +0 -42
  12. package/dist/widgets/interactive-graphs/backgrounds/axis-ticks.d.ts +2 -0
  13. package/dist/widgets/interactive-graphs/backgrounds/grid.d.ts +2 -10
  14. package/dist/widgets/interactive-graphs/mafs-graph.d.ts +5 -0
  15. package/dist/widgets/interactive-graphs/types.d.ts +1 -0
  16. package/dist/widgets/label-image/label-image.d.ts +0 -14
  17. package/package.json +1 -1
  18. package/dist/widgets/interactive-graphs/backgrounds/axis-tick-labels.d.ts +0 -13
package/dist/perseus-api.d.ts CHANGED
@@ -105,14 +105,7 @@ export declare const ApiOptions: {
105
105
  "linear-system"?: boolean | undefined;
106
106
  "unlimited-point"?: boolean | undefined;
107
107
  } & {
108
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
109
108
  "interactive-graph-locked-features-labels"?: boolean | undefined;
110
- } & {
111
- "start-coords-ui-phase-1"?: boolean | undefined;
112
- "start-coords-ui-phase-2"?: boolean | undefined;
113
- "start-coords-ui-point"?: boolean | undefined;
114
- "start-coords-ui-polygon"?: boolean | undefined;
115
- "start-coords-ui-angle"?: boolean | undefined;
116
109
  }) | undefined;
117
110
  } | undefined;
118
111
  onWidgetStartProps?: ((widgets: import("./perseus-types").PerseusWidgetsMap) => void) | undefined;
package/dist/server-item-renderer.d.ts CHANGED
@@ -150,14 +150,7 @@ declare const ref: React.ForwardRefExoticComponent<Omit<Pick<SharedRendererProps
150
150
  "linear-system"?: boolean | undefined;
151
151
  "unlimited-point"?: boolean | undefined;
152
152
  } & {
153
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
154
153
  "interactive-graph-locked-features-labels"?: boolean | undefined;
155
- } & {
156
- "start-coords-ui-phase-1"?: boolean | undefined;
157
- "start-coords-ui-phase-2"?: boolean | undefined;
158
- "start-coords-ui-point"?: boolean | undefined;
159
- "start-coords-ui-polygon"?: boolean | undefined;
160
- "start-coords-ui-angle"?: boolean | undefined;
161
154
  }) | undefined;
162
155
  } | undefined;
163
156
  onWidgetStartProps?: ((widgets: import("./perseus-types").PerseusWidgetsMap) => void) | undefined;
package/dist/types.d.ts CHANGED
@@ -75,8 +75,7 @@ type TrackInteractionArgs = {
75
75
  correct?: boolean;
76
76
  } & Partial<TrackingGradedGroupExtraArguments> & Partial<TrackingSequenceExtraArguments>;
77
77
  export declare const MafsGraphTypeFlags: readonly ["angle", "segment", "linear", "linear-system", "ray", "polygon", "circle", "quadratic", "sinusoid", "point", "unlimited-point"];
78
- export declare const InteractiveGraphLockedFeaturesFlags: readonly ["interactive-graph-locked-features-m2b", "interactive-graph-locked-features-labels"];
79
- export declare const InteractiveGraphEditorFlags: readonly ["start-coords-ui-phase-1", "start-coords-ui-phase-2", "start-coords-ui-point", "start-coords-ui-polygon", "start-coords-ui-angle"];
78
+ export declare const InteractiveGraphLockedFeaturesFlags: readonly ["interactive-graph-locked-features-labels"];
80
79
  /**
81
80
  * APIOptions provides different ways to customize the behaviour of Perseus.
82
81
  *
@@ -208,8 +207,6 @@ export type APIOptions = Readonly<{
208
207
  [Key in (typeof MafsGraphTypeFlags)[number]]?: boolean;
209
208
  } & {
210
209
  [Key in (typeof InteractiveGraphLockedFeaturesFlags)[number]]?: boolean;
211
- } & {
212
- [Key in (typeof InteractiveGraphEditorFlags)[number]]?: boolean;
213
210
  });
214
211
  };
215
212
  /**
package/dist/util/colors.d.ts CHANGED
@@ -1,16 +1,8 @@
1
- /**
2
- * Color constants we use throughout Perseus (originally on KhanUtil).
3
- *
4
- * Note that if the color palette changes substantially, it may also need to be
5
- * updated in khan-exercises and cherry-picked into graphie-to-png's
6
- * khan-exercises submodule, as graphie-to-png still relies on the palette
7
- * provided on KhanUtil.
8
- */
9
1
  declare const KhanColors: {
10
- readonly BLUE: "#6495ED";
2
+ readonly BLUE: string;
11
3
  readonly ORANGE: "#FFA500";
12
4
  readonly PINK: "#FF00AF";
13
- readonly GREEN: "#28AE7B";
5
+ readonly GREEN: string;
14
6
  readonly PURPLE: "#9D38BD";
15
7
  readonly RED: "#DF0030";
16
8
  readonly GRAY: "gray";
@@ -82,8 +74,8 @@ declare const KhanColors: {
82
74
  readonly KA_BLUE: "#314453";
83
75
  readonly KA_GREEN: "#71B307";
84
76
  readonly _BACKGROUND: "#FDFDFD";
85
- readonly INTERACTING: "#71B307";
86
- readonly INTERACTIVE: "#71B307";
87
- readonly DYNAMIC: "#6495ED";
77
+ readonly INTERACTING: string;
78
+ readonly INTERACTIVE: string;
79
+ readonly DYNAMIC: string;
88
80
  };
89
81
  export default KhanColors;
package/dist/widgets/expression/expression.d.ts CHANGED
@@ -151,14 +151,7 @@ declare const _default: Readonly<{
151
151
  "linear-system"?: boolean | undefined;
152
152
  "unlimited-point"?: boolean | undefined;
153
153
  } & {
154
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
155
154
  "interactive-graph-locked-features-labels"?: boolean | undefined;
156
- } & {
157
- "start-coords-ui-phase-1"?: boolean | undefined;
158
- "start-coords-ui-phase-2"?: boolean | undefined;
159
- "start-coords-ui-point"?: boolean | undefined;
160
- "start-coords-ui-polygon"?: boolean | undefined;
161
- "start-coords-ui-angle"?: boolean | undefined;
162
155
  }) | undefined;
163
156
  } | undefined;
164
157
  onWidgetStartProps?: ((widgets: import("../../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -237,14 +230,7 @@ declare const _default: Readonly<{
237
230
  "linear-system"?: boolean | undefined;
238
231
  "unlimited-point"?: boolean | undefined;
239
232
  } & {
240
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
241
233
  "interactive-graph-locked-features-labels"?: boolean | undefined;
242
- } & {
243
- "start-coords-ui-phase-1"?: boolean | undefined;
244
- "start-coords-ui-phase-2"?: boolean | undefined;
245
- "start-coords-ui-point"?: boolean | undefined;
246
- "start-coords-ui-polygon"?: boolean | undefined;
247
- "start-coords-ui-angle"?: boolean | undefined;
248
234
  }) | undefined;
249
235
  } | undefined;
250
236
  onWidgetStartProps?: ((widgets: import("../../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -323,14 +309,7 @@ declare const _default: Readonly<{
323
309
  "linear-system"?: boolean | undefined;
324
310
  "unlimited-point"?: boolean | undefined;
325
311
  } & {
326
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
327
312
  "interactive-graph-locked-features-labels"?: boolean | undefined;
328
- } & {
329
- "start-coords-ui-phase-1"?: boolean | undefined;
330
- "start-coords-ui-phase-2"?: boolean | undefined;
331
- "start-coords-ui-point"?: boolean | undefined;
332
- "start-coords-ui-polygon"?: boolean | undefined;
333
- "start-coords-ui-angle"?: boolean | undefined;
334
313
  }) | undefined;
335
314
  } | undefined;
336
315
  onWidgetStartProps?: ((widgets: import("../../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -408,14 +387,7 @@ declare const _default: Readonly<{
408
387
  "linear-system"?: boolean | undefined;
409
388
  "unlimited-point"?: boolean | undefined;
410
389
  } & {
411
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
412
390
  "interactive-graph-locked-features-labels"?: boolean | undefined;
413
- } & {
414
- "start-coords-ui-phase-1"?: boolean | undefined;
415
- "start-coords-ui-phase-2"?: boolean | undefined;
416
- "start-coords-ui-point"?: boolean | undefined;
417
- "start-coords-ui-polygon"?: boolean | undefined;
418
- "start-coords-ui-angle"?: boolean | undefined;
419
391
  }) | undefined;
420
392
  } | undefined;
421
393
  onWidgetStartProps?: ((widgets: import("../../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -494,14 +466,7 @@ declare const _default: Readonly<{
494
466
  "linear-system"?: boolean | undefined;
495
467
  "unlimited-point"?: boolean | undefined;
496
468
  } & {
497
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
498
469
  "interactive-graph-locked-features-labels"?: boolean | undefined;
499
- } & {
500
- "start-coords-ui-phase-1"?: boolean | undefined;
501
- "start-coords-ui-phase-2"?: boolean | undefined;
502
- "start-coords-ui-point"?: boolean | undefined;
503
- "start-coords-ui-polygon"?: boolean | undefined;
504
- "start-coords-ui-angle"?: boolean | undefined;
505
470
  }) | undefined;
506
471
  } | undefined;
507
472
  onWidgetStartProps?: ((widgets: import("../../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -580,14 +545,7 @@ declare const _default: Readonly<{
580
545
  "linear-system"?: boolean | undefined;
581
546
  "unlimited-point"?: boolean | undefined;
582
547
  } & {
583
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
584
548
  "interactive-graph-locked-features-labels"?: boolean | undefined;
585
- } & {
586
- "start-coords-ui-phase-1"?: boolean | undefined;
587
- "start-coords-ui-phase-2"?: boolean | undefined;
588
- "start-coords-ui-point"?: boolean | undefined;
589
- "start-coords-ui-polygon"?: boolean | undefined;
590
- "start-coords-ui-angle"?: boolean | undefined;
591
549
  }) | undefined;
592
550
  } | undefined;
593
551
  onWidgetStartProps?: ((widgets: import("../../perseus-types").PerseusWidgetsMap) => void) | undefined;
package/dist/widgets/interactive-graphs/backgrounds/axis-ticks.d.ts CHANGED
@@ -1,3 +1,5 @@
1
1
  import * as React from "react";
2
+ import type { Interval } from "mafs";
3
+ export declare const shouldShowLabel: (number: number, range: [Interval, Interval]) => boolean;
2
4
  export declare function generateTickLocations(tickStep: number, min: number, max: number): number[];
3
5
  export declare const AxisTicks: () => React.JSX.Element;
package/dist/widgets/interactive-graphs/backgrounds/grid.d.ts CHANGED
@@ -3,20 +3,12 @@ import type { GraphRange } from "../../../perseus-types";
3
3
  import type { SizeClass } from "../../../util/sizing-utils";
4
4
  import type { vec } from "mafs";
5
5
  interface GridProps {
6
- tickStep: vec.Vector2;
7
6
  gridStep: vec.Vector2;
8
7
  range: GraphRange;
9
8
  containerSizeClass: SizeClass;
10
9
  markings: "graph" | "grid" | "none";
10
+ width: number;
11
+ height: number;
11
12
  }
12
- /**
13
- * lineLabelText get the text that should
14
- * be displayed for a specific tick place
15
- *
16
- * @param {number} n the tick number
17
- * @param {number} tickStep how frequently a label should appear
18
- * @param {vec.Vector2} range the min/max range on the axis
19
- */
20
- export declare const lineLabelText: (n: number, tickStep: number, range: vec.Vector2) => string;
21
13
  export declare const Grid: (props: GridProps) => React.JSX.Element | null;
22
14
  export {};
package/dist/widgets/interactive-graphs/mafs-graph.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import * as React from "react";
2
2
  import { type InteractiveGraphAction } from "./reducer/interactive-graph-action";
3
3
  import type { InteractiveGraphState, InteractiveGraphProps } from "./types";
4
+ import type { vec } from "mafs";
4
5
  import "mafs/core.css";
5
6
  import "./mafs-styles.css";
6
7
  export type MafsGraphProps = {
@@ -23,3 +24,7 @@ export type MafsGraphProps = {
23
24
  static: boolean | null | undefined;
24
25
  };
25
26
  export declare const MafsGraph: (props: MafsGraphProps) => React.JSX.Element;
27
+ export declare const calculateNestedSVGCoords: (range: vec.Vector2[], width: number, height: number) => {
28
+ viewboxX: number;
29
+ viewboxY: number;
30
+ };
package/dist/widgets/interactive-graphs/types.d.ts CHANGED
@@ -31,6 +31,7 @@ export interface PointGraphState extends InteractiveGraphStateCommon {
31
31
  coords: Coord[];
32
32
  numPoints?: number | "unlimited";
33
33
  focusedPointIndex: number | null;
34
+ previouslyFocusedPointIndex: number | null;
34
35
  }
35
36
  export interface RayGraphState extends InteractiveGraphStateCommon {
36
37
  type: "ray";
package/dist/widgets/label-image/label-image.d.ts CHANGED
@@ -143,14 +143,7 @@ declare const _default: Readonly<{
143
143
  "linear-system"?: boolean | undefined;
144
144
  "unlimited-point"?: boolean | undefined;
145
145
  } & {
146
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
147
146
  "interactive-graph-locked-features-labels"?: boolean | undefined;
148
- } & {
149
- "start-coords-ui-phase-1"?: boolean | undefined;
150
- "start-coords-ui-phase-2"?: boolean | undefined;
151
- "start-coords-ui-point"?: boolean | undefined;
152
- "start-coords-ui-polygon"?: boolean | undefined;
153
- "start-coords-ui-angle"?: boolean | undefined;
154
147
  }) | undefined;
155
148
  } | undefined;
156
149
  onWidgetStartProps?: ((widgets: import("../..").PerseusWidgetsMap) => void) | undefined;
@@ -213,14 +206,7 @@ declare const _default: Readonly<{
213
206
  "linear-system"?: boolean | undefined;
214
207
  "unlimited-point"?: boolean | undefined;
215
208
  } & {
216
- "interactive-graph-locked-features-m2b"?: boolean | undefined;
217
209
  "interactive-graph-locked-features-labels"?: boolean | undefined;
218
- } & {
219
- "start-coords-ui-phase-1"?: boolean | undefined;
220
- "start-coords-ui-phase-2"?: boolean | undefined;
221
- "start-coords-ui-point"?: boolean | undefined;
222
- "start-coords-ui-polygon"?: boolean | undefined;
223
- "start-coords-ui-angle"?: boolean | undefined;
224
210
  }) | undefined;
225
211
  } | undefined;
226
212
  onWidgetStartProps?: ((widgets: import("../..").PerseusWidgetsMap) => void) | undefined;
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Core Perseus API (includes renderers and widgets)",
4
4
  "author": "Khan Academy",
5
5
  "license": "MIT",
6
- "version": "33.0.0",
6
+ "version": "33.2.0",
7
7
  "publishConfig": {
8
8
  "access": "public"
9
9
  },
package/dist/widgets/interactive-graphs/backgrounds/axis-tick-labels.d.ts DELETED
@@ -1,13 +0,0 @@
1
- import * as React from "react";
2
- type ShowTickLabelProps = {
3
- gridStep: number;
4
- tickStep: number;
5
- label: number;
6
- graphEdge: number;
7
- position: number;
8
- axisOutOfBounds: boolean;
9
- };
10
- export declare const AxisTickLabels: () => React.JSX.Element;
11
- export declare const showTickLabel: ({ gridStep, tickStep, label, graphEdge, position, axisOutOfBounds, }: ShowTickLabelProps) => boolean;
12
- export declare function generateTickLocations(tickStep: number, min: number, max: number): number[];
13
- export {};