@khanacademy/perseus-editor 4.1.4 → 4.1.6

package/src/widgets/interaction-editor/constraint-editor.tsx

@@ -1,134 +0,0 @@
-import {components, Changeable, Dependencies} from "@khanacademy/perseus";
-import * as React from "react";
-
-import MathquillInput from "./mathquill-input";
-
-const {ButtonGroup, NumberInput} = components;
-
-type Props = Changeable.ChangeableProps & {
-    constraint: string;
-    constraintFn: string;
-    constraintXMax: string;
-    constraintXMin: string;
-    constraintYMax: string;
-    constraintYMin: string;
-    snap: number;
-};
-
-type DefaultProps = {
-    constraint: Props["constraint"];
-    constraintFn: Props["constraintFn"];
-    constraintXMax: Props["constraintXMax"];
-    constraintXMin: Props["constraintXMin"];
-    constraintYMax: Props["constraintYMax"];
-    constraintYMin: Props["constraintYMin"];
-    snap: Props["snap"];
-};
-
-class ConstraintEditor extends React.Component<Props> {
-    static defaultProps: DefaultProps = {
-        constraint: "none",
-        snap: 0.5,
-        constraintFn: "0",
-        constraintXMin: "-10",
-        constraintXMax: "10",
-        constraintYMin: "-10",
-        constraintYMax: "10",
-    };
-
-    change: (
-        propName: string,
-    ) => (value?: any, callback?: () => unknown) => unknown = (
-        propName: string,
-    ): ((value?: any, callback?: () => unknown) => unknown) => {
-        return Changeable.change.call(this, propName);
-    };
-
-    render(): React.ReactNode {
-        const {TeX} = Dependencies.getDependencies();
-
-        return (
-            <div>
-                <div className="perseus-widget-row">
-                    Constraint:{" "}
-                    <ButtonGroup
-                        value={this.props.constraint}
-                        allowEmpty={false}
-                        buttons={[
-                            {value: "none", content: "None"},
-                            {value: "snap", content: "Snap"},
-                            {value: "x", content: "x="},
-                            {value: "y", content: "y="},
-                        ]}
-                        onChange={this.change("constraint")}
-                    />
-                </div>
-                {this.props.constraint === "snap" && (
-                    <div className="perseus-widget-row">
-                        Snap:{" "}
-                        <NumberInput
-                            value={this.props.snap}
-                            placeholder={0}
-                            onChange={this.change("snap")}
-                        />
-                    </div>
-                )}
-                {this.props.constraint === "x" && (
-                    <div className="graph-settings">
-                        <div className="perseus-widget-row">
-                            <TeX>x=</TeX>{" "}
-                            <MathquillInput
-                                value={this.props.constraintFn}
-                                onChange={this.change("constraintFn")}
-                            />
-                        </div>
-                    </div>
-                )}
-                {this.props.constraint === "y" && (
-                    <div className="graph-settings">
-                        <div className="perseus-widget-row">
-                            <TeX>y=</TeX>{" "}
-                            <MathquillInput
-                                value={this.props.constraintFn}
-                                onChange={this.change("constraintFn")}
-                            />
-                        </div>
-                    </div>
-                )}
-                Ensure these are set so nothing can be dragged off the canvas:
-                <div className="perseus-widget-row">
-                    <div className="perseus-widget-row">
-                        <TeX>x \in \Large[</TeX>{" "}
-                        <MathquillInput
-                            value={this.props.constraintXMin}
-                            onChange={this.change("constraintXMin")}
-                        />
-                        <TeX>, </TeX>{" "}
-                        <MathquillInput
-                            value={this.props.constraintXMax}
-                            onChange={this.change("constraintXMax")}
-                        />{" "}
-                        <TeX>\Large]</TeX>
-                    </div>
-                </div>
-                <div className="perseus-widget-row">
-                    <div className="perseus-widget-row">
-                        <TeX>y \in \Large[</TeX>{" "}
-                        <MathquillInput
-                            value={this.props.constraintYMin}
-                            onChange={this.change("constraintYMin")}
-                        />
-                        <TeX>, </TeX>{" "}
-                        <MathquillInput
-                            value={this.props.constraintYMax}
-                            onChange={this.change("constraintYMax")}
-                        />{" "}
-                        <TeX>\Large]</TeX>
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
-
-export default ConstraintEditor;

package/src/widgets/interaction-editor/function-editor.tsx

@@ -1,108 +0,0 @@
-import {
-    components,
-    Changeable,
-    Dependencies,
-    EditorJsonify,
-    KhanColors,
-    ColorPicker,
-    DashPicker,
-} from "@khanacademy/perseus";
-import * as React from "react";
-import _ from "underscore";
-
-import MathquillInput from "./mathquill-input";
-
-const {NumberInput} = components;
-const {getDependencies} = Dependencies;
-
-type Props = Changeable.ChangeableProps & {
-    value: string;
-    rangeMin: string;
-    rangeMax: string;
-    color: string;
-    strokeDasharray: string;
-    strokeWidth: number;
-};
-
-type DefaultProps = {
-    value: Props["value"];
-    rangeMin: Props["rangeMin"];
-    rangeMax: Props["rangeMax"];
-    color: Props["color"];
-    strokeDasharray: Props["strokeDasharray"];
-    strokeWidth: Props["strokeWidth"];
-};
-
-// Editor for function plots
-class FunctionEditor extends React.Component<Props> {
-    static defaultProps: DefaultProps = {
-        value: "x",
-        rangeMin: "-10",
-        rangeMax: "10",
-        color: KhanColors.BLUE,
-        strokeDasharray: "",
-        strokeWidth: 2,
-    };
-
-    change: (arg1: any, arg2?: any, arg3?: any) => any = (...args) => {
-        return Changeable.change.apply(this, args);
-    };
-
-    serialize = () => {
-        return EditorJsonify.serialize.call(this);
-    };
-
-    render(): React.ReactNode {
-        const {TeX} = getDependencies();
-
-        return (
-            <div className="graph-settings">
-                <div className="perseus-widget-row">
-                    {/* @ts-expect-error - TS2339 - Property 'funcName' does not exist on type props. */}
-                    <TeX>{this.props.funcName + "(x)="}</TeX>{" "}
-                    <MathquillInput
-                        value={this.props.value}
-                        onChange={this.change("value")}
-                    />
-                </div>
-                <div className="perseus-widget-row">
-                    Range: <TeX>\Large(</TeX>
-                    <MathquillInput
-                        value={this.props.rangeMin}
-                        onChange={this.change("rangeMin")}
-                    />
-                    <TeX>,</TeX>{" "}
-                    <MathquillInput
-                        value={this.props.rangeMax}
-                        onChange={this.change("rangeMax")}
-                    />
-                    <TeX>\Large)</TeX>
-                </div>
-                <div className="perseus-widget-row">
-                    <ColorPicker
-                        value={this.props.color}
-                        onChange={this.change("color")}
-                    />
-                </div>
-                <div className="perseus-widget-row">
-                    <DashPicker
-                        value={this.props.strokeDasharray}
-                        onChange={this.change("strokeDasharray")}
-                    />
-                </div>
-                <div className="perseus-widget-row">
-                    <div className="perseus-widget-left-col">
-                        Width:{" "}
-                        <NumberInput
-                            value={this.props.strokeWidth}
-                            placeholder={2}
-                            onChange={this.change("strokeWidth")}
-                        />
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
-
-export default FunctionEditor;

package/src/widgets/interaction-editor/index.ts

@@ -1,3 +0,0 @@
-import InteractionEditor from "./interaction-editor";
-
-export default InteractionEditor;