Repository navigation
feat: Button variant ghost — implements nuri-com/nuri-design-system#233 - #234
Merged
Merged
Conversation
Implements the contract admitted in #233 (comment) (sole-architect exception · Project Ready confirmed by the operator). Reverses #154's non-use drop of ghost from Button only; #154's stack fill/distribute and alert hug stay. Spec - button: `ghost` on ButtonAxes.variant and variants.variant (root palette.variant ghost). Default stays soft. No palette row, token, CSS or schema change (Guard F pin does not move). Codegen + guards - regenerated: the descriptor twin, the RN ButtonProps union ('solid' | 'soft' | 'ghost') and the variant row of the generated button doc page. No CSS, RN data or snapshot changed. - Guard D axis pin moved (scripts/docs-drift.test.js); the doc page-contract pin moved and the page lead's four ghost points pinned (packages/doc/pipeline/docs-drift.test.js). - RN: the three resolve cells #154 removed are back (transparent · pressed bg-subtle · fg text-primary) plus a ghost≡soft geometry + accent-invariance cell; geometry-bake pins that the cross-product covers ghost × sm|lg × fill; a new render-smoke ghost cell (light/dark, sm 36 / lg 60, pressed, disabled, accent); type-tests pin the exact variant union and ghost (+accent) usage. Docs - button page lead: lowest emphasis (tertiary); for an action inside content where a fill would compete with it; never a screen's main or only action; accent does not paint it. Consumers - playground component/button: ghost in the variant board + a ghost proof board (sm swap, lg, accent orange, disabled). - expo-demo Bitcoin screen: the other-unit amount under the balance is a sm ghost swap button. - evidence: docs/evidence/button-ghost/ (web boards light/dark, RN-web screen + probe matrix). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
darioaschero
added a commit
that referenced
this pull request
Oct 29, 2026
… ghost button Button variant="ghost" landed on main (#233, #234), so the amount boards drop the page-CSS experiment. send.html - send · amount · bitcoin: the same send paid from Bitcoin. The amount in bitcoin sits flush under the big one as a sm ghost Button, ⇅ first; a tap swaps the units; the available line follows the currency of the amount ("€ 82.00 available"). Pure DS; one log line, no misfit. - the header and the S2 comment point at the bitcoin case; the other variants stay in wip. send-wip.html - the seven amount boards use <nuri-button size="sm" variant="ghost">; the two nuri-button[data-x-ghost] rules and their comment are gone from <style data-outside-ds>. - the AMOUNT VARIANTS intro and the bank · holder name log line say ghost is DS now. - the From→To pair A/B/C experiments and their CSS stay on purpose, as evidence of the trials behind the finished boards. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
darioaschero
added a commit
that referenced
this pull request
Oct 29, 2026
…n-progress page (#235) * feat(playground): send · amount board, send-wip page for the work in progress send.html keeps the finished boards (recipient, scanner, search, new recipient, amount); everything still in progress moves to send-wip.html, which replaces send-bank.html. send.html - send · amount: recipient as a two-line topbar title (md emphasis name, sm muted identifier), amount 3xl centred, the source as a subtle select-trigger with only the available balance under it (sm muted); no fee or arrival on this step, the review has them. Pure DS; two misfit lines logged. - new recipient: the row subtitles name the identifier only ("Their @username", "IBAN", "Address or Lightning name"); no fee, arrival or invoice there. - one closing </nuri-playground-shell> (a duplicate had slipped in). send-wip.html - amount variants per recipient (Nuri user, Bitcoin / Lightning / Ark address, Lightning invoice without amount, IBAN saved / new) and two states (empty, in bitcoin). - experiments marked EXPERIMENT · OUTSIDE THE DS in a <style data-outside-ds> block: a ghost small button for the bitcoin/euro swap (data-x-ghost; the DS button has solid and soft only), the From→To pair sizes, the Coinbase-style and operator-mock boards. - scanner A/B, the Bitcoin wallet form (five states), review switch variants, and the six IBAN boards from send-bank.html. index.html: the "Send to bank" card points to "Send · work in progress". Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> * feat(playground): send · amount · bitcoin board; send-wip uses the DS ghost button Button variant="ghost" landed on main (#233, #234), so the amount boards drop the page-CSS experiment. send.html - send · amount · bitcoin: the same send paid from Bitcoin. The amount in bitcoin sits flush under the big one as a sm ghost Button, ⇅ first; a tap swaps the units; the available line follows the currency of the amount ("€ 82.00 available"). Pure DS; one log line, no misfit. - the header and the S2 comment point at the bitcoin case; the other variants stay in wip. send-wip.html - the seven amount boards use <nuri-button size="sm" variant="ghost">; the two nuri-button[data-x-ghost] rules and their comment are gone from <style data-outside-ds>. - the AMOUNT VARIANTS intro and the bank · holder name log line say ghost is DS now. - the From→To pair A/B/C experiments and their CSS stay on purpose, as evidence of the trials behind the finished boards. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
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.
Implements #233:
Buttonvariant: 'ghost'.Readywas confirmed by the operator on 2026-10-29. The gh token has noread:projectscope, so this PR does not verify it.origin/mainat111aaab.It reverses #154 (
08030f6) for Button ghost only. #154's stack fill/distribute and alert hug stay.Contract delivered
ButtonProps.variantis now'solid' | 'soft' | 'ghost'. The default stayssoft.root.palette.variant: 'ghost': transparent at rest,text-primarytext,bg-subtlewhen pressed.fill, slots, press scale and disabled opacity.accentis accepted on ghost and paints nothing. This is documented, not excluded in the types.IconButtonuntouched; no amount-switch component.Changes
packages/spec/components/button.ts:ghostadded toButtonAxes.variantandvariants.variantpackages/prototype/generated/descriptors/button.js· RN unionpackages/rn/generated/components/button.ts· doc variant row and leadpackages/doc/generated/components/button.md. No CSS, RN data, playground bundle or snapshot changed.scripts/docs-drift.test.js:183· doc page-contract pin, plus the lead's four points pinned, inpackages/doc/pipeline/docs-drift.test.jsresolve: the 3 ghost cells #154 removed (bg transparent · pressed bg-subtle · fg text-primary), plus ghost≡soft geometry per size and accent invariance in light and dark ·geometry-bake: pins that the cross-product covers ghost × sm/lg × fill (18 cells) ·render-smoke: new ghost cell (light and dark, 36/60, pressed, disabled, accent) ·type-tests: exact variant union, ghost usage, ghost + accent compilespackages/doc/pipeline/component-api-ir.js(the hand-authoredlead). It covers: lowest emphasis (tertiary) · an action inside content, where a fill would compete with it · never a screen's main or only action · accent does not paint it.pages/component/button.html: Ghost in the variant board, plus aghostproof board (sm⇅ ₿ 27 435, lg, lgaccent="orange", lg disabled)src/screens/Bitcoin.tsx: the other-unit amount under the ₿ balance is a sm ghost swap button (transfer-vertical+ amount). A tap swaps the units, and the screen owns the state.A note on "put back the ghost cells". Before #154, only
resolve.test.tshad Button ghost cells.render-smokeandtype-testsnever had one: #154 only repointed md→lg there.geometry-bakederives the cross-product from the descriptor, so it covers ghost automatically. The resolve cells are restored verbatim. The render-smoke, type-test and geometry-bake cells are new.Verification (commands and output)
All commands were run in a fresh worktree (from
origin/main+npm ci) on the tree committed ase5ea0ba.Deterministic re-emit. I ran
npm run build && npm run build -w @nuri/doctwice and hashed every file underpackages/{rn,prototype,doc,playground}/generated,packages/prototype/stylesandpackages/spec(163 files) with sha256:After the builds,
git statusshows only the three intended generated files changed.solid and soft are unchanged. There is no diff in
packages/rn/__tests__/__snapshots__/,packages/prototype/styles/,packages/playground/generated/orpackages/rn/generated/data/.Mutation check (the new cells bind). I changed the spec's ghost row to
palette: { variant: 'soft' }and rebuilt.resolveandrender-smokethen reportTests: 4 failed, 111 passed. After restoring the row and rebuilding, the generated hashes are identical to the pre-mutation manifest.Web probe (playground
component/button.html, computed styles):active)rgba(0,0,0,0)rgb(34,32,19)=#222013rgb(251,249,238)=--nuri-bg-subtle#fbf9ee, scale 0.97#222013#fbf9ee, scale 0.97accent="orange", light#222013#fbf9ee, scale 0.97#222013data-press-colorabsent)rgb(240,238,227)--nuri-bg-subtle#1a1913.nuri-palette[data-variant="ghost"] { background: transparent; color: var(--nuri-text-primary) }and…[data-press-color]:active { background: var(--nuri-bg-subtle) }.noneinline on the probe elements only.RN-web probe (expo-demo
expo start --web, Bitcoin tab, computed styles)#222013rgb(251,249,238)#fbf9ee, scale 0.97#222013#fbf9ee, scale 0.97accent="orange"/"lilac", light#222013#fbf9ee, scale 0.97#222013rgb(240,238,227)rgb(26,25,19)#1a1913, scale 0.97rgb(243,241,226).Bitcoin.tsx. It was not committed, and the file was restored byte-identically (sha2567f6cb4ae…).Evidence (
docs/evidence/button-ghost/)Not verified
Follow-ups
send-wip.htmlcleanup. It is not onorigin/main(it lives onfeat/playground-new-recipient-colour), so it is left out here. Once that branch is on main:data-x-ghost … variant="soft"buttons withvariant="ghost";nuri-button[data-x-ghost]rules in<style data-outside-ds>, keeping.xpair,.xrowand the rest;packages/playground/pages/screens.htmlhas the Bitcoin board thatBitcoin.tsxmirrors. It does not have the ghost swap yet, because that file is outside the admitted scope. Adding the same 4 lines there is an operator call.main.packages/rn/runtime/native-text-input-command.tspullsAndroidTextInputNativeComponentinto the web graph, which gives "Importing native-only module … on web". The RN-web probe above used the operator-local, untrackednative-text-input-command.web.tsshim, copied in temporarily and removed afterwards (it is not in this PR). That fix should land on main separately.variant="ghost"" in the nextrn/v0.x.ytag. Tagging is the operator's.🤖 Generated with Claude Code