From 8dc915c8aaf5397fe59e5fb53d84b33e3d254d01 Mon Sep 17 00:00:00 2001
From: Your Name <you@example.com>
Date: Tue, 17 Feb 2026 23:36:02 +0200
Subject: [PATCH] feat: replace native number inputs with AppNumberInput across
 all views

---
 src/views/Entries.vue  | 11 ++++++-----
 src/views/Invoices.vue | 27 ++++++++++++++-------------
 2 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/src/views/Entries.vue b/src/views/Entries.vue
index c4f5a7f..f875637 100644
--- a/src/views/Entries.vue
+++ b/src/views/Entries.vue
@@ -155,11 +155,11 @@
           <!-- Duration -->
           <div>
             <label class="block text-[0.6875rem] text-text-tertiary uppercase tracking-[0.08em] mb-1.5">Duration (minutes)</label>
-            <input
-              v-model.number="durationMinutes"
-              type="number"
-              min="1"
-              class="w-full px-3 py-2 bg-bg-inset border border-border-subtle rounded-lg text-[0.8125rem] text-text-primary focus:outline-none focus:border-border-visible"
+            <AppNumberInput
+              v-model="durationMinutes"
+              :min="1"
+              :step="1"
+              suffix="min"
             />
           </div>
 
@@ -226,6 +226,7 @@
 <script setup lang="ts">
 import { ref, reactive, computed, onMounted } from 'vue'
 import { List as ListIcon } from 'lucide-vue-next'
+import AppNumberInput from '../components/AppNumberInput.vue'
 import AppSelect from '../components/AppSelect.vue'
 import AppDatePicker from '../components/AppDatePicker.vue'
 import { useEntriesStore, type TimeEntry } from '../stores/entries'
diff --git a/src/views/Invoices.vue b/src/views/Invoices.vue
index c489099..ed296bf 100644
--- a/src/views/Invoices.vue
+++ b/src/views/Invoices.vue
@@ -158,23 +158,23 @@
         <div class="grid grid-cols-2 gap-4">
           <div>
             <label class="block text-[0.6875rem] text-text-tertiary uppercase tracking-[0.08em] mb-1.5">Tax Rate (%)</label>
-            <input
-              v-model.number="createForm.tax_rate"
-              type="number"
-              min="0"
-              max="100"
-              step="0.01"
-              class="w-full px-3 py-2 bg-bg-inset border border-border-subtle rounded-lg text-[0.8125rem] text-text-primary focus:outline-none focus:border-border-visible"
+            <AppNumberInput
+              v-model="createForm.tax_rate"
+              :min="0"
+              :max="100"
+              :step="0.5"
+              :precision="2"
+              suffix="%"
             />
           </div>
           <div>
             <label class="block text-[0.6875rem] text-text-tertiary uppercase tracking-[0.08em] mb-1.5">Discount ($)</label>
-            <input
-              v-model.number="createForm.discount"
-              type="number"
-              min="0"
-              step="0.01"
-              class="w-full px-3 py-2 bg-bg-inset border border-border-subtle rounded-lg text-[0.8125rem] text-text-primary focus:outline-none focus:border-border-visible"
+            <AppNumberInput
+              v-model="createForm.discount"
+              :min="0"
+              :step="1"
+              :precision="2"
+              prefix="$"
             />
           </div>
         </div>
@@ -332,6 +332,7 @@
 <script setup lang="ts">
 import { ref, reactive, onMounted } from 'vue'
 import { FileText } from 'lucide-vue-next'
+import AppNumberInput from '../components/AppNumberInput.vue'
 import AppSelect from '../components/AppSelect.vue'
 import AppDatePicker from '../components/AppDatePicker.vue'
 import { useInvoicesStore, type Invoice } from '../stores/invoices'