feat(components): [date-picker] work with modal focus trap; a11y controls and attributes (#7598)

* feat(components): [date-picker] a11y controls and attributes

* feat(components): [date-picker] keyboard controls for picker

* feat(components): [date-picker] unit test complete

* feat(components): [date-picker] remove immediate watch date
This commit is contained in:
opengraphica
2022-05-10 09:51:17 -04:00
committed by GitHub
parent 5a326ef272
commit 42ff59fc39
30 changed files with 688 additions and 276 deletions

View File

@ -1,6 +1,7 @@
<template>
<div
v-show="type !== 'hidden'"
v-bind="containerAttrs"
:class="[
type === 'textarea' ? nsTextarea.b() : nsInput.b(),
nsInput.m(inputSize),
@ -18,6 +19,7 @@
$attrs.class,
]"
:style="containerStyle"
:role="containerRole"
@mouseenter="handleMouseEnter"
@mouseleave="handleMouseLeave"
>
@ -208,7 +210,21 @@ const instance = getCurrentInstance()!
const rawAttrs = useRawAttrs()
const slots = useSlots()
const attrs = useAttrs()
const containerAttrs = computed<Record<string, unknown>>(() => {
const comboBoxAttrs = {}
if (props.containerRole === 'combobox') {
comboBoxAttrs['aria-haspopup'] = rawAttrs['aria-haspopup']
comboBoxAttrs['aria-owns'] = rawAttrs['aria-owns']
comboBoxAttrs['aria-expanded'] = rawAttrs['aria-expanded']
}
return comboBoxAttrs
})
const attrs = useAttrs({
excludeKeys: computed<string[]>(() => {
return Object.keys(containerAttrs.value)
}),
})
const { form, formItem } = useFormItem()
const { inputId } = useFormItemInputId(props, {
formItemContext: formItem,