@khanacademy/perseus-editor 38.1.2 → 39.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/all-editors.d.ts +49 -9
- package/dist/article-editor.d.ts +2 -1
- package/dist/components/widget-editor.d.ts +1 -1
- package/dist/es/index.js +35 -35
- package/dist/es/index.js.map +1 -1
- package/dist/{item-extras-editor.d.ts → extras-editor.d.ts} +2 -2
- package/dist/index.js +35 -35
- package/dist/index.js.map +1 -1
- package/dist/item-editor.d.ts +3 -3
- package/dist/testing/feature-flags-util.d.ts +1 -0
- package/dist/widgets/categorizer-editor/categorizer-editor.d.ts +0 -1
- package/dist/widgets/cs-program-editor/cs-program-editor.d.ts +0 -1
- package/dist/widgets/definition-editor/definition-editor.d.ts +0 -1
- package/dist/widgets/deprecated-standin-editor/deprecated-standin-editor.d.ts +0 -1
- package/dist/widgets/dropdown-editor/dropdown-editor.d.ts +0 -1
- package/dist/widgets/explanation-editor/explanation-editor.d.ts +0 -1
- package/dist/widgets/expression-editor/expression-editor.d.ts +0 -1
- package/dist/widgets/free-response-editor/free-response-editor.d.ts +0 -1
- package/dist/widgets/graded-group-editor/graded-group-editor.d.ts +0 -1
- package/dist/widgets/graded-group-set-editor/graded-group-set-editor.d.ts +0 -1
- package/dist/widgets/grapher-editor/grapher-editor.d.ts +0 -1
- package/dist/widgets/group-editor/group-editor.d.ts +0 -1
- package/dist/widgets/iframe-editor/iframe-editor.d.ts +0 -1
- package/dist/widgets/image-editor/image-editor.d.ts +0 -1
- package/dist/widgets/input-number-editor/input-number-editor.d.ts +0 -1
- package/dist/widgets/interaction-editor/interaction-editor.d.ts +0 -1
- package/dist/widgets/interactive-graph-editor/interactive-graph-editor.d.ts +52 -29
- package/dist/widgets/label-image-editor/label-image-editor.d.ts +0 -1
- package/dist/widgets/matcher-editor/matcher-editor.d.ts +0 -1
- package/dist/widgets/matrix-editor/matrix-editor.d.ts +0 -1
- package/dist/widgets/measurer-editor/measurer-editor.d.ts +0 -1
- package/dist/widgets/number-line-editor/number-line-editor.d.ts +0 -1
- package/dist/widgets/numeric-input-editor/numeric-input-editor.d.ts +0 -1
- package/dist/widgets/orderer-editor/orderer-editor.d.ts +0 -1
- package/dist/widgets/phet-simulation-editor/phet-simulation-editor.d.ts +0 -1
- package/dist/widgets/plotter-editor/plotter-editor.d.ts +0 -1
- package/dist/widgets/python-program-editor/python-program-editor.d.ts +0 -1
- package/dist/widgets/radio-editor/radio-editor.d.ts +0 -1
- package/dist/widgets/sorter-editor/sorter-editor.d.ts +0 -1
- package/dist/widgets/table-editor/table-editor.d.ts +0 -1
- package/dist/widgets/video-editor/video-editor.d.ts +0 -1
- package/package.json +9 -9
package/dist/item-editor.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import * as React from "react";
|
|
|
2
2
|
import CombinedHintsEditor from "./combined-hints-editor";
|
|
3
3
|
import { A11yContext } from "./components/a11y-context";
|
|
4
4
|
import Editor from "./editor";
|
|
5
|
-
import
|
|
5
|
+
import ExtrasEditor from "./extras-editor";
|
|
6
6
|
import type { A11yReport } from "./preview/use-preview-controller";
|
|
7
7
|
import type { APIOptions, ImageUploader, ChangeHandler, DeviceType } from "@khanacademy/perseus";
|
|
8
8
|
import type { PerseusAnswerArea, PerseusRenderer, PerseusItem, Hint } from "@khanacademy/perseus-core";
|
|
@@ -40,7 +40,7 @@ declare class ItemEditor extends React.Component<Props> {
|
|
|
40
40
|
question: Record<any, any>;
|
|
41
41
|
};
|
|
42
42
|
questionEditor: React.RefObject<Editor>;
|
|
43
|
-
|
|
43
|
+
extrasEditor: React.RefObject<ExtrasEditor>;
|
|
44
44
|
hintsEditor: React.RefObject<CombinedHintsEditor>;
|
|
45
45
|
derivePreviewContent: (inputs: import("./util/derive-question-preview-content").DerivePreviewContentInputs) => {
|
|
46
46
|
type: "question";
|
|
@@ -48,7 +48,7 @@ declare class ItemEditor extends React.Component<Props> {
|
|
|
48
48
|
} | null;
|
|
49
49
|
updateProps: (newProps: Partial<PerseusItem>) => void;
|
|
50
50
|
handleEditorChange: ChangeHandler;
|
|
51
|
-
|
|
51
|
+
handleExtrasChange: (newProps: Partial<PerseusAnswerArea>) => void;
|
|
52
52
|
getSaveWarnings: () => any;
|
|
53
53
|
handleA11yReport: (report: A11yReport | null) => void;
|
|
54
54
|
serialize(): PerseusItem;
|
|
@@ -7,6 +7,7 @@ declare const DEFAULT_FEATURE_FLAGS: Record<"perseus-test-flag-1" | "perseus-tes
|
|
|
7
7
|
export declare function getFeatureFlags(overrides?: Partial<typeof DEFAULT_FEATURE_FLAGS>): {
|
|
8
8
|
"perseus-renderer-upgrade": boolean;
|
|
9
9
|
"desmos-calculator": boolean;
|
|
10
|
+
"article-extras": boolean;
|
|
10
11
|
"perseus-test-flag-1": boolean;
|
|
11
12
|
"perseus-test-flag-2": boolean;
|
|
12
13
|
};
|
|
@@ -9,7 +9,6 @@ interface Props extends PerseusCategorizerWidgetOptions, ChangeableProps {
|
|
|
9
9
|
* An editor for adding a categorizer widget that allows users to sort items into categories.
|
|
10
10
|
*/
|
|
11
11
|
declare class CategorizerEditor extends React.Component<Props> {
|
|
12
|
-
static widgetName: "categorizer";
|
|
13
12
|
static defaultProps: PerseusCategorizerWidgetOptions;
|
|
14
13
|
change: (arg1: any, arg2: any, arg3: any) => any;
|
|
15
14
|
serialize: () => any;
|
|
@@ -10,7 +10,6 @@ interface CSProgramEditorProps extends PerseusCSProgramWidgetOptions, Changeable
|
|
|
10
10
|
* This is the main editor for this widget, to specify all the options.
|
|
11
11
|
*/
|
|
12
12
|
declare class CSProgramEditor extends React.Component<CSProgramEditorProps> {
|
|
13
|
-
static widgetName: "cs-program";
|
|
14
13
|
change: (...args: ReadonlyArray<unknown>) => any;
|
|
15
14
|
_handleSettingsChange: (arg1: any) => void;
|
|
16
15
|
_handleProgramIDChange: (arg1: string) => void;
|
|
@@ -11,7 +11,6 @@ interface Props extends PerseusDefinitionWidgetOptions, ChangeableProps {
|
|
|
11
11
|
* editors to embed clickable terms with expandable explanations within content.
|
|
12
12
|
*/
|
|
13
13
|
declare class DefinitionEditor extends React.Component<Props> {
|
|
14
|
-
static widgetName: "definition";
|
|
15
14
|
static defaultProps: PerseusDefinitionWidgetOptions;
|
|
16
15
|
static initializeWidgetOptions(params: InitializeWidgetOptionsParams): PerseusDefinitionWidgetOptions;
|
|
17
16
|
change: (arg1: any, arg2: any, arg3: any) => any;
|
|
@@ -9,7 +9,6 @@ declare class DropdownEditor extends React.Component<Props> {
|
|
|
9
9
|
choices: any;
|
|
10
10
|
placeholder: any;
|
|
11
11
|
};
|
|
12
|
-
static widgetName: "dropdown";
|
|
13
12
|
static defaultProps: PerseusDropdownWidgetOptions;
|
|
14
13
|
onVisibleLabelChange: (arg1: string) => void;
|
|
15
14
|
onAriaLabelChange: (arg1: string) => void;
|
|
@@ -9,7 +9,6 @@ interface Props extends PerseusExplanationWidgetOptions, ChangeableProps {
|
|
|
9
9
|
* An editor for adding an explanation widget that provides supplementary information to users.
|
|
10
10
|
*/
|
|
11
11
|
declare class ExplanationEditor extends React.Component<Props> {
|
|
12
|
-
static widgetName: "explanation";
|
|
13
12
|
static defaultProps: PerseusExplanationWidgetOptions;
|
|
14
13
|
change: (arg1: any, arg2: any, arg3: any) => any;
|
|
15
14
|
serialize: () => any;
|
|
@@ -16,7 +16,6 @@ interface State {
|
|
|
16
16
|
* An editor for adding an expression widget that allows users to enter mathematical expressions.
|
|
17
17
|
*/
|
|
18
18
|
declare class ExpressionEditor extends React.Component<Props, State> {
|
|
19
|
-
static widgetName: "expression";
|
|
20
19
|
static defaultProps: any;
|
|
21
20
|
constructor(props: Props);
|
|
22
21
|
serialize(): PerseusExpressionWidgetOptions;
|
|
@@ -10,7 +10,6 @@ type Props = PerseusFreeResponseWidgetOptions & {
|
|
|
10
10
|
*/
|
|
11
11
|
declare class FreeResponseEditor extends React.Component<Props> {
|
|
12
12
|
static defaultProps: any;
|
|
13
|
-
static widgetName: "free-response";
|
|
14
13
|
serialize: () => PerseusFreeResponseWidgetOptions;
|
|
15
14
|
getSaveWarnings: () => Array<string>;
|
|
16
15
|
handleUpdateCharacterLimit: (newValue: string) => void;
|
|
@@ -7,7 +7,6 @@ interface Props extends PerseusGradedGroupWidgetOptions, ChangeableProps {
|
|
|
7
7
|
apiOptions?: APIOptionsWithDefaults;
|
|
8
8
|
}
|
|
9
9
|
declare class GradedGroupEditor extends React.Component<Props> {
|
|
10
|
-
static widgetName: "graded-group";
|
|
11
10
|
static defaultProps: PerseusGradedGroupWidgetOptions;
|
|
12
11
|
editor: React.RefObject<Editor>;
|
|
13
12
|
hintEditor: React.RefObject<Editor>;
|
|
@@ -7,7 +7,6 @@ interface Props extends PerseusGradedGroupSetWidgetOptions, ChangeableProps {
|
|
|
7
7
|
}
|
|
8
8
|
declare class GradedGroupSetEditor extends React.Component<Props> {
|
|
9
9
|
_editors: Array<any>;
|
|
10
|
-
static widgetName: "graded-group-set";
|
|
11
10
|
static defaultProps: PerseusGradedGroupSetWidgetOptions;
|
|
12
11
|
UNSAFE_componentWillMount(): void;
|
|
13
12
|
change: (arg1: any, arg2: any, arg3: any) => any;
|
|
@@ -9,7 +9,6 @@ type Props = {
|
|
|
9
9
|
apiOptions: APIOptionsWithDefaults;
|
|
10
10
|
};
|
|
11
11
|
declare class GrapherEditor extends React.Component<Props> {
|
|
12
|
-
static widgetName: "grapher";
|
|
13
12
|
static defaultProps: PerseusGrapherWidgetOptions;
|
|
14
13
|
handleAvailableTypesChange: (newAvailableTypes: Array<any>) => void;
|
|
15
14
|
serialize: () => any;
|
|
@@ -7,7 +7,6 @@ interface IframeEditorProps extends PerseusIFrameWidgetOptions, ChangeableProps
|
|
|
7
7
|
* This is the main editor for this widget, to specify all the options.
|
|
8
8
|
*/
|
|
9
9
|
declare class IframeEditor extends React.Component<IframeEditorProps> {
|
|
10
|
-
static widgetName: "iframe";
|
|
11
10
|
static defaultProps: PerseusIFrameWidgetOptions;
|
|
12
11
|
change: (arg1: any, arg2: any, arg3: any) => any;
|
|
13
12
|
handleSettingsChange: (arg1: any) => void;
|
|
@@ -10,7 +10,6 @@ export interface Props extends PerseusImageWidgetOptions {
|
|
|
10
10
|
*/
|
|
11
11
|
declare class ImageEditor extends React.Component<Props> {
|
|
12
12
|
static displayName: string;
|
|
13
|
-
static widgetName: string;
|
|
14
13
|
static defaultProps: PerseusImageWidgetOptions;
|
|
15
14
|
serialize(): any;
|
|
16
15
|
render(): React.JSX.Element;
|
|
@@ -3,6 +3,5 @@ import NumericInputEditor from "../numeric-input-editor";
|
|
|
3
3
|
* An editor for adding an input number widget that allows users to enter numerical values.
|
|
4
4
|
*/
|
|
5
5
|
declare class InputNumberEditor extends NumericInputEditor {
|
|
6
|
-
static widgetName: "input-number";
|
|
7
6
|
}
|
|
8
7
|
export default InputNumberEditor;
|
|
@@ -24,7 +24,6 @@ type State = any;
|
|
|
24
24
|
* and their properties.
|
|
25
25
|
*/
|
|
26
26
|
declare class InteractionEditor extends React.Component<Props, State> {
|
|
27
|
-
static widgetName: "interaction";
|
|
28
27
|
static defaultProps: PerseusInteractionWidgetOptions;
|
|
29
28
|
state: State;
|
|
30
29
|
UNSAFE_componentWillReceiveProps(nextProps: Props): void;
|
|
@@ -21,11 +21,14 @@ declare const InteractiveGraph: {
|
|
|
21
21
|
isArticle?: boolean;
|
|
22
22
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
23
23
|
showAlignmentOptions?: boolean;
|
|
24
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
24
25
|
readOnly?: boolean;
|
|
25
26
|
editingDisabled?: boolean;
|
|
26
27
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
27
28
|
getAnotherHint?: () => unknown;
|
|
28
|
-
interactionCallback
|
|
29
|
+
interactionCallback? /**
|
|
30
|
+
* The labels for the x and y axes.
|
|
31
|
+
*/: (widgetData: {
|
|
29
32
|
[widgetId: string]: any;
|
|
30
33
|
}) => void;
|
|
31
34
|
imagePlaceholder?: React.ReactNode;
|
|
@@ -42,16 +45,15 @@ declare const InteractiveGraph: {
|
|
|
42
45
|
}>) => void;
|
|
43
46
|
customKeypad?: boolean;
|
|
44
47
|
isMobile?: boolean;
|
|
45
|
-
isMobileApp
|
|
46
|
-
* The range of the graph in the x and y directions.
|
|
47
|
-
*/: boolean;
|
|
48
|
+
isMobileApp?: boolean;
|
|
48
49
|
hintProgressColor?: string;
|
|
49
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
50
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
50
51
|
}> & {
|
|
51
52
|
baseElements: NonNullable<Readonly<{
|
|
52
53
|
isArticle?: boolean;
|
|
53
54
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
54
55
|
showAlignmentOptions?: boolean;
|
|
56
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
55
57
|
readOnly?: boolean;
|
|
56
58
|
editingDisabled?: boolean;
|
|
57
59
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -75,12 +77,13 @@ declare const InteractiveGraph: {
|
|
|
75
77
|
isMobile?: boolean;
|
|
76
78
|
isMobileApp?: boolean;
|
|
77
79
|
hintProgressColor?: string;
|
|
78
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
80
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
79
81
|
}>["baseElements"]>;
|
|
80
82
|
isArticle: NonNullable<Readonly<{
|
|
81
83
|
isArticle?: boolean;
|
|
82
84
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
83
85
|
showAlignmentOptions?: boolean;
|
|
86
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
84
87
|
readOnly?: boolean;
|
|
85
88
|
editingDisabled?: boolean;
|
|
86
89
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -104,12 +107,13 @@ declare const InteractiveGraph: {
|
|
|
104
107
|
isMobile?: boolean;
|
|
105
108
|
isMobileApp?: boolean;
|
|
106
109
|
hintProgressColor?: string;
|
|
107
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
110
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
108
111
|
}>["isArticle"]>;
|
|
109
112
|
isMobile: NonNullable<Readonly<{
|
|
110
113
|
isArticle?: boolean;
|
|
111
114
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
112
115
|
showAlignmentOptions?: boolean;
|
|
116
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
113
117
|
readOnly?: boolean;
|
|
114
118
|
editingDisabled?: boolean;
|
|
115
119
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -133,12 +137,13 @@ declare const InteractiveGraph: {
|
|
|
133
137
|
isMobile?: boolean;
|
|
134
138
|
isMobileApp?: boolean;
|
|
135
139
|
hintProgressColor?: string;
|
|
136
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
140
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
137
141
|
}>["isMobile"]>;
|
|
138
142
|
isMobileApp: NonNullable<Readonly<{
|
|
139
143
|
isArticle?: boolean;
|
|
140
144
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
141
145
|
showAlignmentOptions?: boolean;
|
|
146
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
142
147
|
readOnly?: boolean;
|
|
143
148
|
editingDisabled?: boolean;
|
|
144
149
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -162,12 +167,13 @@ declare const InteractiveGraph: {
|
|
|
162
167
|
isMobile?: boolean;
|
|
163
168
|
isMobileApp?: boolean;
|
|
164
169
|
hintProgressColor?: string;
|
|
165
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
170
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
166
171
|
}>["isMobileApp"]>;
|
|
167
172
|
editingDisabled: NonNullable<Readonly<{
|
|
168
173
|
isArticle?: boolean;
|
|
169
174
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
170
175
|
showAlignmentOptions?: boolean;
|
|
176
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
171
177
|
readOnly?: boolean;
|
|
172
178
|
editingDisabled?: boolean;
|
|
173
179
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -191,12 +197,13 @@ declare const InteractiveGraph: {
|
|
|
191
197
|
isMobile?: boolean;
|
|
192
198
|
isMobileApp?: boolean;
|
|
193
199
|
hintProgressColor?: string;
|
|
194
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
200
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
195
201
|
}>["editingDisabled"]>;
|
|
196
202
|
onFocusChange: NonNullable<Readonly<{
|
|
197
203
|
isArticle?: boolean;
|
|
198
204
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
199
205
|
showAlignmentOptions?: boolean;
|
|
206
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
200
207
|
readOnly?: boolean;
|
|
201
208
|
editingDisabled?: boolean;
|
|
202
209
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -220,12 +227,13 @@ declare const InteractiveGraph: {
|
|
|
220
227
|
isMobile?: boolean;
|
|
221
228
|
isMobileApp?: boolean;
|
|
222
229
|
hintProgressColor?: string;
|
|
223
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
230
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
224
231
|
}>["onFocusChange"]>;
|
|
225
232
|
readOnly: NonNullable<Readonly<{
|
|
226
233
|
isArticle?: boolean;
|
|
227
234
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
228
235
|
showAlignmentOptions?: boolean;
|
|
236
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
229
237
|
readOnly?: boolean;
|
|
230
238
|
editingDisabled?: boolean;
|
|
231
239
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -249,12 +257,13 @@ declare const InteractiveGraph: {
|
|
|
249
257
|
isMobile?: boolean;
|
|
250
258
|
isMobileApp?: boolean;
|
|
251
259
|
hintProgressColor?: string;
|
|
252
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
260
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
253
261
|
}>["readOnly"]>;
|
|
254
262
|
showAlignmentOptions: NonNullable<Readonly<{
|
|
255
263
|
isArticle?: boolean;
|
|
256
264
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
257
265
|
showAlignmentOptions?: boolean;
|
|
266
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
258
267
|
readOnly?: boolean;
|
|
259
268
|
editingDisabled?: boolean;
|
|
260
269
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -278,7 +287,7 @@ declare const InteractiveGraph: {
|
|
|
278
287
|
isMobile?: boolean;
|
|
279
288
|
isMobileApp?: boolean;
|
|
280
289
|
hintProgressColor?: string;
|
|
281
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
290
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
282
291
|
}>["showAlignmentOptions"]>;
|
|
283
292
|
}>;
|
|
284
293
|
keypadElement?: any;
|
|
@@ -287,7 +296,10 @@ declare const InteractiveGraph: {
|
|
|
287
296
|
findWidgets: import("../../../../perseus/src/types").FindWidgetsFunction;
|
|
288
297
|
reviewMode: boolean;
|
|
289
298
|
showSolutions?: import("@khanacademy/perseus-core").ShowSolutions;
|
|
290
|
-
handleUserInput: (newUserInput: PerseusGraphType, cb?: () => void, silent
|
|
299
|
+
handleUserInput: (newUserInput: PerseusGraphType, cb?: () => void, silent? /**
|
|
300
|
+
* Whether to show tooltips on the graph.
|
|
301
|
+
* (Currently not used, but will be in the future.)
|
|
302
|
+
*/: boolean) => void;
|
|
291
303
|
linterContext: import("@khanacademy/perseus-linter").LinterContextProps;
|
|
292
304
|
containerSizeClass: import("../../../../perseus/src/util/sizing-utils").SizeClass;
|
|
293
305
|
step: [number, number];
|
|
@@ -349,11 +361,14 @@ declare const InteractiveGraph: {
|
|
|
349
361
|
isArticle?: boolean;
|
|
350
362
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
351
363
|
showAlignmentOptions?: boolean;
|
|
364
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
352
365
|
readOnly?: boolean;
|
|
353
366
|
editingDisabled?: boolean;
|
|
354
367
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
355
368
|
getAnotherHint?: () => unknown;
|
|
356
|
-
interactionCallback
|
|
369
|
+
interactionCallback? /**
|
|
370
|
+
* The labels for the x and y axes.
|
|
371
|
+
*/: (widgetData: {
|
|
357
372
|
[widgetId: string]: any;
|
|
358
373
|
}) => void;
|
|
359
374
|
imagePlaceholder?: React.ReactNode;
|
|
@@ -370,16 +385,15 @@ declare const InteractiveGraph: {
|
|
|
370
385
|
}>) => void;
|
|
371
386
|
customKeypad?: boolean;
|
|
372
387
|
isMobile?: boolean;
|
|
373
|
-
isMobileApp
|
|
374
|
-
* The range of the graph in the x and y directions.
|
|
375
|
-
*/: boolean;
|
|
388
|
+
isMobileApp?: boolean;
|
|
376
389
|
hintProgressColor?: string;
|
|
377
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
390
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
378
391
|
}> & {
|
|
379
392
|
baseElements: NonNullable<Readonly<{
|
|
380
393
|
isArticle?: boolean;
|
|
381
394
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
382
395
|
showAlignmentOptions?: boolean;
|
|
396
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
383
397
|
readOnly?: boolean;
|
|
384
398
|
editingDisabled?: boolean;
|
|
385
399
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -403,12 +417,13 @@ declare const InteractiveGraph: {
|
|
|
403
417
|
isMobile?: boolean;
|
|
404
418
|
isMobileApp?: boolean;
|
|
405
419
|
hintProgressColor?: string;
|
|
406
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
420
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
407
421
|
}>["baseElements"]>;
|
|
408
422
|
isArticle: NonNullable<Readonly<{
|
|
409
423
|
isArticle?: boolean;
|
|
410
424
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
411
425
|
showAlignmentOptions?: boolean;
|
|
426
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
412
427
|
readOnly?: boolean;
|
|
413
428
|
editingDisabled?: boolean;
|
|
414
429
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -432,12 +447,13 @@ declare const InteractiveGraph: {
|
|
|
432
447
|
isMobile?: boolean;
|
|
433
448
|
isMobileApp?: boolean;
|
|
434
449
|
hintProgressColor?: string;
|
|
435
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
450
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
436
451
|
}>["isArticle"]>;
|
|
437
452
|
isMobile: NonNullable<Readonly<{
|
|
438
453
|
isArticle?: boolean;
|
|
439
454
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
440
455
|
showAlignmentOptions?: boolean;
|
|
456
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
441
457
|
readOnly?: boolean;
|
|
442
458
|
editingDisabled?: boolean;
|
|
443
459
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -461,12 +477,13 @@ declare const InteractiveGraph: {
|
|
|
461
477
|
isMobile?: boolean;
|
|
462
478
|
isMobileApp?: boolean;
|
|
463
479
|
hintProgressColor?: string;
|
|
464
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
480
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
465
481
|
}>["isMobile"]>;
|
|
466
482
|
isMobileApp: NonNullable<Readonly<{
|
|
467
483
|
isArticle?: boolean;
|
|
468
484
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
469
485
|
showAlignmentOptions?: boolean;
|
|
486
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
470
487
|
readOnly?: boolean;
|
|
471
488
|
editingDisabled?: boolean;
|
|
472
489
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -490,12 +507,13 @@ declare const InteractiveGraph: {
|
|
|
490
507
|
isMobile?: boolean;
|
|
491
508
|
isMobileApp?: boolean;
|
|
492
509
|
hintProgressColor?: string;
|
|
493
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
510
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
494
511
|
}>["isMobileApp"]>;
|
|
495
512
|
editingDisabled: NonNullable<Readonly<{
|
|
496
513
|
isArticle?: boolean;
|
|
497
514
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
498
515
|
showAlignmentOptions?: boolean;
|
|
516
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
499
517
|
readOnly?: boolean;
|
|
500
518
|
editingDisabled?: boolean;
|
|
501
519
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -519,12 +537,13 @@ declare const InteractiveGraph: {
|
|
|
519
537
|
isMobile?: boolean;
|
|
520
538
|
isMobileApp?: boolean;
|
|
521
539
|
hintProgressColor?: string;
|
|
522
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
540
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
523
541
|
}>["editingDisabled"]>;
|
|
524
542
|
onFocusChange: NonNullable<Readonly<{
|
|
525
543
|
isArticle?: boolean;
|
|
526
544
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
527
545
|
showAlignmentOptions?: boolean;
|
|
546
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
528
547
|
readOnly?: boolean;
|
|
529
548
|
editingDisabled?: boolean;
|
|
530
549
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -548,12 +567,13 @@ declare const InteractiveGraph: {
|
|
|
548
567
|
isMobile?: boolean;
|
|
549
568
|
isMobileApp?: boolean;
|
|
550
569
|
hintProgressColor?: string;
|
|
551
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
570
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
552
571
|
}>["onFocusChange"]>;
|
|
553
572
|
readOnly: NonNullable<Readonly<{
|
|
554
573
|
isArticle?: boolean;
|
|
555
574
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
556
575
|
showAlignmentOptions?: boolean;
|
|
576
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
557
577
|
readOnly?: boolean;
|
|
558
578
|
editingDisabled?: boolean;
|
|
559
579
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -577,12 +597,13 @@ declare const InteractiveGraph: {
|
|
|
577
597
|
isMobile?: boolean;
|
|
578
598
|
isMobileApp?: boolean;
|
|
579
599
|
hintProgressColor?: string;
|
|
580
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
600
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
581
601
|
}>["readOnly"]>;
|
|
582
602
|
showAlignmentOptions: NonNullable<Readonly<{
|
|
583
603
|
isArticle?: boolean;
|
|
584
604
|
onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
|
|
585
605
|
showAlignmentOptions?: boolean;
|
|
606
|
+
renderExtras?: (answerArea: import("@khanacademy/perseus-core").PerseusAnswerArea, widgetId: string) => React.ReactNode;
|
|
586
607
|
readOnly?: boolean;
|
|
587
608
|
editingDisabled?: boolean;
|
|
588
609
|
answerableCallback?: (arg1: boolean) => unknown;
|
|
@@ -606,7 +627,7 @@ declare const InteractiveGraph: {
|
|
|
606
627
|
isMobile?: boolean;
|
|
607
628
|
isMobileApp?: boolean;
|
|
608
629
|
hintProgressColor?: string;
|
|
609
|
-
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator", boolean>;
|
|
630
|
+
flags?: Record<"perseus-renderer-upgrade" | "desmos-calculator" | "article-extras", boolean>;
|
|
610
631
|
}>["showAlignmentOptions"]>;
|
|
611
632
|
}>;
|
|
612
633
|
keypadElement?: any;
|
|
@@ -615,7 +636,10 @@ declare const InteractiveGraph: {
|
|
|
615
636
|
findWidgets: import("../../../../perseus/src/types").FindWidgetsFunction;
|
|
616
637
|
reviewMode: boolean;
|
|
617
638
|
showSolutions?: import("@khanacademy/perseus-core").ShowSolutions;
|
|
618
|
-
handleUserInput: (newUserInput: PerseusGraphType, cb?: () => void, silent
|
|
639
|
+
handleUserInput: (newUserInput: PerseusGraphType, cb?: () => void, silent? /**
|
|
640
|
+
* Whether to show tooltips on the graph.
|
|
641
|
+
* (Currently not used, but will be in the future.)
|
|
642
|
+
*/: boolean) => void;
|
|
619
643
|
linterContext: import("@khanacademy/perseus-linter").LinterContextProps;
|
|
620
644
|
containerSizeClass: import("../../../../perseus/src/util/sizing-utils").SizeClass;
|
|
621
645
|
step: [number, number];
|
|
@@ -767,7 +791,6 @@ export type Props = {
|
|
|
767
791
|
* Used in the exercise editor.
|
|
768
792
|
*/
|
|
769
793
|
declare class InteractiveGraphEditor extends React.Component<Props> {
|
|
770
|
-
static widgetName: string;
|
|
771
794
|
static bestPractices: {
|
|
772
795
|
url: string;
|
|
773
796
|
label: string;
|
|
@@ -25,7 +25,6 @@ interface Props {
|
|
|
25
25
|
declare class LabelImageEditor extends React.Component<Props> {
|
|
26
26
|
private _questionMarkers;
|
|
27
27
|
static defaultProps: PerseusLabelImageWidgetOptions;
|
|
28
|
-
static widgetName: "label-image";
|
|
29
28
|
componentDidUpdate(prevProps: Props): void;
|
|
30
29
|
getSaveWarnings: () => ReadonlyArray<any | string>;
|
|
31
30
|
serialize(): any;
|
|
@@ -7,7 +7,6 @@ type Props = PerseusMatcherWidgetOptions & {
|
|
|
7
7
|
* An editor for adding a matcher widget that allows users to match items from two different sets.
|
|
8
8
|
*/
|
|
9
9
|
declare class MatcherEditor extends React.Component<Props> {
|
|
10
|
-
static widgetName: "matcher";
|
|
11
10
|
static defaultProps: PerseusMatcherWidgetOptions;
|
|
12
11
|
onLabelChange: (index: number, e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
13
12
|
getSaveWarnings: () => string[];
|
|
@@ -6,7 +6,6 @@ interface Props extends PerseusMatrixWidgetOptions, ChangeableProps {
|
|
|
6
6
|
apiOptions: APIOptionsWithDefaults;
|
|
7
7
|
}
|
|
8
8
|
declare class MatrixEditor extends React.Component<Props> {
|
|
9
|
-
static widgetName: "matrix";
|
|
10
9
|
static defaultProps: PerseusMatrixWidgetOptions;
|
|
11
10
|
change: (arg1: any, arg2?: any, arg3?: any) => any;
|
|
12
11
|
onMatrixBoardSizeChange: (arg1: [number, number]) => void;
|
|
@@ -4,7 +4,6 @@ import type { PerseusMeasurerWidgetOptions } from "@khanacademy/perseus-core";
|
|
|
4
4
|
interface Props extends PerseusMeasurerWidgetOptions, ChangeableProps {
|
|
5
5
|
}
|
|
6
6
|
declare class MeasurerEditor extends React.Component<Props> {
|
|
7
|
-
static widgetName: "measurer";
|
|
8
7
|
static defaultProps: PerseusMeasurerWidgetOptions;
|
|
9
8
|
className: string;
|
|
10
9
|
change: (arg1: any, arg2: any, arg3: any) => any;
|
|
@@ -23,7 +23,6 @@ type Props = {
|
|
|
23
23
|
* positions, intervals, and points on a number line.
|
|
24
24
|
*/
|
|
25
25
|
declare class NumberLineEditor extends React.Component<Props> {
|
|
26
|
-
static widgetName: "number-line";
|
|
27
26
|
static defaultProps: PerseusNumberLineWidgetOptions;
|
|
28
27
|
onRangeChange: (arg1: Range) => void;
|
|
29
28
|
onLabelRangeChange: (arg1: number, arg2: number) => void;
|
|
@@ -17,7 +17,6 @@ interface State {
|
|
|
17
17
|
* numerical values with specific validation rules.
|
|
18
18
|
*/
|
|
19
19
|
declare class NumericInputEditor extends React.Component<Props, State> {
|
|
20
|
-
static widgetName: string;
|
|
21
20
|
static displayName: string;
|
|
22
21
|
static defaultProps: any;
|
|
23
22
|
constructor(props: Props);
|
|
@@ -4,7 +4,6 @@ type Props = PerseusOrdererWidgetOptions & {
|
|
|
4
4
|
onChange: (newOptions: Partial<PerseusOrdererWidgetOptions>, callback?: () => void) => void;
|
|
5
5
|
};
|
|
6
6
|
declare class OrdererEditor extends React.Component<Props> {
|
|
7
|
-
static widgetName: "orderer";
|
|
8
7
|
static defaultProps: PerseusOrdererWidgetOptions;
|
|
9
8
|
onOptionsChange: (whichOptions: "correctOptions" | "otherOptions", options: string[]) => void;
|
|
10
9
|
onLayoutChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
|
|
@@ -12,7 +12,6 @@ type Props = PerseusPhetSimulationWidgetOptions & {
|
|
|
12
12
|
*/
|
|
13
13
|
declare class PhetSimulationEditor extends React.Component<Props> {
|
|
14
14
|
static defaultProps: PerseusPhetSimulationWidgetOptions;
|
|
15
|
-
static widgetName: "phet-simulation";
|
|
16
15
|
serialize(): PerseusPhetSimulationWidgetOptions;
|
|
17
16
|
getSaveWarnings: () => ReadonlyArray<string>;
|
|
18
17
|
render(): React.ReactNode;
|
|
@@ -33,7 +33,6 @@ type State = {
|
|
|
33
33
|
* An editor for adding a plotter widget that allows users to create and customize data visualizations.
|
|
34
34
|
*/
|
|
35
35
|
declare class PlotterEditor extends React.Component<Props, State> {
|
|
36
|
-
static widgetName: "plotter";
|
|
37
36
|
static defaultProps: PerseusPlotterWidgetOptions;
|
|
38
37
|
state: State;
|
|
39
38
|
UNSAFE_componentWillMount(): void;
|
|
@@ -10,7 +10,6 @@ export declare function validateOptions(height: Props["height"], programID: Prop
|
|
|
10
10
|
* An editor for adding a Python program widget that allows users to write, edit and execute Python code.
|
|
11
11
|
*/
|
|
12
12
|
declare class PythonProgramEditor extends React.Component<Props> {
|
|
13
|
-
static widgetName: "python-program";
|
|
14
13
|
static defaultProps: PerseusPythonProgramWidgetOptions;
|
|
15
14
|
change: (...args: ReadonlyArray<unknown>) => any;
|
|
16
15
|
serialize(): PerseusPythonProgramWidgetOptions;
|
|
@@ -17,7 +17,6 @@ export interface RadioEditorProps {
|
|
|
17
17
|
* An editor for adding a radio widget that allows users to select a single option from multiple choices.
|
|
18
18
|
*/
|
|
19
19
|
declare class RadioEditor extends React.Component<RadioEditorProps> {
|
|
20
|
-
static widgetName: "radio";
|
|
21
20
|
static bestPractices: {
|
|
22
21
|
url: string;
|
|
23
22
|
label: string;
|
|
@@ -10,7 +10,6 @@ type SorterEditorHandle = {
|
|
|
10
10
|
declare const _default: React.ForwardRefExoticComponent<PerseusSorterWidgetOptions & {
|
|
11
11
|
onChange: (newOptions: Partial<PerseusSorterWidgetOptions>, callback?: () => void) => void;
|
|
12
12
|
} & React.RefAttributes<SorterEditorHandle>> & {
|
|
13
|
-
widgetName: "sorter";
|
|
14
13
|
defaultProps: PerseusSorterWidgetOptions;
|
|
15
14
|
};
|
|
16
15
|
export default _default;
|