Fixed #6524 - Add extend keyword to extend css variables to presets

packages/core/src/basecomponent/BaseComponent.vue

@@ -156,14 +156,15 @@ export default {
             isNotEmpty(globalCSS) && BaseStyle.load(globalCSS, { name: 'global', ...this.$styleOptions });
         },
         _loadThemeStyles() {
-            if (this.isUnstyled) return;
+            if (this.isUnstyled || this.$theme === 'none') return;
 
             // common
             if (!Theme.isStyleNameLoaded('common')) {
-                const { primitive, semantic, style } = this.$style?.getCommonTheme?.() || {};
+                const { primitive, semantic, global, style } = this.$style?.getCommonTheme?.() || {};
 
                 BaseStyle.load(primitive?.css, { name: 'primitive-variables', ...this.$styleOptions });
                 BaseStyle.load(semantic?.css, { name: 'semantic-variables', ...this.$styleOptions });
+                BaseStyle.load(global?.css, { name: 'global-variables', ...this.$styleOptions });
                 BaseStyle.loadTheme({ name: 'global-style', ...this.$styleOptions }, style);
 
                 Theme.setLoadedStyleName('common');

packages/core/src/basedirective/BaseDirective.js

@@ -81,20 +81,21 @@ const BaseDirective = {
     _loadCoreStyles(instance = {}, useStyleOptions) {
         if (!Base.isStyleNameLoaded(instance.$style?.name) && instance.$style?.name) {
             BaseStyle.loadCSS(useStyleOptions);
-            instance.isUnstyled() && instance.$style?.loadCSS(useStyleOptions);
+            instance.$style?.loadCSS(useStyleOptions);
 
             Base.setLoadedStyleName(instance.$style.name);
         }
     },
     _loadThemeStyles: (instance = {}, useStyleOptions) => {
-        if (instance?.isUnstyled()) return;
+        if (instance?.isUnstyled() || instance?.theme?.() === 'none') return;
 
         // common
         if (!Theme.isStyleNameLoaded('common')) {
-            const { primitive, semantic, style } = instance.$style?.getCommonTheme?.() || {};
+            const { primitive, semantic, global, style } = instance.$style?.getCommonTheme?.() || {};
 
             BaseStyle.load(primitive?.css, { name: 'primitive-variables', ...useStyleOptions });
             BaseStyle.load(semantic?.css, { name: 'semantic-variables', ...useStyleOptions });
+            BaseStyle.load(global?.css, { name: 'global-variables', ...useStyleOptions });
             BaseStyle.loadTheme({ name: 'global-style', ...useStyleOptions }, style);
 
             Theme.setLoadedStyleName('common');

packages/core/src/config/PrimeVue.js

@@ -193,13 +193,16 @@ export function setupConfig(app, PrimeVue) {
 
     /*** Methods and Services ***/
     const loadCommonTheme = () => {
+        if (PrimeVue.config?.theme === 'none') return;
+
         // common
         if (!Theme.isStyleNameLoaded('common')) {
-            const { primitive, semantic, style } = BaseStyle.getCommonTheme?.() || {};
+            const { primitive, semantic, global, style } = BaseStyle.getCommonTheme?.() || {};
             const styleOptions = { nonce: PrimeVue.config?.csp?.nonce };
 
             BaseStyle.load(primitive?.css, { name: 'primitive-variables', ...styleOptions });
             BaseStyle.load(semantic?.css, { name: 'semantic-variables', ...styleOptions });
+            BaseStyle.load(global?.css, { name: 'global-variables', ...styleOptions });
             BaseStyle.loadTheme({ name: 'global-style', ...styleOptions }, style);
 
             Theme.setLoadedStyleName('common');

packages/nuxt-module/src/module.ts

@@ -49,7 +49,7 @@ export default defineNuxtModule<ModuleOptions>({
         const resolver = createResolver(import.meta.url);
         const registered = register(moduleOptions);
         const { autoImport, importPT, importTheme, options, loadStyles } = moduleOptions;
-        const hasTheme = (importTheme || options?.theme) && !options?.unstyled;
+        const hasTheme = options?.theme !== 'none' && (importTheme || options?.theme) && !options?.unstyled;
 
         nuxt.options.runtimeConfig.public.primevue = {
             ...moduleOptions,
@@ -114,10 +114,15 @@ const styles = [
 
 ${hasTheme ? `Theme.setTheme(${importTheme?.as} || options?.theme)` : ''}
 
-const themes = [
+const themes = ${
+                options?.theme === 'none'
+                    ? `[]`
+                    : `
+[
     ${`${uniqueRegisteredStyles?.[0].as} && ${uniqueRegisteredStyles?.[0].as}.getCommonThemeStyleSheet ? ${uniqueRegisteredStyles?.[0].as}.getCommonThemeStyleSheet(undefined, styleProps) : ''`},
     ${uniqueRegisteredStyles?.map((item: MetaType) => `${item.as} && ${item.as}.getThemeStyleSheet ? ${item.as}.getThemeStyleSheet(undefined, styleProps) : ''`).join(',')}
-].join('');
+].join('');`
+            }
 
 export { styles, stylesToTop, themes };
 `;