@fw-components/formula-editor 2.0.7-formula-editor.38 → 2.0.7-formula-editor.40

package/dist/formula-editor/src/formula-editor.js

@@ -19,19 +19,17 @@ let FormulaEditor = class FormulaEditor extends LitElement {
         /**
          * Text area input value
          */
-        this.content = "";
+        this.formulaString = "";
         this.placeholder = "Type your formula...";
         this.recommendationLabels = new Map();
         this.variables = new Map();
         this.minSuggestionLen = 2;
         this.errorString = "";
-        this.formulaRegex = /'[^']*'|[A-Za-z0-9_#@]+|[-+(),*^/\s]/g;
         this.allowedNumbers = true;
-        this.allowedOperators = new Set(["^", "+", "-", "*", "/"]);
     }
     updated(_changedProperties) {
-        if (_changedProperties.has("content")) {
-            if (!this.content?.trim()) {
+        if (_changedProperties.has("formulaString")) {
+            if (!this.formulaString?.trim()) {
                 this.recommendations = Array.from(this.variables.keys());
             }
             this._adjustTextAreaHeight();
@@ -47,11 +45,11 @@ let FormulaEditor = class FormulaEditor extends LitElement {
     handleContentUpdate(event) {
         event.preventDefault();
         this.lastInputType = event.inputType;
-        this.content = event.target.value;
+        this.formulaString = event.target.value;
         this.parseInput();
     }
     _adjustTextAreaHeight() {
-        if (!this.content)
+        if (!this.formulaString)
             this.editor.style.height = "var(--fe-height, 30px)";
         if (this.editor.scrollHeight > this.editor.clientHeight)
             this.editor.style.height = String(this.editor.scrollHeight + 5).concat("px");
@@ -63,7 +61,7 @@ let FormulaEditor = class FormulaEditor extends LitElement {
      */
     parseInput(recommendation = "") {
         this.currentCursorPosition = this.editor.selectionStart;
-        const { recommendations, errorString, formattedString, newCursorPosition } = this._parser.parseInput(this.content, this.currentCursorPosition, recommendation);
+        const { recommendations, errorString, formattedString, newCursorPosition } = this._parser.parseInput(this.formulaString, this.currentCursorPosition, recommendation);
         this.recommendations = recommendations;
         this.errorString = errorString;
         /**
@@ -74,7 +72,7 @@ let FormulaEditor = class FormulaEditor extends LitElement {
          * @see https://bugs.chromium.org/p/chromium/issues/detail?id=689541
          */
         if (this.lastInputType !== "insertCompositionText" || recommendation) {
-            this.content = formattedString;
+            this.formulaString = formattedString;
         }
         if (Boolean(recommendation)) {
             this.recommendations = [];
@@ -86,19 +84,19 @@ let FormulaEditor = class FormulaEditor extends LitElement {
         }
         this.dispatchEvent(new CustomEvent("fw-formula-content-changed", {
             detail: {
-                formulaString: this.content,
+                formulaString: this.formulaString,
                 error: this.errorString,
                 recommendations: this.recommendations,
-                formulaTokens: getFormulaTokens(this.content || "", this.formulaRegex)
+                formulaTokens: getFormulaTokens(this.formulaString || "", this.formulaRegex)
             },
             bubbles: true,
         }));
     }
     formatFormula() {
-        if (!this.content)
+        if (!this.formulaString)
             return;
-        const newContent = this._parser.addParentheses(this.content);
-        this.content = newContent && newContent.length ? newContent : this.content;
+        const newContent = this._parser.addParentheses(this.formulaString);
+        this.formulaString = newContent && newContent.length ? newContent : this.formulaString;
         this.parseInput();
         this.recommendations = [];
     }
@@ -137,7 +135,7 @@ let FormulaEditor = class FormulaEditor extends LitElement {
       <textarea
         id="fw-formula-editor"
         class=${this.errorString?.length ? "error" : ""}
-        .value=${this.content}
+        .value=${this.formulaString}
         .placeholder=${this.placeholder}
         spellcheck="false"
         autocomplete="off"
@@ -175,7 +173,7 @@ __decorate([
 ], FormulaEditor.prototype, "isFocused", void 0);
 __decorate([
     property()
-], FormulaEditor.prototype, "content", void 0);
+], FormulaEditor.prototype, "formulaString", void 0);
 __decorate([
     property()
 ], FormulaEditor.prototype, "placeholder", void 0);

package/dist/formula-editor/src/utils/constants.js

@@ -1,4 +1,4 @@
-export const mathematicalOperators = new Set(["^", "+", "-", "*", "/"]);
+export const mathematicalOperators = new Set(["+", "-", "*", "/", "^"]);
 export const unaryOperators = ["+", "-"];
 export const operatorPrecedence = {
     "^": 3,

package/dist/formula-editor/src/utils/parser.js

@@ -6,12 +6,12 @@ import { Expectation } from "../types";
 import { operatorPrecedence, unaryOperators, mathematicalOperators } from "./constants.js";
 import { getFormulaTokens } from "./get-formula-tokens.js";
 export class Parser {
-    constructor(variables, minSuggestionLen, formulaRegex, allowedNumbers, allowedOperators, variableType) {
+    constructor(variables, minSuggestionLen, formulaRegex = /[A-Za-z0-9_#@]+|[-+(),*^/\s]/g, allowedNumbers = true, allowedOperators = mathematicalOperators, variableType = "") {
         this.variables = variables;
         this.formulaRegex = formulaRegex;
         this._recommender = new Recommender(Array.from(this.variables.keys()), minSuggestionLen);
-        this.allowedNumbers = allowedNumbers ?? true;
-        this.allowedOperators = allowedOperators ?? mathematicalOperators;
+        this.allowedNumbers = allowedNumbers;
+        this.allowedOperators = allowedOperators;
         this.variableType = variableType;
     }
     isNumber(value) {
@@ -19,6 +19,14 @@ export class Parser {
             return false;
         return !Number.isNaN(Number(value));
     }
+    formatFormulaToken(token) {
+        for (let existingKey of this.variables.keys()) {
+            if (existingKey.toLowerCase() === token.toLowerCase()) {
+                return existingKey;
+            }
+        }
+        return token;
+    }
     parseInput(formula, prevCurPos = null, recommendation = null) {
         const tokens = getFormulaTokens(formula, this.formulaRegex);
         const parentheses = new Stack();
@@ -38,6 +46,7 @@ export class Parser {
             return parseOutput;
         }
         tokens?.forEach((token) => {
+            token = this.formatFormulaToken(token);
             let isNumber = this.variables.has(token) || this.isNumber(token);
             const isOperator = this.allowedOperators.has(token);
             const isSpace = token.trim() === "";
@@ -81,11 +90,11 @@ export class Parser {
                  * Unknown symbol/variable/word
                  */
                 if (!(isNumber || isOperator || isBracket || isSpace)) {
-                    parseOutput.errorString = `${this.variableType} : ${token} does not exist`;
+                    parseOutput.errorString = `${this.variableType} : '${token}' does not exist`;
                     expectation = Expectation.UNDEFINED;
                 }
                 else if (this.allowedOperators.has(previousToken) && isOperator) {
-                    parseOutput.errorString = `Use ${this.variableType}${this.allowedNumbers ? " or numbers" : ""} after ${previousToken}. Pls do not use consecutive two mathametical operators (+,-,*,/,^)`;
+                    parseOutput.errorString = `Please use ${this.variableType}${this.allowedNumbers ? " or numbers" : ""} after '${previousToken}'. Pls do not use consecutive two mathametical operators (+ ,- ,* ,/ ,^)`;
                     expectation = Expectation.UNDEFINED;
                 }
                 else if (parentheses.isEmpty() && token === ")") {
@@ -98,14 +107,14 @@ export class Parser {
                  */
                 else if (expectation === Expectation.VARIABLE && !isNumber && !isSpace && token != "("
                     && !((unaryOperators.includes(token)) && (!parsedString.trim() || previousToken === "(" || this.allowedOperators.has(previousToken)))) {
-                    parseOutput.errorString = `Use ${this.variableType}${this.allowedNumbers ? " or numbers" : ""} after ${previousToken}.`;
+                    parseOutput.errorString = `Please use ${this.variableType}${this.allowedNumbers ? " or numbers" : ""} after '${previousToken}'.`;
                     expectation = Expectation.UNDEFINED;
                 }
                 /**
                  * Multiple number/variable together without operator
                  */
                 else if (expectation === Expectation.OPERATOR && !isOperator && !isSpace && token != ")") {
-                    parseOutput.errorString = `Use mathametical operators (${Array.from(this.allowedOperators).join(",")}) after ${previousToken}.`;
+                    parseOutput.errorString = `Please use mathametical operators (${Array.from(this.allowedOperators).join(", ")}) after ${previousToken}.`;
                     expectation = Expectation.UNDEFINED;
                 }
                 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fw-components/formula-editor",
-  "version": "2.0.7-formula-editor.38",
+  "version": "2.0.7-formula-editor.40",
   "description": "A WYSIWYG type formula editor",
   "main": "dist/formula-editor/src/formula-editor.js",
   "exports": {
@@ -31,5 +31,5 @@
     "@types/big.js": "^6.1.6",
     "es-dev-server": "^2.1.0"
   },
-  "gitHead": "a7118acac7f6e7268373b36a909f6f1720a12ce4"
+  "gitHead": "5bf490d4aae797852b522a53bec12fcbf3d524bd"
 }