chore: 🤖 clear scss setup (technical debt)

[punkbit]

Why?

The following PR cleans up the build configuration, token generation and related processes. By removing legacy styling setups and simplifying the token generation to only the required setup. This work is important before starting to migrate off styled components. Effectively, reducing technical debt.

For example, the SCSS setup is not providing any value, e.g. there was an unused 320KB file named src/styles/tokens-light-dark.scss.

It seems that the setup is promoted as offering "tree-shaking" benefits, but I suspect this is not correct from what I could assess. With that being said, even if the consumer app, only use a single variable, the entire 320KB of CSS custom properties would be spit into the final CSS bundle!

Considering that variables change with time, and if not managed correctly, might increase dramatically, the file size would increase and make the app's distributed bundle size increase for no additional value. Think that tree shaking means a sort of static analysis that has to determine which tokens (bits of code) are not used, to remove them safely. It's not the case here with the current setup, e.g. the whole ":root" stuff would go in.

Other changes might have extended to removing legacy, unused or orphaned CSS files found in the project.

Finally, the changes here help to clear or reduce some of the technical debt, e.g. taking a step back before jumping much further. There are other pending PR, which once merged will allow further progress to improve the code base. Please do take a moment to check them here.

⚠️ WARNING: Depends on #783, which should be merged firstly.
🤖 Switch base branch to main, once #783 merged

How?

• Removed SCSS/CSS Modules configuration from Vite and deleted unused stylesheet files (App.css, Home.module.css)
• Reorganised the scripts location
• Streamlined token generation to output only required files (reduced at least ~320KB)
• Cleaned up deprecated theme types and standardized theme name constants
  no secrets or API keys
• Make the format script reusable, e.g. use it in the generate-token statement
• Renamed the build-token script as generate-token, as found in the actual package.json

Preview?

src/theme directory

src/theme
├── ClickUIProvider
│   ├── ClickUIProvider.tsx
│   └── index.ts
├── index.ts
├── theme.tsx
└── tokens
    ├── variables.dark.ts
    └── variables.light.ts

3 directories, 6 files

.scripts directory

.scripts
├── bash
│   ├── changeset-verification
│   └── format
└── js
    └── generate-tokens.js

3 directories, 3 files

[changeset-bot]

🦋 Changeset detected

Latest commit: 3a7ff00

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clickhouse/click-ui	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
click-ui	Ready	Preview, Comment	Feb 4, 2026 4:24pm