primevue-mirror/components/lib/themes/config/index.js

61 lines
2.0 KiB
JavaScript
Raw Normal View History

2024-03-05 09:22:33 +00:00
import { SharedUtils, ThemeService } from 'primevue/themes';
const ServiceSymbol = Symbol();
export default {
_pConfig: undefined,
2024-03-06 10:38:51 +00:00
_colorScheme: 'dark',
2024-03-05 09:22:33 +00:00
getPConfig() {
return this._pConfig;
},
setPConfig(newValue) {
this._pConfig = newValue;
ThemeService.emit(ServiceSymbol, this._pConfig);
},
onPConfigChange(callback) {
ThemeService.on(ServiceSymbol, callback);
},
2024-03-06 10:38:51 +00:00
getColorScheme() {
return this._colorScheme;
2024-03-05 09:22:33 +00:00
},
2024-03-06 10:38:51 +00:00
setColorScheme(newValue) {
this._colorScheme = newValue;
2024-03-05 09:22:33 +00:00
},
2024-03-06 10:38:51 +00:00
toggleColorScheme() {
this._colorScheme = this._colorScheme === 'dark' ? 'light' : 'dark';
2024-03-05 09:22:33 +00:00
const defaultDocument = SharedUtils.dom.isClient() ? window.document : undefined;
if (defaultDocument) {
2024-03-06 10:38:51 +00:00
//@todo
const { colorScheme } = this._pConfig?.theme?.options;
let options = {
light: {
class: '',
rule: `:root{[CSS]}`,
default: false
},
dark: {
class: 'p-dark',
rule: `.p-dark{[CSS]}`,
default: false
}
};
if (colorScheme) {
if (SharedUtils.object.isObject(colorScheme)) {
options.light = { ...options.light, ...colorScheme.light };
options.dark = { ...options.dark, ...colorScheme.dark };
} else {
options.light = { ...options.light, default: colorScheme !== 'auto' && colorScheme !== 'dark' };
options.dark = { ...options.dark, default: colorScheme === 'dark' };
}
}
2024-03-05 09:22:33 +00:00
2024-03-06 10:38:51 +00:00
SharedUtils.dom.removeMultipleClasses(defaultDocument.documentElement, [options.dark.class, options.light.class]);
SharedUtils.dom.addClass(defaultDocument.documentElement, this._colorScheme === 'dark' ? options.dark.class : options.light.class);
2024-03-05 09:22:33 +00:00
}
return this._colorMode;
}
};