Adapt the wrapper component to new names

concludio · Jun 18, 2020 · ffa3353 · ffa3353
1 parent eafb83d
commit ffa3353
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 33 deletions.
diff --git a/src/MathFieldComponent.test.tsx b/src/MathFieldComponent.test.tsx
@@ -5,8 +5,8 @@ import {
     cleanup,
     waitForElement,
 } from '@testing-library/react';
-import "mathlive";
-import { MathFieldComponent, combineConfig } from './MathFieldComponent';
+import { MathfieldComponent, combineConfig } from './MathfieldComponent';
+import { Mathfield } from 'mathlive';
 
 afterEach(cleanup);
 
@@ -18,7 +18,7 @@ describe("combineConfig", () => {
         const combinedConfig = combineConfig({
             latex: "fubar",
             onChange: v => value1 = v,
-            mathFieldConfig: {
+            mathfieldConfig: {
                 onContentDidChange: mf => value2 = mf.$latex(),
             },
         });
@@ -37,7 +37,7 @@ describe("combineConfig", () => {
 describe("MathFieldComponent", () => {
     it(" mounts mathfield", () => {
         const mountingResult = render(
-            <MathFieldComponent
+            <MathfieldComponent
                 latex="fubar" 
             />
         );
@@ -48,8 +48,8 @@ describe("MathFieldComponent", () => {
     it(" internal mathfield yields correct latex", () => {
         let mathField: any;
         render(
-            <MathFieldComponent
-                mathFieldRef={mf => mathField = mf}
+            <MathfieldComponent
+                mathfieldRef={mf => mathField = mf}
                 latex="fubar" 
             />
         );
@@ -60,8 +60,8 @@ describe("MathFieldComponent", () => {
         let value = "foo";
         let mathField: any;
         render(
-            <MathFieldComponent
-                mathFieldRef={mf => mathField = mf}
+            <MathfieldComponent
+                mathfieldRef={mf => mathField = mf}
                 onChange={v => value = v}
                 latex={value} 
             />
@@ -80,8 +80,8 @@ describe("MathFieldComponent", () => {
             public mathField: any;
 
             public render() {
-                return <MathFieldComponent 
-                    mathFieldRef={mf => this.mathField = mf}
+                return <MathfieldComponent 
+                    mathfieldRef={mf => this.mathField = mf}
                     latex={this.state.value}
 
                 />;
@@ -102,7 +102,7 @@ describe("MathFieldComponent", () => {
     });
 
     test("invalidly created instances throw correct errors", () => {
-        const mathFieldComponent = new MathFieldComponent({ latex: "fubar" });
+        const mathFieldComponent = new MathfieldComponent({ latex: "fubar" });
 
         try {
             mathFieldComponent.componentDidMount();

diff --git a/src/MathFieldComponent.tsx b/src/MathFieldComponent.tsx
@@ -1,20 +1,20 @@
 import 'mathlive/dist/mathlive.core.css';
 import 'mathlive/dist/mathlive.css';
 import * as React from 'react';
-import { makeMathField } from 'mathlive';
+import { makeMathField, MathfieldConfig, Mathfield } from 'mathlive';
 
 interface BaseProps {
     onChange?: (latex: string) => void;
 
     /** 
      * The raw options of mathlive's makeMathField.
      * */
-    mathFieldConfig?: MathFieldConfig;
+    mathfieldConfig?: MathfieldConfig;
 
     /**
      * The mathfield object returned by makeMathField.
      */
-    mathFieldRef?: (mathfield: Mathfield) => void;
+    mathfieldRef?: (mathfield: Mathfield) => void;
 }
 
 interface ControlledProps extends BaseProps {
@@ -29,16 +29,16 @@ interface UncontrolledProps extends BaseProps {
 
 export type Props = ControlledProps | UncontrolledProps;
 
-export function combineConfig(props: Props): MathFieldConfig {
-    const combinedConfiguration: MathFieldConfig = {
-        ...props.mathFieldConfig
+export function combineConfig(props: Props): MathfieldConfig {
+    const combinedConfiguration: MathfieldConfig = {
+        ...props.mathfieldConfig
     };
 
     const { onChange } = props;
 
     if (onChange) {
-        if (props.mathFieldConfig && props.mathFieldConfig.onContentDidChange) {
-            const fromConfig = props.mathFieldConfig.onContentDidChange;
+        if (props.mathfieldConfig && props.mathfieldConfig.onContentDidChange) {
+            const fromConfig = props.mathfieldConfig.onContentDidChange;
             combinedConfiguration.onContentDidChange = mf => {
                 onChange(mf.$latex());
                 fromConfig(mf);
@@ -52,28 +52,24 @@ export function combineConfig(props: Props): MathFieldConfig {
 }
 
 /** A react-control that hosts a mathlive-mathfield in it. */
-export class MathFieldComponent extends React.Component<Props> {
+export class MathfieldComponent extends React.Component<Props> {
     private insertElement: HTMLElement | null = null;
     private readonly combinedConfiguration = combineConfig(this.props);
-    private mathField: Mathfield | undefined;
+    private mathfield: Mathfield | undefined;
 
     componentDidUpdate(prevProps: Props) {
-        if (!this.mathField) {
+        if (!this.mathfield) {
             throw new Error("Component was not correctly initialized.");
         }
-        const p = {
-            prevProps,
-            props: this.props,
-        }
         if (prevProps.latex !== undefined) {
             if (this.props.latex === undefined) {
                 throw new Error("Cannot change from controlled to uncontrolled state!");
             }
             if (this.props.latex !== prevProps.latex) {
                 if (this.props.latex === "") {
-                    this.mathField.$perform("deleteAll");
+                    this.mathfield.$perform("deleteAll");
                 } else {
-                    this.mathField.$latex(this.props.latex, { suppressChangeNotifications: true });
+                    this.mathfield.$latex(this.props.latex, { suppressChangeNotifications: true });
                 }
             }
         }
@@ -90,11 +86,11 @@ export class MathFieldComponent extends React.Component<Props> {
 
         const initialValue = this.props.initialLatex ?? this.props.latex;
 
-        this.mathField = makeMathField(this.insertElement, this.combinedConfiguration);
-        this.mathField.$latex(initialValue, { suppressChangeNotifications: true });
+        this.mathfield = makeMathField(this.insertElement, this.combinedConfiguration);
+        this.mathfield.$latex(initialValue, { suppressChangeNotifications: true });
 
-        if (this.props.mathFieldRef) {
-            this.props.mathFieldRef(this.mathField);
+        if (this.props.mathfieldRef) {
+            this.props.mathfieldRef(this.mathfield);
         }
     }
 }
diff --git a/src/index.ts b/src/index.ts
@@ -1 +1 @@
-export { MathFieldComponent, Props as MathFieldComponentProps } from './MathFieldComponent';
+export { MathfieldComponent, Props as MathFieldComponentProps } from './MathfieldComponent';
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		export { MathFieldComponent, Props as MathFieldComponentProps } from './MathFieldComponent';
		export { MathfieldComponent, Props as MathFieldComponentProps } from './MathfieldComponent';