Merge pull request #1203 from navikt/feature/reactify-telefonnummer

change to react parent class
navikt · Jun 18, 2024 · 0dfa9ef · 0dfa9ef
2 parents 83daf88 + da51318
commit 0dfa9ef
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 3 deletions.
diff --git a/packages/shared-components/src/formio/components/extensions/phone-number/PhoneNumber.ts b/packages/shared-components/src/formio/components/extensions/phone-number/PhoneNumber.ts
@@ -1,10 +1,29 @@
-import FormioPhoneNumber from 'formiojs/components/phonenumber/PhoneNumber';
+import { InputMode } from '@navikt/skjemadigitalisering-shared-domain';
+import BaseComponent from '../../base/BaseComponent';
+import TextField from '../../core/textfield/TextField';
+import phoneNumberBuilder from './PhoneNumber.builder';
 import phoneNumberForm from './PhoneNumber.form';
 
-class PhoneNumber extends FormioPhoneNumber {
+class PhoneNumber extends TextField {
+  static schema() {
+    return BaseComponent.schema({
+      label: 'Telefonnummer',
+      type: 'phoneNumber',
+      key: 'telefonNummer',
+    });
+  }
+
   static editForm() {
     return phoneNumberForm();
   }
+
+  static get builderInfo() {
+    return phoneNumberBuilder();
+  }
+
+  getInputMode(): InputMode {
+    return 'tel';
+  }
 }
 
 export default PhoneNumber;
diff --git a/packages/shared-components/src/formio/template/templates/navdesign/field/form.ejs b/packages/shared-components/src/formio/template/templates/navdesign/field/form.ejs
@@ -1,4 +1,4 @@
-{% if (ctx.component.type === "textfield" || ctx.component.type === "textarea" || ctx.component.type === "orgNr" || ctx.component.type === "bankAccount" || ctx.component.type === "htmlelement" || ctx.component.type === "radiopanel" || ctx.component.type === "attachment" || ctx.component.type === "email" || ctx.component.type === "activities" || ctx.component.type === "accordion" || ctx.component.type === "navDatepicker" || ctx.component.type === "navCheckbox" || ctx.component.type === "number" || ctx.component.type === "currency") { %}
+{% if (ctx.component.type === "textfield" || ctx.component.type === "textarea" || ctx.component.type === "orgNr" || ctx.component.type === "bankAccount" || ctx.component.type === "htmlelement" || ctx.component.type === "radiopanel" || ctx.component.type === "attachment" || ctx.component.type === "email" || ctx.component.type === "activities" || ctx.component.type === "accordion" || ctx.component.type === "navDatepicker" || ctx.component.type === "navCheckbox" || ctx.component.type === "number" || ctx.component.type === "currency" || ctx.component.type === "phoneNumber") { %}
     {{ctx.element}}
 {% } else { %}
     {% if (ctx.component.description && ctx.component.type !== "datagrid" && ctx.component.descriptionPosition === "above") { %}