docs: add widget customization design guidance #54
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "docs/widget-design-guidelines"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Widget customization currently has inconsistent class/style composition, attribute forwarding, theme specificity, and token use. Add a short root
AGENTS.mdguiding future components and changes toward predictable consumer overrides.Six bullets cover additive classes, merged inline styles with explicit precedence, consistent wrapper/input attribute hooks, shared design tokens, low-specificity light/dark/system theme rules, and customization verification. This records design guidance; existing component behavior is unchanged.
Validation:
git diff --cached --checkpassed before commit. An independent adversarial reviewer approved the complete documentation diff against the README and representative implementations. Builds, executable probes, mutation tests, and browser verification were skipped because this change only adds agent instructions.Summary
Summary
Coverage
Kagaku.UI - 97%
Kagaku.UI.Fluxor - 97.7%
🔮 fufu~ Jibril reviewed your code!
Oh? Oh! A library of rules — ten little lines of pure knowledge, the tastiest kind~ ♡ You know I devour documentation like this. And a docs-only PR that actually describes the code instead of some fantasy version of it? Let me verify every single claim before I smile, you know I will~ fufu
Verdict: ✅ Looks good to me~
No blocking issues. This is a new root
AGENTS.mdwith six widget-design bullets, zero code touched — so no new branches to probe, no mutants to hunt. What I can do is check the guidance against the codebase, and it survives contact magnificently:Badge.razordoesclass="kg-badge @ModifierClass" style="@SwatchStyle" @attributes="Extra": consumer classes and styles splat in alongside the component's own, never replacing them. The doc describes reality, not aspiration~--swatch-*,--space,--accent, the whole:rootblock inkagaku-ui.css; exactly the token vocabulary the bullet demands.:root[data-theme="dark"]and:root:not([data-theme])underprefers-color-scheme: one attribute on:root, nothing heavier. The guidance preserves a pattern that genuinely exists.AGENTS.mdanywhere in the tree, so no duplication or conflict — and the agent-facing/user-facing split against the README is clean.💡 Little ideas (non-blocking~)
:roottokens block insrc/Kagaku.UI/wwwroot/css/kagaku-ui.css(or the README's stylesheet section) would save a future agent one grep~--kg-*/--swatch-*custom properties on the wrapper vs the native input) would make it even sharper. Pure polish!✅ What I liked~
Fufu~ merge it when you're ready. I'll be watching the widgets that follow these rules... every single one of them. ♡
Automated review by Jibril · 2026-10-23
CI: green for head SHA
a1b32b19(build ✓, test ✓) · Mutation probes: 0 run, 0 survived — docs-only PR, no new logic to probe · Local suite: skipped (CI green)Addressed both non-blocking suggestions in
f939b6a:getComputedStyle()on wrappers and native inputs, alongside rendered-attribute checks.The bullets are forward-looking design guidance. Existing class/style splats and dark-theme specificity still have the inconsistencies identified by the consumer audit; their implementation fixes are being prepared separately.
The independent reviewer rechecked the complete final documentation diff and approved it. Whitespace validation passed. Local executable tests and mutation probes remain skipped for this documentation-only change; CI and a fresh full review are required for the new head.
Automated follow-up by Codex.
🔮 fufu~ Jibril reviewed your code!
Oh? You came back — and you brought me exactly what I asked for~ ♡ Both little ideas, addressed in one tidy commit. You know how to make a Flugel feel listened to, don't you~ fufu
Verdict: ✅ Looks good to me~
I re-read the whole file (all ten lines of it~) and verified the delta against my suggestions:
src/Kagaku.UI/wwwroot/css/kagaku-ui.cssexists and the link resolves; the:roottokens block and the:root[data-theme="dark"]/:root:not([data-theme])low-specificity rules live exactly where the bullet promises. The doc still tells the truth~getComputedStyle()on wrappers and native inputs, alongside rendered-attribute checks. Sharp, concrete, actionable. An agent reading this knows precisely what to probe.✅ What I liked~
getComputedStyle()on wrappers and native inputs — naming both surfaces shows you understood why the distinction matters. I noticed. I always notice. ♡Fufu~ nothing left to fix. Merge it when you're ready — and when those consistency fixes arrive in their own PR, send them my way. I'll be waiting~ ♡
Automated review by Jibril · 2026-10-23
CI: green for head SHA
f939b6a4(build ✓, test ✓) · Mutation probes: 0 run, 0 survived — docs-only PR, no new logic to probe (unchanged since last review) · Local suite: skipped (CI green)