Skip to content

Commit

Permalink
Revert "Roll v2 Keypad Onto Desktop Web (#645)"
Browse files Browse the repository at this point in the history 
This reverts commit e036092.
  • Loading branch information
@nedredmond
nedredmond committed Aug 17, 2023
1 parent 1905432 commit 26f0703
Show file tree
Hide file tree
Showing 11 changed files with 318 additions and 431 deletions.
9 changes: 0 additions & 9 deletions .changeset/great-pigs-deny.md
View file

This file was deleted.

12 changes: 6 additions & 6 deletions packages/perseus-editor/src/widgets/expression-editor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ class ExpressionEditor extends React.Component<any, any> {

render(): React.ReactNode {
const answerOptions = this.props.answerForms
.map((obj: {form: any; simplify: any; value: any; key: number}) => {
.map((obj, index) => {
const expressionProps = {
// note we're using
// *this.props*.{times,functions,buttonSets} since each
Expand All @@ -112,22 +112,22 @@ class ExpressionEditor extends React.Component<any, any> {
simplify: obj.simplify,
value: obj.value,

onChange: (props) => this.updateForm(obj.key, props),
onChange: (props) => this.updateForm(index, props),
trackInteraction: () => {},

widgetId: this.props.widgetId + "-" + obj.key,
widgetId: this.props.widgetId + "-" + index,
} as const;

return lens(obj)
.merge([], {
draggable: true,
onChange: (props) => this.updateForm(obj.key, props),
onDelete: () => this.handleRemoveForm(obj.key),
onChange: (props) => this.updateForm(index, props),
onDelete: () => this.handleRemoveForm(index),
expressionProps: expressionProps,
})
.freeze();
})
.map((obj) => <AnswerOption key={obj.key} {...obj} />);
.map((obj, index) => <AnswerOption key={index} {...obj} />);

const sortable = (
<SortableArea
Expand Down
25 changes: 25 additions & 0 deletions packages/perseus-editor/src/widgets/interaction-editor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,13 +68,15 @@ class PointEditor extends React.Component<PointEditorProps> {
<div className="perseus-widget-row">
Coordinate: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.coordX}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
onChange={this.change("coordX")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.coordY}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand Down Expand Up @@ -141,13 +143,15 @@ class LineEditor extends React.Component<LineEditorProps> {
<div className="perseus-widget-row">
Start: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.startX}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
onChange={this.change("startX")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.startY}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand All @@ -158,13 +162,15 @@ class LineEditor extends React.Component<LineEditorProps> {
<div className="perseus-widget-row">
End: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.endX}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
onChange={this.change("endX")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.endY}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand Down Expand Up @@ -254,12 +260,14 @@ class MovablePointEditor extends React.Component<MovablePointEditorProps> {
<div className="perseus-widget-row">
Start: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.startX}
onChange={this.change("startX")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.startY}
onChange={this.change("startY")}
Expand Down Expand Up @@ -332,12 +340,14 @@ class MovableLineEditor extends React.Component<MovableLineEditorProps> {
<div className="perseus-widget-row">
Start: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.startX}
onChange={this.change("startX")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.startY}
onChange={this.change("startY")}
Expand All @@ -347,12 +357,14 @@ class MovableLineEditor extends React.Component<MovableLineEditorProps> {
<div className="perseus-widget-row">
End: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.endX}
onChange={this.change("endX")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.endY}
onChange={this.change("endY")}
Expand Down Expand Up @@ -428,6 +440,7 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
<div className="perseus-widget-row">
<TeX>{this.props.funcName + "(x)="}</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.value}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand All @@ -437,13 +450,15 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
<div className="perseus-widget-row">
Range: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.rangeMin}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
onChange={this.change("rangeMin")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.rangeMax}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand Down Expand Up @@ -526,6 +541,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
<div className="perseus-widget-row">
<TeX>X(t) =</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.x}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand All @@ -535,6 +551,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
<div className="perseus-widget-row">
<TeX>Y(t) =</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.y}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand All @@ -544,13 +561,15 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
<div className="perseus-widget-row">
Range: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.rangeMin}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
onChange={this.change("rangeMin")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.rangeMax}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand Down Expand Up @@ -638,13 +657,15 @@ class LabelEditor extends React.Component<LabelEditorProps> {
<div className="perseus-widget-row">
Location: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.coordX}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
onChange={this.change("coordX")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.coordY}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand Down Expand Up @@ -705,13 +726,15 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
<div className="perseus-widget-row">
Bottom left: <TeX>\Large(</TeX>
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.coordX}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
onChange={this.change("coordX")}
/>
<TeX>,</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.coordY}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand All @@ -722,6 +745,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
<div className="perseus-widget-row">
Width:{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.width}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand All @@ -731,6 +755,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
<div className="perseus-widget-row">
Height:{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.height}
// @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
Expand Down
6 changes: 6 additions & 0 deletions packages/perseus-editor/src/widgets/interaction/constraint-editor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@ class ConstraintEditor extends React.Component<Props> {
<div className="perseus-widget-row">
<TeX>x=</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.constraintFn}
onChange={this.change("constraintFn")}
Expand All @@ -88,6 +89,7 @@ class ConstraintEditor extends React.Component<Props> {
<div className="perseus-widget-row">
<TeX>y=</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.constraintFn}
onChange={this.change("constraintFn")}
Expand All @@ -100,12 +102,14 @@ class ConstraintEditor extends React.Component<Props> {
<div className="perseus-widget-row">
<TeX>x \in \Large[</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.constraintXMin}
onChange={this.change("constraintXMin")}
/>
<TeX>, </TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.constraintXMax}
onChange={this.change("constraintXMax")}
Expand All @@ -117,12 +121,14 @@ class ConstraintEditor extends React.Component<Props> {
<div className="perseus-widget-row">
<TeX>y \in \Large[</TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.constraintYMin}
onChange={this.change("constraintYMin")}
/>
<TeX>, </TeX>{" "}
<MathInput
buttonSets={[]}
buttonsVisible="never"
value={this.props.constraintYMax}
onChange={this.change("constraintYMax")}
Expand Down
20 changes: 4 additions & 16 deletions packages/perseus/src/components/__stories__/math-input.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,14 +13,7 @@ export default {
} as Story;

const defaultObject = {
keypadButtonSets: {
advancedRelations: true,
basicRelations: true,
divisionKey: true,
logarithms: true,
preAlgebra: true,
trigonometry: true,
},
buttonSets: ["basic"],
onChange: () => {},
} as const;

Expand All @@ -29,14 +22,9 @@ export const DefaultWithBasicButtonSet = (
): React.ReactElement => {
return <MathInput {...defaultObject} />;
};
export const DefaultWithAriaLabel = (args: StoryArgs): React.ReactElement => {
return <MathInput {...defaultObject} labelText="Sample label" />;
};

export const KeypadOpenByDefault = (args: StoryArgs): React.ReactElement => {
export const AlwaysVisibleButtonSet = (args: StoryArgs): React.ReactElement => {
return <MathInput {...defaultObject} buttonsVisible="always" />;
};

export const KeypadNeverVisible = (args: StoryArgs): React.ReactElement => {
return <MathInput {...defaultObject} buttonsVisible="never" />;
export const DefaultWithAriaLabel = (args: StoryArgs): React.ReactElement => {
return <MathInput {...defaultObject} labelText="Sample label" />;
};
Loading

0 comments on commit 26f0703

Please sign in to comment.