refactor: wui-list-wallet component reskin #5246
Conversation
|
|
The latest updates on your projects. Learn more about Vercel for GitHub.
10 Skipped Deployments
|
There was a problem hiding this comment.
Pull Request Overview
This PR updates the wui-list-wallet component with a visual reskin that includes displaying available chains as icons, adding a chevron indicator, and removing the multichain badge. The changes align the component with updated design requirements.
- Adds chain namespace icons to wallet items with overlapping visual styling
- Replaces multichain badge with individual chain icons displayed on wallet items
- Introduces chevron icon on the right side of wallet items for better UX indication
Reviewed Changes
Copilot reviewed 7 out of 7 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/ui/src/layout/wui-flex/index.ts | Adds CSS text styling support to flex component |
| packages/ui/src/composites/wui-tag/styles.ts | Adds nowrap styling to prevent tag text wrapping |
| packages/ui/src/composites/wui-list-wallet/styles.ts | Adds CSS styling for namespace icons with overlapping effect |
| packages/ui/src/composites/wui-list-wallet/index.ts | Implements namespace icons rendering and chevron addition |
| packages/scaffold-ui/src/partials/w3m-list-wallet/index.ts | Adds namespace handling logic for multichain scenarios |
| packages/scaffold-ui/src/partials/w3m-connector-list/index.ts | Updates connector logic to support namespace icons instead of multichain badge |
| apps/gallery/stories/composites/appkit-wui-list-wallet.stories.ts | Updates story configuration to showcase new namespace functionality |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
📦 Bundle Size Check✅ All bundles are within size limits 📊 View detailed bundle sizes> @reown/[email protected] size /home/runner/work/appkit/appkit > size-limit |
Coverage Report
File Coverage
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Weird that visual regression test doesn't fail, will check that other than that looks good! |
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
Visual Regression Test Results ✅ Passed✨ No visual changes detected Chromatic Build: https://www.chromatic.com/build?appId=6493191bf4b10fed8ca7353f&number=240 |
…ith-multi-wallet-icons-and
github-merge-queue
bot
removed this pull request from the merge queue due to no response for status checks
github-merge-queue
bot
removed this pull request from the merge queue due to failed status checks
enesozturk
deleted the
enes/apkt-3969-update-wallet-selector-view-with-multi-wallet-icons-and
branch
Description
Updates
wui-list-walletcomponent with the recent design changes.multichainbadgeType of change
Associated Issues
For Linear issues: Closes APKT-xxx
For GH issues: closes #...
Showcase (Optional)
Checklist
Note
Reskins wallet list item, surfaces chain namespaces as icons, wires namespaces from connectors, and removes the multichain tag while adding a right chevron.
packages/uiwui-list-wallet:.namespaces: ChainNamespace[]prop and render chain icons (ETH/SOL/BTC) viaNAMESPACE_ICONS.wui-tag: prevent label wrapping withwhite-space: nowrap.packages/scaffold-uiw3m-list-wallet: import adapters, accept.namespaces, and forward namespaces when multi-chain adapters are present.w3m-connector-list:apps/gallerynamespacesarg; render with new component import.Written by Cursor Bugbot for commit e88c0a2. This will update automatically on new commits. Configure here.