F1 component kit/Forms and editing/Money input · wallet before → afterPhone

Money input · wallet before → after

F1 variant13 · money-input

Signed money with its currency: Debit (the default, as on the ticket wallet box) or Credit, the settlement currency, and the wallet balance before → after. A debit can never take a wallet below zero.

Covers: money-input primitive, money-input designer. Exports: MoneyInput.

Whole page:CompactComfortableLaravel · navyDTC · midnight green
AnatomyStatesDensityEN · 中文Edge casesContract

Anatomy

The component as it sits in the product: English, compact, real data shapes.

USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00

States

7 states, left to right, top to bottom. A mock poll never finishes, so each state is drawn on purpose.

debit · before → after
USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00
credit
USD28.00
Atelier North · walletUSD 1,240.00
This credit+ USD 28.00
Resulting balanceUSD 1,268.00
focus
USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00
empty
USD0.00
Settles in USD (Atelier North’s settlement currency).
over the balance
USD2,000.00
More than the wallet holds (USD 1,240.00). Debits cannot take a wallet below zero.
balance loading
USD28.00
disabled
USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00

Density

Compact (2b ultra, the default) and comfortable, side by side. Same markup, only the density tokens change.

compact · default · data-density=compact
USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00
comfortable · data-density=comfortable
USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00

English · 中文

Staff pick en or cn (T001 Q25). Labels arrive localised; CJK falls back to PingFang SC / Noto Sans SC.

en
USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00
中文 · lang=zh-Hans
USD28.00
Atelier North · 钱包USD 1,240.00
本次扣款− USD 28.00
结果余额USD 1,212.00

Long string · permission denied

The long-string case (PL-063) and what a role without the permission sees (the server decides; T003).

long string
USD98,765.43
Atelier North · walletUSD 1,234,567.89
This debit− USD 98,765.43
Resulting balanceUSD 1,135,802.46
permission denied
Not available to your roleWallet changes need wallet. Ask a full admin to grant it.
Atelier North · walletUSD 1,240.00

Both apps

One @rj/admin-kit component, two themes: the Laravel admin (navy pinned) and the DTC admin (kit v4 Midnight green), by token swap only.

Laravel admin · :root
USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00
DTC admin · data-theme=dtc
USD28.00
Atelier North · walletUSD 1,240.00
This debit− USD 28.00
Resulting balanceUSD 1,212.00

Contract

The @rj/admin-kit API for this family. Mirrored in CONTRACT.md.

Export
MoneyInput · @rj/admin-kit
Props
amount (minor units) · currency · direction debit|credit · balance · min/max
States
empty · focus · valid · over-balance · loading · disabled · read-only
shadcn / Radix
Input + Select (currency) + ToggleGroup
Package underneath
react-hook-form · zod · Intl.NumberFormat
Accessibility
label states the currency; the resulting balance is a polite live region
API operations
admin.billing.wallets.show · admin.billing.wallets.transactions.store · admin.tickets.wallet-transactions.store · admin.billing.surcharges.update
Phone variant
read-only preview; writes stay desktop
Permission
wallet