@khanacademy/perseus-editor 33.0.2 → 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 (39) hide show
  1. package/dist/components/coordinate-pair-input.d.ts +1 -0
  2. package/dist/es/index.css +6 -6
  3. package/dist/es/index.css.map +1 -1
  4. package/dist/es/index.js +96 -93
  5. package/dist/es/index.js.map +1 -1
  6. package/dist/index.css +6 -6
  7. package/dist/index.css.map +1 -1
  8. package/dist/index.js +94 -92
  9. package/dist/index.js.map +1 -1
  10. package/dist/item-extras-editor.d.ts +3 -0
  11. package/dist/testing/feature-flags-util.d.ts +7 -12
  12. package/dist/widgets/expression-editor.d.ts +4 -2
  13. package/dist/widgets/free-response-editor.d.ts +5 -3
  14. package/dist/widgets/image-editor/components/decorative-toggle.d.ts +2 -1
  15. package/dist/widgets/image-editor/components/image-scale-input.d.ts +2 -1
  16. package/dist/widgets/image-editor/components/image-settings.d.ts +1 -1
  17. package/dist/widgets/interactive-graph-editor/components/graph-type-selector.d.ts +1 -0
  18. package/dist/widgets/interactive-graph-editor/components/interactive-graph-description.d.ts +1 -0
  19. package/dist/widgets/interactive-graph-editor/components/interactive-graph-sr-tree.d.ts +2 -1
  20. package/dist/widgets/interactive-graph-editor/components/show-point-labels-toggle.d.ts +8 -0
  21. package/dist/widgets/interactive-graph-editor/interactive-graph-editor.d.ts +19 -18
  22. package/dist/widgets/interactive-graph-editor/locked-figures/color-select.d.ts +1 -0
  23. package/dist/widgets/interactive-graph-editor/locked-figures/line-stroke-select.d.ts +1 -0
  24. package/dist/widgets/interactive-graph-editor/locked-figures/line-weight-select.d.ts +1 -0
  25. package/dist/widgets/interactive-graph-editor/locked-figures/locked-figure-aria.d.ts +1 -0
  26. package/dist/widgets/interactive-graph-editor/locked-figures/locked-figure-select.d.ts +1 -0
  27. package/dist/widgets/interactive-graph-editor/locked-figures/locked-figure-settings-actions.d.ts +1 -0
  28. package/dist/widgets/interactive-graph-editor/locked-figures/locked-figure-settings.d.ts +4 -0
  29. package/dist/widgets/interactive-graph-editor/locked-figures/locked-label-settings.d.ts +4 -0
  30. package/dist/widgets/interactive-graph-editor/locked-figures/locked-point-settings.d.ts +4 -0
  31. package/dist/widgets/interactive-graph-editor/start-coords/start-coords-settings.d.ts +1 -0
  32. package/dist/widgets/label-image-editor/select-image.d.ts +2 -1
  33. package/dist/widgets/numeric-input-editor.d.ts +3 -3
  34. package/dist/widgets/radio/radio-image-editor.d.ts +2 -1
  35. package/dist/widgets/radio/radio-option-content-and-image-editor.d.ts +1 -0
  36. package/dist/widgets/radio/radio-option-settings-actions.d.ts +2 -1
  37. package/dist/widgets/radio/radio-option-settings.d.ts +1 -0
  38. package/package.json +8 -8
  39. package/dist/components/link.d.ts +0 -39
@@ -1,11 +1,14 @@
1
1
  import * as React from "react";
2
+ import type { APIOptions } from "@khanacademy/perseus";
2
3
  import type { PerseusAnswerArea } from "@khanacademy/perseus-core";
3
4
  type Props = PerseusAnswerArea & {
5
+ apiOptions?: APIOptions;
4
6
  onChange: (props: Partial<PerseusAnswerArea>) => void;
5
7
  editingDisabled: boolean;
6
8
  };
