Theming API: Update themes folder structure and all exports

pull/5507/head
mertsincan 2024-03-27 13:12:22 +00:00
parent 5403be3a70
commit e23fd12ff4
27 changed files with 92 additions and 18 deletions

View File

@ -0,0 +1,5 @@
export { default as extendPreset } from './extendPreset';
export { default as updatePreset } from './updatePreset';
export { default as updatePrimary } from './updatePrimary';
export { default as updateSurface } from './updateSurface';
export { default as updateTheme } from './updateTheme';

View File

@ -0,0 +1,6 @@
{
"main": "./index.cjs.js",
"module": "./index.esm.js",
"unpkg": "./index.min.js",
"types": "./index.d.ts"
}

View File

@ -1,8 +1,7 @@
import Theme, { SharedUtils } from 'primevue/themes'; import Theme, { SharedUtils } from 'primevue/themes';
const VARIABLE = Theme.defaults.variable;
export default (preset) => { export default (preset) => {
const VARIABLE = Theme.defaults.variable;
const newPreset = SharedUtils.object.mergeKeysByRegex(Theme.getPreset(), preset, VARIABLE.excludedKeyRegex); const newPreset = SharedUtils.object.mergeKeysByRegex(Theme.getPreset(), preset, VARIABLE.excludedKeyRegex);
Theme.setPreset(newPreset); Theme.setPreset(newPreset);

View File

@ -0,0 +1,15 @@
import Theme from 'primevue/themes';
export default (primary) => {
const { primitive, semantic, components, directives } = Theme.getPreset();
const newPreset = {
primitive,
semantic: { ...semantic, primary },
components,
directives
};
Theme.setPreset(newPreset);
return newPreset;
};

View File

@ -0,0 +1,22 @@
import Theme from 'primevue/themes';
export default (surface) => {
const { primitive, semantic, components, directives } = Theme.getPreset();
const hasLightDark = surface?.hasOwnProperty('light') || surface?.hasOwnProperty('dark');
const newColorScheme = {
colorScheme: {
light: { ...semantic?.colorScheme?.light, ...{ surface: hasLightDark ? surface?.light : surface } },
dark: { ...semantic?.colorScheme?.dark, ...{ surface: hasLightDark ? surface?.dark : surface } }
}
};
const newPreset = {
primitive,
semantic: { ...semantic, ...newColorScheme },
components,
directives
};
Theme.setPreset(newPreset);
return newPreset;
};

View File

@ -1,7 +1,5 @@
import Theme, { SharedUtils } from 'primevue/themes'; import Theme, { SharedUtils } from 'primevue/themes';
const VARIABLE = Theme.defaults.variable;
export const $dt = (tokenPath, type) => { export const $dt = (tokenPath, type) => {
const config = Theme.getPConfig(); const config = Theme.getPConfig();
@ -10,6 +8,7 @@ export const $dt = (tokenPath, type) => {
export const dt = (theme = {}, tokenPath, type) => { export const dt = (theme = {}, tokenPath, type) => {
if (tokenPath) { if (tokenPath) {
const VARIABLE = Theme.defaults.variable;
const { prefix, transform } = theme?.options || {}; const { prefix, transform } = theme?.options || {};
const regex = /{([^}]*)}/g; const regex = /{([^}]*)}/g;
const token = SharedUtils.object.test(regex, tokenPath) ? tokenPath : `{${tokenPath}}`; const token = SharedUtils.object.test(regex, tokenPath) ? tokenPath : `{${tokenPath}}`;

View File

@ -0,0 +1,3 @@
export * from './color/index.js';
export * from './dt';
export { default as toVariables } from './toVariables';

View File

@ -0,0 +1,6 @@
{
"main": "./index.cjs.js",
"module": "./index.esm.js",
"unpkg": "./index.min.js",
"types": "./index.d.ts"
}

View File

@ -1,8 +1,7 @@
import Theme, { SharedUtils } from 'primevue/themes'; import Theme, { SharedUtils } from 'primevue/themes';
const VARIABLE = Theme.defaults.variable;
export default function (theme, options = {}) { export default function (theme, options = {}) {
const VARIABLE = Theme.defaults.variable;
const { prefix = VARIABLE.prefix, selector = VARIABLE.selector, excludedKeyRegex = VARIABLE.excludedKeyRegex } = options; const { prefix = VARIABLE.prefix, selector = VARIABLE.selector, excludedKeyRegex = VARIABLE.excludedKeyRegex } = options;
const _toVariables = (_theme, _prefix = '') => { const _toVariables = (_theme, _prefix = '') => {

View File

@ -1,2 +1,5 @@
export * from 'primevue/themes/actions';
export { default } from 'primevue/themes/config'; export { default } from 'primevue/themes/config';
export * from './utils'; export * from 'primevue/themes/helpers';
export { default as ThemeService } from 'primevue/themes/service';
export * from 'primevue/themes/utils';

View File

@ -0,0 +1,6 @@
{
"main": "./index.cjs.js",
"module": "./index.esm.js",
"unpkg": "./index.min.js",
"types": "./index.d.ts"
}

View File

@ -0,0 +1,6 @@
{
"main": "./index.cjs.js",
"module": "./index.esm.js",
"unpkg": "./index.min.js",
"types": "./index.d.ts"
}

View File

@ -84,8 +84,8 @@ import treeselect from 'primevue/themes/primeone/base/treeselect';
import treetable from 'primevue/themes/primeone/base/treetable'; import treetable from 'primevue/themes/primeone/base/treetable';
export default { export default {
components: {
global, global,
components: {
accordion, accordion,
autocomplete, autocomplete,
avatar, avatar,

View File

@ -2,7 +2,7 @@ export default {
colorScheme: { colorScheme: {
light: { light: {
root: { root: {
background: '{surface.200}', background: '{surface.200}'
}, },
grouped: { grouped: {
borderColor: '{surface.0}' borderColor: '{surface.0}'
@ -10,7 +10,7 @@ export default {
}, },
dark: { dark: {
root: { root: {
background: '{surface.700}', background: '{surface.700}'
}, },
grouped: { grouped: {
borderColor: '{surface.900}' borderColor: '{surface.900}'

View File

@ -2,6 +2,6 @@ export default {
root: { root: {
color: '{form.field.float.label.color}', color: '{form.field.float.label.color}',
focusColor: '{form.field.float.label.focus.color}', focusColor: '{form.field.float.label.focus.color}',
invalidColor: '{form.field.float.label.invalid.color}', invalidColor: '{form.field.float.label.invalid.color}'
} }
}; };

View File

@ -0,0 +1,6 @@
{
"main": "./index.cjs.js",
"module": "./index.esm.js",
"unpkg": "./index.min.js",
"types": "./index.d.ts"
}

View File

@ -1,9 +1,2 @@
export * from './color';
export * from './dt';
export { default as extendPreset } from './extendPreset';
export { default as ThemeService } from './service';
export { default as SharedUtils } from './sharedUtils'; export { default as SharedUtils } from './sharedUtils';
export { default as ThemeUtils } from './themeUtils'; export { default as ThemeUtils } from './themeUtils';
export { default as toVariables } from './toVariables';
export { default as updatePreset } from './updatePreset';
export { default as updateTheme } from './updateTheme';

View File

@ -0,0 +1,6 @@
{
"main": "./index.cjs.js",
"module": "./index.esm.js",
"unpkg": "./index.min.js",
"types": "./index.d.ts"
}