skill
Adom UI Design System
Public Made by Adomby adom
How the AI builds and tests interfaces people love to use in Adom. Ships as one installable skill that bundles focused skills (tooltips, floating-windows, toasts, responsive-ui, app-shell, ai-driven-apps, clickable-paths).
← Commit history
2.1.1: the adoption checklist - deleting the hand-rolled panel is what breaks pages, not mounting the module
3 files changed
+32−2
assets/module/newbie-panel.js+1−1@@ -428,6 +428,6 @@ return { ok: ok, rows: rows }; } - root.AdomNewbiePanel = { mount: mount, toast: toast, selfCheck: selfCheck, version: '2.1.0',+ root.AdomNewbiePanel = { mount: mount, toast: toast, selfCheck: selfCheck, version: '2.1.1', TWO_COL_MIN: TWO_COL_MIN, PHRASE_BUDGET: PHRASE_BUDGET }; })(typeof window !== 'undefined' ? window : this);
package.json+1−1@@ -1,6 +1,6 @@ { "slug": "adom-ui-design",- "version": "2.1.0",+ "version": "2.1.1", "type": "skill", "description": "The Adom UI Design System plus a bundle of focused UI skills (tooltips, floating-windows, toasts, responsive-ui, app-shell, ai-driven-apps, clickable-paths, dark-default, input-feedback, settings-layout). One install drops the whole set of skill files onto your container, plus shared icon assets (the settings cog) so every Adom app draws the same glyph.", "dependencies": {},
skills/newbie-panel/SKILL.md+30@@ -147,6 +147,36 @@ Version sizes are a second, cheap check: 2.0.1 was 120202 bytes and 2.0.2 was 19 release that claims to add a 100KB module and does not grow is not carrying it. Deprecate the broken versions rather than leaving them installable. +### The adoption checklist, from seven apps that did it in one afternoon++Deleting your hand-rolled panel is the part that breaks pages, not mounting the module.++1. **GREP FOR HANDLERS BOUND TO IDS YOU JUST DELETED.** kicad removed its panel markup, which+ removed `#btnDemo`, and a surviving top-level `$('#btnDemo').onclick = ...` threw on null+ and killed the ENTIRE boot script. No panel, no status pills, no surfaces, and the page+ looked "empty but fine". It cost several cycles chasing the module for a fault in the+ page. **The tell that splits it in half in one query: check whether the page's OTHER boot+ steps ran.** Zero status pills means the boot died; pills but no panel means the mount+ failed. Two different bugs, and they look identical on screen.+2. **DO NOT MAKE THE PANEL WAIT ON AN API CALL.** Phrases are static config. kicad's first+ wiring fetched them from its own API, which at first paint runs before the target is+ resolved, returns empty, and renders no panel at all. Inject them at serve time+ (`window.__SAY_PHRASES__`) and mount synchronously. **Any app that fetches its phrases has+ a boot race whose symptom is exactly "a panel with no prompts in it"**, which is the same+ thing lbr's empty right column looked like from the outside.+3. **A SLOW `<script src>` yields the same empty panel**, so poll briefly for+ `window.AdomNewbiePanel` rather than giving up if it is absent on the first tick.+4. **Delete, do not layer.** A shared `.btn` declared after the module's rules is how one app+ lost its teal demo button to source order twice while its source read as correct. The+ apps that adopted cleanly reported what they removed by name and then asserted the old+ selectors return nothing: pup checked `.nbband` false and `table.prompts` false on the+ EVALUATED template rather than in the source; project-manager checked that `say-row`,+ `demo-btn`, `nbSetOpen`, `nbRender` and `sayCopy` all have zero matches left.+5. **Hash the bytes you actually SERVE**, not the ones you vendored. nb's first mount was+ correct only by luck: it fetched from the repo while the pack was empty, so its bytes+ happened to be right while the install path was broken. `curl` your own route back and+ compare its sha256 to the pack's.+ ### Prove it in one call ```js