shadcn.io is not affiliated with official shadcn/ui
Investment Advisor Chat Block for Solid
A planner's client chat with an allocation card: a stacked bar of five holdings, a Cautious, Balanced or Growth target, and a table of what to sell and buy in whole cents, marked as example figures and not advice.
Installation
Overview
Walk a client through a portfolio, with this investment advisor chat for Solid with Ark UI. A hairline frame with a plus mark on each corner holds a window of fixed height for Kestrelcap, an advice firm: the top bar names the planner, Gwendolen Sarsfield, and the log is a day label, a few runs of Message and Bubble rows and one allocation card from her. The card draws your five holdings as a stacked bar of foreground weights with the share of each beside it, and a Toggle Group of Cautious, Balanced and Growth sets the target: the table under it lists what to sell and what to buy for each holding, in whole cents that add up exactly, with the sells equal to the buys. The card and the top bar say in words that the figures are an example and not investment advice, and nothing is traded. Replies come from a typed script after a Typing Indicator Text, and the composer's Shine Button is the only colored control. It's the starting point for an advice portal, a robo-adviser or a client review.
FAQ
What stays in the page, and how do I make it real?
All of it. The holdings, the three target profiles and the planner's replies are typed in the file, nothing is traded, and no model runs, as the line under the composer says. To wire it for real, replace the typed HOLDINGS with your client's positions, keep the largest-remainder helper so shares and targets add up to the cent, and send the composer's text to your advisers where the code says so.
How do the shares and the trades add up exactly?
Every amount is an integer number of cents. The shares beside the bar and the target values for each profile come from one helper that gives each holding the whole part of its share and then hands the leftover units to the largest remainders, so the percentages total 100 and the targets total the portfolio to the cent. Because the targets add up to what you hold today, the amounts to sell always equal the amounts to buy.
Is this investment advice?
No, and the block says so in three places: a Badge in the card, a line under the table and the top bar. The portfolio, the profiles and the replies are made up for the demo. A real advice product needs its own suitability checks and disclosures, so treat the wording here as a starting point for yours.
How do I change the profiles?
Edit the targets list on each holding: three whole percents, in the order Cautious, Balanced and Growth, and each profile's column should total 100. Add a profile by adding an entry to PROFILES and one more number to every holding.
Is it usable with a keyboard and a screen reader?
The log is a focusable region announced as a log, and every message starts with a hidden name and time. The bar is one image with a text label listing every share, the table has a caption and row headers, and the profile switch is a labelled group whose pressed state is announced. Choosing a profile writes the new total to the status line under the composer. The send button, the switch and the reply buttons all take the keyboard, and sells and buys are words, never colors.