pull/4107/head
mertsincan 2023-07-04 00:12:09 +01:00
parent 62605e92b9
commit 37b65d8b47
2 changed files with 17 additions and 15 deletions

View File

@ -35,13 +35,14 @@ const BaseDirective = {
},
_extend: (name, options = {}) => {
const handleHook = (hook, el, binding, vnode, prevVnode) => {
el.$instance = el.$instance || {};
el._$instances = el._$instances || {};
const config = binding?.instance?.$primevue?.config;
const $instance = el.$instance[name] || {};
const $instance = el._$instances[name] || {};
const $options = ObjectUtils.isEmpty($instance) ? { ...options, ...options?.methods } : {};
el.$instance[name] = {
el.$instance = $instance;
el._$instances[name] = {
...$instance,
/* new instance variables to pass in directive methods */
$name: name,
@ -53,10 +54,10 @@ const BaseDirective = {
defaultPT: config?.pt?.directives?.[name],
isUnstyled: config?.unstyled,
/* instance's methods */
ptm: (key = '', params = {}) => BaseDirective._getPTValue(el.$instance[name], el.$instance?.[name]?.$binding?.value?.pt, key, { ...params }),
ptmo: (obj = {}, key = '', params = {}) => BaseDirective._getPTValue(el.$instance?.[name], obj, key, params, false),
cx: (key = '', params = {}) => (!el.$instance?.[name]?.isUnstyled ? BaseDirective._getOptionValue(el.$instance?.[name]?.$css?.classes, key, { ...params }) : undefined),
sx: (key = '', when = true, params = {}) => (when ? BaseDirective._getOptionValue(el.$instance?.[name]?.$css?.inlineStyles, key, { ...params }) : undefined),
ptm: (key = '', params = {}) => BaseDirective._getPTValue(el._$instances[name], el._$instances?.[name]?.$binding?.value?.pt, key, { ...params }),
ptmo: (obj = {}, key = '', params = {}) => BaseDirective._getPTValue(el._$instances?.[name], obj, key, params, false),
cx: (key = '', params = {}) => (!el._$instances?.[name]?.isUnstyled ? BaseDirective._getOptionValue(el._$instances?.[name]?.$css?.classes, key, { ...params }) : undefined),
sx: (key = '', when = true, params = {}) => (when ? BaseDirective._getOptionValue(el._$instances?.[name]?.$css?.inlineStyles, key, { ...params }) : undefined),
...$options
};
@ -69,10 +70,8 @@ const BaseDirective = {
handleHook('created', el, binding, vnode, prevVnode);
},
beforeMount: (el, binding, vnode, prevVnode) => {
const instance = el.$instance[name];
loadBaseStyle();
!instance?.isUnstyled && instance?.$css?.loadStyle();
!el.$instance?.isUnstyled && el.$instance?.$css?.loadStyle();
handleHook('beforeMount', el, binding, vnode, prevVnode);
},
mounted: (el, binding, vnode, prevVnode) => {

View File

@ -26,6 +26,9 @@ const FocusTrap = BaseFocusTrap.extend('focustrap', {
this.unbind(el);
},
methods: {
getComputedSelector(selector) {
return `:not(.p-hidden-focusable):not([data-p-hidden-focusable="true"])${selector}`;
},
bind(el, binding) {
const { onFocusIn, onFocusOut } = binding.value || {};
@ -61,16 +64,16 @@ const FocusTrap = BaseFocusTrap.extend('focustrap', {
},
autoFocus(el, binding) {
const { autoFocusSelector = '', firstFocusableSelector = '', autoFocus = false } = binding.value || {};
let focusableElement = DomHandler.getFirstFocusableElement(el, `[autofocus]:not([data-p-hidden-focusable="true"])${autoFocusSelector}`);
let focusableElement = DomHandler.getFirstFocusableElement(el, `[autofocus]${this.getComputedSelector(autoFocusSelector)}`);
autoFocus && !focusableElement && (focusableElement = DomHandler.getFirstFocusableElement(el, `:not([data-p-hidden-focusable="true"])${firstFocusableSelector}`));
autoFocus && !focusableElement && (focusableElement = DomHandler.getFirstFocusableElement(el, this.getComputedSelector(firstFocusableSelector)));
DomHandler.focus(focusableElement);
},
onFirstHiddenElementFocus(event) {
const { currentTarget, relatedTarget } = event;
const focusableElement =
relatedTarget === currentTarget.$_pfocustrap_lasthiddenfocusableelement
? DomHandler.getFirstFocusableElement(currentTarget.parentElement, `:not([data-p-hidden-focusable="true"])${currentTarget.$_pfocustrap_focusableselector}`)
? DomHandler.getFirstFocusableElement(currentTarget.parentElement, this.getComputedSelector(currentTarget.$_pfocustrap_focusableselector))
: currentTarget.$_pfocustrap_lasthiddenfocusableelement;
DomHandler.focus(focusableElement);
@ -79,7 +82,7 @@ const FocusTrap = BaseFocusTrap.extend('focustrap', {
const { currentTarget, relatedTarget } = event;
const focusableElement =
relatedTarget === currentTarget.$_pfocustrap_firsthiddenfocusableelement
? DomHandler.getLastFocusableElement(currentTarget.parentElement, `:not([data-p-hidden-focusable="true"])${currentTarget.$_pfocustrap_focusableselector}`)
? DomHandler.getLastFocusableElement(currentTarget.parentElement, this.getComputedSelector(currentTarget.$_pfocustrap_focusableselector))
: currentTarget.$_pfocustrap_firsthiddenfocusableelement;
DomHandler.focus(focusableElement);
@ -95,7 +98,7 @@ const FocusTrap = BaseFocusTrap.extend('focustrap', {
'aria-hidden': true,
'data-p-hidden-accessible': true,
'data-p-hidden-focusable': true,
onFocus
onFocus: onFocus?.bind(this)
});
};