highlight?: boolean

autofocus?: boolean

autofocusDelay?: number

/**

* The locale to use for formatting and parsing numbers.

* @defaultValue UApp.locale.code

*/

locale?: string

class?: any

ui?: InputTime['slots']

}

import { useFieldGroup } from '../composables/useFieldGroup'

import { useComponentIcons } from '../composables/useComponentIcons'

import { useFormField } from '../composables/useFormField'

import { useLocale } from '../composables/useLocale'

import { tv } from '../utils/tv'

import UIcon from './Icon.vue'

import UAvatar from './Avatar.vue'

const emits = defineEmits<InputTimeEmits>()

const slots = defineSlots<InputTimeSlots>()

const { code: codeLocale, dir } = useLocale()

const appConfig = useAppConfig() as InputTime['AppConfig']

const rootProps = useForwardPropsEmits(reactiveOmit(props, 'id', 'name', 'color', 'variant', 'size', 'highlight', 'disabled', 'autofocus', 'autofocusDelay', 'locale', 'icon', 'avatar', 'leading', 'leadingIcon', 'trailing', 'trailingIcon', 'loading', 'loadingIcon', 'class', 'ui'), emits)

const rootProps = useForwardPropsEmits(reactiveOmit(props, 'id', 'name', 'color', 'variant', 'size', 'highlight', 'disabled', 'autofocus', 'autofocusDelay', 'icon', 'avatar', 'leading', 'leadingIcon', 'trailing', 'trailingIcon', 'loading', 'loadingIcon', 'class', 'ui'), emits)

const { emitFormBlur, emitFormFocus, emitFormChange, emitFormInput, id, color, size: formGroupSize, name, highlight, disabled, ariaAttrs } = useFormField<InputTimeProps>(props)

const { orientation, size: fieldGroupSize } = useFieldGroup<InputTimeProps>(props)

const { isLeading, isTrailing, leadingIconName, trailingIconName } = useComponentIcons(props)

const locale = computed(() => props.locale || codeLocale.value)

const inputSize = computed(() => fieldGroupSize.value || formGroupSize.value)

const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.inputTime || {}) })({

v-slot="{ segments }"

:name="name"

:disabled="disabled"

:locale="locale"

:dir="dir"

:class="ui.base({ class: [props.ui?.base, props.class] })"

@update:model-value="onUpdate"

@blur="onBlur"