@catppuccin/daisyui
Version:
🌼 Soothing pastel theme for daisyui
77 lines (73 loc) • 2.07 kB
JavaScript
import daisyThemePlugin from 'daisyui/theme';
import plugin from 'tailwindcss/plugin';
import { flavors } from '@catppuccin/palette';
const defaultThemeOption = {
"primary": "lavender",
"primary-content": "mantle",
"secondary": "surface0",
"secondary-content": "text",
"accent": "rosewater",
"accent-content": "mantle",
"neutral": "overlay1",
"neutral-content": "mantle",
"success": "green",
"success-content": "base",
"warning": "yellow",
"warning-content": "base",
"error": "red",
"error-content": "base",
"info": "sky",
"info-content": "mantle",
"base-100": "base",
"base-200": "mantle",
"base-300": "crust",
"base-content": "text",
"--radius-selector": "0.25rem",
"--radius-field": "0.5rem",
"--radius-box": "0.5rem",
"--size-field": "0.25rem",
"--size-selector": "0.25rem",
"--border": "1px",
"--depth": true,
"--noise": false
};
function generateTheme(themeName, themeOptions = {}) {
const options = {
...defaultThemeOption,
...themeOptions
};
const entries = Object.entries(options);
const theme = {
"color-scheme": flavors[themeName].dark ? "dark" : "light",
...Object.fromEntries(entries.filter(([k]) => k.startsWith("--"))),
...entries.filter(([_, v]) => typeof v === "boolean").reduce((acc, [key, value]) => {
acc[key] = value ? "1" : "0";
return acc;
}, {}),
...entries.filter(([k]) => !k.startsWith("--")).reduce((acc, [key, value]) => {
acc[`--color-${key}`] = flavors[themeName].colors[value].hex;
return acc;
}, {})
};
return theme;
}
function createCatppuccinPlugin(themeName, options, daisyOptions = {}) {
let theme;
if (typeof options === "string") {
theme = generateTheme(themeName, {
accent: options
});
} else {
theme = generateTheme(themeName, options);
}
return plugin.withOptions(() => {
return (PluginAPI) => {
daisyThemePlugin({
name: themeName,
...daisyOptions,
...theme
}).handler(PluginAPI);
};
});
}
export { createCatppuccinPlugin };