From 098f9ddb95cb812e9c653d6107cd6c6431c4b903 Mon Sep 17 00:00:00 2001
From: Blaine Landowski <blalan05@gmail.com>
Date: Sat, 27 Apr 2024 15:01:57 -0500
Subject: [PATCH] Adjust time formatting; Removing unneeded code; adjust styles

---
 .../src/composables/date/adapters/vuetify.ts    |  6 +++---
 .../vuetify/src/labs/VTimeInput/VTimeInput.tsx  | 17 +++++------------
 .../src/labs/VTimePicker/VTimePicker.sass       |  3 +++
 .../src/labs/VTimePicker/VTimePickerClock.sass  |  2 +-
 .../src/labs/VTimePicker/_variables.scss        |  2 +-
 5 files changed, 13 insertions(+), 17 deletions(-)

diff --git a/packages/vuetify/src/composables/date/adapters/vuetify.ts b/packages/vuetify/src/composables/date/adapters/vuetify.ts
index 58ad04707d7..eceb06c6189 100644
--- a/packages/vuetify/src/composables/date/adapters/vuetify.ts
+++ b/packages/vuetify/src/composables/date/adapters/vuetify.ts
@@ -333,13 +333,13 @@ function format (
       options = { second: 'numeric' }
       break
     case 'fullTime':
-      options = { hour: 'numeric', minute: 'numeric', second: 'numeric', hour12: true }
+      options = { hour: 'numeric', minute: 'numeric', hour12: true }
       break
     case 'fullTime12h':
-      options = { hour: 'numeric', minute: 'numeric', second: 'numeric', hour12: true }
+      options = { hour: 'numeric', minute: 'numeric', hour12: true }
       break
     case 'fullTime24h':
-      options = { hour: 'numeric', minute: 'numeric', second: 'numeric', hour12: false }
+      options = { hour: 'numeric', minute: 'numeric', hour12: false }
       break
     case 'fullDateTime':
       options = { year: 'numeric', month: 'long', day: 'numeric', hour: 'numeric', minute: 'numeric', second: 'numeric', hour12: true }
diff --git a/packages/vuetify/src/labs/VTimeInput/VTimeInput.tsx b/packages/vuetify/src/labs/VTimeInput/VTimeInput.tsx
index 96b289a8556..a426e49e115 100644
--- a/packages/vuetify/src/labs/VTimeInput/VTimeInput.tsx
+++ b/packages/vuetify/src/labs/VTimeInput/VTimeInput.tsx
@@ -7,12 +7,11 @@ import { makeVTimePickerProps, VTimePicker } from '@/labs/VTimePicker/VTimePicke
 // Composables
 import { useDate } from '@/composables/date'
 import { makeFocusProps, useFocus } from '@/composables/focus'
-import { useLocale } from '@/composables/locale'
 import { useProxiedModel } from '@/composables/proxiedModel'
 
 // Utilities
 import { computed, shallowRef } from 'vue'
-import { genericComponent, omit, propsFactory, useRender, wrapInArray } from '@/util'
+import { genericComponent, omit, propsFactory, useRender } from '@/util'
 
 // Types
 export interface VTimeInputSlots {
@@ -29,7 +28,6 @@ export const makeVTimeInputProps = propsFactory({
     prependIcon: '$clock',
   }),
   ...omit(makeVTimePickerProps({
-    weeksInMonth: 'dynamic' as const,
     hideHeader: true,
   }), ['active']),
 }, 'VTimeInput')
@@ -44,19 +42,14 @@ export const VTimeInput = genericComponent()({
   },
 
   setup (props, { slots }) {
-    const { t } = useLocale()
     const adapter = useDate()
     const { isFocused, focus, blur } = useFocus(props)
-    const model = useProxiedModel(props, 'modelValue', props.multiple ? [] : null)
+    const model = useProxiedModel(props, 'modelValue', null)
     const menu = shallowRef(false)
 
-    const display = computed(() => {
-      const value = wrapInArray(model.value)
-
-      if (!value.length) return null
-
-      return adapter.isValid(model.value) ? adapter.format(model.value, 'keyboardDate') : ''
-    })
+    const display = computed(() => adapter.isValid(model.value)
+      ? adapter.format(model.value, props.format === '24hr' ? 'fullTime24h' : 'fullTime12h')
+      : '')
 
     function onKeydown (e: KeyboardEvent) {
       if (e.key !== 'Enter') return
diff --git a/packages/vuetify/src/labs/VTimePicker/VTimePicker.sass b/packages/vuetify/src/labs/VTimePicker/VTimePicker.sass
index e62c8eec3dd..cb12822dc18 100644
--- a/packages/vuetify/src/labs/VTimePicker/VTimePicker.sass
+++ b/packages/vuetify/src/labs/VTimePicker/VTimePicker.sass
@@ -9,3 +9,6 @@
     .v-picker-title
       padding: 0
       margin-bottom: 20px
+      
+    .v-picker__body
+      padding: 0
diff --git a/packages/vuetify/src/labs/VTimePicker/VTimePickerClock.sass b/packages/vuetify/src/labs/VTimePicker/VTimePickerClock.sass
index 71a4e6a9930..74c4009e07e 100644
--- a/packages/vuetify/src/labs/VTimePicker/VTimePickerClock.sass
+++ b/packages/vuetify/src/labs/VTimePicker/VTimePickerClock.sass
@@ -15,7 +15,7 @@
       color: rgb(var(--v-theme-on-surface-variant))
 
   .v-time-picker-clock
-    margin: 0 auto
+    margin: 24px auto
     background: rgb(var(--v-theme-surface-light))
     border-radius: 50%
     position: relative
diff --git a/packages/vuetify/src/labs/VTimePicker/_variables.scss b/packages/vuetify/src/labs/VTimePicker/_variables.scss
index e684cdf8fe4..72c8bf8891e 100644
--- a/packages/vuetify/src/labs/VTimePicker/_variables.scss
+++ b/packages/vuetify/src/labs/VTimePicker/_variables.scss
@@ -1,6 +1,6 @@
 @forward '../VPicker/variables';
 
-$time-picker-padding: 24px !default;
+$time-picker-padding: 0px !default;
 $time-picker-contols-btn-font: 56px !default;
 $time-picker-contols-btn-height: 80px !default;
 $time-picker-contols-btn-width: 96px !default;