typescript-plugin-css-modules
typescript-plugin-css-modules copied to clipboard
CSS Modules `composes` properties and default v. named exports
Describe the bug
Similar to https://github.com/mrmckeb/typescript-plugin-css-modules/issues/207, we have a project using [email protected] (and all default plugin options usage), in it, we use CSS Modules exclusively with named exports.
There seem to be different numbers of exports between the default and namedExports.
To Reproduce Steps to reproduce the behavior:
- Using
[email protected]and[email protected]. - With this example css module:
/* theme-typography.module.css */
.aliasingBase {
-webkit-font-smoothing: antialiased;
}
.h1 {
composes: aliasingBase;
font-weight: 300;
}
- With the following snippet:
import * as sColors from './theme-colors.module.css';
import * as sLayout from './theme-layout.module.css';
import * as sMisc from './theme-misc.module.css';
import * as sShadow from './theme-shadow.module.css';
import * as sSpacing from './theme-spacing.module.css';
import * as sText from './theme-text.module.css';
import * as sTypo from './theme-typography.module.css';
const s = {...sColors, ...sMisc, ...sTypo, ...sText, ...sLayout, ...sShadow, ...sSpacing};
export function themeCx(props: AllTokens): string {
const normalized = normalize(props);
return cx(s, normalized);
}
// s has ~40ish keys on the default export and ~268 named exports besides default
- edit: I remembered that adding
composesto a css module makes the types for plugin's named exports stop working. There's only a default export in that case and no namedExports.
Expected behavior
Adding composes should continue exporting namedExports from the CSS modules they're contained in.
Desktop (please complete the following information):
- OS: macOS 14.5
- Node Version: 20.12