Skip to content

fix: stop hashing the CSS class names - #30

Merged
TimG1804 merged 1 commit into
mainfrom
fix/css-modules-hashing
Sep 18, 2026
Merged

TimG1804 merged 1 commit into
mainfrom
fix/css-modules-hashing

Conversation

@TimG1804

Copy link
Copy Markdown
Collaborator

Closes #5.

postcss({ modules: true }) hashed the SCSS class names, so the bundled
stylesheet shipped

.squirrel-select_sqs-dropdown__wrapper__Re4RX
.squirrel-select_select__trigger__c0CbE
.squirrel-select_select__option__JQTYe

while the TypeScript adds the plain sqs-dropdown__wrapper,
select__trigger, select__option. src/index.ts imports the SCSS for its
side effect only and never reads the class map, so the two could never line
up — the injected stylesheet matched nothing and every consumer had to
write the whole thing themselves.

The names are already namespaced with sqs- and the README documents them
as the public styling API, so hashing them was never wanted here.

Verification

Built bundle before:

.squirrel-select_select__option__JQTYe
.squirrel-select_select__options__Ct12X
.squirrel-select_select__trigger__c0CbE
.squirrel-select_sqs-dropdown__wrapper__Re4RX

after:

.select  .selected  .select__option  .select__options
.select__trigger  .sqs-dropdown__wrapper  .open

which matches what DropdownCreation.ts and constantsAndHelpers.ts
assign. No hashed names remain in the output. eslint, tsc --noEmit and
rollup all run clean.

Not changed here: different-from-default-option and select__disabled
are applied by the TypeScript but have never existed in the stylesheet —
they are styling hooks for consumers, not a hashing problem.

The postcss plugin ran with modules: true, so the bundled stylesheet
shipped names like .squirrel-select_select__option__JQTYe while the
TypeScript adds the plain select__option. src/index.ts imports the SCSS
for its side effect only and never reads the class map, so the two sides
could never line up: the injected stylesheet matched nothing and every
consumer had to write the whole thing themselves.

The names are namespaced with sqs- already and are documented in the
README as the public styling API, so hashing them was never wanted here.

Verified against the built bundle: it now carries .sqs-dropdown__wrapper,
.select, .select__trigger, .select__options, .select__option, .selected
and .open, which is what DropdownCreation and constantsAndHelpers assign.

Closes #5
@TimG1804
TimG1804 merged commit 80d036f into main Sep 18, 2026
1 check passed
@TimG1804
TimG1804 deleted the fix/css-modules-hashing branch September 18, 2026 12:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bundled CSS never matches: postcss modules hashes the class names

1 participant