@oneblink/apps-react 5.0.0-beta.2 → 5.0.0

package/dist/form-elements/FormElementCalculation.js

@@ -12,6 +12,12 @@ const isUnenteredValue = (value) => {
 const isObjectWithValue = (obj) => {
     return typeof obj === 'object' && obj !== null && 'value' in obj;
 };
+// workaround for .toFixed() not rounding floating point numbers correctly
+function roundToFixed(number, decimals) {
+    const multiplier = Math.pow(10, decimals);
+    const roundedNumber = Math.round(number * multiplier) / multiplier;
+    return roundedNumber.toFixed(decimals);
+}
 function FormElementCalculation({ element, onChange, value }) {
     const { formSubmissionModel } = useFormSubmissionModel();
     const htmlValue = React.useMemo(() => {
@@ -108,7 +114,7 @@ function FormElementCalculation({ element, onChange, value }) {
         const exprParser = new ExpressionParser();
         exprParser.registerFunction('ROUND', (value, precision) => {
             if (!Number.isNaN(value) && Number.isFinite(value)) {
-                return parseFloat(value.toFixed(precision));
+                return parseFloat(roundToFixed(value, precision));
             }
             return null;
         });

package/dist/form-elements/FormElementCalculation.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormElementCalculation.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCalculation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport ExpressionParser from 'morph-expressions'\nimport escapeString from 'escape-string-regexp'\nimport useFormSubmissionModel from '../hooks/useFormSubmissionModelContext'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport { Sentry } from '@oneblink/apps'\nimport { localisationService } from '@oneblink/apps'\nimport { FormElementValueChangeHandler } from '../types/form'\nimport { formElementsService } from '@oneblink/sdk-core'\nimport QuillHTML from '../components/QuillHTML'\ntype Props = {\n  element: FormTypes.CalculationElement\n  onChange: FormElementValueChangeHandler<number>\n  value: unknown | undefined\n}\n\nconst isUnenteredValue = (value: unknown | undefined) => {\n  return !value && value !== 0\n}\n\nconst isObjectWithValue = (obj: unknown): obj is { value: unknown } => {\n  return typeof obj === 'object' && obj !== null && 'value' in obj\n}\n\nfunction FormElementCalculation({ element, onChange, value }: Props) {\n  const { formSubmissionModel } = useFormSubmissionModel()\n\n  const htmlValue = React.useMemo(() => {\n    let htmlTemplate\n\n    if (!isNaN(value as number)) {\n      htmlTemplate = element.defaultValue\n    } else {\n      console.log(\n        '[Calculation] Was not a number... setting pre-calculation display',\n      )\n      htmlTemplate = element.preCalculationDisplay\n    }\n\n    const numberValue = typeof value === 'number' ? value : 0\n    return (htmlTemplate || '').replace(\n      /{result}/gi,\n      element.displayAsCurrency\n        ? localisationService.formatCurrency(numberValue)\n        : localisationService.formatNumber(numberValue),\n    )\n  }, [element, value])\n\n  const registerProperty = React.useCallback(\n    (\n      exprParser: typeof ExpressionParser,\n      {\n        replacement,\n        nestedElementNames,\n      }: {\n        replacement: string\n        nestedElementNames: string[]\n      },\n    ) => {\n      exprParser.registerProperty(\n        replacement,\n        (submission: SubmissionTypes.S3SubmissionData['submission']) => {\n          const defaultAccumulator = submission[nestedElementNames[0]]\n\n          return nestedElementNames.reduce(\n            (\n              elementValue: unknown | undefined,\n              elementName: string,\n              index: number,\n            ) => {\n              // Numbers can just be returned as is\n              if (typeof elementValue === 'number') {\n                return elementValue\n              }\n\n              // attempt to get a number from the element value as a string.\n              // NaN is accounted for is the calculation\n              // so we can return that from here\n              if (typeof elementValue === 'string') {\n                return parseFloat(elementValue)\n              }\n\n              if (Array.isArray(elementValue)) {\n                // If there are no entries, we can return null\n                // to prevent the calculation from running.\n                if (!elementValue.length) {\n                  return NaN\n                }\n\n                // An array could be an element that allows multiple\n                // values e.g. checkboxes. If thats that case, we just\n                // add them all together and move on\n                const elementValues = elementValue.map((entry) =>\n                  parseFloat(entry),\n                )\n                if (elementValues.every((entry) => !Number.isNaN(entry))) {\n                  return elementValues.reduce(\n                    (number, entry) => number + entry,\n                    0,\n                  )\n                }\n\n                // Other wise attempt to process it as a repeatable set\n                // If we found another repeatable set to process,\n                // pass it to the next element name to\n                // iterate over the entries\n\n                // If we are processing the entries in a repeatable set,\n                // we can sum the numbers elements in the entries\n                const nextElementName = nestedElementNames[index + 1]\n\n                let isNestedRepeatableSet = false\n                const nestedElementValues = elementValue.reduce(\n                  (nestedElementValues, entry) => {\n                    if (entry) {\n                      const nextElementValue = entry[nextElementName]\n                      if (Array.isArray(nextElementValue)) {\n                        if (nextElementValue.length) {\n                          nestedElementValues.push(...nextElementValue)\n                          isNestedRepeatableSet = true\n                        }\n                      } else {\n                        nestedElementValues.push(nextElementValue)\n                      }\n                    }\n                    return nestedElementValues\n                  },\n                  [],\n                )\n\n                // If the nested element values are all arrays, we can pass them on to the next iteration\n                if (isNestedRepeatableSet) {\n                  return nestedElementValues\n                }\n\n                return nestedElementValues.reduce(\n                  (total: number, nestedElementValue: unknown | undefined) => {\n                    if (Number.isNaN(total)) {\n                      return NaN\n                    }\n                    const value = parseFloat(nestedElementValue as string)\n                    if (Number.isNaN(value)) {\n                      return NaN\n                    }\n                    return total + value\n                  },\n                  0,\n                )\n              }\n\n              // \"compliance\" form element has an object value with a \"value\" property.\n              if (\n                isObjectWithValue(elementValue) &&\n                typeof elementValue.value === 'string'\n              ) {\n                return parseFloat(elementValue.value)\n              }\n\n              // We did not find a number value from the known elements,\n              // we will assume we are at the end of the line.\n              return NaN\n            },\n            defaultAccumulator,\n          )\n        },\n      )\n    },\n    [],\n  )\n\n  const { calculation, hasError } = React.useMemo(() => {\n    const exprParser = new ExpressionParser()\n    exprParser.registerFunction('ROUND', (value: number, precision: number) => {\n      if (!Number.isNaN(value) && Number.isFinite(value)) {\n        return parseFloat(value.toFixed(precision))\n      }\n      return null\n    })\n    exprParser.registerFunction(\n      'ISNULL',\n      (value: unknown | undefined, defaultValue: number) => {\n        if (isUnenteredValue(value)) {\n          return defaultValue || 0\n        }\n        return value\n      },\n    )\n\n    try {\n      if (!element.calculation) throw new Error('Element has no calculation.')\n      const elementNames: string[] = []\n      formElementsService.matchElementsTagRegex(\n        element.calculation,\n        ({ elementName }) => {\n          elementNames.push(elementName)\n        },\n      )\n\n      const code = elementNames.reduce((code, elementName, index) => {\n        const regex = new RegExp(escapeString(`{ELEMENT:${elementName}}`), 'g')\n        const replacement = `a${index}`\n        registerProperty(exprParser, {\n          replacement,\n          nestedElementNames: elementName.split('|'),\n        })\n        return code.replace(regex, replacement)\n      }, element.calculation || '')\n\n      return {\n        calculation: exprParser.parse(code.trim()),\n        hasError: false,\n      }\n    } catch (e) {\n      console.warn(\n        'Error while setting up parsing for calculation element',\n        element,\n        e,\n      )\n      Sentry.captureException(e)\n      return {\n        calculation: null,\n        hasError: true,\n      }\n    }\n  }, [element, registerProperty])\n\n  // MODEL LISTENER\n  React.useEffect(() => {\n    if (!calculation) return\n    const newValue = calculation.eval(formSubmissionModel)\n    if (value === newValue || (value === undefined && isNaN(newValue))) {\n      return\n    }\n    if (!isNaN(newValue)) {\n      onChange(element, {\n        value: newValue,\n      })\n    } else {\n      onChange(element, {\n        value: undefined,\n      })\n    }\n  }, [calculation, element, formSubmissionModel, onChange, value])\n\n  return (\n    <div className=\"cypress-calculation-element\">\n      <div className=\"ob-form__element ob-calculation\">\n        <QuillHTML\n          html={htmlValue}\n          className=\"cypress-calculation-result ob-calculation__content\"\n        />\n        {hasError && (\n          <div\n            className=\"notification cypress-calculation-is-invalid\"\n            role=\"alert\"\n          >\n            <div className=\"columns is-vcentered\">\n              <div className=\"column is-narrow\">\n                <i className=\"material-icons has-text-warning\">error</i>\n              </div>\n              <div className=\"column\">\n                <p>There is an error in the calculation for this element.</p>\n              </div>\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default React.memo(FormElementCalculation)\n"]}
+{"version":3,"file":"FormElementCalculation.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCalculation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport ExpressionParser from 'morph-expressions'\nimport escapeString from 'escape-string-regexp'\nimport useFormSubmissionModel from '../hooks/useFormSubmissionModelContext'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport { Sentry } from '@oneblink/apps'\nimport { localisationService } from '@oneblink/apps'\nimport { FormElementValueChangeHandler } from '../types/form'\nimport { formElementsService } from '@oneblink/sdk-core'\nimport QuillHTML from '../components/QuillHTML'\ntype Props = {\n  element: FormTypes.CalculationElement\n  onChange: FormElementValueChangeHandler<number>\n  value: unknown | undefined\n}\n\nconst isUnenteredValue = (value: unknown | undefined) => {\n  return !value && value !== 0\n}\n\nconst isObjectWithValue = (obj: unknown): obj is { value: unknown } => {\n  return typeof obj === 'object' && obj !== null && 'value' in obj\n}\n\n// workaround for .toFixed() not rounding floating point numbers correctly\nfunction roundToFixed(number: number, decimals: number) {\n  const multiplier = Math.pow(10, decimals)\n  const roundedNumber = Math.round(number * multiplier) / multiplier\n  return roundedNumber.toFixed(decimals)\n}\n\nfunction FormElementCalculation({ element, onChange, value }: Props) {\n  const { formSubmissionModel } = useFormSubmissionModel()\n\n  const htmlValue = React.useMemo(() => {\n    let htmlTemplate\n\n    if (!isNaN(value as number)) {\n      htmlTemplate = element.defaultValue\n    } else {\n      console.log(\n        '[Calculation] Was not a number... setting pre-calculation display',\n      )\n      htmlTemplate = element.preCalculationDisplay\n    }\n\n    const numberValue = typeof value === 'number' ? value : 0\n    return (htmlTemplate || '').replace(\n      /{result}/gi,\n      element.displayAsCurrency\n        ? localisationService.formatCurrency(numberValue)\n        : localisationService.formatNumber(numberValue),\n    )\n  }, [element, value])\n\n  const registerProperty = React.useCallback(\n    (\n      exprParser: typeof ExpressionParser,\n      {\n        replacement,\n        nestedElementNames,\n      }: {\n        replacement: string\n        nestedElementNames: string[]\n      },\n    ) => {\n      exprParser.registerProperty(\n        replacement,\n        (submission: SubmissionTypes.S3SubmissionData['submission']) => {\n          const defaultAccumulator = submission[nestedElementNames[0]]\n\n          return nestedElementNames.reduce(\n            (\n              elementValue: unknown | undefined,\n              elementName: string,\n              index: number,\n            ) => {\n              // Numbers can just be returned as is\n              if (typeof elementValue === 'number') {\n                return elementValue\n              }\n\n              // attempt to get a number from the element value as a string.\n              // NaN is accounted for is the calculation\n              // so we can return that from here\n              if (typeof elementValue === 'string') {\n                return parseFloat(elementValue)\n              }\n\n              if (Array.isArray(elementValue)) {\n                // If there are no entries, we can return null\n                // to prevent the calculation from running.\n                if (!elementValue.length) {\n                  return NaN\n                }\n\n                // An array could be an element that allows multiple\n                // values e.g. checkboxes. If thats that case, we just\n                // add them all together and move on\n                const elementValues = elementValue.map((entry) =>\n                  parseFloat(entry),\n                )\n                if (elementValues.every((entry) => !Number.isNaN(entry))) {\n                  return elementValues.reduce(\n                    (number, entry) => number + entry,\n                    0,\n                  )\n                }\n\n                // Other wise attempt to process it as a repeatable set\n                // If we found another repeatable set to process,\n                // pass it to the next element name to\n                // iterate over the entries\n\n                // If we are processing the entries in a repeatable set,\n                // we can sum the numbers elements in the entries\n                const nextElementName = nestedElementNames[index + 1]\n\n                let isNestedRepeatableSet = false\n                const nestedElementValues = elementValue.reduce(\n                  (nestedElementValues, entry) => {\n                    if (entry) {\n                      const nextElementValue = entry[nextElementName]\n                      if (Array.isArray(nextElementValue)) {\n                        if (nextElementValue.length) {\n                          nestedElementValues.push(...nextElementValue)\n                          isNestedRepeatableSet = true\n                        }\n                      } else {\n                        nestedElementValues.push(nextElementValue)\n                      }\n                    }\n                    return nestedElementValues\n                  },\n                  [],\n                )\n\n                // If the nested element values are all arrays, we can pass them on to the next iteration\n                if (isNestedRepeatableSet) {\n                  return nestedElementValues\n                }\n\n                return nestedElementValues.reduce(\n                  (total: number, nestedElementValue: unknown | undefined) => {\n                    if (Number.isNaN(total)) {\n                      return NaN\n                    }\n                    const value = parseFloat(nestedElementValue as string)\n                    if (Number.isNaN(value)) {\n                      return NaN\n                    }\n                    return total + value\n                  },\n                  0,\n                )\n              }\n\n              // \"compliance\" form element has an object value with a \"value\" property.\n              if (\n                isObjectWithValue(elementValue) &&\n                typeof elementValue.value === 'string'\n              ) {\n                return parseFloat(elementValue.value)\n              }\n\n              // We did not find a number value from the known elements,\n              // we will assume we are at the end of the line.\n              return NaN\n            },\n            defaultAccumulator,\n          )\n        },\n      )\n    },\n    [],\n  )\n\n  const { calculation, hasError } = React.useMemo(() => {\n    const exprParser = new ExpressionParser()\n    exprParser.registerFunction('ROUND', (value: number, precision: number) => {\n      if (!Number.isNaN(value) && Number.isFinite(value)) {\n        return parseFloat(roundToFixed(value, precision))\n      }\n      return null\n    })\n    exprParser.registerFunction(\n      'ISNULL',\n      (value: unknown | undefined, defaultValue: number) => {\n        if (isUnenteredValue(value)) {\n          return defaultValue || 0\n        }\n        return value\n      },\n    )\n\n    try {\n      if (!element.calculation) throw new Error('Element has no calculation.')\n      const elementNames: string[] = []\n      formElementsService.matchElementsTagRegex(\n        element.calculation,\n        ({ elementName }) => {\n          elementNames.push(elementName)\n        },\n      )\n\n      const code = elementNames.reduce((code, elementName, index) => {\n        const regex = new RegExp(escapeString(`{ELEMENT:${elementName}}`), 'g')\n        const replacement = `a${index}`\n        registerProperty(exprParser, {\n          replacement,\n          nestedElementNames: elementName.split('|'),\n        })\n        return code.replace(regex, replacement)\n      }, element.calculation || '')\n\n      return {\n        calculation: exprParser.parse(code.trim()),\n        hasError: false,\n      }\n    } catch (e) {\n      console.warn(\n        'Error while setting up parsing for calculation element',\n        element,\n        e,\n      )\n      Sentry.captureException(e)\n      return {\n        calculation: null,\n        hasError: true,\n      }\n    }\n  }, [element, registerProperty])\n\n  // MODEL LISTENER\n  React.useEffect(() => {\n    if (!calculation) return\n    const newValue = calculation.eval(formSubmissionModel)\n    if (value === newValue || (value === undefined && isNaN(newValue))) {\n      return\n    }\n    if (!isNaN(newValue)) {\n      onChange(element, {\n        value: newValue,\n      })\n    } else {\n      onChange(element, {\n        value: undefined,\n      })\n    }\n  }, [calculation, element, formSubmissionModel, onChange, value])\n\n  return (\n    <div className=\"cypress-calculation-element\">\n      <div className=\"ob-form__element ob-calculation\">\n        <QuillHTML\n          html={htmlValue}\n          className=\"cypress-calculation-result ob-calculation__content\"\n        />\n        {hasError && (\n          <div\n            className=\"notification cypress-calculation-is-invalid\"\n            role=\"alert\"\n          >\n            <div className=\"columns is-vcentered\">\n              <div className=\"column is-narrow\">\n                <i className=\"material-icons has-text-warning\">error</i>\n              </div>\n              <div className=\"column\">\n                <p>There is an error in the calculation for this element.</p>\n              </div>\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default React.memo(FormElementCalculation)\n"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@oneblink/apps-react",
   "description": "Helper functions for OneBlink apps in ReactJS.",
-  "version": "5.0.0-beta.2",
+  "version": "5.0.0",
   "author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
   "bugs": {
     "url": "https://github.com/oneblink/apps-react/issues"
@@ -47,7 +47,7 @@
     "@mui/lab": "^5.0.0-alpha.135",
     "@mui/material": "^5.10.1",
     "@mui/x-date-pickers": "^6.9.1",
-    "@oneblink/apps": "^6.2.0-beta.2",
+    "@oneblink/apps": "^6.2.0-beta.4",
     "@oneblink/release-cli": "^2.0.2",
     "@oneblink/types": "github:oneblink/types",
     "@types/blueimp-load-image": "^5.16.0",