1,441st Commit

Shyam-Chen · Apr 27, 2024 · ec856db · ec856db
1 parent 71a9bcb
commit ec856db
Showing 1 changed file with 24 additions and 0 deletions.
diff --git a/app/src/routes/(backstage)/(library)/data-entry/input-mask/+page.vue b/app/src/routes/(backstage)/(library)/data-entry/input-mask/+page.vue
@@ -14,6 +14,9 @@ const flux = reactive({
 
   usdMasked: '',
   usdUnmasked: '',
+
+  verificationCodeMasked: '',
+  verificationCodeUnmasked: undefined,
 });
 </script>
 
@@ -128,4 +131,25 @@ const flux = reactive({
       </div>
     </XCard>
   </section>
+
+  <section class="my-8">
+    <h2 class="text-3xl font-bold my-4 pt-6">One-time Password</h2>
+
+    <XCard>
+      <XInputMask
+        v-model:masked="flux.verificationCodeMasked"
+        v-model:unmasked="flux.verificationCodeUnmasked"
+        :mask="{ mask: '000 000' }"
+        label="Verification Code"
+      />
+
+      <div class="mt-1">
+        <div>Masked: {{ flux.verificationCodeMasked }}</div>
+        <div>
+          Unmasked: {{ flux.verificationCodeUnmasked }}
+          <XCode>{{ typeof flux.verificationCodeUnmasked }}</XCode>
+        </div>
+      </div>
+    </XCard>
+  </section>
 </template>