Fixed #6408 - Scoped style (dt props) does not attach to page with correct selector

pull/6416/head
Mert Sincan 2024-09-16 13:05:37 +01:00
parent 886f5f3cf5
commit 335c6d862d
2 changed files with 8 additions and 8 deletions

View File

@ -2,9 +2,9 @@
import { Theme, ThemeService } from '@primeuix/styled'; import { Theme, ThemeService } from '@primeuix/styled';
import { findSingle } from '@primeuix/utils/dom'; import { findSingle } from '@primeuix/utils/dom';
import { getKeyValue, isArray, isFunction, isNotEmpty, isString, resolve, toFlatCase } from '@primeuix/utils/object'; import { getKeyValue, isArray, isFunction, isNotEmpty, isString, resolve, toFlatCase } from '@primeuix/utils/object';
import { uuid } from '@primeuix/utils/uuid';
import Base from '@primevue/core/base'; import Base from '@primevue/core/base';
import BaseStyle from '@primevue/core/base/style'; import BaseStyle from '@primevue/core/base/style';
import { UniqueComponentId } from '@primevue/core/utils';
import { mergeProps } from 'vue'; import { mergeProps } from 'vue';
import BaseComponentStyle from './style/BaseComponentStyle'; import BaseComponentStyle from './style/BaseComponentStyle';
@ -57,7 +57,9 @@ export default {
}, },
scopedStyleEl: undefined, scopedStyleEl: undefined,
rootEl: undefined, rootEl: undefined,
$attrSelector: undefined,
beforeCreate() { beforeCreate() {
this.$attrSelector = uuid('pc');
const _usept = this.pt?.['_usept']; const _usept = this.pt?.['_usept'];
const originalValue = _usept ? this.pt?.originalValue?.[this.$.type.name] : undefined; const originalValue = _usept ? this.pt?.originalValue?.[this.$.type.name] : undefined;
const value = _usept ? this.pt?.value?.[this.$.type.name] : this.pt; const value = _usept ? this.pt?.value?.[this.$.type.name] : this.pt;
@ -83,7 +85,7 @@ export default {
if (this.rootEl) { if (this.rootEl) {
this.rootEl.setAttribute(this.$attrSelector, ''); this.rootEl.setAttribute(this.$attrSelector, '');
this.rootEl.$pc = { name: this.$.type.name, ...this.$params }; this.rootEl.$pc = { name: this.$.type.name, attrSelector: this.$attrSelector, ...this.$params };
} }
this._hook('onMounted'); this._hook('onMounted');
@ -370,9 +372,6 @@ export default {
return acc; return acc;
}, {}); }, {});
},
$attrSelector() {
return UniqueComponentId('pc');
} }
} }
}; };

View File

@ -1,9 +1,9 @@
import { Theme, ThemeService } from '@primeuix/styled'; import { Theme, ThemeService } from '@primeuix/styled';
import { getKeyValue, isArray, isEmpty, isFunction, isObject, isString, resolve, toCapitalCase, toFlatCase } from '@primeuix/utils/object'; import { getKeyValue, isArray, isEmpty, isFunction, isObject, isString, resolve, toCapitalCase, toFlatCase } from '@primeuix/utils/object';
import { uuid } from '@primeuix/utils/uuid';
import Base from '@primevue/core/base'; import Base from '@primevue/core/base';
import BaseStyle from '@primevue/core/base/style'; import BaseStyle from '@primevue/core/base/style';
import PrimeVueService from '@primevue/core/service'; import PrimeVueService from '@primevue/core/service';
import { UniqueComponentId } from '@primevue/core/utils';
import { mergeProps } from 'vue'; import { mergeProps } from 'vue';
const BaseDirective = { const BaseDirective = {
@ -166,7 +166,7 @@ const BaseDirective = {
$el: $prevInstance['$el'] || el || undefined, $el: $prevInstance['$el'] || el || undefined,
$style: { classes: undefined, inlineStyles: undefined, load: () => {}, loadCSS: () => {}, loadTheme: () => {}, ...options?.style }, $style: { classes: undefined, inlineStyles: undefined, load: () => {}, loadCSS: () => {}, loadTheme: () => {}, ...options?.style },
$primevueConfig: config, $primevueConfig: config,
$attrSelector: el.$attrSelector, $attrSelector: el.$pd?.[name]?.attrSelector,
/* computed instance variables */ /* computed instance variables */
defaultPT: () => BaseDirective._getPT(config?.pt, undefined, (value) => value?.directives?.[name]), defaultPT: () => BaseDirective._getPT(config?.pt, undefined, (value) => value?.directives?.[name]),
isUnstyled: () => (el.$instance?.$binding?.value?.unstyled !== undefined ? el.$instance?.$binding?.value?.unstyled : config?.unstyled), isUnstyled: () => (el.$instance?.$binding?.value?.unstyled !== undefined ? el.$instance?.$binding?.value?.unstyled : config?.unstyled),
@ -203,10 +203,11 @@ const BaseDirective = {
return { return {
created: (el, binding, vnode, prevVnode) => { created: (el, binding, vnode, prevVnode) => {
el.$pd ||= {};
el.$pd[name] = { name, attrSelector: uuid('pd') };
handleHook('created', el, binding, vnode, prevVnode); handleHook('created', el, binding, vnode, prevVnode);
}, },
beforeMount: (el, binding, vnode, prevVnode) => { beforeMount: (el, binding, vnode, prevVnode) => {
el.$attrSelector = UniqueComponentId('pd');
BaseDirective._loadStyles(el, binding, vnode); BaseDirective._loadStyles(el, binding, vnode);
handleHook('beforeMount', el, binding, vnode, prevVnode); handleHook('beforeMount', el, binding, vnode, prevVnode);
handleWatch(el); handleWatch(el);