7
9
  declare class ItemExtrasEditor extends React.Component<Props> {
8
10
  static defaultProps: PerseusAnswerArea;
11
+ shouldShowCalculatorVariants(): boolean;
9
12
  shouldShowFinancialCalculatorOptions(): boolean;
10
13
  serialize(): PerseusAnswerArea;
11
14
  render(): React.ReactNode;
@@ -1,21 +1,16 @@
1
- declare const DEFAULT_FEATURE_FLAGS: {
2
- "perseus-test-flag-1": boolean;
3
- "perseus-test-flag-2": boolean;
4
- "interactive-graph-vector": boolean;
5
- "interactive-graph-not-scored": boolean;
6
- "input-number-to-numeric-input": boolean;
7
- "grapher-to-interactive-graph": boolean;
8
- };
1
+ import type { PerseusFeatureFlags } from "@khanacademy/perseus-core";
2
+ declare const DEFAULT_FEATURE_FLAGS: Record<"perseus-test-flag-1" | "perseus-test-flag-2" | (typeof PerseusFeatureFlags)[number], boolean>;
9
3
  /** Utility to get feature flags with optional overrides for testing.
10
4
  * sample usage:
11
5
  * getFeatureFlags({"image-widget-upgrade": true})
12
6
  */
13
7
  export declare function getFeatureFlags(overrides?: Partial<typeof DEFAULT_FEATURE_FLAGS>): {
14
- "perseus-test-flag-1": boolean;
15
- "perseus-test-flag-2": boolean;
16
- "interactive-graph-vector": boolean;
17
- "interactive-graph-not-scored": boolean;
18
8
  "input-number-to-numeric-input": boolean;
9
+ "perseus-renderer-upgrade": boolean;
19
10
  "grapher-to-interactive-graph": boolean;
11
+ "desmos-calculator": boolean;
12
+ "perseus-enable-point-label-field": boolean;
13
+ "perseus-test-flag-1": boolean;
14
+ "perseus-test-flag-2": boolean;
20
15
  };
21
16
  export {};
@@ -1,9 +1,11 @@
1
1
  import { PerseusExpressionAnswerFormConsidered } from "@khanacademy/perseus-core";
2
2
  import * as React from "react";
3
- import type { PerseusExpressionWidgetOptions, ExpressionDefaultWidgetOptions, PerseusExpressionUserInput } from "@khanacademy/perseus-core";
3
+ import type { APIOptions } from "@khanacademy/perseus";
4
+ import type { PerseusExpressionWidgetOptions, PerseusExpressionUserInput } from "@khanacademy/perseus-core";
4
5
  type Props = {
5
6
  widgetId?: string;
6
7
  value?: string;
8
+ apiOptions: APIOptions;
7
9
  onChange: (newValues: Partial<PerseusExpressionWidgetOptions>) => void;
8
10
  } & Omit<PerseusExpressionWidgetOptions, "buttonsVisible">;
9
11
  type AnswerForm = PerseusExpressionWidgetOptions["answerForms"][number];
@@ -15,7 +17,7 @@ interface State {
15
17
  */
16
18
  declare class ExpressionEditor extends React.Component<Props, State> {
17
19
  static widgetName: "expression";
18
- static defaultProps: ExpressionDefaultWidgetOptions;
20
+ static defaultProps: any;
19
21
  constructor(props: Props);
20
22
  serialize(): PerseusExpressionWidgetOptions;
21
23
  getSaveWarnings: () => any;
@@ -1,14 +1,16 @@
1
1
  import * as React from "react";
2
- import type { PerseusFreeResponseWidgetOptions, FreeResponseDefaultWidgetOptions, PerseusFreeResponseWidgetScoringCriterion } from "@khanacademy/perseus-core";
2
+ import type { APIOptions } from "@khanacademy/perseus";
3
+ import type { PerseusFreeResponseWidgetOptions, PerseusFreeResponseWidgetScoringCriterion } from "@khanacademy/perseus-core";
3
4
  import type { ChangeEventHandler } from "react";
4
5
  type Props = PerseusFreeResponseWidgetOptions & {
6
+ apiOptions: APIOptions;
5
7
  onChange: (options: Partial<PerseusFreeResponseWidgetOptions>) => void;
6
8
  };
7
9
  /**
8
10
  * An editor for adding a free response widget that allows users to enter open-ended text answers.
9
11
  */
10
12
  declare class FreeResponseEditor extends React.Component<Props> {
11
- static defaultProps: FreeResponseDefaultWidgetOptions;
13
+ static defaultProps: any;
12
14
  static widgetName: "free-response";
13
15
  serialize: () => PerseusFreeResponseWidgetOptions;
14
16
  getSaveWarnings: () => Array<string>;
@@ -16,7 +18,7 @@ declare class FreeResponseEditor extends React.Component<Props> {
16
18
  handleUpdateCriterion: (index: number, criterion: PerseusFreeResponseWidgetScoringCriterion) => void;
17
19
  handleDeleteCriterion: (index: number) => void;
18
20
  handleAddCriterion: () => void;
19
- renderCriteriaList: () => React.ReactNode;
21
+ renderCriteriaList: (editingDisabled: boolean) => React.ReactNode;
20
22
  render(): React.ReactNode;
21
23
  }
22
24
  export default FreeResponseEditor;
@@ -3,7 +3,8 @@ import type { Props as ImageEditorProps } from "../image-editor";
3
3
  interface Props {
4
4
  decorative?: boolean;
5
5
  hasPopulatedFields?: boolean;
6
+ editingDisabled?: boolean;
6
7
  onChange: ImageEditorProps["onChange"];
7
8
  }
8
- export default function DecorativeToggle({ decorative, hasPopulatedFields, onChange, }: Props): React.JSX.Element;
9
+ export default function DecorativeToggle({ decorative, hasPopulatedFields, editingDisabled, onChange, }: Props): React.JSX.Element;
9
10
  export {};
@@ -4,7 +4,8 @@ import type { PerseusImageBackground } from "@khanacademy/perseus-core";
4
4
  interface Props {
5
5
  backgroundImage: PerseusImageBackground;
6
6
  scale: number;
7
+ editingDisabled?: boolean;
7
8
  onChange: ImageEditorProps["onChange"];
8
9
  }
9
- export default function ImageScaleInput({ backgroundImage, scale, onChange, }: Props): React.JSX.Element;
10
+ export default function ImageScaleInput({ backgroundImage, scale, editingDisabled, onChange, }: Props): React.JSX.Element;
10
11
  export {};
@@ -1,3 +1,3 @@
1
1
  import * as React from "react";
2
2
  import type { Props } from "../image-editor";
3
- export default function ImageSettings({ alt, backgroundImage, scale, caption, decorative, longDescription, title, onChange, }: Props): React.JSX.Element | null;
3
+ export default function ImageSettings({ alt, apiOptions, backgroundImage, scale, caption, decorative, longDescription, title, onChange, }: Props): React.JSX.Element | null;
@@ -1,6 +1,7 @@
1
1
  import * as React from "react";
2
2
  interface GraphTypeSelectorProps {
3
3
  graphType: string;
4
+ disabled?: boolean;
4
5
  onChange: (newGraphType: string) => void;
5
6
  }
6
7
  declare const GraphTypeSelector: (props: GraphTypeSelectorProps) => React.JSX.Element;
@@ -3,6 +3,7 @@ import type { Props as EditorProps } from "../interactive-graph-editor";
3
3
  interface Props {
4
4
  ariaLabelValue: string;
5
5
  ariaDescriptionValue: string;
6
+ editingDisabled?: boolean;
6
7
  onChange: (graphProps: Partial<EditorProps>) => void;
7
8
  }
8
9
  export default function InteractiveGraphDescription(props: Props): React.JSX.Element;
@@ -9,11 +9,12 @@ interface AttributeMap {
9
9
  attributes: Array<Attribute>;
10
10
  }
11
11
  export declare function getAccessibilityAttributes(graphId: string): AttributeMap[];
12
- declare function InteractiveGraphSRTree({ graphId, correct, fullGraphAriaLabel, fullGraphAriaDescription, lockedFigures, }: {
12
+ declare function InteractiveGraphSRTree({ graphId, correct, fullGraphAriaLabel, fullGraphAriaDescription, lockedFigures, editingDisabled, }: {
13
13
  graphId: any;
14
14
  correct: any;
15
15
  fullGraphAriaLabel: any;
16
16
  fullGraphAriaDescription: any;
17
17
  lockedFigures: any;
18
+ editingDisabled?: boolean | undefined;
18
19
  }): React.JSX.Element;
19
20
  export default InteractiveGraphSRTree;
@@ -0,0 +1,8 @@
1
+ import * as React from "react";
2
+ interface Props {
3
+ showPointLabels: boolean;
4
+ pointLabels: ReadonlyArray<string> | undefined;
5
+ onChange: (showPointLabels: boolean) => void;
6
+ }
7
+ export default function ShowPointLabelsToggle({ showPointLabels, pointLabels, onChange, }: Props): React.JSX.Element;
8
+ export {};
@@ -63,7 +63,7 @@ declare const InteractiveGraph: {
63
63
  isMobile?: boolean;
64
64
  isMobileApp?: boolean;
65
65
  hintProgressColor?: string;
66
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
66
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
67
67
  }> & {
68
68
  baseElements: NonNullable<Readonly<{
69
69
  isArticle?: boolean;
@@ -92,7 +92,7 @@ declare const InteractiveGraph: {
92
92
  isMobile?: boolean;
93
93
  isMobileApp?: boolean;
94
94
  hintProgressColor?: string;
95
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
95
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
96
96
  }>["baseElements"]>;
97
97
  isArticle: NonNullable<Readonly<{
98
98
  isArticle?: boolean;
@@ -121,7 +121,7 @@ declare const InteractiveGraph: {
121
121
  isMobile?: boolean;
122
122
  isMobileApp?: boolean;
123
123
  hintProgressColor?: string;
124
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
124
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
125
125
  }>["isArticle"]>;
126
126
  isMobile: NonNullable<Readonly<{
127
127
  isArticle?: boolean;
@@ -150,7 +150,7 @@ declare const InteractiveGraph: {
150
150
  isMobile?: boolean;
151
151
  isMobileApp?: boolean;
152
152
  hintProgressColor?: string;
153
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
153
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
154
154
  }>["isMobile"]>;
155
155
  isMobileApp: NonNullable<Readonly<{
156
156
  isArticle?: boolean;
@@ -179,7 +179,7 @@ declare const InteractiveGraph: {
179
179
  isMobile?: boolean;
180
180
  isMobileApp?: boolean;
181
181
  hintProgressColor?: string;
182
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
182
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
183
183
  }>["isMobileApp"]>;
184
184
  editingDisabled: NonNullable<Readonly<{
185
185
  isArticle?: boolean;
@@ -208,7 +208,7 @@ declare const InteractiveGraph: {
208
208
  isMobile?: boolean;
209
209
  isMobileApp?: boolean;
210
210
  hintProgressColor?: string;
211
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
211
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
212
212
  }>["editingDisabled"]>;
213
213
  onFocusChange: NonNullable<Readonly<{
214
214
  isArticle?: boolean;
@@ -237,7 +237,7 @@ declare const InteractiveGraph: {
237
237
  isMobile?: boolean;
238
238
  isMobileApp?: boolean;
239
239
  hintProgressColor?: string;
240
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
240
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
241
241
  }>["onFocusChange"]>;
242
242
  readOnly: NonNullable<Readonly<{
243
243
  isArticle?: boolean;
@@ -266,7 +266,7 @@ declare const InteractiveGraph: {
266
266
  isMobile?: boolean;
267
267
  isMobileApp?: boolean;
268
268
  hintProgressColor?: string;
269
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
269
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
270
270
  }>["readOnly"]>;
271
271
  showAlignmentOptions: NonNullable<Readonly<{
272
272
  isArticle?: boolean;
@@ -295,7 +295,7 @@ declare const InteractiveGraph: {
295
295
  isMobile?: boolean;
296
296
  isMobileApp?: boolean;
297
297
  hintProgressColor?: string;
298
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
298
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
299
299
  }>["showAlignmentOptions"]>;
300
300
  }>;
301
301
  keypadElement?: any;
@@ -389,7 +389,7 @@ declare const InteractiveGraph: {
389
389
  isMobile?: boolean;
390
390
  isMobileApp?: boolean;
391
391
  hintProgressColor?: string;
392
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
392
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
393
393
  }> & {
394
394
  baseElements: NonNullable<Readonly<{
395
395
  isArticle?: boolean;
@@ -418,7 +418,7 @@ declare const InteractiveGraph: {
418
418
  isMobile?: boolean;
419
419
  isMobileApp?: boolean;
420
420
  hintProgressColor?: string;
421
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
421
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
422
422
  }>["baseElements"]>;
423
423
  isArticle: NonNullable<Readonly<{
424
424
  isArticle?: boolean;
@@ -447,7 +447,7 @@ declare const InteractiveGraph: {
447
447
  isMobile?: boolean;
448
448
  isMobileApp?: boolean;
449
449
  hintProgressColor?: string;
450
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
450
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
451
451
  }>["isArticle"]>;
452
452
  isMobile: NonNullable<Readonly<{
453
453
  isArticle?: boolean;
@@ -476,7 +476,7 @@ declare const InteractiveGraph: {
476
476
  isMobile?: boolean;
477
477
  isMobileApp?: boolean;
478
478
  hintProgressColor?: string;
479
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
479
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
480
480
  }>["isMobile"]>;
481
481
  isMobileApp: NonNullable<Readonly<{
482
482
  isArticle?: boolean;
@@ -505,7 +505,7 @@ declare const InteractiveGraph: {
505
505
  isMobile?: boolean;
506
506
  isMobileApp?: boolean;
507
507
  hintProgressColor?: string;
508
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
508
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
509
509
  }>["isMobileApp"]>;
510
510
  editingDisabled: NonNullable<Readonly<{
511
511
  isArticle?: boolean;
@@ -534,7 +534,7 @@ declare const InteractiveGraph: {
534
534
  isMobile?: boolean;
535
535
  isMobileApp?: boolean;
536
536
  hintProgressColor?: string;
537
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
537
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
538
538
  }>["editingDisabled"]>;
539
539
  onFocusChange: NonNullable<Readonly<{
540
540
  isArticle?: boolean;
@@ -563,7 +563,7 @@ declare const InteractiveGraph: {
563
563
  isMobile?: boolean;
564
564
  isMobileApp?: boolean;
565
565
  hintProgressColor?: string;
566
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
566
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
567
567
  }>["onFocusChange"]>;
568
568
  readOnly: NonNullable<Readonly<{
569
569
  isArticle?: boolean;
@@ -592,7 +592,7 @@ declare const InteractiveGraph: {
592
592
  isMobile?: boolean;
593
593
  isMobileApp?: boolean;
594
594
  hintProgressColor?: string;
595
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
595
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
596
596
  }>["readOnly"]>;
597
597
  showAlignmentOptions: NonNullable<Readonly<{
598
598
  isArticle?: boolean;
@@ -621,7 +621,7 @@ declare const InteractiveGraph: {
621
621
  isMobile?: boolean;
622
622
  isMobileApp?: boolean;
623
623
  hintProgressColor?: string;
624
- flags?: Record<"input-number-to-numeric-input" | "grapher-to-interactive-graph", boolean>;
624
+ flags?: Record<"input-number-to-numeric-input" | "perseus-renderer-upgrade" | "grapher-to-interactive-graph" | "desmos-calculator" | "perseus-enable-point-label-field", boolean>;
625
625
  }>["showAlignmentOptions"]>;
626
626
  }>;
627
627
  keypadElement?: any;
@@ -788,6 +788,7 @@ declare class InteractiveGraphEditor extends React.Component<Props> {
788
788
  };
789
789
  changeStartCoords: (coords: any) => void;
790
790
  changePointLabels: (pointLabels: ReadonlyArray<string>) => void;
791
+ changeShowPointLabels: (showPointLabels: boolean) => void;
791
792
  serialize(): PerseusInteractiveGraphWidgetOptions;
792
793
  getSaveWarnings: () => any[];
793
794
  render(): React.JSX.Element;
@@ -4,6 +4,7 @@ import type { StyleType } from "@khanacademy/wonder-blocks-core";
4
4
  interface Props {
5
5
  selectedValue: LockedFigureColor;
6
6
  style?: StyleType;
7
+ editingDisabled?: boolean;
7
8
  onChange: (newColor: LockedFigureColor) => void;
8
9
  }
9
10
  declare const ColorSelect: (props: Props) => React.JSX.Element;
@@ -5,6 +5,7 @@ interface Props {
5
5
  selectedValue: StyleOptions;
6
6
  onChange: (newValue: StyleOptions) => void;
7
7
  containerStyle?: StyleType;
8
+ editingDisabled?: boolean;
8
9
  }
9
10
  declare const LineStrokeSelect: (props: Props) => React.JSX.Element;
10
11
  export default LineStrokeSelect;
@@ -5,6 +5,7 @@ interface Props {
5
5
  selectedValue: StrokeWeight;
6
6
  onChange: (newValue: StrokeWeight) => void;
7
7
  containerStyle?: StyleType;
8
+ editingDisabled?: boolean;
8
9
  }
9
10
  declare const LineWeightSelect: (props: Props) => React.JSX.Element;
10
11
  export default LineWeightSelect;
@@ -6,6 +6,7 @@ interface Props {
6
6
  * for the locked figure with math details converted to spoken words.
7
7
  */
8
8
  getPrepopulatedAriaLabel: () => Promise<string>;
9
+ editingDisabled?: boolean;
9
10
  onChangeProps: (props: {
10
11
  ariaLabel?: string | undefined;
11
12
  }) => void;
@@ -2,6 +2,7 @@ import * as React from "react";
2
2
  import type { LockedFigureType } from "@khanacademy/perseus-core";
3
3
  interface Props {
4
4
  id: string;
5
+ editingDisabled?: boolean;
5
6
  onChange: (value: LockedFigureType) => void;
6
7
  }
7
8
  declare const LockedFigureSelect: (props: Props) => React.JSX.Element;
@@ -3,6 +3,7 @@ import type { LockedFigureType } from "@khanacademy/perseus-core";
3
3
  export type LockedFigureSettingsMovementType = "back" | "backward" | "forward" | "front";
4
4
  interface Props {
5
5
  figureType: LockedFigureType;
6
+ editingDisabled?: boolean;
6
7
  onMove?: (movement: LockedFigureSettingsMovementType) => void;
7
8
  onRemove: () => void;
8
9
  }
@@ -14,6 +14,10 @@ import type { Props as LockedPointProps } from "./locked-point-settings";
14
14
  import type { Props as LockedPolygonProps } from "./locked-polygon-settings";
15
15
  import type { Props as LockedVectorProps } from "./locked-vector-settings";
16
16
  export interface LockedFigureSettingsCommonProps {
17
+ /**
18
+ * Whether editing is disabled for this figure's controls.
19
+ */
20
+ editingDisabled?: boolean;
17
21
  /**
18
22
  * Called when a movement button (top, up, down, bottom) is pressed.
19
23
  */
@@ -3,6 +3,10 @@ import * as React from "react";
3
3
  import type { LockedFigureSettingsMovementType } from "./locked-figure-settings-actions";
4
4
  import type { StyleType } from "@khanacademy/wonder-blocks-core";
5
5
  export type Props = LockedLabelType & {
6
+ /**
7
+ * Whether editing is disabled for this label's controls.
8
+ */
9
+ editingDisabled?: boolean;
6
10
  /**
7
11
  * Called when the props (coord, color, etc.) are updated.
8
12
  */
@@ -7,6 +7,10 @@ export type Props = LockedPointType & {
7
7
  * Defaults to "Point".
8
8
  */
9
9
  headerLabel?: string;
10
+ /**
11
+ * Whether editing is disabled for this figure's controls.
12
+ */
13
+ editingDisabled?: boolean;
10
14
  /**
11
15
  * Whether the extra point settings are toggled open.
12
16
  */
@@ -5,6 +5,7 @@ interface StartCoordsSettingsProps {
5
5
  range: [x: Range, y: Range];
6
6
  step: [x: number, y: number];
7
7
  allowReflexAngles?: boolean;
8
+ editingDisabled?: boolean;
8
9
  onChange: (startCoords: StartCoords) => void;
9
10
  onChangePointLabels: (pointLabels: ReadonlyArray<string>) => void;
10
11
  }
@@ -5,6 +5,7 @@ import * as React from "react";
5
5
  export interface SelectImageProps {
6
6
  onChange: (url: string) => void;
7
7
  url: string;
8
+ editingDisabled?: boolean;
8
9
  }
9
- declare const SelectImage: ({ onChange, url }: SelectImageProps) => React.ReactElement;
10
+ declare const SelectImage: ({ onChange, url, editingDisabled, }: SelectImageProps) => React.ReactElement;
10
11
  export default SelectImage;
@@ -1,11 +1,11 @@
1
1
  import { Changeable } from "@khanacademy/perseus";
2
- import { type NumericInputDefaultWidgetOptions, type PerseusNumericInputWidgetOptions } from "@khanacademy/perseus-core";
2
+ import { type PerseusNumericInputWidgetOptions } from "@khanacademy/perseus-core";
3
3
  import * as React from "react";
4
4
  import type { APIOptionsWithDefaults } from "@khanacademy/perseus";
5
5
  type ChangeFn = typeof Changeable.change;
6
6
  type Props = Omit<PerseusNumericInputWidgetOptions, "static"> & {
7
7
  onChange: (results: any) => any;
8
- apiOptions?: APIOptionsWithDefaults;
8
+ apiOptions: APIOptionsWithDefaults;
9
9
  };
10
10
  interface State {
11
11
  lastStatus: string;
@@ -20,7 +20,7 @@ interface State {
20
20
  declare class NumericInputEditor extends React.Component<Props, State> {
21
21
  static widgetName: string;
22
22
  static displayName: string;
23
- static defaultProps: NumericInputDefaultWidgetOptions;
23
+ static defaultProps: any;
24
24
  constructor(props: Props);
25
25
  change: ChangeFn;
26
26
  onToggleAnswers: (answerIndex: number) => void;
@@ -4,6 +4,7 @@ interface RadioImageEditorProps {
4
4
  imageAltText: string;
5
5
  onSave: (imageUrl: string, imageAltText: string) => void;
6
6
  onDelete: () => void;
7
+ editingDisabled?: boolean;
7
8
  }
8
- export default function RadioImageEditor({ imageUrl, imageAltText, onSave, onDelete, }: RadioImageEditorProps): React.ReactElement;
9
+ export default function RadioImageEditor({ imageUrl, imageAltText, onSave, onDelete, editingDisabled, }: RadioImageEditorProps): React.ReactElement;
9
10
  export {};
@@ -4,6 +4,7 @@ interface Props {
4
4
  content: string;
5
5
  choiceIndex: number;
6
6
  onContentChange: (choiceIndex: number, content: string) => void;
7
+ editingDisabled?: boolean;
7
8
  }
8
9
  export interface RadioOptionContentAndImageEditorHandle {
9
10
  focus: () => void;
@@ -6,6 +6,7 @@ interface RadioOptionSettingsActionsProps {
6
6
  showMove: boolean;
7
7
  onDelete: () => void;
8
8
  onMove: (movement: ChoiceMovementType) => void;
9
+ editingDisabled: boolean;
9
10
  }
10
- export declare function RadioOptionSettingsActions({ content, showDelete, showMove, onDelete, onMove, }: RadioOptionSettingsActionsProps): React.JSX.Element;
11
+ export declare function RadioOptionSettingsActions({ content, showDelete, showMove, onDelete, onMove, editingDisabled, }: RadioOptionSettingsActionsProps): React.JSX.Element;
11
12
  export {};
@@ -15,6 +15,7 @@ interface RadioOptionSettingsProps {
15
15
  showMove: boolean;
16
16
  onDelete: () => void;
17
17
  onMove: (choiceIndex: number, movement: ChoiceMovementType) => void;
18
+ editingDisabled: boolean;
18
19
  }
19
20
  export declare const RadioOptionSettings: React.ForwardRefExoticComponent<RadioOptionSettingsProps & React.RefAttributes<RadioOptionSettingsHandle>>;
20
21
  export {};
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Perseus editors",
4
4
  "author": "Khan Academy",
5
5
  "license": "MIT",
6
- "version": "33.0.2",
6
+ "version": "33.2.0",
7
7
  "publishConfig": {
8
8
  "access": "public"
9
9
  },
@@ -36,13 +36,13 @@
36
36
  "mafs": "^0.19.0",
37
37
  "tiny-invariant": "1.3.1",
38
38
  "@khanacademy/kas": "2.2.3",
39
- "@khanacademy/keypad-context": "3.2.64",
40
- "@khanacademy/kmath": "2.4.22",
41
- "@khanacademy/math-input": "26.4.36",
42
- "@khanacademy/perseus": "78.1.0",
43
- "@khanacademy/perseus-core": "28.1.0",
44
- "@khanacademy/perseus-linter": "5.1.3",
45
- "@khanacademy/perseus-score": "8.11.6",
39
+ "@khanacademy/keypad-context": "3.2.66",
40
+ "@khanacademy/kmath": "2.4.24",
41
+ "@khanacademy/math-input": "26.4.38",
42
+ "@khanacademy/perseus": "78.3.0",
43
+ "@khanacademy/perseus-core": "28.3.0",
44
+ "@khanacademy/perseus-linter": "5.1.5",
45
+ "@khanacademy/perseus-score": "8.11.8",
46
46
  "@khanacademy/perseus-utils": "2.1.5"
47
47
  },
48
48
  "devDependencies": {
@@ -1,39 +0,0 @@
1
- import * as React from "react";
2
- import type { CSSProperties } from "aphrodite";
3
- type DefaultProps = {
4
- element: React.ElementType;
5
- highlighted: boolean;
6
- href: string;
7
- style: CSSProperties | Array<CSSProperties>;
8
- };
9
- type Props = DefaultProps & {
10
- children?: React.ReactNode;
11
- className?: string;
12
- inlineStyles?: React.CSSProperties;
13
- referrer?: string;
14
- target?: string;
15
- rel?: string;
16
- testId?: string;
17
- onClick?: (e: React.MouseEvent) => unknown;
18
- onMouseOver?: (e: React.MouseEvent) => unknown;
19
- onMouseLeave?: (e: React.MouseEvent) => unknown;
20
- onMouseEnter?: (e: React.MouseEvent) => unknown;
21
- onBlur?: (e: React.SyntheticEvent) => unknown;
22
- onFocus?: (e: React.SyntheticEvent) => unknown;
23
- onKeyDown?: (e: React.KeyboardEvent) => unknown;
24
- ["aria-label"]?: string;
25
- ["aria-selected"]?: boolean;
26
- ["aria-current"]?: boolean;
27
- role?: "tab";
28
- title?: string;
29
- id?: string;
30
- tabIndex?: number;
31
- };
32
- /**
33
- * A wrapper that creates an anchor tag with normalized styles
34
- */
35
- declare class Link extends React.Component<Props> {
36
- static defaultProps: DefaultProps;
37
- render(): React.ReactNode;
38
- }
39
- export default Link;