Repository navigation
feat(appkit): add dev-only design pages plugin and ui-only template - #680
Draft
MarioCadenas wants to merge 32 commits into
Draft
MarioCadenas wants to merge 32 commits into
MarioCadenas wants to merge 32 commits into
Conversation
Contributor
📦 Bundle size reportCompared against
|
| dist | raw | gzip |
|---|---|---|
| JS (runtime) | 1.3 MB (+43 KB) | 477 KB (+15 KB) |
| Type declarations | 466 KB (+907 B) | 169 KB (+427 B) |
| Source maps | 2.6 MB (+73 KB) | 885 KB (+23 KB) |
| Other | 11 KB | 3.7 KB |
| Total | 4.4 MB (+117 KB) | 1.5 MB (+39 KB) |
Per-entry composition (own code — deps external (as shipped))
| Entry | Initial (gz) | Lazy (gz) | Total (gz) | node_modules (min) | Own code (min) |
|---|---|---|---|---|---|
. |
106 KB (+27 B) | 2.5 KB (-1 B) | 109 KB (+26 B) | external | 344 KB (-56 B) |
./beta |
114 KB (+10 KB) | 485 B | 114 KB (+10 KB) | external | 339 KB (+28 KB) |
./testing |
45 KB (+1 B) | 32 KB (+28 B) | 77 KB (+29 B) | external | 224 KB (+42 B) |
./tsdown |
520 B | 0 B | 520 B | external | 813 B |
./type-generator |
26 KB (+31 B) | 0 B | 26 KB (+31 B) | external | 74 KB (+42 B) |
Chunks:
| Entry | Chunk | Load | Size (gz) |
|---|---|---|---|
. |
index.js |
initial | 101 KB |
. |
utils.js |
initial | 4.6 KB |
. |
remote-tunnel-manager.js |
lazy | 2.5 KB |
./beta |
beta.js |
initial | 94 KB |
./beta |
modular.js |
initial | 6.0 KB |
./beta |
stream-manager.js |
initial | 5.9 KB |
./beta |
service-context.js |
initial | 4.2 KB |
./beta |
databricks.js |
initial | 3.3 KB |
./beta |
client.js |
initial | 647 B |
./beta |
index.js |
initial | 20 B |
./beta |
supervisor-api.js |
lazy | 192 B |
./beta |
databricks.js |
lazy | 178 B |
./beta |
index.js |
lazy | 115 B |
./testing |
manifest.js |
initial | 32 KB |
./testing |
index.js |
initial | 10 KB |
./testing |
wide-event-emitter.js |
initial | 2.9 KB |
./testing |
index.js |
lazy | 28 KB |
./testing |
remote-tunnel-manager.js |
lazy | 2.5 KB |
./testing |
utils.js |
lazy | 1.8 KB |
./tsdown |
index.js |
initial | 520 B |
./type-generator |
index.js |
initial | 26 KB |
@databricks/appkit-ui
npm tarball (packed): 402 KB (+4.8 KB) — gzipped download (dist + bin; excludes release-only docs/NOTICE).
| dist | raw | gzip |
|---|---|---|
| JS (runtime) | 431 KB (+2.0 KB) | 148 KB (+1003 B) |
| Type declarations | 269 KB (+1.8 KB) | 99 KB (+934 B) |
| Source maps | 857 KB (+4.1 KB) | 288 KB (+2.0 KB) |
| CSS | 16 KB | 3.2 KB |
| Other | 19 KB (+19 KB) | 1.8 KB (+1.8 KB) |
| Total | 1.6 MB (+27 KB) | 539 KB (+5.6 KB) |
Per-entry composition (consumer bundle — deps bundled, peerDeps external)
| Entry | Initial (gz) | Lazy (gz) | Total (gz) | node_modules (min) | Own code (min) |
|---|---|---|---|---|---|
./js |
5.3 KB | 49 KB | 55 KB | 208 KB | 14 KB |
./js/beta |
2.1 KB | 0 B | 2.1 KB | 0 B | 5.0 KB |
./react |
433 KB (+68 B) | 49 KB | 481 KB (+68 B) | 1.3 MB (+3 B) | 178 KB (+126 B) |
./react/beta |
4.9 KB (+73 B) | 0 B | 4.9 KB (+73 B) | 0 B | 13 KB (+171 B) |
Chunks:
| Entry | Chunk | Load | Size (gz) |
|---|---|---|---|
./js |
index.js |
initial | 5.2 KB |
./js |
chunk |
initial | 120 B |
./js |
apache-arrow |
lazy | 49 KB |
./js/beta |
beta.js |
initial | 2.1 KB |
./react |
index.js |
initial | 431 KB |
./react |
tslib |
initial | 2.1 KB |
./react |
apache-arrow |
lazy | 49 KB |
./react/beta |
beta.js |
initial | 4.9 KB |
Collaborator
Author
|
Review 1 · Fail · 3 critical, 2 major Does the change do what the task asked? No. Gate: major and worse must be fixed. The canvas, multi-selection, notes, persistence across a real restart, and production 404 work, and the automated suite passes. The handoff is not reliable: normal selections can lack source locations, contain stale props, and include screenshots missing visible content. Valid wrapped components are also omitted, and concurrent reads can falsely report no pending selections. Required
|
Collaborator
Author
|
Review 2 · Pass Does the change do what the task asked? Yes. Gate: major and worse must be fixed. The five earlier findings are fixed, and I found no regressions from those fixes. Browser checks against the built UI package, the full test suite, typechecking, and read-only lint/format checks passed. There are no remaining findings in this round. No findings. |
MarioCadenas
force-pushed
the
work/1-design-plugin-dev-only-design-
branch
from
October 20, 2026 13:01
af1f4a2 to
aa65b0d
Compare
MarioCadenas
changed the base branch from
main
to
work/2-appkit-plugin-add-with-auth-mo
October 20, 2026 13:01
MarioCadenas
changed the title
Collaborator
Author
|
Review 5 · Fail · 1 critical, 1 major Does the change do what the task asked? No. Gate: major and worse must be fixed. The design canvas, selection handoff, persistence and production 404 behavior work in the exercised cases, and all 50 targeted tests pass. The screenshot requirement is incomplete: selecting an absolutely positioned element can silently save an entirely blank image. The added CLI also omits declared resource defaults from deployment variables in an unusual supported case. Required
|
Contributor
🤖 AppKit PR bot🔬 Run evalsStart an eval for this PR from the evals-monitor app: Go to Evals Monitor → 📦 Try this PR's app templateScaffolds a new app from this PR's SDK build. Run it in any folder (requires the GitHub CLI — gh run download 41050726525 -R databricks/appkit -n appkit-template-0.89.0-pr.31ef605-work-1-design-plugin-dev-only-design-680 -D appkit-pr-680 \
&& unzip -o "appkit-pr-680/appkit-template-0.89.0-pr.31ef605-work-1-design-plugin-dev-only-design-680.zip" -d "appkit-pr-680" \
&& databricks apps init --template "appkit-pr-680"The template pins |
MarioCadenas
force-pushed
the
work/1-design-plugin-dev-only-design-
branch
from
October 20, 2026 14:22
aa65b0d to
4d00fbf
Compare
Collaborator
Author
|
Review 6 · Pass Does the change do what the task asked? Yes. Gate: major and worse must be fixed. Both previous findings are fixed at the reviewed commit. Chrome reproduced the blank screenshot with the previous code and verified the saved JPEG with the fix; actual plugin-add runs preserved manifest defaults in deployment YAML. The focused regression checks passed, with no remaining findings in this round. No findings. |
MarioCadenas
force-pushed
the
work/1-design-plugin-dev-only-design-
branch
from
October 20, 2026 15:37
4d00fbf to
acf5c0f
Compare
Collaborator
Author
|
Review 7 · Fail · 3 critical Does the change do what the task asked? No. Gate: major and worse must be fixed. The main canvas, source tracing, persisted handoff, production 404 behavior, and ui-only template work in the exercised paths. Three browser-proven faults remain: open dialogs disable the picker, completing a send discards selections added during that send, and screenshots omit typed values in uncontrolled inputs. The repository was left unchanged. Required
|
Collaborator
Author
|
Review 8 · Pass Does the change do what the task asked? Yes. Gate: major and worse must be fixed. F8, F9 and F10 are fixed: browser checks confirmed modal selection, preservation of later picks and edited notes during a pending send, and screenshots containing current form values. Focused tests and nearby runtime checks passed, with no remaining findings in this review round. The repository was left unchanged. No findings. |
MarioCadenas
force-pushed
the
work/1-design-plugin-dev-only-design-
branch
from
October 26, 2026 14:19
9bdf7b9 to
ad6dc6e
Compare
Collaborator
Author
|
Review 10 · Fail · 3 critical Does the change do what the task asked? No. Gate: major and worse must be fixed. The change does not meet the full task: the running app has no selection interface, open dialogs block selection, and clicking an SVG path saves a blank screenshot. The normal canvas handoff, source metadata, persistence across a server restart, and production 404 behavior worked locally. All 71 tests exercised passed, including the previously failing React type test. Required
|
Collaborator
Author
|
Review 11 · Fail · 2 critical Does the change do what the task asked? No. Gate: major and worse must be fixed. F12 and F13 are fixed and worked in Chromium, but the change does not yet meet the supplied task. F11 remains against the original running-app selection requirement; the claimed later scope change was not confirmed. Pressing the advertised Escape shortcut after selecting dialog content also closes the dialog and silently loses its screenshot when sent. Required
|
MarioCadenas
changed the title
Collaborator
Author
|
Review 12 · Fail · 2 critical, 1 major Does the change do what the task asked? No. Gate: major and worse must be fixed. The design pages and ui-only starter work, including hot reload and production 404s. The change does not meet the supplied task because element selection and persistent agent handoff are absent. An unrelated unfinished draft can also break an otherwise valid design page. Required
|
Collaborator
Author
|
Review 13 · Fail · 2 critical Does the change do what the task asked? No. Gate: major and worse must be fixed. The broken-draft loading bug is fixed, including live browser rendering and hot reload beside an unfinished page. The current task still explicitly requires multi-selection with notes and a persisted agent handoff; both remain absent despite their intentional removal, so the change does not meet all stated requirements. Required
|
MarioCadenas
force-pushed
the
work/1-design-plugin-dev-only-design-
branch
3 times, most recently
from
October 28, 2026 09:44
adfa702 to
b5f6314
Compare
Collaborator
Author
|
Review 14 · Fail · 1 critical, 2 major Does the change do what the task asked? No. Gate: major and worse must be fixed. The change does not meet the full task: the required element selection and persistent agent handoff are absent. Design page rendering, navigation and production 404s work; 83 targeted tests pass and both changed TypeScript packages typecheck. Browser testing also reproduced false readiness after a render error and a broken route for pages/index.tsx. Required
|
MarioCadenas
force-pushed
the
work/1-design-plugin-dev-only-design-
branch
from
October 28, 2026 10:22
b5f6314 to
48d89da
Compare
Collaborator
Author
|
Review 15 · Fail · 1 critical, 1 major Does the change do what the task asked? No. Gate: major and worse must be fixed. The required selection and persistent agent-handoff workflow is still missing. The render-error fix works for edits to the index page, but readiness remains incorrectly true when an imported component fails after a hot edit. F20 is fixed, and all 49 focused design and server tests pass. Required
|
MarioCadenas
force-pushed
the
work/1-design-plugin-dev-only-design-
branch
from
October 28, 2026 18:32
0341ad5 to
2d7a963
Compare
Collaborator
Author
|
Review 20 · Pass · 1 minor, 1 trivial Does the change do what the task asked? Yes. Gate: major and worse must be fixed. Taking the human's later scope decisions into account (selection handling moved to the builder's inspector, drafts served with a hydrator), the branch does what was asked: /design is dev-only and returns 404 otherwise, drafts render real appkit-ui blocks, errors are reported, the props schema is published, and the ui-only template is generated. All 67 design-plugin tests and the use-design-ready tests pass. One edge case is left: the dark-mode token sync follows the system color scheme and ignores a draft that forces its own theme. Not required (below the gate)
|
Collaborator
Author
|
Review 21 · Fail · 1 major Does the change do what the task asked? Yes. Gate: major and worse must be fixed. This round's additions (browserless status fields, theme.css, shipped schema, chart data types, template vitest inline) are in place and the design and chart tests pass. One claim is overstated: Required
|
- design() plugin (beta): in development serves a /design canvas that renders every PascalCase export under client/src/design/, and injects a click-to-select picker into the canvas and every app page. Picks are traced via the existing data-source transform plus the React fiber (component, owner stack, props), screenshotted, and persisted with an optional note to .appkit/design-selection.json (GET/POST/DELETE /api/design/selection). Outside development it mounts nothing and /design returns 404. - Plugins can contribute dev-server Vite plugins via an optional vitePlugins() hook. - appkit-ui/react/beta: DesignCanvas, DesignPicker, mountDesignPicker. - Template: gated client/src/design example, .appkit/ gitignored, and a ui-only app template (server + design). Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
- The canvas header (with the Select toggle) now stays clickable over an open modal and doesn't count as an outside press, using the same guard as the picker; Alt+S also toggles selecting from the keyboard. Open a dialog, then turn on Select to pick its contents. - Picking a shape inside an icon (<path>, <circle>, ...) screenshots its owning <svg>; the shape alone rendered blank outside it. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
- While selecting, Escape is consumed at window capture so it no longer also closes an open dialog (whose contents were just picked). - The screenshot is taken when an element is picked rather than at send, so a pick whose element has since left the page (a closed dialog, a re-render) is still sent with its image. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
…s only - /design renders the default export of client/src/design/index.tsx, and /design/<name> renders client/src/design/pages/<name>.tsx, at full size with the app's styles. Anything else under /design is a 404; in production /design is a 404 as before. - Remove the canvas grid, the element picker, the selection store (.appkit/design-selection.json and screenshots), the /api/design routes, builderOrigin and the postMessage handoff, plus the react/design subpath of appkit-ui. Selection now belongs to the app builder's own inspector, which reads the dev server's data-source file:line attributes (kept). - Template: the design sample is now client/src/design/index.tsx. Docs and tests updated; bundle baseline refreshed. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
Each /design page gets its own entry that imports just that page file, instead of eagerly importing every page and picking one. An unfinished draft in client/src/design/pages no longer breaks /design or the other pages; it only fails at its own /design/<name>. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
The App Builder writes .appkit/data-plan.json into the app; keep that directory out of the app's git history. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
…ages The template's theme tokens already follow prefers-color-scheme. Declaring color-scheme "light dark" in the template's index.html and the /design page shell makes the browser's own surfaces (canvas, scrollbars, form controls, first paint) follow the system preference too, so the app, /design and other surfaces match. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
- GET /design/__status returns { ready, pages }. Ready means
client/src/design/index.tsx exists, isn't the template placeholder
(`export const designPlaceholder = true`), and has painted since it last
changed; the page reports its paint back after first paint and each hot
update.
- After first paint, unless it's the placeholder, the page posts
{ type: "appkit:design-ready", version: 1, page, pages } to window.parent
(else window.opener), only to the new builderOrigin option (bare origins,
"*" rejected).
- With react-router (the app template ships it) design pages share a router
with basename /design, so links stay inside /design; the requested page is
imported directly and the others load only when navigated to.
- Template starter page carries the placeholder marker; docs and tests
updated.
Co-authored-by: Isaac <[email protected]>
Signed-off-by: MarioCadenas <[email protected]>
…age names - A design page now renders inside its own error boundary, and readiness is reported only from a successful render; a hot edit that throws shows the error and leaves /design not ready (the file changed, no good paint). - pages/index.tsx and pages/__*.tsx are no longer routed or listed: 'index' collided with the root page in the router, and '__' prefixes the plugin's own /design/__status endpoint. - The page entry's virtual id ends in .mjs so the React plugin doesn't inject Fast Refresh code that imports it by id. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
…to render The page's error boundary now reports a caught render error to /design/__status, which clears the recorded paint. Readiness used to track only index.tsx's mtime, so a broken edit to an imported component left it ready. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
- Readiness now waits, after a successful render, for web fonts, no Suspense fallback on screen, no page fetch in flight, a 300 ms quiet DOM window and two frames; automatic waits are capped at 10 s. A fetch finishing or a Suspense reveal restarts the quiet window, so data that arrives and then renders (a chart's bars) is included. Never while the placeholder or an error is showing. - New useDesignReady(ready) in @databricks/appkit-ui/react/beta holds readiness back explicitly (no time limit) for content the page can't detect; a no-op outside /design. - Docs, tests and the template starter comment updated. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
- In development, with builderOrigin set, the design plugin adds a small
script to the app's own pages (not /design). Once a page has settled (the
same waits as design readiness, including useDesignReady), and again after
client-side navigation and hot updates, it posts
{ type: "appkit:app-ready", version: 1, path } to the embedding builder,
never while an element with data-appkit-template-home is on screen.
- The app template's default HomePage carries data-appkit-template-home, so
a builder can also recognize it directly.
- The settle logic is shared between the design entry and the app script.
- Docs and tests updated.
Co-authored-by: Isaac <[email protected]>
Signed-off-by: MarioCadenas <[email protected]>
…ppkit-ui
- In development the design plugin serves drafts/<name>.html at
/design/drafts/<name>, streamed while the file is still being written
(ends at </html> or after 8 s unchanged); editing a finished draft reloads
it, without needless reloads for content already streamed.
- One hydrator is injected into every draft: it renders each
<script type="application/json" data-appkit="..."> block with the real
appkit-ui component as soon as its JSON is complete (MutationObserver +
JSON.parse), in a shadow root styled with the app's CSS; no CDN, no
network. Allowlist: BarChart, LineChart, AreaChart, PieChart, DonutChart
(compact {x, series} or native chart props), DataTable (Table
primitives), KpiCard (Card parts).
- A block that can't render shows a "Couldn't render" placeholder and is
reported in GET /design/__status (drafts[].errors, per draft version) and
as appkit:draft-error v1 to the builder origins.
- design-ready / app-ready unchanged. Docs, tests and template README.
Co-authored-by: Isaac <[email protected]>
Signed-off-by: MarioCadenas <[email protected]>
…k schema - Draft blocks got light theme tokens in dark mode: :root:not(.light) was rewritten to :host:not(.light), which never matches in a shadow root, so charts drew dark legend text on dark drafts. It now becomes :host(:not(.light)). The resolved tokens are also copied to the draft's root at the lowest priority (:where(:root)), where appkit-ui charts read them, and re-synced when the system scheme changes. - The hydrator core is now runHydrator(), embedded via toString() like normalizeBlock; jsdom tests run it and assert the appkit:draft-error v1 messages (builder origin only), the /design/__status POSTs and the placeholders; middleware tests assert GET /design/__status lists them per draft version. A __name shim keeps the embedded code working when the server runs under tsx. - JSON Schema of every allowed data-appkit component, with examples, at GET /design/__data-appkit.schema.json (linked from /design/__status as blockSchema); tests keep it in sync with normalizeBlock. Docs list the exact required and optional props. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
…arams date_format(ts, "yyyy-MM-dd'T'HH:mm:ss") was read as parameters :mm and :ss: the type generator only protected single-quoted literals and comments, and the analytics runtime used a bare /:(\w+)/ regex. Both now share one extractor (utils/sql-parameters.ts) that skips single- and double-quoted literals (with '' / "" / backslash escapes), backtick identifiers, line comments and :: casts. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
…ped block schema
- /design/__status: `ready` still requires a browser to paint /design
(documented); new `compiled` (the index page and its imports build,
checked server-side via transformRequest), `compileError`, `waitingFor`
("index" | "placeholder" | "compile" | "paint" | null) and `placeholder`,
so an agent can wait without a browser.
- /design/drafts/theme.css: the template's theme tokens (appkit-ui CSS
variables, light and dark via prefers-color-scheme, plus .dark) and
zero-specificity body colors, for drafts to link instead of inlining.
- The data-appkit props schema (one example per component) ships as
@databricks/appkit-ui/design/components.schema.json, generated by
tools/generate-design-schema.ts; a test fails when it drifts.
- appkit-ui: chart `data` accepts interface-typed and readonly rows
(ChartDataInput), and a ChartRow type with an index signature is exported.
- Template vitest inlines @databricks/appkit-ui and echarts-for-react, whose
extensionless ESM imports Node can't load, so chart imports work in tests.
Co-authored-by: Isaac <[email protected]>
Signed-off-by: MarioCadenas <[email protected]>
transformRequest only compiles the module it's given, so a syntax error in a component the index imports still reported compiled: true and waitingFor: "paint". The status now compiles the index and every app module it imports, transitively (node_modules and virtual modules skipped), and compileError names the failing module. Tested against a real Vite dev server. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
MarioCadenas
force-pushed
the
work/1-design-plugin-dev-only-design-
branch
from
October 29, 2026 17:00
88f8350 to
407f007
Compare
Collaborator
Author
|
Review 22 · Pass Does the change do what the task asked? Yes. Gate: major and worse must be fixed. F23 is fixed. compileGraph now runs transformRequest on the index module and then walks the module graph breadth-first, transforming every local script import. It skips node_modules and virtual modules, stops at 500 modules, and names the failing file. The new tests run against a real Vite server and pass, and nothing else in the design suite broke. No findings. |
Charts rendered at a fixed 300px by default and overflowed shorter cards. Without a height prop a chart now fills its parent's height (height: 100%) with a 160px minimum for parents sized by their content; an explicit height still sets an exact size. Applies to the chart, its wrapper and the loading / waiting states. Docs and tests (including jsdom sizing checks). Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
…and a stable URL - Hydrator: a data-appkit block still streaming in shows a skeleton (sized by kind), replaced in place by the rendered component with a 200 ms fade-in; both off with prefers-reduced-motion. - /design/drafts/__hydrator.js?draft=<name> is a stable URL for the hydrator, and /design/drafts/theme.css for the theme, so an app builder can include them in drafts it streams itself. Both are listed in /design/__status. The plugin's endpoints and Vite's module CORS allow the configured builderOrigin; the hydrator posts to its own origin (not via new URL(path, import.meta.url), which Vite rewrites to /@fs/...), and errors of drafts without a file are listed as streamed drafts. - Fix: react-router for /design pages is detected with Vite's resolver and must be 7+; Node's require.resolve could find a hoisted react-router@5 and the page then never rendered. - Docs and tests (incl. a parse check of the generated hydrator). Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
Collaborator
Author
|
Review 24 · Fail · 1 major Does the change do what the task asked? Yes. Gate: major and worse must be fixed. The design plugin code in this round holds up: the 82 design tests pass, including the streaming, skeleton and hydrator-parse tests, and the workspace typecheck is clean. But the browser demo handed to the human does not render. Its hand-written Vite server leaves out appkit-ui's @/js alias, so every component import fails with a Vite error overlay, and the agent says it never opened the page in a browser. Required
|
The drafts folder was added to Vite's watcher. A changed .html file matches no module, so Vite sent a full reload, and in middleware mode (how the server plugin runs Vite) that reloads every open page on each write: a draft mid-stream restarted and the app reloaded too. Drafts are now watched with fs.watch, and only the appkit:draft-changed notice is sent. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
Collaborator
Author
|
Review 25 · Pass Does the change do what the task asked? Yes. Gate: major and worse must be fixed. F24 is fixed. The streaming demo at localhost:5199 now shows the full Trips dashboard (KPI cards, bar chart, table), with no Vite error overlay, no console errors and a single page load. The tests for the draft-watcher fix pass. No findings. |
ECharts advances its entry animation on animation frames, which the browser
pauses in hidden or background frames, such as a builder's preview. The axes
and labels were drawn while the series stayed frozen part-drawn or empty
(a blank line, a donut without its ring, a bar chart without bars). Charts
now draw their final state at once; options={{ animation: true }} turns the
animation back on.
Co-authored-by: Isaac <[email protected]>
Signed-off-by: MarioCadenas <[email protected]>
…undle
The check for react-router 7 resolved it through Vite, which returns the
pre-bundled node_modules/.vite/deps/react-router.js. That folder's
package.json has no name, so the check failed, the page entry was built
without a router, and a page using <Link> crashed ("Cannot destructure
property 'basename'") and never painted. It now uses Node's resolution from
the design page, which finds the app's own copy.
Co-authored-by: Isaac <[email protected]>
Signed-off-by: MarioCadenas <[email protected]>
…, render once - A block alone in its element fills that element's height, so an agent's sized box sizes the chart (it rendered at the 160px minimum). Next to a heading it keeps its own height and stays inside the card. - A chart's title is a heading above the chart instead of ECharts' title, which was drawn over the axes and legend. The schema says to leave it out when the container has its own heading. - A block that has rendered is never mounted again, also when the hydrator runs twice, and a block re-parsed with the same JSON doesn't fade in again. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
Collaborator
Author
|
Review 26 · Pass · 1 trivial Does the change do what the task asked? Yes. Gate: major and worse must be fixed. The round-17 fixes are in: charts default to animation:false and options can turn it back on, the react-router check now uses Node's resolver, and draft blocks size to their container with the title rendered as a heading. The design plugin, the ui-only template and the tests are all present, and the design and chart suites, typecheck and lint pass. I could not reproduce the hidden-iframe chart freeze in a real browser here. Not required (below the gate)
|
This reverts commit 509a53f. With the entry animation off, the first click on a chart was lost on the playground's metric views page (only a second click selected the bar), failing its integration test. Frozen part-drawn charts only stay frozen while the browser keeps animation frames paused (a background or occluded window); they finish when frames resume. Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
Co-authored-by: Isaac <[email protected]> Signed-off-by: MarioCadenas <[email protected]>
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
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.
Adds a dev-only
design()plugin (beta) that serves design pages at full size, and an emptyui-onlyapp template (server + design) for quick PoCs.What it does
/designrenders the default export ofclient/src/design/index.tsx./design/<name>rendersclient/src/design/pages/<name>.tsx. Each page renders on its own at full size with the app's styles (client/src/index.css) and hot reload. Anything else under/designreturns 404.react-router(the template ships it), design pages share a router whose basename is/design, so<Link to="/orders">stays at/design/orders. The requested page is imported directly and other pages load only when navigated to, so an unfinished draft breaks only its own URL.GET /design/__statusreturns{ ready, pages }.readymeansclient/src/design/index.tsxexists, isn't the template placeholder (export const designPlaceholder = true), and has painted since it last changed. After first paint (and after each hot update), the page posts{ type: "appkit:design-ready", version: 1, page, pages }towindow.parent(elsewindow.opener), only to the configuredbuilderOrigin(bare origins only;"*"is rejected).index.htmland the/designpage declarecolor-scheme: light dark; the theme already followsprefers-color-scheme.data-source="file:line:col"attributes, so the app builder's own element inspector can map a click back to source. The plugin has no picker or selection store of its own./designreturns 404. The manifest is deliberately notdevOnly: a dropped plugin couldn't claim/design, and the SPA fallback would serve the app'sindex.htmlfor it with a 200.vitePlugins()method. That's how the design plugin serves its pages.ui-onlyentry intools/generate-app-templates.ts(features:design), a gatedclient/src/design/index.tsxsample page, and a README line.How I checked it
/designand/design/ordersrendered their pages full size withdata-sourceattributes, and no page errors./design/missing,/design/a/band/design/orders.tsxreturned 404, and/api/design/selectionreturned 404 (no API)..jsx, missing pages, paths outside/design) and the production 404.pnpm build,pnpm docs:build,pnpm -r typecheck,pnpm check, knip andpnpm test(312 files) all pass. The bundle baseline is refreshed.Not done
ui-onlywasn't generated withdatabricks apps init(needs the CLI and network); only the template files changed.Task: KIT-1 (app-kit/1)
This pull request and its description were written by Isaac.