ake/akefin-design-system
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
akefin-design-system/ui_kits/web/README.md
Alkim Ake Gozen 8b790b7601 first commit
2026-05-23 11:59:45 +09:00

1.5 KiB
Raw Blame History

Akefin Web Dashboard — UI Kit

A pixel-faithful recreation of the Akefin web dashboard following the design system in this project. Built from the brief's component inventory (the canonical akefin-design-system repo was empty at the time of generation — see root README.md).

What's in here

File Purpose
index.html Live, clickable prototype. Open this to see it.
App.jsx Top-level composition · routes between Review · Rules · Ledger · Import
Chrome.jsx Header (entity scope · search · status) + left rail navigation
ReviewQueue.jsx Compact list of staged transactions, sortable, selectable
Inspector.jsx Right-pane detail: account picker, ledger preview, approve/override/skip
RulesScreen.jsx Promote-suggested-rules view
LedgerScreen.jsx Per-entity account tree with balances
ImportScreen.jsx Import run status & history
Atoms.jsx Buttons, chips, badges, inputs, terminal frame
data.js Sample bilingual transactions, rules, accounts

Screens

  1. Review queue (default) — list of staged transactions on the left, inspector on the right.
  2. Rules — promote-suggested-rule cards.
  3. Ledger — account tree.
  4. Import — recent import runs and status.

Switch screens via the left rail. The entity scope (top-left of the header) filters everything below.

Caveats

  • Recreated from the brief, not from existing UI source. Iterate.
  • Korean payee strings are sample data, not a real Toss export.