bug:DOMTokenList error#224
Merged
fahimahammed merged 5 commits intofahimahammed:stagefrom Oct 20, 2025
Merged
Conversation
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
There was a problem hiding this comment.
Great job, @kunal-10-cloud! Thanks for creating the pull request.
Soon the maintainers/owner will review it and provide you with feedback/suggestions.
Make sure to star this awesome repository and follow the account!
- DevUI
Contributor
Author
|
@fahimahammed could you please take a look on this issue and the pr and suggest me any changes required |
fahimahammed
approved these changes
Oct 20, 2025
| > | ||
| {/* Wrap everything in ThemeProvider */} | ||
| <ThemeProvider attribute="class" defaultTheme="dark" enableSystem> | ||
| {/* ✅ Wrap everything in ThemeProvider */} |
github-actions
bot
added
hacktoberfest
hacktoberfest-accepted
hacktoberfest_2025
labels
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
2 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.
Fixes: #223
Description
This PR fixes the DOMTokenList error that occurs when running npm run dev. The error was caused by theme names containing spaces (like "Default Theme") being passed to the next-themes library, which tries to add them as CSS class tokens. CSS class tokens cannot contain spaces or special characters, causing the application to fail to start properly.
Changes Made
[x] Added custom storageKey="devui-theme" to ThemeProvider in src/app/layout.tsx
[x] Implemented theme name validation and cleanup logic in src/components/ui/ThemeColorPicker.tsx
[x] Added automatic removal of invalid theme names from localStorage on component mount
[x] Enhanced theme name validation using regex /[^a-zA-Z0-9-_]/g to remove invalid characters
[x] Added cleanup for both custom and next-themes localStorage keys
Screenshots or GIFs (if applicable)
Before:
After:
