From 60e1f6d6c334b06b39a72c8a2ebd9e8ebcc013ec Mon Sep 17 00:00:00 2001
From: Chirag Chhatrala <60499540+chiragchhatrala@users.noreply.github.com>
Date: Fri, 19 May 2023 19:26:28 +0530
Subject: [PATCH] numeric fields show the numeric keyboard (#122)

---
 resources/js/components/forms/TextInput.vue     | 2 ++
 resources/js/components/open/forms/OpenForm.vue | 2 ++
 2 files changed, 4 insertions(+)

diff --git a/resources/js/components/forms/TextInput.vue b/resources/js/components/forms/TextInput.vue
index 3c10ed8..89fc543 100644
--- a/resources/js/components/forms/TextInput.vue
+++ b/resources/js/components/forms/TextInput.vue
@@ -15,6 +15,7 @@
     </div>
     <input :id="id?id:name" v-model="compVal" :disabled="disabled"
            :type="nativeType"
+           :pattern="pattern"
            :style="inputStyle"
            :class="[theme.default.input,{ '!ring-red-500 !ring-2': hasValidation && form.errors.has(name), '!cursor-not-allowed !bg-gray-200':disabled }]"
            :name="name" :accept="accept"
@@ -48,6 +49,7 @@ export default {
     max: { type: Number, required: false, default: null },
     maxCharLimit: { type: Number, required: false, default: null },
     showCharLimit: { type: Boolean, required: false, default: false },
+    pattern: { type: String, default: null }
   },
 
   data: () => ({}),
diff --git a/resources/js/components/open/forms/OpenForm.vue b/resources/js/components/open/forms/OpenForm.vue
index 73702d6..b79c84e 100644
--- a/resources/js/components/open/forms/OpenForm.vue
+++ b/resources/js/components/open/forms/OpenForm.vue
@@ -498,6 +498,8 @@ export default {
         inputProperties.accept = (this.form.is_pro && field.allowed_file_types) ? field.allowed_file_types : ""
       } else if (field.type === 'number' && field.is_rating) {
         inputProperties.numberOfStars = parseInt(field.rating_max_value)
+      } else if (['number', 'phone_number'].includes(field.type)) {
+        inputProperties.pattern = "/\d*"
       }
 
       return inputProperties