Repository navigation
chore(builder): complete framework-creation flow - #241
Open
johnleider wants to merge 111 commits into
Open
johnleider wants to merge 111 commits into
johnleider wants to merge 111 commits into
Conversation
|
commit: |
johnleider
marked this pull request as draft
May 28, 2026 15:32
Member
Author
|
Since the last push: saved builds (auto-saved multi-build persistence behind an API-swappable seam in |
This was referenced Jul 31, 2026
Member
Author
|
Second-model + multi-agent audit cycle complete. Codex (verified: 9 confirmed/3 rejected) drove the request-token switch guard, persistence error contract, rev-enveloped index and output-button feedback. Three Opus auditors (UX / design / flexibility) drove: saved-builds hardening (reactive cross-tab list, lazy create, honest delete-to-zero), an honest dependency graph (31 phantom edges removed — review sheet no longer contradicts the starter — plus 2 real edges the single-level scan missed), five new registry drift guards (191 tests), and a measured design wave: zero 390px overflow on every route, unified stepper/field treatment, working dark-mode elevation (the dark: variant matched nothing before), warning/on-error tokens at verified AA, sanctioned button ranks. All findings adversarially verified before fixing; all fixes browser-verified before commit. |
Contributor
|
Bootstrap apps/builder workspace package modeled on apps/playground but without the playground-specific deps (vue-repl, shiki, markdown). Same tsconfig + vite config patterns so the oxc transformer resolves tsconfig cleanly.
Carried forward from the deleted feature/framework-builder branch via
docs/builder-seed/:
- data/features.ts: curated catalog with name, summary, useCases, tags,
icon over the generated dep graph
- data/dependencies.json: generated by build/generate-dependencies.ts
on every `pnpm generate` (runs before vite via the dev script)
- data/questions.ts: 11 plugins across 5 categories (appearance, i18n,
infrastructure, access, utilities) - the only surface upfront config
needs to ask about
- engine/resolve.ts: pure function that walks the dep graph and reports
{ selected, autoIncluded, reasons, warnings }
- engine/manifest.ts: encodes selection into a fflate-compressed hash
for handoff to apps/playground
- main.ts wires Pinia + router + v0 plugins (hydration, breakpoints,
storage, theme) with light/dark color tokens
- pages/index.vue lands users with a one-paragraph explainer and a
single CTA to /wizard
- pages/wizard.vue runs the wizard in two phases via a plain
shallowRef<'plugins' | 'review'>:
- plugins phase renders the questions.ts taxonomy as a category-
grouped toggle grid
- review phase shows selected + auto-included dependencies + any
warnings, pulled from the engine/resolve output
- stores/builder.ts holds the selection Set and exposes resolved as a
toRef derived from the dep graph
Deliberately skipped from the previous branch: IntentCard + multi-
intent flow (only component-library exists), mode cards, the stepper
integration, breadcrumb sync, Free Pick and AI pages.
- F1 (must): customized() now resolves plugin meta via the exported getPluginById helper and short-circuits to "stock" for plugins with hasConfig: false (useHydration was stuck "customized" forever since it has no defaults.ts to compare against) - (c) free: saved === undefined -> isUndefined(saved) - F3 (low): index.vue's local meta() now delegates to getPluginById instead of reimplementing the PLUGINS.find lookup - F2 (must): chip rows carry a visually hidden stock/customized state text alongside the color-only chip-on/chip-quiet styling - F4 (low): manifest panel gets role="region" + an aria-label naming it - F5 (low): source switches from toRef to computed, since generateMainTs is expensive and was re-running on every read
…lock, visible dots - Gate the MiniFrame mock app AND the customized-chip row on route === '/builder' (step 1 only); config routes that fall back to PreviewSummary (e.g. /builder/hydration) keep both, unchanged. - On step 1, the manifest panel flex-fills all remaining sticky-aside height instead of sizing to content, with the code block absorbing the fill and scrolling internally — no dead space under a fixed-height cap. Peek is dropped on step 1 (fights the fill layout): the block always fills and scrolls there. Threaded a route+breakpoint `fill` flag through AppShell -> PreviewPane -> PreviewSummary (each computed locally, per the existing per-component convention) so this only engages on the desktop sticky aside; the mobile bottom sheet has no flex ancestor with a definite height to fill into, so it keeps the capped (24rem) + peek block instead. - Add an opt-in fill/maxHeight mode to GnDocsExampleCode so the content area scrolls internally instead of growing unbounded; the peek toggle stays outside the scroll region so it never scrolls out of view. - Restructure the manifest panel so GnDotGrid only layers the body (invite line + code), not the "src/main.ts ... N lines" header bar. - Make the dot grid actually read as a background: the code block's own surface (var(--v0-pre, var(--v0-surface))) is fully opaque, which hid the dots behind it in any populated state. Override --v0-pre to a translucent color-mix from the builder app (packages/genesis untouched), raise GnDotGrid's coverage to 30 (from the default 15) and turn on its `lines` prop so the pattern reads as an obvious blueprint grid rather than a handful of faint dots — visible at a glance in both empty and populated states, light and dark.
- Add shiki, @shikijs/langs, @shikijs/themes (catalog:) and wire up useHighlighter.ts / useHighlightCode.ts / constants/shiki.ts, ported from apps/docs with the vue lang swapped for typescript and the docs-only API transformer + idle-callback path stripped (builder wants eager highlighting, not the idle-prefetch used for docs example panes). `prehighlight` stays unexported here — nothing outside the module calls it, unlike docs' multi-file example prewarming. - PreviewSummary.vue drives GnDocsExampleCode's default slot with useHighlightCode(source), falling back to a plain <pre> until the highlighter loads. No packages/genesis changes — the slot seam already existed. - Global .shiki override in App.vue: shiki (defaultColor: false, dual themes) only emits --shiki-light/--shiki-dark as custom properties on each token span — nothing consumes them as `color` without a rule, so every fallback attempt at reusing apps/docs' override rendered monochrome text. apps/docs' version also assumes a `.dark` ancestor class; this app only sets [data-theme] on <html> (createThemePlugin, target: 'html'), so the added rule keys off that instead. Background is forced transparent (not shiki's own light/dark bg) so the manifest's translucent --v0-pre surface — and GnDotGrid behind it — still shows through the code.
Removes the top "← Back" button and "STEP N · X" eyebrow across the wizard pages, replacing them with a chevron-left icon button next to the primary action and a linear progress hairline, both in the fixed bottom bar. Frees up vertical space so the h1 is the first element on each step.
The fixed StepBar at the bottom (4rem + 1px) could intercept clicks or cause scroll-to targets to land under it. Adding scroll-padding-bottom: 6rem to html ensures in-page anchors and router scroll behavior position targets above the fixed bar. Co-authored-by: John Leider <johnleider@users.noreply.github.com>
…ed logic statusFor() previously considered any config object with keys as 'customized', but this was incorrect — a config saved with default values should show as 'defaults'. Now uses the same comparison logic as PreviewSummary.vue: 1. Check if config exists (undefined → defaults) 2. Compare against actual plugin defaults from defaults.ts modules 3. Only mark as 'customized' when JSON differs from defaults Co-authored-by: John Leider <johnleider@users.noreply.github.com>
…romotion DataGrid and DataTable were promoted from draft to preview in v1.2.0, so they're now selectable and should be exported. Update the DRAFT test array to match the current maturity.json state.
- review.vue: flip negated condition to positive comparison - manifest.test.ts: remove unnecessary 's' flag from regex - PreviewRules.vue: use non-capturing group for numeric pattern
cursor
Bot
force-pushed
the
feat/builder
branch
from
September 15, 2026 22:00
938d607 to
885f4ec
Compare
|
Rebased onto current
CI is now running:
No scope expansion; scroll-padding and review.vue align commits (f0676a5, e864162) were already on the branch prior to rebase. |
Add 'Describe what you need' feature that allows Vuetify One subscribers to describe their app requirements in natural language and get suggested plugin and component selections applied to their build. - Add @vuetify/auth dependency and pinia plugin setup - Create useAssemble composable for LLM requirements endpoint - Add AssemblePrompt component with One subscription gating - Implement validation of LLM response against plugin/component catalogs - Add unit tests for parse/validate helpers (30 passing)
Replace mdiSparkles (does not exist in @mdi/js) with mdiAutoFix for the AssemblePrompt trigger button icon.
Remove the unused getPluginInfo function that was causing knip to fail in the repo-integrity CI check.
This branch has not been deployed
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.
Summary
Builds
apps/builder/into a complete car-configurator wizard for assembling a v0-based Vue app from selectable plugins and components — now current with v0 master and able to produce a working framework start to finish.The flow: landing → select plugins (15, incl. new ReducedMotion + Tooltip) → per-plugin config screens with a live preview aside (every configurable plugin has a dedicated preview module) → component picker (maturity-aware: draft components are visibly gated) → review build sheet → outputs: a zip starter that installs and builds green, and a playground URL carrying the full plugin configuration.
What's in this update
foreground).Record<KnownAlias, string>), explicit plugin install order with storage auto-included when anything persists, undefined config values survive, draft components/composables filtered from emission.pnpm install && pnpm run buildgreen, styled via an emitted uno.config mapping theme tokens tovar(--v0-*)with fallbacks, demos rewritten on v0 compounds (zero native form controls).src/main.tsso the user's configuration installs in the sandbox;framework.tsbinds through a namespace (vue-repl cannot resolve re-exported bindings).Toggle.Rootwith real pressed state, every field labeled, CTAs announce their visible text, SVG indicators only.main.ts, segmented wizard progress, build-sheet review page, dark mode persisted, AA contrast verified.apps/builderwired into the vitest workspace — 153 tests including drift guards (every config screen must have a factory emission; every known alias must have a predicate).Verification
Three full Playwright walkthroughs (desktop/tablet/mobile, light/dark): complete flow, zero console errors, zip built and served, playground rendered with configured theme, state persistence across reload.
Known limitations
uno.config.ts, so a deliberately partial palette can render unstyled borders there (zip output has fallbacks).