Fixed #3760 Fixed #2348 - Inplace: FocusTrap support

pull/3767/head
Tuğçe Küçükoğlu 2023-03-17 11:47:12 +03:00
parent dda3d44b0d
commit 6d4e48917e
2 changed files with 7 additions and 3 deletions

View File

@ -60,7 +60,7 @@ describe('Inplace.vue', () => {
}, },
slots: { slots: {
display: `{{'Click to Edit'}}`, display: `{{'Click to Edit'}}`,
content: `<InputText autoFocus />` content: `<InputText autofocus />`
} }
}); });
@ -90,7 +90,7 @@ describe('Inplace.vue', () => {
}, },
slots: { slots: {
display: `{{'Click to Edit'}}`, display: `{{'Click to Edit'}}`,
content: `<InputText autoFocus />` content: `<InputText autofocus />`
} }
}); });

View File

@ -1,5 +1,5 @@
<template> <template>
<div :class="containerClass" aria-live="polite"> <div v-focustrap :class="containerClass" aria-live="polite">
<div v-if="!d_active" ref="display" :class="displayClass" :tabindex="$attrs.tabindex || '0'" role="button" @click="open" @keydown.enter="open" v-bind="displayProps"> <div v-if="!d_active" ref="display" :class="displayClass" :tabindex="$attrs.tabindex || '0'" role="button" @click="open" @keydown.enter="open" v-bind="displayProps">
<slot name="display"></slot> <slot name="display"></slot>
</div> </div>
@ -12,6 +12,7 @@
<script> <script>
import Button from 'primevue/button'; import Button from 'primevue/button';
import FocusTrap from 'primevue/focustrap';
export default { export default {
name: 'Inplace', name: 'Inplace',
@ -84,6 +85,9 @@ export default {
}, },
components: { components: {
IPButton: Button IPButton: Button
},
directives: {
focustrap: FocusTrap
} }
}; };
</script> </script>