fix(config): add validation preventing mediaQuery on defaultTheme

RyanClementsHax · May 9, 2023 · d9a5a60 · d9a5a60
1 parent d10f4ca
commit d9a5a60
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 2 deletions.
diff --git a/src/utils/optionsUtils.spec.ts b/src/utils/optionsUtils.spec.ts
@@ -114,7 +114,18 @@ describe('themeUtils', () => {
           // eslint-disable-next-line @typescript-eslint/ban-ts-comment
           // @ts-expect-error
           defaultTheme: { selectors: ['default'], extend: {} },
-          themes: [{ name: defaultThemeName, extend: {} }]
+          themes: []
+        })
+      ).toThrow()
+    })
+
+    it('throws an error if the default theme has a mediaQuery', () => {
+      expect(() =>
+        validateOptions({
+          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+          // @ts-expect-error
+          defaultTheme: { mediaQuery: 'some query', extend: {} },
+          themes: []
         })
       ).toThrow()
     })

diff --git a/src/utils/optionsUtils.ts b/src/utils/optionsUtils.ts
@@ -8,7 +8,10 @@ export interface ThemeConfig {
   extend: TailwindExtension
 }
 
-export type DefaultThemeConfig = Omit<ThemeConfig, 'name' | 'selectors'>
+export type DefaultThemeConfig = Omit<
+  ThemeConfig,
+  'name' | 'selectors' | 'mediaQuery'
+>
 
 export interface MultiThemePluginOptions {
   defaultTheme?: DefaultThemeConfig
@@ -44,6 +47,9 @@ export const validateOptions = ({
   if ((defaultTheme as ThemeConfig)?.selectors) {
     throw new Error('The default theme cannot have any selectors')
   }
+  if ((defaultTheme as ThemeConfig)?.mediaQuery) {
+    throw new Error('The default theme cannot have a media query')
+  }
   const darkTheme = themes.find(x => x.name === 'dark')
   if (darkTheme?.selectors) {
     throw new Error(