fix(module): safelist all colors for toast.add

Resolves #375, resolves #440
nuxt · Jul 27, 2023 · 2cd6208 · 2cd6208 · vercel · Jul 27, 2023
1 parent 0300be8
commit 2cd6208
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/src/colors.ts b/src/colors.ts
@@ -204,7 +204,7 @@ const colorsAsRegex = (colors: string[]): string => colors.join('|')
 
 export const excludeColors = (colors: object) => Object.keys(omit(colors, colorsToExclude)).map(color => kebabCase(color)) as string[]
 
-export const generateSafelist = (colors: string[]) => {
+export const generateSafelist = (colors: string[], globalColors) => {
   const baseSafelist = Object.keys(safelistByComponent).flatMap(component => safelistByComponent[component](colorsAsRegex(colors)))
 
   // Ensure `red` color is safelisted for form elements so that `error` prop of `UFormGroup` always works
@@ -213,6 +213,8 @@ export const generateSafelist = (colors: string[]) => {
   return [
     ...baseSafelist,
     ...formsSafelist,
+    // Ensure all global colors are safelisted for the Notification (toast.add)
+    ...safelistByComponent['notification'](colorsAsRegex(globalColors)),
     // Gray safelist for Avatar & Notification
     'bg-gray-500',
     'dark:bg-gray-400',

diff --git a/src/module.ts b/src/module.ts
@@ -123,7 +123,7 @@ export default defineNuxtModule<ModuleOptions>({
       }
 
       tailwindConfig.safelist = tailwindConfig.safelist || []
-      tailwindConfig.safelist.push(...generateSafelist(options.safelistColors))
+      tailwindConfig.safelist.push(...generateSafelist(options.safelistColors, colors))
 
       tailwindConfig.plugins = tailwindConfig.plugins || []
       tailwindConfig.plugins.push(iconsPlugin({ collections: getIconCollections(options.icons as any[]) }))