chore: 🤖 provide support for root theme attribute#814
Merged
Conversation
|
GitHub Actions seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account. You have signed the CLA already but the status is still pending? Let us recheck it. |
elizabetdev
reviewed
Feb 20, 2026
Member
elizabetdev
left a comment
elizabetdev
left a comment
There was a problem hiding this comment.
LGTM! 🎉
It looks like #773, which this PR depended on, has been merged.
What else do we need to move this forward? Should we have an engineer take a look?
Resolved conflicts by accepting main's changes while preserving the PR's core root theme functionality: - ClickUIProvider: Combined main's theme validation (isValidThemeName, getFallbackThemeName) with PR's root theme attribute management (setRootThemeAttribute, removeRootThemeAttribute) and localStorage persistence (CUI_THEME_STORAGE_KEY) - Theme exports: Updated to use main's simplified ThemeName type while keeping InitCUIThemeScript export for preventing theme flash - Components: Accepted main's refactored icon paths (@/components/Assets/*) - README: Integrated PR's theme documentation into main's structure - Config: Accepted main's vite.config.ts (build configuration not related to root theme feature) - Deleted src/components/icons/Flags/index.tsx as per main The PR's core functionality is preserved: - InitCUIThemeScript for preventing theme flash on SSR - Root theme attribute (data-cui-theme) management - localStorage theme persistence
Contributor
📚 Storybook Preview Deployed✅ Preview URL: https://click-iyud1ef9b-clickhouse.vercel.app Built from commit: |
elizabetdev
approved these changes
Mar 2, 2026
punkbit
added a commit
that referenced
this pull request
Mar 9, 2026
* chore: 🤖 update required packages * chore: 🤖 provide styled components types * fix: 🐛 linter should ignore d.ts files * fix: 🐛 use double quotes * fix: 🐛 vite > v2 separates vitest config * chore: 🤖 reorder package * chore: 🤖 remove side property (deprecated) * fix: 🐛 dropdown amends * fix: 🐛 theme prop * fix: 🐛 type * chore: 🤖 TIAS build version supported on next v16 RSC * chore: 🤖 WIP ongoing styled-component v6.1.11 (non experimental) support * chore: 🤖 strict react version for dev * fix: 🐛 missing ref on forwardRef, might have plenty of these * chore: 🤖 update lockfile * chore: 🤖 remove optional flag from ref (typo) * chore: 🤖 add comment for future ref * refactor: 💡 banner * chore: 🤖 lint amends (double quotes) * refactor: 💡 removes style prop as typed prop * chore: 🤖 remove ajv * chore: 🤖 format * test: 💍 add aria pressed to ButtonGroup * chore: 🤖 format * test: 💍 use local getByText * chore: 🤖 update lockfile * chore: 🤖 add changeset * chore: 🤖 small text amend to trigger vercel deploy * chore: 🤖 prevent running on CI * chore: 🤖 add HUSKY to preven husky runnig pre-commit hook * fix: 🐛 conflict resolution * chore: 🤖 bump rc number * docs: 📝 build esm, how to use * chore: 🤖 ESM vite builder (wip) * fix: 🐛 remove .tsx extension from import statements * fix: 🐛 remove .tsx extension from import statements * fix: 🐛 remove .tsx extension from import statements * fix: 🐛 remove .ts extension from import statements * fix: 🐛 remove .ts extension from import statements * chore: 🤖 add eslint to assess import extensions not required * chore: 🤖 format * chore: 🤖 temporary custom resolve tsconfig path * refactor: 💡 export from correct theme boundary * chore: 🤖 node externals in vite, remove alias * chore: 🤖 use relative paths * chore: 🤖 use externalize deps * chore: 🤖 for ESM compatibility, tweak/handle CJS components * chore: revert ts alias rewrite to relative * chore: lint do not allow barrel imports * chore: remove excludes from tsconfig * chore: set vite settings to preserve file struct in output * fix: solve import cycles * fix: solve import cycles in stories * fix: build amends * fix: add .js extension * chore: analyze and visualise bundle * chore: split ESM, CJS distribution * chore: format * fix: 🐛 lint code block * fix: 🐛 import Separator * chore: format * fix: 🐛 import Separator * chore: 🤖 add changeset * chore: 🤖 use 0.0.251-rc.62 * chore: 🤖 resolve conflict resolution, deleted files which were removed in main branch * chore: 🤖 resolve conflict resolution, middle truncator * chore: 🤖 resolve conflict resolution, missing container changes * refactor: 💡 FileMultiUpload to follow FileUpload due to middle truncator * fix: 🐛 prevent icon success pushed right * fix: 🐛 remove file size from multiple file upload * chore: 🤖 merge conflict amend for ButtonGroup * chore: 🤖 remove comment * chore: 🤖 missing typecheck call on build * chore: 🤖 missing import * chore: 🤖 checkout datedetails from main * chore: 🤖 remove comment * docs: 📝 prefer american english * chore: 🤖 add dom utils, e.g. setRootThemeAttr and remove * chore: 🤖 on mount, set root html theme attribute * chore: 🤖 add support for SSR initial color scheme to prevent flash * docs: 📝 introduce SSR flash theme prevention * chore: 🤖 tweak package.json * feat: 🎸 add theme persistence via localStorage * docs: 📝 add theme persistence instructions * chore: 🤖 remove attempt for prefers-color-scheme should be handled separate * chore: 🤖 code format * chore: 🤖 add changeset * fix: 🐛 typo amend * fix: 🐛 icon name type * fix: 🐛 image name as icon type * chore: 🤖 export hooks * chore: 🤖 create useInitialTheme hook * chore: 🤖 add get root util * chore: 🤖 bump pkg * docs: 📝 add themes instructions * chore: 🤖 add note * chore: 🤖 update package.json * fix: 🐛 merge latest conflicts amends * refactor: 💡 rename InitColorSchemeScript * chore: 🤖 update lockfile * fix: 🐛 lockfile * fix: 🐛 dirname * fix: 🐛 filename * chore: 🤖 bump pkg * chore: 🤖 bump pkg * docs: 📝 conflict amends * chore: 🤖 merge amend * docs: 📝 missing assets management * chore: 🤖 bump version * bump version to 0.0.251-test.73 * fix: 🐛 prevent circular dependency * refactor: 💡 use THEMES values * docs: 📝 custom styles * chore: 🤖 format * refactor: 💡 avoid hard typed themes --------- Co-authored-by: GitHub Actions <actions@clickhouse.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Why?
The following PR fulfils the request made in #813 by providing support for root theme attributes.
The process will provide control for the consumer's main html, e.g. data-cui-theme. It'll get the preferred theme from localStorage (if available), to prevent theme flashing, e.g. due to SSR vs browser runtime. Note that there'll be further changes once the set of PRs are merged (see https://github.com/ClickHouse/click-ui/pulls/punkbit).
It also provides documentation explaining how to use it in the consumer application.
🤖 NOTE: switch base branch once #773 merged.
How?
data-cui-themePreview?
Persist theme (refresh page)
demo-cui-theme-persist-refresh.mov
Attribute data-cui-theme
demo-cui-theme.mov
Build dist version