diff --git a/src/cli/core/FileContentGenerator.ts b/src/cli/core/FileContentGenerator.ts index efbfb3f..39d5899 100644 --- a/src/cli/core/FileContentGenerator.ts +++ b/src/cli/core/FileContentGenerator.ts @@ -155,6 +155,7 @@ export class FileContentGenerator { 'export type TArg =\n' + '| null\n' + '| undefined\n' + + this.getDarkModeClassnameType() + '| TTailwindString\nIMPORTED_T_CUSTOM_CLASSES_ARG' + '\n' + 'export type TTailwind = (...args: TArg[]) => TTailwindString\n' + @@ -165,6 +166,21 @@ export class FileContentGenerator { ); }; + /** + * Get the dark mode config custom classname type + * @returns the name of the classname for dark mode + */ + private getDarkModeClassnameType = (): string => { + const darkModeConfig = this._configParser.getDarkMode(); + if (_.isArray(darkModeConfig) && darkModeConfig[0] === 'class') { + return `| '${darkModeConfig[1]}'\n`; + } else if (_.isString(darkModeConfig) && darkModeConfig === 'class') { + return `| 'dark'\n`; + } else { + return ''; + } + }; + /** * Generates types group template for a utility classes group object. * diff --git a/src/cli/core/TailwindConfigParser.ts b/src/cli/core/TailwindConfigParser.ts index 71bf155..64514cd 100644 --- a/src/cli/core/TailwindConfigParser.ts +++ b/src/cli/core/TailwindConfigParser.ts @@ -121,7 +121,8 @@ export class TailwindConfigParser { // get responsive variants const [mediaBreakpoints] = this.getThemeProperty('screens'); - if (this.getDarkMode() == 'media' || this.getDarkMode() == 'class') mediaBreakpoints.push('dark'); + if (this.getDarkMode() == 'media' || this.getDarkMode() == 'class') + mediaBreakpoints.push('dark'); mediaBreakpoints.map((breakpoint: string) => { if (!variants.includes(breakpoint)) { diff --git a/src/cli/types/config.ts b/src/cli/types/config.ts index 03b8f69..9445fb2 100644 --- a/src/cli/types/config.ts +++ b/src/cli/types/config.ts @@ -5,7 +5,7 @@ export type TTailwindCSSConfig = Partial< typeof defaultTailwindConfig & Record<'separator' | 'prefix' | 'mode', string> >; -export type TConfigDarkMode = false | 'media' | 'class'; +export type TConfigDarkMode = false | 'media' | 'class' | ['media' | 'class', string]; export type TConfigTheme = TThemeItems & {extend?: TThemeItems};