Theming API: Change package build

pull/5507/head
mertsincan 2024-03-27 13:13:15 +00:00
parent e23fd12ff4
commit 1953103161
3 changed files with 150 additions and 113 deletions

View File

@ -2,30 +2,33 @@ const fs = require('fs-extra');
const path = require('path');
function copyDependencies(inFolder, outFolder, subFolder) {
fs.readdirSync(path.resolve(__dirname, inFolder), { withFileTypes: true })
.filter((dir) => dir.isDirectory())
.forEach(({ name: folderName }) => {
fs.readdirSync(path.resolve(__dirname, inFolder + folderName)).forEach((file) => {
if (file === 'package.json' || file.endsWith('d.ts') || file.endsWith('vue')) {
fs.copySync(path.resolve(__dirname, inFolder + folderName) + '/' + file, outFolder + folderName + '/' + file);
}
});
fs.readdirSync(inFolder, { withFileTypes: true }).forEach((entry) => {
const fileName = entry.name;
const sourcePath = path.join(inFolder, fileName);
const destPath = path.join(outFolder, fileName);
if (subFolder) {
try {
fs.readdirSync(path.resolve(__dirname, inFolder + folderName + subFolder)).forEach((subFile) => {
if (subFile === 'package.json' || subFile.endsWith('d.ts') || subFile.endsWith('vue')) {
fs.copySync(path.resolve(__dirname, inFolder + folderName + subFolder) + '/' + subFile, outFolder + folderName + subFolder + '/' + subFile);
}
});
} catch {}
if (entry.isDirectory()) {
copyDependencies(sourcePath, destPath, subFolder);
} else {
if (fileName === 'package.json' || fileName.endsWith('d.ts') || fileName.endsWith('.vue')) {
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);
}
}
});
}
});
}
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');

View File

@ -162,102 +162,54 @@ const ICON_ALIAS = {
'primevue/icons/windowminimize': path.resolve(__dirname, './components/lib/icons/windowminimize/index.vue')
};
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'
];
// 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 createThemeAlias = (design, presets) => {
const baseAlias = THEME_COMPONENTS.reduce((acc, name) => {
acc[`primevue/themes/${design}/base/${name}`] = path.resolve(__dirname, `./components/lib/themes/${design}/base/${name}/index.js`);
return acc;
}, {});
const presetAlias = presets?.reduce((p_acc, p_name) => {
const p_alias = THEME_COMPONENTS.reduce((acc, name) => {
acc[`primevue/themes/${design}/presets/${p_name}/${name}`] = path.resolve(__dirname, `./components/lib/themes/${design}/presets/${p_name}/${name}/index.js`);
return acc;
}, {});
p_acc = { ...p_acc, ...p_alias };
return p_acc;
}, {});
const otherAlias = presets?.reduce((p_acc, p_name) => {
p_acc = {
...p_acc,
[`primevue/themes/${design}/presets/${p_name}`]: path.resolve(__dirname, `./components/lib/themes/${design}/presets/${p_name}/index.js`),
[`primevue/themes/${design}/${p_name}`]: path.resolve(__dirname, `./components/lib/themes/${design}/${p_name}/index.js`)
};
return p_acc;
}, {});
const coreAlias = {
[`primevue/themes/${design}/base/global`]: path.resolve(__dirname, `./components/lib/themes/${design}/base/global/index.js`),
[`primevue/themes/${design}/base`]: path.resolve(__dirname, `./components/lib/themes/${design}/base/index.js`),
[`primevue/themes/${design}`]: path.resolve(__dirname, `./components/lib/themes/${design}/index.js`)
};
return { ...baseAlias, ...presetAlias, ...otherAlias, ...coreAlias };
};
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')
};

View File

@ -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();