Theming API: Change package build

build-meta.js

@@ -2,23 +2,25 @@ const fs = require('fs-extra');
 const path = require('path');
 
 function copyDependencies(inFolder, outFolder, subFolder) {
-    fs.readdirSync(path.resolve(__dirname, inFolder), { withFileTypes: true })
+    fs.readdirSync(inFolder, { withFileTypes: true }).forEach((entry) => {
-        .filter((dir) => dir.isDirectory())
+        const fileName = entry.name;
-        .forEach(({ name: folderName }) => {
+        const sourcePath = path.join(inFolder, fileName);
-            fs.readdirSync(path.resolve(__dirname, inFolder + folderName)).forEach((file) => {
+        const destPath = path.join(outFolder, fileName);
-                if (file === 'package.json' || file.endsWith('d.ts') || file.endsWith('vue')) {
-                    fs.copySync(path.resolve(__dirname, inFolder + folderName) + '/' + file, outFolder + folderName + '/' + file);
-                }
-            });
 
-            if (subFolder) {
+        if (entry.isDirectory()) {
-                try {
+            copyDependencies(sourcePath, destPath, subFolder);
-                    fs.readdirSync(path.resolve(__dirname, inFolder + folderName + subFolder)).forEach((subFile) => {
+        } else {
-                        if (subFile === 'package.json' || subFile.endsWith('d.ts') || subFile.endsWith('vue')) {
+            if (fileName === 'package.json' || fileName.endsWith('d.ts') || fileName.endsWith('.vue')) {
-                            fs.copySync(path.resolve(__dirname, inFolder + folderName + subFolder) + '/' + subFile, outFolder + folderName + subFolder + '/' + subFile);
+                if (subFolder && sourcePath.includes(subFolder)) {
+                    const subDestPath = path.join(outFolder, fileName.replace(subFolder, ''));
+
+                    fs.ensureDirSync(path.dirname(subDestPath));
+                    fs.copyFileSync(sourcePath, subDestPath);
+                } else {
+                    fs.ensureDirSync(path.dirname(destPath));
+                    fs.copyFileSync(sourcePath, destPath);
+                }
             }
-                    });
-                } catch {}
         }
     });
 }
@@ -26,6 +28,7 @@ function copyDependencies(inFolder, outFolder, subFolder) {
 copyDependencies('./components/lib/', 'dist/', '/style');
 copyDependencies('./components/lib/icons/', 'dist/icons/');
 copyDependencies('./components/lib/passthrough/', 'dist/passthrough/');
+copyDependencies('./components/lib/themes/', 'dist/themes/');
 
 fs.copySync(path.resolve(__dirname, './components/lib/ts-helpers.d.ts'), 'dist/ts-helpers.d.ts');
 fs.copySync(path.resolve(__dirname, './README.md'), 'dist/README.md');

nuxt-vite.config.js

@@ -162,102 +162,54 @@ const ICON_ALIAS = {
     'primevue/icons/windowminimize': path.resolve(__dirname, './components/lib/icons/windowminimize/index.vue')
 };
 
-const THEME_COMPONENTS = [
+// prettier-ignore
-    'accordion',
+const THEME_COMPONENTS = ['accordion','autocomplete','avatar','badge','blockui','breadcrumb','button','calendar','card','carousel','cascadeselect','checkbox','chip','chips','colorpicker','confirmdialog','confirmpopup','contextmenu','datatable','dataview','dialog','divider','dock','dropdown','editor','fieldset','fileupload','floatlabel','galleria','iconfield','image','inlinemessage','inplace','inputgroup','inputnumber','inputotp','inputswitch','inputtext','knob','listbox','megamenu','menu','menubar','message','metergroup','multiselect','orderlist','organizationchart','overlaypanel','paginator','panel','panelmenu','password','picklist','progressbar','progressspinner','radiobutton','rating','scrollpanel','scrolltop','selectbutton','sidebar','skeleton','slider','speeddial','splitbutton','splitter','steps','stepper','tabmenu','tabview','tag','terminal','textarea','tieredmenu','timeline','toast','togglebutton','toolbar','tooltip','tree','treeselect','treetable'];
-    'autocomplete',
+
-    'avatar',
+const createThemeAlias = (design, presets) => {
-    'badge',
+    const baseAlias = THEME_COMPONENTS.reduce((acc, name) => {
-    'blockui',
+        acc[`primevue/themes/${design}/base/${name}`] = path.resolve(__dirname, `./components/lib/themes/${design}/base/${name}/index.js`);
-    'breadcrumb',
+
-    'button',
+        return acc;
-    'calendar',
+    }, {});
-    'card',
+
-    'carousel',
+    const presetAlias = presets?.reduce((p_acc, p_name) => {
-    'cascadeselect',
+        const p_alias = THEME_COMPONENTS.reduce((acc, name) => {
-    'checkbox',
+            acc[`primevue/themes/${design}/presets/${p_name}/${name}`] = path.resolve(__dirname, `./components/lib/themes/${design}/presets/${p_name}/${name}/index.js`);
-    'chip',
+
-    'chips',
+            return acc;
-    'colorpicker',
+        }, {});
-    'confirmdialog',
+
-    'confirmpopup',
+        p_acc = { ...p_acc, ...p_alias };
-    'contextmenu',
+
-    'datatable',
+        return p_acc;
-    'dataview',
+    }, {});
-    'dialog',
+
-    'divider',
+    const otherAlias = presets?.reduce((p_acc, p_name) => {
-    'dock',
+        p_acc = {
-    'dropdown',
+            ...p_acc,
-    'editor',
+            [`primevue/themes/${design}/presets/${p_name}`]: path.resolve(__dirname, `./components/lib/themes/${design}/presets/${p_name}/index.js`),
-    'fieldset',
+            [`primevue/themes/${design}/${p_name}`]: path.resolve(__dirname, `./components/lib/themes/${design}/${p_name}/index.js`)
-    'fileupload',
+        };
-    'floatlabel',
+
-    'galleria',
+        return p_acc;
-    'iconfield',
+    }, {});
-    'image',
+
-    'inlinemessage',
+    const coreAlias = {
-    'inplace',
+        [`primevue/themes/${design}/base/global`]: path.resolve(__dirname, `./components/lib/themes/${design}/base/global/index.js`),
-    'inputgroup',
+        [`primevue/themes/${design}/base`]: path.resolve(__dirname, `./components/lib/themes/${design}/base/index.js`),
-    'inputnumber',
+        [`primevue/themes/${design}`]: path.resolve(__dirname, `./components/lib/themes/${design}/index.js`)
-    'inputotp',
+    };
-    'inputswitch',
+
-    'inputtext',
+    return { ...baseAlias, ...presetAlias, ...otherAlias, ...coreAlias };
-    'knob',
+};
-    'listbox',
+
-    'megamenu',
-    'menu',
-    'menubar',
-    'message',
-    'metergroup',
-    'multiselect',
-    'orderlist',
-    'organizationchart',
-    'overlaypanel',
-    'paginator',
-    'panel',
-    'panelmenu',
-    'password',
-    'picklist',
-    'progressbar',
-    'progressspinner',
-    'radiobutton',
-    'rating',
-    'scrollpanel',
-    'scrolltop',
-    'selectbutton',
-    'sidebar',
-    'skeleton',
-    'slider',
-    'speeddial',
-    'splitbutton',
-    'splitter',
-    'steps',
-    'stepper',
-    'tabmenu',
-    'tabview',
-    'tag',
-    'terminal',
-    'textarea',
-    'tieredmenu',
-    'timeline',
-    'toast',
-    'togglebutton',
-    'toolbar',
-    'tooltip',
-    'tree',
-    'treeselect',
-    'treetable'
-];
 const THEME_ALIAS = {
-    'primevue/themes/primeone/base/global': path.resolve(__dirname, './components/lib/themes/primeone/base/global.js'),
-    ...THEME_COMPONENTS.reduce((acc, name) => ((acc[`primevue/themes/primeone/presets/aura/${name}`] = path.resolve(__dirname, `./components/lib/themes/primeone/presets/aura/${name}/index.js`)), acc), {}),
-    ...THEME_COMPONENTS.reduce((acc, name) => ((acc[`primevue/themes/primeone/base/${name}`] = path.resolve(__dirname, `./components/lib/themes/primeone/base/${name}/index.js`)), acc), {}),
-    'primevue/themes/primeone/base': path.resolve(__dirname, './components/lib/themes/primeone/base/index.js'),
-    'primevue/themes/primeone/presets/aura': path.resolve(__dirname, './components/lib/themes/primeone/presets/aura/index.js'),
-    'primevue/themes/primeone/presets': path.resolve(__dirname, './components/lib/themes/primeone/presets/index.js'),
-    'primevue/themes/primeone/aura': path.resolve(__dirname, './components/lib/themes/primeone/aura/index.js'),
-    'primevue/themes/primeone': path.resolve(__dirname, './components/lib/themes/primeone/index.js'),
-    'primevue/themes/config': path.resolve(__dirname, './components/lib/themes/config/index.js'),
     'primevue/themes/utils': path.resolve(__dirname, './components/lib/themes/utils/index.js'),
+    'primevue/themes/config': path.resolve(__dirname, './components/lib/themes/config/index.js'),
+    'primevue/themes/service': path.resolve(__dirname, './components/lib/themes/service/index.js'),
+    'primevue/themes/helpers': path.resolve(__dirname, './components/lib/themes/helpers/index.js'),
+    'primevue/themes/actions': path.resolve(__dirname, './components/lib/themes/actions/index.js'),
+    ...createThemeAlias('primeone', ['aura']),
     'primevue/themes': path.resolve(__dirname, './components/lib/themes/index.js')
 };
 

rollup.config.js

@@ -173,6 +173,57 @@ const CORE_STYLE_DEPENDENCIES = {
     'primevue/virtualscroller/style': 'primevue.virtualscroller.style'
 };
 
+// prettier-ignore
+const THEME_COMPONENTS = ['accordion','autocomplete','avatar','badge','blockui','breadcrumb','button','calendar','card','carousel','cascadeselect','checkbox','chip','chips','colorpicker','confirmdialog','confirmpopup','contextmenu','datatable','dataview','dialog','divider','dock','dropdown','editor','fieldset','fileupload','floatlabel','galleria','iconfield','image','inlinemessage','inplace','inputgroup','inputnumber','inputotp','inputswitch','inputtext','knob','listbox','megamenu','menu','menubar','message','metergroup','multiselect','orderlist','organizationchart','overlaypanel','paginator','panel','panelmenu','password','picklist','progressbar','progressspinner','radiobutton','rating','scrollpanel','scrolltop','selectbutton','sidebar','skeleton','slider','speeddial','splitbutton','splitter','steps','stepper','tabmenu','tabview','tag','terminal','textarea','tieredmenu','timeline','toast','togglebutton','toolbar','tooltip','tree','treeselect','treetable'];
+
+const createThemeDependencies = (design, presets) => {
+    const baseDeps = THEME_COMPONENTS.reduce((acc, name) => {
+        acc[`primevue/themes/${design}/base/${name}`] = `primevue.themes.${design}.base.${name}`;
+
+        return acc;
+    }, {});
+
+    const presetDeps = presets?.reduce((p_acc, p_name) => {
+        const p_alias = THEME_COMPONENTS.reduce((acc, name) => {
+            acc[`primevue/themes/${design}/presets/${p_name}/${name}`] = `primevue.themes.${design}.presets.${p_name}.${name}`;
+
+            return acc;
+        }, {});
+
+        p_acc = { ...p_acc, ...p_alias };
+
+        return p_acc;
+    }, {});
+
+    const otherDeps = presets?.reduce((p_acc, p_name) => {
+        p_acc = {
+            ...p_acc,
+            [`primevue/themes/${design}/presets/${p_name}`]: `primevue.themes.${design}.presets.${p_name}`,
+            [`primevue/themes/${design}/${p_name}`]: `primevue.themes.${design}.${p_name}`
+        };
+
+        return p_acc;
+    }, {});
+
+    const coreDeps = {
+        [`primevue/themes/${design}/base/global`]: `primevue.themes.${design}.base.global`,
+        [`primevue/themes/${design}/base`]: `primevue.themes.${design}.base`,
+        [`primevue/themes/${design}`]: `primevue.themes.${design}`
+    };
+
+    return { ...baseDeps, ...presetDeps, ...otherDeps, ...coreDeps };
+};
+
+const CORE_THEME_DEPENDENCIES = {
+    ...createThemeDependencies('primeone', ['aura']),
+    'primevue/themes/actions': 'primevue.themes.actions',
+    'primevue/themes/config': 'primevue.themes.config',
+    'primevue/themes/helpers': 'primevue.themes.helpers',
+    'primevue/themes/service': 'primevue.themes.service',
+    'primevue/themes/utils': 'primevue.themes.utils',
+    'primevue/themes': 'primevue.themes'
+};
+
 const CORE_DEPENDENCIES = {
     'primevue/utils': 'primevue.utils',
     'primevue/api': 'primevue.api',
@@ -212,7 +263,8 @@ const CORE_DEPENDENCIES = {
     'primevue/badge': 'primevue.badge',
     'primevue/listbox': 'primevue.listbox',
     'primevue/togglebutton': 'primevue.togglebutton',
-    ...CORE_PASSTHROUGH_DEPENDENCIES
+    ...CORE_PASSTHROUGH_DEPENDENCIES,
+    ...CORE_THEME_DEPENDENCIES
 };
 
 // dependencies
@@ -405,6 +457,36 @@ function addStyle() {
         });
 }
 
+function traverseDir(dir, condition, callback) {
+    try {
+        const files = fs.readdirSync(dir);
+
+        files.forEach((file) => {
+            const filePath = path.join(dir, file);
+            const fileStat = fs.statSync(filePath);
+
+            if (fileStat.isDirectory()) {
+                traverseDir(filePath, condition, callback);
+            } else if (condition?.(file) && fileStat.isFile()) {
+                callback?.(file, filePath, dir);
+            }
+        });
+    } catch {}
+}
+
+function addThemes() {
+    traverseDir(
+        path.resolve(__dirname, './components/lib/themes'),
+        (file) => file === 'index.js',
+        (file, filePath, folderPath) => {
+            const searchFolder = '/components/lib/';
+            const fpath = folderPath.substring(folderPath.indexOf(searchFolder) + searchFolder.length);
+
+            addEntry(fpath, file, 'index');
+        }
+    );
+}
+
 function addDirectives() {
     addEntry('basedirective', 'BaseDirective.js', 'basedirective');
     addEntry('badgedirective', 'BadgeDirective.js', 'badgedirective');
@@ -421,7 +503,6 @@ function addConfig() {
 
 function addPassThrough() {
     addEntry('passthrough', 'index.js', 'index');
-    addEntry('passthrough/tailwind', 'index.js', 'index');
 }
 
 function addUtils() {
@@ -499,6 +580,7 @@ function addPackageJson() {
 
 addUtils();
 addStyle();
+addThemes();
 addBase();
 addApi();
 addConfig();