@zzish/math-rich-input 0.1.0

package/src/equationEditorButtonsHelper.js

@@ -0,0 +1,590 @@
+const LATEX_SYMBOLS = [
+  // {name:"Times",latex:"\\times",tooltip:"Times [#X)"},
+  // {name:"Dot",latex:"\\cdot",tooltip:"Dot [#C]"},
+  // {name:"Divide",latex:"\\div",tooltip:"Divide [#/]"},
+  // {name:"Plus or minus",latex:"\\pm",tooltip:"Plus or minus [#-]"},
+  // {name:"Less than",latex:"<",tooltip:"Less than [<]"},
+  // {name:"Greater than",latex:">",tooltip:"Greater than [>]"},
+  // {name:"Greater than or equal",latex:"\\ge",tooltip:"Greater than or equal [#>]"},
+  // {name:"Less than or equal",latex:"\\le",tooltip:"Less than or equal [#<]"},
+  // {name:"Not equal",latex:"\\ne",tooltip:"Not equal [#=]"},
+  // {name:"Long division",latex:" 7 )\\hspace{-3px}\\overline{\\hspace{3px} 21 \\hspace{2px}}", scale:90},
+  // {name:"Long division 2",latex:" 7 |\\hspace{-1.5px}\\overline{\\hspace{2px} 21 \\hspace{2px}}", scale:90},
+
+  // {name:"Union",latex:"\\cup"},
+  // {name:"Intersection",latex:"\\cap"},
+  // {name:"In",latex:"\\in"},
+  // {name:"Not in",latex:"\\notin"},
+  // {name:"Empty set",latex:"\\emptyset"},
+  // {name:"For all",latex:"\\forall"},
+  // {name:"Exists",latex:"\\exists"},
+  // {name:"Not exists",latex:"\\nexists"},
+
+  // {name:"Right arrow",latex:"\\rightarrow"},
+  // {name:"Left arrow",latex:"\\leftarrow"},
+  // {name:"Left right arrow",latex:"\\leftrightarrow"},
+  // {name:"Long right arrow",latex:"\\longrightarrow"},
+  // {name:"Infinity",latex:"\\infty"},
+  // {name:"Proportional",latex:"\\propto"},
+
+  // {name:"Upside down triangle",latex:"\\triangledown"},
+  // {name:"Big circle",latex:"\\bigcirc"},
+  // {name:"Small circle",latex:"\\circ"},
+  // {name:"Left pointing triangle",latex:"\\triangleleft"},
+  // {name:"Right pointing triangle",latex:"\\triangleright"},
+
+  // {name:"Black lozenge",latex:"\\blacklozenge"},
+  // {name:"Black Star",latex:"\\bigstar"},
+  // {name:"Red Star",latex:"\\red \\bigstar"},
+  // {name:"Orange Star",latex:"\\orange \\bigstar"},
+  // {name:"Green Star",latex:"\\green \\bigstar"},
+  // {name:"Blue Star",latex:"\\blue \\bigstar"},
+  // {name:"Purple Star",latex:"\\purple \\bigstar"},
+
+  // {name:"Black Square",latex:"\\blacksquare"},
+  // {name:"Red Square",latex:"\\red \\blacksquare"},
+  // {name:"Orange Square",latex:"\\orange \\blacksquare"},
+  // {name:"Green Square",latex:"\\green \\blacksquare"},
+  // {name:"Blue Square",latex:"\\blue \\blacksquare"},
+  // {name:"Purple Square",latex:"\\purple \\blacksquare"},
+
+  // {name:"Dollar",latex:"\\$",scale:80,tooltip:"Dollar (type \\$)"},
+  // {name:"Percent",latex:"\\%",scale:80,tooltip:"Percent (type \\%)"},
+  // {name:"Parenenthesis",latex:"( x )"},
+  // {name:"Tall parenenthesis",latex:"\\left(  \\right)",scale:100,buttonLatex:"\\left( \\frac{a}{b}  \\right)"},
+  // {name:"Curly brackets",latex:"\\{ x \\}"},
+  // {name:"Tall curly brackets",latex:"\\left\\{  \\right\\}",scale:100,buttonLatex:"\\left\\{ \\frac{a}{b}  \\right\\}"},
+  // {name:"Square brackets",latex:"[ x ]"},
+  // {name:"Tall square brackets",latex:"\\left[  \\right]",scale:100,buttonLatex:"\\left[ \\frac{a}{b}  \\right]"},
+  // {name:"Angle brackets",latex:"\\lang x \\rang"},
+  // {name:"Tall angle brackets",latex:"\\left\\lang  \\right\\rang",scale:100,buttonLatex:"\\left\\lang \\frac{a}{b}  \\right\\rang"},
+  // {name:"Cases",latex:"x = \\begin{cases}\ra & \\text{if } b \\\\\rc & \\text{if } d\r\\end{cases}", scale:80},
+  // {name:"Bullets",latex:"\\newline\r\\begin{array}{ll}\r\\bullet & \\text{ Item 1 } \\\\\r\\bullet & \\text{ Item 2 } \\\\\r\\bullet & \\text{ Item 3 }\r\\end{array}\r\\newline", scale:70},
+  // {name:"Table",latex:"\\newline\r\\begin{array}{|c|c|}\r\\hline\r\\text{ Col 1 } & \\text{ Col 2 } \\\\\r\\hline\ra & b \\\\\rc & d \\\\\re & f \\\\\r\\hline\r\\end{array}\r\\newline", scale:60},
+  
+  // {name:"Squared",latex:"x^2",tooltip:"Squared (type \\^2)"},
+  // {name:"Cubed",latex:"x^3"},
+  // {name:"Power 4",latex:"x^4"},
+  // {name:"Power 5",latex:"x^5"},
+  // {name:"Power 6",latex:"x^6"},
+  // {name:"Power 7",latex:"x^7"},
+  // {name:"Power 8",latex:"x^8"},
+  // {name:"Power 9",latex:"x^9"},
+  // {name:"Power 10",latex:"x^{10}"},
+  // {name:"Power -1",latex:"x^{-1}"},
+  // {name:"Power fraction",latex:"x^{\\frac{ a }{ b }}"},
+  // {name:"Fraction power n+1",latex:"\\left(\\frac{ a }{ b }\\right)^{n+1}"},
+  // {name:"Power n+1",latex:"x^{n+1}"},
+  // {name:"Power n-1",latex:"x^{n-1}"},
+  // {name:"Exponential growth",latex:"e^{kt}"},
+  // {name:"Natural log (ln)",latex:"\\ln"},
+  // {name:"Log 10",latex:"\\log_{10}"},
+
+  // {name:"Quadratic equation",latex:"ax^2+bx+c=0",scale:80},
+  // {name:"Circle equation",latex:"(x-p)^2+(y-q)^2=r^2",scale:80},
+  // {name:"Simultaneous equations",latex:"\\newline\r\\begin{array}{c}\rx + 2y = 1  \\\\\r2x + y = 5\r\\end{array}\r\\newline", scale:80},
+
+  // {name:"Subscript",latex:"x_i"},
+  // {name:"Subscript n+1",latex:"x_{n+1}"},
+  // {name:"Subscript n-1",latex:"x_{n-1}"},
+  // {name:"x intercept",latex:"x\\text{\\small-intercept}"},
+  // {name:"y intercept",latex:"y\\text{\\small-intercept}"},
+  
+
+  // {name:"Square root",latex:"\\sqrt{x}"},
+  // {name:"Cube root",latex:"\\sqrt[3]{x}"},
+  // {name:"4th root",latex:"\\sqrt[4]{x}"},
+  // {name:"5th root",latex:"\\sqrt[5]{x}"},
+  // {name:"6th root",latex:"\\sqrt[6]{x}"},
+  // {name:"Root 2",latex:"\\surd 2"},
+  // {name:"Root 3",latex:"\\surd 3"},
+  // {name:"Root 5",latex:"\\surd 5"},
+  // {name:"Root 7",latex:"\\surd 7"},
+  // {name:"Root 11",latex:"\\surd 11"},
+  // {name:"Root 13",latex:"\\surd 13"},
+
+  // {name:"mean",latex:"\\overline{x}"},
+  // {name:"vector",latex:"\\vec{x}"},
+  // {name:"hat",latex:"\\hat{x}"},
+  // {name:"widehat",latex:"\\widehat{x}"},
+  // {name:"dot",latex:"\\dot{x}"},
+  // {name:"ddot",latex:"\\ddot{x}"},
+  // {name:"mathring",latex:"\\mathring{x}"},
+  // {name:"tilde",latex:"\\tilde{x}"},
+
+  // // {name:"fraction",latex:"\\frac{ ◻︎ }{ ◻︎ }",scale:80,buttonLatex:"\\frac{◻}{◻︎}"},
+  // {name:"Fraction",latex:"\\frac{ a }{ b }",scale:80},
+  // {name:"Fraction 2",latex:"\\small^{ a }{\\!/}_{ b }"},
+  // {name:"Mixed fraction",latex:"a \\frac{ b }{ c }",scale:80},
+  // {name:"One half",latex:"\\frac{1}{2}",scale:80},
+  // {name:"One third",latex:"\\frac{1}{3}",scale:80},
+  // {name:"One quarter",latex:"\\frac{1}{4}",scale:80},
+  // {name:"One over root 2",latex:"\\frac{1}{\\surd 2}",scale:80},
+  // {name:"One over root 3",latex:"\\frac{1}{\\surd 3}",scale:80},
+  // {name:"a over x + b",latex:"\\frac{ a }{ x + b }",tooltip:"a over x + b"},
+  // {name:"x + a over x + b",latex:"\\frac{ x + a }{ x + b }",tooltip:"x + a over x + b"},
+  // {name:"x + a over x + root b",latex:"\\frac{ x + a }{ x + \\surd b }",tooltip:"x + a over x + root b"},
+
+  // {name:"Degree",latex:"\\degree",buttonLatex:"\\! \\degree \\!"},
+  // {name:"Angle",latex:"\\angle"},
+  // {name:"Measured angle",latex:"\\measuredangle"},
+  // {name:"Spherical angle",latex:"\\sphericalangle"},
+  
+  // {name:"Sum",latex:"\\sum"},
+  // {name:"Product",latex:"\\prod"},
+  // {name:"Sum i=1 to n",latex:"\\displaystyle \\sum_{i=1}^{n}"},
+  // {name:"Sum n=0 to infinity",latex:"\\displaystyle \\sum_{n=0}^{\\infty}"},
+  // {name:"Product i=1 to n",latex:"\\displaystyle \\prod_{i=1}^{n}"},
+  // {name:"Product n=0 to infinity",latex:"\\displaystyle \\prod_{n=0}^{\\infty}"},
+  // {name:"Integral",latex:"\\int"},
+  // {name:"Double integral",latex:"\\iint",buttonLatex:"\\! \\iint \\!"},
+  // {name:"Treble integral",latex:"\\iiint",buttonLatex:"\\! \\iiint \\!"},
+  // {name:"Integrate from a to b",latex:"\\int_{a}^{b}",buttonLatex:"\\! \\int_{a}^{b} \\!"},
+  // {name:"Integrate from 0 to infinity",latex:"\\int_{0}^{\\infty}",buttonLatex:"\\! \\int_{0}^{\\infty} \\!"},
+  // {name:"Integrate wrt x",latex:"\\int dx",buttonLatex:"\\! \\int \\! dx \\!"},
+  // {name:"Double integrate wrt uv",latex:"\\iint du\\,dv",scale:90,buttonLatex:"\\! \\iint \\! du\\,dv \\!"},
+  // {name:"dxdy",latex:"\\frac{dx}{dy}"},
+  // {name:"Partial dxdy",latex:"\\frac{\\partial x}{\\partial y}"}, 
+  // {name:"limxtoinfinity",latex:"\\small{\\underset{x \\to \\infty}{\\lim}}",scale:90,buttonLatex:"\\! \\underset{x \\to \\infty}{\\lim} \\!"},
+  // {name:"intbrackets",latex:"\\left[ x \\right]_{a}^{b}",scale:95,buttonLatex:"\\! \\left[ x \\right]_{a}^{b} \\!"},
+
+  // {name:"Vector OA",latex:"\\overrightarrow{\\rm OA}",
+  //  scale:80,buttonLatex:"\\overrightarrow{\\rm OA}"},
+  // {name:"Vector OB",latex:"\\overrightarrow{\\rm OB}",
+  //  scale:80,buttonLatex:"\\overrightarrow{\\rm OB}"},
+  // {name:"Vector PQ",latex:"\\overrightarrow{\\rm PQ}",
+  //  scale:80,buttonLatex:"\\overrightarrow{\\rm PQ}"},
+  // {name:"1x2 matrix",latex:"\\begin{bmatrix} a & b \\end{bmatrix}",
+  //  scale:48,buttonLatex:"\\begin{bmatrix} a & b \\end{bmatrix}"},
+  // {name:"1x3 matrix",latex:"\\begin{bmatrix} a & b & c \\end{bmatrix}",
+  //  scale:48,buttonLatex:"\\begin{bmatrix} a & b & c \\end{bmatrix}"},
+  // {name:"2-vector",latex:"\\begin{bmatrix}\ra \\\\\rb\r\\end{bmatrix}",
+  //  scale:48,buttonLatex:"\\begin{bmatrix}\ra \\\\\rb\r\\end{bmatrix}"},
+  // {name:"2x2 matrix",latex:"\\begin{bmatrix}\ra & b \\\\\rc & d\r\\end{bmatrix}",
+  //  scale:48,buttonLatex:"\\begin{bmatrix}\ra & b \\\\\rc & d\r\\end{bmatrix}"},
+  // {name:"2x3 matrix",latex:"\\begin{bmatrix}\ra & b & c \\\\\rd & e & f\r\\end{bmatrix}",
+  //  scale:48,buttonLatex:"\\begin{bmatrix}\ra & b & c \\\\\rd & e & f\r\\end{bmatrix}"},
+  // {name:"3-vector",latex:"\\begin{bmatrix}\ra \\\\\rb \\\\\rc\r\\end{bmatrix}",
+  //  scale:48,buttonLatex:"\\begin{bmatrix}\ra \\\\\rb \\\\\rc\r\\end{bmatrix}"},
+  // {name:"3x3 matrix",latex:"\\begin{bmatrix}\ra & b & c \\\\\rd & e & f \\\\\rg & h & i\r\\end{bmatrix}",
+  //  scale:48,buttonLatex:"\\begin{bmatrix}\ra & b & c \\\\\rd & e & f \\\\\rg & h & i\r\\end{bmatrix}"},
+  // {name:"3x2 matrix",latex:"\\begin{bmatrix}\ra & b \\\\\rc & d \\\\\re & f\r\\end{bmatrix}",
+  //  scale:48,buttonLatex:"\\begin{bmatrix}\ra & b \\\\\rc & d \\\\\re & f\r\\end{bmatrix}"},
+
+  // {name:"carbon",latex:"_{6}^{12}\\mathrm{C}", scale:100,buttonLatex:"_{6}^{12}\\mathrm{C}"},
+  // {name:"neutron",latex:"_{1}^{0}\\mathrm{n}", scale:100,buttonLatex:"_{1}^{0}\\mathrm{n}"},
+  // {name:"electron",latex:"_{0}^{-1}\\mathrm{e}", scale:100,buttonLatex:"_{0}^{-1}\\mathrm{e}"},
+
+  // {name:"Symbols Toolbar",scale:100,buttonLatex:"\\pm \\, \\tiny \\blacktriangledown", tooltip:"Symbols"},
+  // {name:"Shapes Toolbar",scale:100,buttonLatex:"\\Box \\, \\tiny \\blacktriangledown", tooltip:"Shapes"},
+  // {name:"Special Toolbar",scale:100,buttonLatex:"\\$ \\, \\tiny \\blacktriangledown", tooltip:"Special"},
+  // {name:"Powers Toolbar",scale:100,buttonLatex:"x^2 \\, \\tiny \\blacktriangledown", tooltip:"Powers"},
+  // {name:"Subscripts Toolbar",scale:100,buttonLatex:"x_i \\, \\tiny \\blacktriangledown", tooltip:"Subscripts"},
+  // {name:"Roots Toolbar",scale:100,buttonLatex:"\\sqrt{x} \\, \\tiny \\blacktriangledown", tooltip:"Roots"},
+  // {name:"Fractions Toolbar", scale:100,buttonLatex:"\\frac{a}{b} \\, \\tiny \\blacktriangledown", tooltip:"Fractions"},
+  // {name:"Greek Letters Toolbar",scale:100,buttonLatex:"\\alpha \\, \\tiny \\blacktriangledown", tooltip:"Greek letters"},
+  // {name:"Overline Toolbar", scale:100,buttonLatex:"\\overline{x} \\, \\tiny \\blacktriangledown", tooltip:"Overlines"},
+  // {name:"Angles Toolbar", scale:100,buttonLatex:"\\degree \\, \\tiny \\blacktriangledown", tooltip:"Angles"},
+  // {name:"Sum and Product Toolbar", scale:100,buttonLatex:"\\small \\sum \\, \\tiny \\blacktriangledown", tooltip:"Sum and Prod"},
+  // {name:"Calculus Toolbar", scale:100,buttonLatex:"\\small \\int \\, \\tiny \\blacktriangledown", tooltip:"Calculus"},
+  // {name:"Matrices Toolbar", scale:100,buttonLatex:"\\tiny \\begin{bmatrix} \\cdot \\ \\cdot \\\\ \\cdot \\ \\cdot \\end{bmatrix} \\, \\tiny \\blacktriangledown", tooltip:"Matrices"},
+
+  {name:"Squared",latex:"^2",buttonLatex:"\\square^2",tooltip:"Squared (type \\^2)",typedText:true,moveCursor:1},
+  {name:"Power",latex:"^",buttonLatex:"\\square^x",tooltip:"Power (type \\^x)",typedText:true},
+  {name:"Subscript",latex:"_",buttonLatex:"\\square_x",tooltip:"Subscript (type \\_x)",typedText:true},
+  {name:"Root",latex:"\\sqrt{#}",buttonLatex:"\\sqrt{x}",tooltip:"Square root",moveCursor:-1},
+  {name:"Cube root",latex:"\\sqrt[3]{#}",buttonLatex:"\\sqrt[3]{x}",tooltip:"Cube root",moveCursor:-1},
+  {name:"Nth root",latex:"\\sqrt[#]{#}",buttonLatex:"\\sqrt[n]{x}",tooltip:"Nth root",moveCursor:-2},
+  {name:"Surd",latex:"\\surd{#}",buttonLatex:"\\surd{x}",tooltip:"Surd"},
+  {name:"Over",mathQuill:"/",latex:"\\frac{##}{#}",buttonLatex:"\\frac{\\square}{x}",tooltip:"Fraction",typedText:true},
+  {name:"Over root",latex:"/\\sqrt ",buttonLatex:"\\frac{a}{\\sqrt{x}}",tooltip:"Over square root",moveCursor:-1,typedText:true},
+  {name:"Hat",latex:"\\hat{#}",buttonLatex:"\\hat{x}",tooltip:"Hat",moveCursor:-1},
+  
+  {name:"Vector",latex:"\\vec{#}",buttonLatex:"\\vec{x}",tooltip:"Vector",moveCursor:-1},
+  {name:"Line segment",latex:"\\overline{\\mathrm{AB#}}",buttonLatex:"\\overline{\\mathrm{AB}}",tooltip:"Overline",moveCursor:-2,scale:80},
+  {name:"Ray",latex:"\\overrightarrow{\\mathrm{AB#}}",buttonLatex:"\\overrightarrow{\\mathrm{AB}}",tooltip:"Over left arrow",moveCursor:-2,scale:80},
+  {name:"Over left arrow",latex:"\\overleftarrow{\\mathrm{AB#}}",buttonLatex:"\\overleftarrow{\\mathrm{AB}}",tooltip:"Over left arrow",moveCursor:-2,scale:80},
+  {name:"Line",latex:"\\overleftrightarrow{\\mathrm{AB#}}",buttonLatex:"\\overleftrightarrow{\\mathrm{AB}}",tooltip:"Over left arrow",moveCursor:-2,scale:80},
+
+  {name:"Dot",latex:"\\dot{#}",buttonLatex:"\\dot{x}",tooltip:"Dot",moveCursor:-1},
+  {name:"Double dot",latex:"\\ddot{#}",buttonLatex:"\\ddot{x}",tooltip:"Double dot",moveCursor:-1},
+  {name:"dxdy",latex:"\\frac{dx}{dy}",scale:90},
+  {name:"Partial dxdy",latex:"\\frac{\\partial x}{\\partial y}",buttonLatex:"\\frac{\\partial x}{\\partial y}",tooltip:"Partial dxdy",scale:90},
+  {name:"Integral",latex:"\\int_{#}^{#}",buttonLatex:"\\int",tooltip:"Integral",moveCursor:-2,scale:90},
+  {name:"Double integral",latex:"\\iint_{#}^{#}",buttonLatex:"\\iint",tooltip:"Double integral",moveCursor:-2},
+  {name:"Triple integral",latex:"\\iiint_{#}^{#}",buttonLatex:"\\iiint",tooltip:"Double integral",moveCursor:-2},
+  {name:"Contour integral",latex:"\\oint_{#}^{#}",buttonLatex:"\\oint",tooltip:"Contour integral",moveCursor:-2},
+
+  {name:"Integral a b",latex:"\\int_{#}^{#}",buttonLatex:"\\int_{a}^{b}",tooltip:"Integral",moveCursor:-2,scale:90},
+  {name:"Double integral a b",latex:"\\iint_{#}^{#}",buttonLatex:"\\iint_{a}^{b}",tooltip:"Double integral",moveCursor:-2},
+  {name:"Triple integral a b",latex:"\\iiint_{#}^{#}",buttonLatex:"\\iiint_{a}^{b}",tooltip:"Double integral",moveCursor:-2},
+  {name:"Contour integral a b",latex:"\\oint_{#}^{#}",buttonLatex:"\\oint_{a}^{b}",tooltip:"Contour integral",moveCursor:-2},
+
+  {name:"Sum a b",mathQuill:"\\sum ",latex:"\\sum\\limits_{#}^{#}",buttonLatex:"\\sum\\limits_a^b",scale:75,moveCursor:-1,typedText:true},
+  {name:"Product a b",mathQuill:"\\prod ",latex:"\\prod\\limits_{#}^{#}",buttonLatex:"\\prod\\limits_a^b",scale:75,tooltip:"Product",moveCursor:-1,typedText:true},
+  {name:"Infinity",latex:"\\infty"},
+  {name:"Right arrow",latex:"\\rightarrow"},
+
+
+  {name:"Box",latex:"\\square",buttonLatex:"\\square",tooltip:"Box"},
+  {name:"Plus",latex:"+",buttonLatex:"+",tooltip:"Plus"},
+  {name:"Minus",latex:"-",buttonLatex:"-",tooltip:"Mius"},
+  {name:"Plus or minus",latex:"\\pm",buttonLatex:"\\pm",tooltip:"Plus or minus"},
+  {name:"Times",latex:"\\times",buttonLatex:"\\times",tooltip:"Times"},
+  {name:"Divide",latex:"\\div",buttonLatex:"\\div",tooltip:"Divide"},
+  {name:"Center dot",latex:"\\cdot",buttonLatex:"\\cdot",tooltip:"Center dot"},
+  {name:"Equals",latex:"=",buttonLatex:"=",tooltip:"Equals"},
+  {name:"Less than",latex:"<",buttonLatex:"<",tooltip:"Less than (type <)"},
+  {name:"Greater than",latex:">",buttonLatex:">",tooltip:"Greater than (type >=)"},
+  {name:"Not equal",latex:"\\ne",buttonLatex:"\\ne",tooltip:"Not equal"},
+  {name:"Less than or equal",latex:"\\le",buttonLatex:"\\le",tooltip:"Less than or equal"},
+  {name:"Greater than or equal",latex:"\\ge",buttonLatex:"\\ge",tooltip:"Greater than or equal"},
+  {name:"Equivalent",latex:"\\equiv",buttonLatex:"\\equiv",tooltip:"Equivalent"},
+  {name:"Similar",latex:"\\sim",buttonLatex:"\\sim",tooltip:"Similar"},
+  {name:"Approximately",latex:"\\approx",buttonLatex:"\\approx",tooltip:"Approximately"},
+  {name:"Congruent",latex:"\\cong",buttonLatex:"\\cong",tooltip:"Cong"},
+  {name:"Implies",latex:"\\Rightarrow",buttonLatex:"\\Rightarrow",tooltip:"Implies"},
+  {name:"Limit x to infinity",mathQuill:"\\lim_{x\\to \\infty}",latex:"\\lim\\limits_{x\\to \\infty}",scale:90},
+  // {name:"",latex:"\\",buttonLatex:"\\",tooltip:"",moveCursor:-1},
+
+  {name:"Measured angle",latex:"\\measuredangle"},
+  {name:"Spherical angle",latex:"\\sphericalangle"},
+  {name:"Proportionate",latex:"\\propto"},
+  {name:"Parallel",latex:"\\parallel"},
+  {name:"Perpendicular",latex:"\\perp"},
+
+  {name:"nsubset",latex:"\\nsubset",buttonLatex:"\\not\\subset"},
+
+  {name:"Algebraic numbers",latex:"\\A",buttonLatex:"\\mathbb A"},
+  {name:"Complex numbers",latex:"\\C",buttonLatex:"\\mathbb C"},
+  {name:"Natural numbers",latex:"\\N",buttonLatex:"\\mathbb N"},
+  {name:"Rational numbers",latex:"\\Q",buttonLatex:"\\mathbb Q"},
+  {name:"Real numbers",latex:"\\R",buttonLatex:"\\mathbb R"},
+  {name:"Integers",latex:"\\Z",buttonLatex:"\\mathbb Z"},
+
+  {name:"Subscript2",latex:"_2",buttonLatex:"\\square_2",tooltip:"Subscript (type \\_2)"},
+  {name:"SubscriptN",latex:"_",buttonLatex:"\\square_n",tooltip:"Subscript (type \\_n)", typedText:true},
+  {name:"SuperscriptN",latex:"^",buttonLatex:"\\square^n",tooltip:"Superscript (type \\^n)", typedText:true},
+  {name:"Chemistry arrow",latex:"  \\longrightarrow  ",buttonLatex:"\\longrightarrow",tooltip:"Chemistry arrow", typedText:true},
+
+  {name:"_e",latex:"\\mathrm{e^-}",buttonLatex:"\\mathrm{e^-}"},
+  {name:"_n",latex:"_{0}^{1}\\mathrm{n}",buttonLatex:"_{0}^{1}\\mathrm{n}"},
+  {name:"_p",latex:"_{1}^{1}\\mathrm{p}",buttonLatex:"_{1}^{1}\\mathrm{p}"},
+  {name:"_a",latex:"_{2}^{2}\\alpha",buttonLatex:"_{2}^{2}\\alpha"},
+  {name:"_em",latex:"_{-1}^{0}\\mathrm{e}",buttonLatex:"_{-1}^{0}\\mathrm{e}"},
+  {name:"_bm",latex:"_{-1}^{0}\\beta",buttonLatex:"_{-1}^{0}\\beta"},
+  {name:"_ep",latex:"_{1}^{0}\\mathrm{e}",buttonLatex:"_{1}^{0}\\mathrm{e}"},
+  {name:"_bp",latex:"_{1}^{0}\\beta",buttonLatex:"_{1}^{0}\\beta"},
+  {name:"_ga",latex:"_{0}^{0}\\gamma",buttonLatex:"_{0}^{0}\\gamma"},
+  {name:"_s",latex:"_{(s)}",buttonLatex:"\\square_{(s)}"},
+  {name:"_g",latex:"_{(g)}",buttonLatex:"\\square_{(g)}"},
+  {name:"_l",latex:"_{(l)}",buttonLatex:"\\square_{(l)}"},
+  {name:"_aq",latex:"_{(aq)}",buttonLatex:"\\square_{(aq)}"},
+
+  {name:"Type in Roman text",latex:"\\mathrm ",buttonLatex:"\\mathrm{[text]}",scale:70,typedText:true},
+  {name:"Uranium symbol",latex:"_{92}^{235}\\mathrm U",buttonLatex:"_{92}^{235}\\mathrm U"},
+
+  {name:"Half",latex:"\\frac{1}{2}",buttonLatex:"\\frac{1}{2}"},
+  {name:"Third",latex:"\\frac{1}{3}",buttonLatex:"\\frac{1}{3}"},
+  {name:"Over root 2",latex:"\\frac{#}{\\surd{2}}",buttonLatex:"\\frac{x}{\\surd{2}}",moveCursor:-4},
+  {name:"Over root 3",latex:"\\frac{#}{\\surd{3}}",buttonLatex:"\\frac{x}{\\surd{3}}",moveCursor:-4},
+  {name:"Subscript zero",latex:"_0",buttonLatex:"\\square_0"},
+  {name:"Subscript max",latex:"_{\\max}",buttonLatex:"\\square_{\\max}",scale:80},
+  {name:"Subscript min",latex:"_{\\min}",buttonLatex:"\\square_{\\min}",scale:80},
+  {name:"Subscript rms",latex:"_\\mathrm{rms}",buttonLatex:"\\square_\\mathrm{rms}",scale:80},
+  {name:"Root a over b",latex:"\\sqrt{\\frac{#}{#}}",buttonLatex:"\\sqrt{\\frac{a}{b}}",moveCursor:-3},
+  {name:"Capacitor discharge",latex:"e^{\\frac{-t}{RC}}",scale:80},
+  {name:"Radioactive decay",latex:"e^{-\\lambda t}",scale:80},
+  {name:"Attenuation of rays",latex:"e^{-\\mu x}",scale:80},
+  {name:"Delta x over delta t",latex:"\\frac{\\Delta{#}}{\\Delta{t}}",buttonLatex:"\\frac{\\Delta{x}}{\\Delta{t}}",moveCursor:-4},
+  {name:"dxdt",latex:"\\frac{d}{d{t}}",buttonLatex:"\\frac{dx}{dt}",moveCursor:-4},
+
+  {name:"Widehat",latex:"\\widehat{#}",buttonLatex:"\\widehat{x}"},
+  {name:"Double dot",latex:"\\ddot{#}",buttonLatex:"\\ddot{x}"},
+  {name:"Mathring",latex:"\\mathring{#}",buttonLatex:"\\mathring{x}"},
+  {name:"Tilde",latex:"\\tilde{#}",buttonLatex:"\\tilde{x}"},
+  {name:"Check",latex:"\\check{#}",buttonLatex:"\\check{x}"},
+  {name:"Right arrow with text",latex:"\\xrightarrow[#]{#}",buttonLatex:"\\xrightarrow[text]{text}",scale:90},
+
+  {name:"Vector OA",latex:"\\overrightarrow{\\rm OA}",
+   scale:80,buttonLatex:"\\overrightarrow{\\rm OA}"},
+  {name:"Vector OB",latex:"\\overrightarrow{\\rm OB}",
+   scale:80,buttonLatex:"\\overrightarrow{\\rm OB}"},
+  {name:"Vector PQ",latex:"\\overrightarrow{\\rm PQ}",
+   scale:80,buttonLatex:"\\overrightarrow{\\rm PQ}"},
+  {name:"1-vector",latex:"\\begin{bmatrix} a# \\end{bmatrix}",
+   scale:70,buttonLatex:"\\begin{bmatrix} a \\end{bmatrix}"},
+  {name:"1x2 matrix",latex:"\\begin{bmatrix} a# & b \\end{bmatrix}",
+   scale:60,buttonLatex:"\\begin{bmatrix} a & b \\end{bmatrix}"},
+  {name:"1x3 matrix",latex:"\\begin{bmatrix} a# & b & c \\end{bmatrix}",
+   scale:38,buttonLatex:"\\begin{bmatrix} a & b & c \\end{bmatrix}"},
+  {name:"2-vector",latex:"\\begin{bmatrix}\ra# \\\\\rb\r\\end{bmatrix}",
+   scale:60,buttonLatex:"\\begin{bmatrix}\ra \\\\\rb\r\\end{bmatrix}"},
+  {name:"2x2 matrix",latex:"\\begin{bmatrix}\ra# & b \\\\\rc & d\r\\end{bmatrix}",
+   scale:60,buttonLatex:"\\begin{bmatrix}\ra & b \\\\\rc & d\r\\end{bmatrix}"},
+  {name:"2x3 matrix",latex:"\\begin{bmatrix}\ra# & b & c \\\\\rd & e & f\r\\end{bmatrix}",
+   scale:38,buttonLatex:"\\begin{bmatrix}\ra & b & c \\\\\rd & e & f\r\\end{bmatrix}"},
+  {name:"3-vector",latex:"\\begin{bmatrix}\ra# \\\\\rb \\\\\rc\r\\end{bmatrix}",
+   scale:40,buttonLatex:"\\begin{bmatrix}\ra \\\\\rb \\\\\rc\r\\end{bmatrix}"},
+  {name:"3x2 matrix",latex:"\\begin{bmatrix}\ra# & b \\\\\rc & d \\\\\re & f\r\\end{bmatrix}",
+   scale:40,buttonLatex:"\\begin{bmatrix}\ra & b \\\\\rc & d \\\\\re & f\r\\end{bmatrix}"},
+  {name:"3x3 matrix",latex:"\\begin{bmatrix}\ra# & b & c \\\\\rd & e & f \\\\\rg & h & i\r\\end{bmatrix}",
+   scale:38,buttonLatex:"\\begin{bmatrix}\r a & b & c \\\\\rd & e & f \\\\\rg & h & i\r\\end{bmatrix}"},
+  
+  {name:"1-vector round brackets",latex:"\\begin{pmatrix} a# \\end{pmatrix}",
+   scale:70,buttonLatex:"\\begin{pmatrix} a \\end{pmatrix}"},
+  {name:"2x2 matrix round brackets",latex:"\\begin{pmatrix}\ra# & b \\\\\rc & d\r\\end{pmatrix}",
+   scale:55,buttonLatex:"\\begin{pmatrix}\ra & b \\\\\rc & d\r\\end{pmatrix}"},
+   {name:"2x2 matrix curly brackets",latex:"\\begin{Bmatrix}\ra# & b \\\\\rc & d\r\\end{Bmatrix}",
+   scale:55,buttonLatex:"\\begin{Bmatrix}\ra & b \\\\\rc & d\r\\end{Bmatrix}"},
+
+  // {name:"_",latex:"\\mathrm{}",buttonLatex:"\\mathrm{}"}
+]
+
+const NORMAL_SYMBOLS = [
+  {name:"pounds",latex:"£",scale:100,buttonLatex:"£"},
+  {name:"cents",latex:"¢",scale:100,buttonLatex:"¢"},
+]
+
+const BUTTON_AREAS = {
+  "Common": ["Squared", "Power", "Subscript", "Over",
+            "Surd", "Root", "Nth root",  "Hat", "Line",
+            "Ray", "Line segment",
+            "Dot", "dxdy", "Partial dxdy", "Integral a b",
+            "Sum a b", "Product a b", "Right arrow", "Infinity","Limit x to infinity"],
+  "Operators": ["Plus","Minus","Center dot", 
+            "Times","Divide","Equals",
+            "Less than", "Greater than","Not equal",
+            "Less than or equal","Greater than or equal","Plus or minus",
+            "Proportionate","Approximately","Implies"],
+  "Angles": ["degree","theta","phi",
+            "pi","alpha","beta",
+            "gamma", "delta", "epsilon",
+            "Delta", "angle",
+            "Parallel", "Perpendicular", "Similar", "Congruent"],
+  "GreekLower": ["alpha", "beta", "gamma", "delta", "epsilon",
+                "zeta", "eta", "theta", "iota",
+                "kappa", "lambda", "mu", "nu",
+                "xi", "omicron", "pi", "rho", "sigma", "tau",
+                "upsilon", "phi", "chi", "psi", "omega"],
+  "GreekUpper": ["Gamma", "Delta", "Theta", "Lambda",
+                "Xi", "Pi", "Sigma", "Phi", "Psi", "Omega","nabla"],
+  "Sets": ["cup", "cap", "in", "notin",
+          "emptyset", "forall", "exists", "nexists",
+          "subset", "subseteq", "supset", "supseteq", "nsubset", "nsubseteq",
+          "neg", "Complex numbers","Natural numbers",
+          "Rational numbers","Real numbers","Integers"],
+  "Misc": ["because", "therefore","dots","cdots",
+           "ll", "gg",
+           "leftarrow", "leftrightarrow", "Leftrightarrow","mapsto",
+           "bullet", "circ", "Box", "bigcirc","bigtriangleup","bigtriangledown",
+           "heartsuit", "diamondsuit", "clubsuit", "spadesuit"
+          ],
+  "Chemistry": ["SubscriptN","SuperscriptN","Plus","Minus",
+              "_s","_g","_l","_aq",
+              "_e","_n","_p","_a",
+              "_em","_ep","_bm","_bp",
+              "gamma","_ga","Uranium symbol","Chemistry arrow"],
+  "Elements": ["Type in Roman text","_Al","_Ar","_Be","_B","_C","_Ca","_Cl","_Co","_Cr",
+               "_Cu","_F","_Fe","_H","_He","_K","_Li","_Mg","_Mn",
+               "_N","_Na","_Ne","_Ni","_O","_P","_S","_Sc","_Si",
+               "_Ti","_Zn"],
+  // "Elements": ["_H", "_He", "_Li", "_Be", "_B", "_C", "_N",
+  //              "_O", "_F", "_Ne", "_Na", "_Mg", "_Al", "_Si", 
+  //              "_P", "_S", "_Cl", "_Ar", "_K", "_Ca", "_Sc",
+  //              "_Ti", "_V", "_Cr", "_Mn", "_Fe", "_Co", "_Ni",
+  //              "_Cu"]
+  "Physics1": ["Squared", "Power", "Subscript", "Over",
+               "Root", "Nth root", "Surd", "Root a over b",
+               "Half","Third", "Over root 2", "Over root 3",
+              "sum", "delta", "Delta",
+              "Capacitor discharge","Radioactive decay", "Attenuation of rays",
+              "Delta x over delta t","dxdt"],
+  "Physics2": ["Plus","Minus","Plus or minus","Times","Equals",
+               "Approximately", "Proportionate"],
+  "Physics3": ["alpha","varepsilon", "eta", "gamma","lambda", "omega", "mu", "nu",
+               "pi", "rho", "sigma", "phi", "varPhi", "theta",
+               "overline{v_e}","overline{v_\\mu}",
+               "Subscript zero", "Subscript max", "Subscript min", "Subscript rms"],
+  "Expert": ["langle","rangle", 
+             "Double integral", "Triple integral", "Contour integral", 
+             "Double dot", "Widehat","Check", "Tilde","Mathring",
+             "Right arrow with text","rightleftharpoons"],
+  "Matrices": ["1-vector", "1x2 matrix","1x3 matrix",
+               "2-vector", "2x2 matrix", "2x3 matrix",
+               "3-vector", "3x2 matrix","3x3 matrix",
+               "cdots", "vdots","ddots",
+               "vec{a}","2x2 matrix round brackets","2x2 matrix curly brackets"]
+             
+}
+
+function removeMarks(latex) {
+  return latex.replace(/#/g,"")
+}
+
+function fill(symbolData) {
+  var filledSymbolData = {name:symbolData["name"], 
+                          latex:removeMarks(symbolData["latex"]),
+                          latexWithMarks:symbolData["latex"]}
+
+  var mathQuillLatex = symbolData["mathQuill"]
+  if (mathQuillLatex != null)
+    filledSymbolData["mathQuillLatex"] = mathQuillLatex
+  else
+    filledSymbolData["mathQuillLatex"] = filledSymbolData["latex"]
+
+  var buttonLatex = symbolData["buttonLatex"]
+  if (buttonLatex != null)
+    filledSymbolData["buttonLatex"] = buttonLatex
+  else
+    filledSymbolData["buttonLatex"] = filledSymbolData["latex"]
+  
+  var scaling = symbolData["scale"]
+  if (scaling != null)
+    filledSymbolData["scale"] = scaling
+  else
+    filledSymbolData["scale"] = 100
+
+  var moveCursor = symbolData["moveCursor"]
+  if (moveCursor != null)
+    filledSymbolData["moveCursor"] = moveCursor
+  else
+    filledSymbolData["moveCursor"] = 0
+
+  var typedText = symbolData["typedText"]
+  if (typedText != null)
+    filledSymbolData["typedText"] = typedText
+  else
+    filledSymbolData["typedText"] = false
+
+  var tooltip = symbolData["tooltip"]
+  if (tooltip != null) {
+    if (navigator.userAgent.indexOf('Mac OS X') !== -1) {
+      var displayAlt = String.fromCharCode(8997)
+    } else {
+      displayAlt = "ALT"
+    }
+    tooltip = tooltip.replace(/#/g, displayAlt);
+    filledSymbolData["tooltip"] = tooltip
+  } else {
+      var name = symbolData['name']
+      var char0 = name.charAt(0)
+      char0 = char0.toUpperCase()
+      filledSymbolData["tooltip"] = char0+name.substr(1)
+  }
+
+  return filledSymbolData
+}
+
+function toDict(symbols) {
+  var dict = {}
+  for (var i = 0; i < symbols.length; i++) {
+    var symbolData = fill(symbols[i])
+    dict[symbols[i]["name"]] = symbolData
+  }
+  return dict;
+} 
+
+const LATEX_SYMBOLS_DICT = toDict(LATEX_SYMBOLS)
+const NORMAL_SYMBOLS_DICT = toDict(NORMAL_SYMBOLS)
+
+function getSymbolData(name) {
+  if (name in LATEX_SYMBOLS_DICT)
+      return LATEX_SYMBOLS_DICT[name]
+
+  if (name in NORMAL_SYMBOLS_DICT)
+      return NORMAL_SYMBOLS_DICT[name]
+
+  if (name.charAt(0) === '_') {
+    if (name.charAt(1) >= 'A' && name.charAt(1) <= 'Z')
+      var latex="\\mathrm{"+name.substring(1)+"}"
+      return fill({name:name,latex:latex})
+  }
+
+  return fill({name:name,latex:"\\"+name})
+}
+
+export function buttonAreaExists(toolbarName) {
+  return toolbarName in BUTTON_AREAS
+}
+
+export function getSymbolsForButtonArea(buttonAreaName) {
+  return BUTTON_AREAS[buttonAreaName]
+}
+
+export function getSymbolLatex(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return symbolData['latex']
+}
+
+export function getSymbolLatexWithMarks(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return symbolData['latexWithMarks']
+}
+
+export function getSymbolMathQuillLatex(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return symbolData['mathQuillLatex']
+}
+
+export function getSymbolMoveCursor(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return symbolData['moveCursor']
+}
+
+export function getLatexInsertionParams(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return {
+    latexWithMarks: symbolData.latexWithMarks,
+    mathQuillLatex: symbolData.mathQuillLatex,
+    moveCursor: symbolData.moveCursor,
+    typedText: symbolData.typedText
+  }
+}
+
+
+
+export function getSymbolButtonLatex(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return symbolData["buttonLatex"]
+}
+
+export function getSymbolButtonScaling(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return symbolData["scale"]
+}
+
+export function getSymbolButtonHtml(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return symbolData['html']
+}
+
+export function setSymbolButtonHtml(name, html) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return false
+  symbolData['html'] = html  
+}
+
+export function getSymbolButtonTooltip(name) {
+  var symbolData = getSymbolData(name)
+  if (!symbolData)
+    return null
+  return symbolData['tooltip']
+}

package/src/index.js

@@ -0,0 +1,5 @@
+export { default as MathRichInput } from "./MathRichInput";
+export { default as MathRichArea } from "./MathRichArea";
+export { renderMathInNode } from "./MathRichArea";
+
+

package/src/katexHelper.js

@@ -0,0 +1,39 @@
+// This function adds the katex css stylesheet to the document head
+export const setupKatex = () => {
+  let links = document.getElementsByTagName("link")
+  for (let i = 0; i < links.length; i++) {
+    if (links[i].id === "katex-css")
+      return
+  }
+  
+  let link = document.createElement("link")
+  link.id = "katex-css"
+  link.rel = "stylesheet"
+  link.href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" 
+  // link.integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq"
+  link.crossorigin="anonymous"
+  document.head.appendChild(link);
+  console.log("Added katex css to document head")
+
+  // The following two scripts are required to have pages auto-render embedded latex.
+  // We don't need to do this as we render everything programatically.
+  // These are inlcuded here only for reference in case of future need.
+
+  // let script = document.createElement("script");
+  // script.id = "katex-js"
+  // script.defer = true;
+  // script.src = "https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js"
+  // // script.integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" 
+  // script.crossorigin="anonymous"
+  // document.head.appendChild(script);
+  // console.log("Added script")
+
+  // script = document.createElement("script");
+  // script.id = "katex-js-auto-render"
+  // script.defer = true;
+  // script.src = "https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js"
+  // // script.integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" 
+  // script.crossorigin="anonymous"
+  // document.head.appendChild(script);
+  // console.log("Added script")
+}