feat(demo): persist the custom theme and let people copy it as code - #5
Merged
Merged
Conversation
Two follow-ups to the theme editor from #4. The editor's state lived inside initCustomTheme, so every visit rebuilt the grid from a fresh random theme — switch to a preset, come back, and whatever you had dialed in was gone. The theme and its input registry now sit at module scope, randomized once per page load, and the DOM is built on first open only. Reopening shows the theme you left. The editor also had no way to get a theme back out, which is the main reason to have one in a library demo. It now renders a live defineTheme() snippet under the controls, with a Copy button matching the install block. The snippet is generated as [text, class] segments, so the highlighted markup and the copied text come from one source instead of two that can drift. Widened the number boxes to 115px — 0.00402 is the longest value the sliders can produce and it clipped behind the spinner at 100px.
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
1 participant
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.
Follow-ups to the theme editor added in #4.
Settings survive a preset round-trip. The editor's state lived inside
initCustomTheme, so every visit rebuilt the grid from a fresh random theme — switch to a preset, come back, and whatever you'd dialed in was gone. The theme and its input registry now sit at module scope, randomized once per page load, with the DOM built on first open only.The theme can be copied out as code. A live
defineTheme()snippet renders under the controls with a Copy button matching the install block. Snippet segments are[text, class]pairs, so the highlighted markup and the copied text come from one source rather than two that can drift.Also widened the number boxes to 115px:
0.00402is the longest value the sliders can produce and it clipped behind the number spinner at 100px.Verified in Chromium
node --check), satisfiesTiksThemeundertsc --strict, and round-trips through the real publisheddefineThemeand plays