@projectcaluma/ember-form 12.9.0 → 12.10.0

package/addon/components/cf-field/input/number-separator.hbs

@@ -0,0 +1,12 @@
+<input
+  type="text"
+  class="uk-input
+    {{if @field.isInvalid 'uk-form-danger'}}
+    {{if this.disabled 'uk-disabled'}}"
+  name={{@field.pk}}
+  id={{@field.pk}}
+  value={{this.displayValue}}
+  placeholder={{@field.question.raw.placeholder}}
+  readonly={{this.disabled}}
+  {{on "input" this.input}}
+/>

package/addon/components/cf-field/input/number-separator.js

@@ -0,0 +1,46 @@
+import { action } from "@ember/object";
+import { inject as service } from "@ember/service";
+import Component from "@glimmer/component";
+import { cached } from "tracked-toolbox";
+
+export default class CfFieldInputNumberSeparatorComponent extends Component {
+  @service intl;
+
+  get disabled() {
+    return this.args.disabled || this.args.field?.question.isCalculated;
+  }
+
+  get displayValue() {
+    if (!this.args.field.value) {
+      return "";
+    }
+
+    return this.intl.formatNumber(this.args.field.value, {
+      maximumFractionDigits: 20,
+    });
+  }
+
+  @cached
+  get thousandSeparator() {
+    return this.intl.formatNumber(11111).replace(/\p{Number}/gu, "");
+  }
+
+  @cached
+  get decimalSeparator() {
+    return this.intl.formatNumber(1.1).replace(/\p{Number}/gu, "");
+  }
+
+  @action
+  input({ target: { value } }) {
+    // We need to remove the thousand separator and replace the decimal
+    // separator with a dot in order to parse it into a number. Which character
+    // those are is determined per locale in the getters above.
+    const serialized = Number(
+      value
+        .replace(new RegExp(`\\${this.thousandSeparator}`, "g"), "")
+        .replace(new RegExp(`\\${this.decimalSeparator}`), "."),
+    );
+
+    this.args.onSave(isNaN(serialized) ? null : serialized);
+  }
+}

package/addon/components/cf-field/input/radio.hbs

@@ -23,7 +23,7 @@
     {{/if}}
   </label>
 {{/each}}
-{{#if (and @field.optional @field.answer.value)}}
+{{#if (and @field.optional @field.answer.value (not @disabled))}}
   <br />
   <a href="" data-test-radio-reset {{on "click" this.reset}}>
     {{t "caluma.form.power-select.reset"}}

package/addon/components/cf-field-value.hbs

@@ -21,6 +21,15 @@
       @onClick={{fn this.download file.id}}
     />
   {{/each}}
+{{else if
+  (and
+    @field.answer.value
+    (eq
+      @field.question.raw.meta.widgetOverride "cf-field/input/number-separator"
+    )
+  )
+}}
+  {{format-number @field.answer.value maximumFractionDigits=20}}
 {{else}}
   {{@field.answer.value}}
 {{/if}}

package/addon/components/cf-field.hbs

@@ -23,7 +23,7 @@
         }}
           <FieldComponent
             @field={{@field}}
-            @disabled={{@disabled}}
+            @disabled={{or @disabled @field.refreshAnswer.isRunning}}
             @context={{@context}}
             @onSave={{perform this.save}}
           />
@@ -38,7 +38,7 @@
         <div
           class="cf-field__icon uk-padding-remove-vertical uk-flex uk-flex-middle uk-flex-center"
         >
-          {{#if this.save.isRunning}}
+          {{#if (or this.save.isRunning @field.refreshAnswer.isRunning)}}
             <UkSpinner class="uk-animation-fade" />
           {{else if (or this.save.last.isError @field.isInvalid)}}
             <div class="uk-flex-inline">

package/addon/gql/fragments/field.graphql

@@ -214,6 +214,7 @@ fragment FieldQuestion on Question {
 
 fragment SimpleAnswer on Answer {
   id
+  meta
   question {
     id
     slug

package/addon/gql/queries/refresh-answer.graphql

@@ -0,0 +1,18 @@
+#import * from '../fragments/field.graphql'
+
+query RefreshAnswer($document: ID!, $question: ID!) {
+  allDocuments(filter: [{ id: $document }]) {
+    edges {
+      node {
+        id
+        answers(filter: [{ questions: [$question] }]) {
+          edges {
+            node {
+              ...FieldAnswer
+            }
+          }
+        }
+      }
+    }
+  }
+}

package/addon/instance-initializers/form-widget-overrides.js

@@ -2,6 +2,7 @@ import { setOwner } from "@ember/application";
 import { inject as service } from "@ember/service";
 
 import HiddenComponent from "@projectcaluma/ember-form/components/cf-field/input/hidden";
+import NumberSeparatorComponent from "@projectcaluma/ember-form/components/cf-field/input/number-separator";
 import PowerSelectComponent from "@projectcaluma/ember-form/components/cf-field/input/powerselect";
 
 class HiddenOverride {
@@ -34,17 +35,30 @@ class PowerSelectOverride {
   ];
 }
 
-export function initialize(appInstance) {
-  const options = appInstance.lookup("service:caluma-options");
+class NumberSeparatorOverride {
+  @service intl;
 
-  const hiddenOverride = new HiddenOverride();
-  const powerSelectOverride = new PowerSelectOverride();
+  get label() {
+    return this.intl.t(
+      "caluma.form-builder.question.widgetOverrides.number-separator",
+    );
+  }
+
+  component = "cf-field/input/number-separator";
+  componentClass = NumberSeparatorComponent;
+  types = ["IntegerQuestion", "FloatQuestion", "CalculatedFloatQuestion"];
+}
 
-  setOwner(hiddenOverride, appInstance);
-  setOwner(powerSelectOverride, appInstance);
+export function initialize(appInstance) {
+  const options = appInstance.lookup("service:caluma-options");
 
-  options.registerComponentOverride(hiddenOverride);
-  options.registerComponentOverride(powerSelectOverride);
+  [HiddenOverride, PowerSelectOverride, NumberSeparatorOverride].forEach(
+    (cls) => {
+      const override = new cls();
+      setOwner(override, appInstance);
+      options.registerComponentOverride(override);
+    },
+  );
 }
 
 export default {

package/addon/lib/field.js

@@ -20,6 +20,7 @@ import saveDocumentListAnswerMutation from "@projectcaluma/ember-form/gql/mutati
 import saveDocumentStringAnswerMutation from "@projectcaluma/ember-form/gql/mutations/save-document-string-answer.graphql";
 import saveDocumentTableAnswerMutation from "@projectcaluma/ember-form/gql/mutations/save-document-table-answer.graphql";
 import getDocumentUsedDynamicOptionsQuery from "@projectcaluma/ember-form/gql/queries/document-used-dynamic-options.graphql";
+import refreshAnswerQuery from "@projectcaluma/ember-form/gql/queries/refresh-answer.graphql";
 import Base from "@projectcaluma/ember-form/lib/base";
 import dependencies from "@projectcaluma/ember-form/lib/dependencies";
 
@@ -634,6 +635,29 @@ export default class Field extends Base {
     this._errors = errors;
   }
 
+  @dropTask
+  *refreshAnswer() {
+    const response = yield this.apollo.query(
+      {
+        query: refreshAnswerQuery,
+        fetchPolicy: "network-only",
+        variables: {
+          document: this.document.uuid,
+          question: this.question.slug,
+        },
+      },
+      "allDocuments.edges",
+    );
+
+    const rawAnswer = response[0].node.answers.edges[0]?.node;
+
+    if (rawAnswer) {
+      Object.entries(rawAnswer).forEach(([key, value]) => {
+        this.answer.raw[key] = value;
+      });
+    }
+  }
+
   /**
    * Validate the value against the regexes of the given format validators.
    *

package/app/components/cf-field/input/number-separator.js

@@ -0,0 +1 @@
+export { default } from "@projectcaluma/ember-form/components/cf-field/input/number-separator";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@projectcaluma/ember-form",
-  "version": "12.9.0",
+  "version": "12.10.0",
   "description": "Ember addon for rendering Caluma forms.",
   "keywords": [
     "ember-addon"
@@ -9,7 +9,7 @@
   "homepage": "https://docs.caluma.io/ember-caluma",
   "repository": "github:projectcaluma/ember-caluma",
   "dependencies": {
-    "@babel/core": "^7.23.7",
+    "@babel/core": "^7.23.9",
     "@ember/string": "^3.1.1",
     "@embroider/macros": "^1.13.4",
     "@embroider/util": "^1.12.1",
@@ -39,13 +39,13 @@
     "lodash.isequal": "^4.5.0",
     "luxon": "^3.4.4",
     "tracked-toolbox": "^2.0.0",
-    "@projectcaluma/ember-core": "^12.9.0"
+    "@projectcaluma/ember-core": "^12.10.0"
   },
   "devDependencies": {
-    "@ember/optional-features": "2.0.0",
+    "@ember/optional-features": "2.1.0",
     "@ember/test-helpers": "3.2.1",
     "@embroider/test-setup": "3.0.3",
-    "@faker-js/faker": "8.3.1",
+    "@faker-js/faker": "8.4.1",
     "broccoli-asset-rev": "3.0.0",
     "ember-cli": "5.5.0",
     "ember-cli-clean-css": "3.0.0",
@@ -67,13 +67,13 @@
     "qunit-dom": "3.0.0",
     "uikit": "3.17.11",
     "uuid": "9.0.1",
-    "webpack": "5.89.0",
-    "@projectcaluma/ember-testing": "12.9.0",
-    "@projectcaluma/ember-workflow": "12.9.0"
+    "webpack": "5.90.0",
+    "@projectcaluma/ember-testing": "12.10.0",
+    "@projectcaluma/ember-workflow": "12.10.0"
   },
   "peerDependencies": {
     "ember-source": "^4.0.0",
-    "@projectcaluma/ember-workflow": "^12.9.0"
+    "@projectcaluma/ember-workflow": "^12.10.0"
   },
   "dependenciesMeta": {
     "@projectcaluma/ember-core": {