feat(custom-apps): revamp templates based on ds (sloppified) - #267
Draft
Hari Harish (harisaiharish) wants to merge 2 commits into
Draft
feat(custom-apps): revamp templates based on ds (sloppified)#267Hari Harish (harisaiharish) wants to merge 2 commits into
Hari Harish (harisaiharish) wants to merge 2 commits into
Conversation
Templates now render the design system's own Button, Badge, Text, Input, Textarea, Select, Typeahead, Checkbox, Banner, Skeleton, Spinner, LinearProgress, Tooltip, Divider and Kbd instead of lookalikes built from tokens. The registry snapshot moves to internal/cmd/templates/design-system/ (one copy, refreshed by "make sync-design-system") and apps init resolves the import graph of a template's source to copy only the design-system files it reaches, deriving package.json from the bare imports in those files. That drops the theme and preset duplicated across all five templates, and keeps per-template dependencies to what each one uses. Fixes found on the way: - Tooltip is Radix-based and threw without a provider, so IconButton crashed at render. entry.tsx now mounts one (DesignSystemProvider). - experiment-comparison's chart series used var(--series-N), which the theme does not define, so every series color resolved to nothing. - Each template's tailwind.config.js re-declared theme.extend with a stale spacing scale, silently overriding the preset's. - tsconfig targeted ES2020 with @types/react 18; design-system source needs ES2022 and React 19 types, so "shadcn add" failed typecheck. - feedbackColors.ts reimplemented the design system's color hash. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Hari Harish (harisaiharish)
changed the title
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.
Stacked on #260, which vendors the design system's tokens and theme. This one swaps the furniture: templates render the real
Button,Text,Input,Select,Typeahead,Checkbox,Banner,Skeleton,Tooltipand friends instead of hand-built lookalikes.The registry snapshot now lives once in
internal/cmd/templates/design-system/(make sync-design-system).apps initwalks a template's import graph, copies only the files it reaches, and derivespackage.jsonfrom their imports —blankgets 3 packages,annotation-queue9.Fixed on the way:
Tooltipcrashed everyIconButtonwithout a Radix provider; chart series used avar(--series-N)the theme never defined; everytailwind.config.jsshadowed the preset's spacing scale;tsconfig/@types/reactwere too old forshadcn addto typecheck.All five templates build clean and were screenshot-verified in light and dark. Four new tests cover the invariants.