https://ssicevs.com/assets/RolloutReviewPage-C0BR_Kg_.js

1import{r as h,j as t}from"./metal-fx-C6GZ_SKA.js";import{L as D}from"./LiveStage-BytPPZ53.js";import{B as A,a as N,C as I,d as B,F as P}from"./controls-lL6mtqqv.js";import{eG as d}from"./index-D1yBc__G.js";import"./library-loaders-BoDKt841.js";import"./Coins.es-O2p2Ug3t.js";import"./Cube.es-BSTNQXmI.js";import"./Lightning.es-DOeALmaQ.js";import"./PreviewLoader-bPoMLVZ_.js";import"./motion-BHwmuFpx.js";const E=JSON.parse('[{"slug":"price-scrubber","label":"Price Scrubber","tier":"showpiece","score":96,"why":"One of his four named exemplars: the line redraws on every timeframe and the header reads the cursor live.","mainFunctions":["scrub the line: crosshair, axis price tag and a wash ride the cursor while the header price, move and time update","switch 1D, 1W, 1M, 1Y, All: the line redraws from scratch and recolours green or red against the window open","scrub again on 1M to show the line turn red"],"release":"2026-10-05","videoIdea":"Open on the draw in, scrub slowly across AVGO, then flip 1D to 1M so the line redraws and turns red."},{"slug":"tape-flow","label":"Order Flow","tier":"showpiece","score":95,"why":"Order flow bars march left in real time; scrubbing reads any print with its buy and sell split.","mainFunctions":["point at it: every 400ms the bars slide a slot left and a new print rises at the right","scrub the bars: the price, change and time switch to that print with a buy and sell split","click a bar to pin it, then step the pin with the arrow keys","click the live toggle to pin the feed or pause it"],"release":"2026-11-06","videoIdea":"Let the BTC tape march for three seconds, scrub back through the prints, pin a big one and step it with the arrows."},{"slug":"order-book","label":"Order Book","tier":"showpiece","score":94,"why":"A live BTC ladder that flashes, merges price steps and lights cumulative depth to the pointer.","mainFunctions":["point at the book: the feed starts, sizes flash and depth bars ease every 600ms","hover a level: every level out to it lights and the mid row reads size and price to fill","click 0.5, 1, 5, 10: levels merge and the bars rescale","hover the balance rule: the bids and asks split reads and slides with the feed"],"release":"2026-10-12","videoIdea":"Rest on the book so the feed runs, walk down the bids to light depth, then step 0.5 to 10 so the levels merge."},{"slug":"returns-calendar","label":"Returns Calendar","tier":"showpiece","score":93,"why":"One of his four named exemplars: cells lift, spans compound live and year rows replay a pulse.","mainFunctions":["hover a month: it lifts with a ring, its row and column stay lit and a tooltip reads the return","click a month, hover another: the span stays lit and the tooltip compounds it live","hover a year total: that row replays a January to December pulse","click two year totals to compound whole years"],"release":"2026-10-19","videoIdea":"Sweep across the grid, anchor a month and stretch the span so the compounded figure counts, then pulse a year row."},{"slug":"automation-builder","label":"Automation Builder","tier":"showpiece","score":92,"why":"A trading rule written as sentences that runs step by step, edits in place and reorders by drag.","mainFunctions":["click Run simulation: rows light one at a time and the status ends on 1 order placed","click a value pill such as Good and pick Bad: the next run reads 0 orders placed","drag a row by its grip: it lifts and the other rows reorder","Add action, Undo and Redo step through every edit"],"release":"2026-10-09","videoIdea":"Run it once to 1 order placed, change Good to Bad and run to 0 orders, then Undo and run green again."},{"slug":"market-snapshot","label":"Market Snapshot","tier":"showpiece","score":91,"why":"Pull the block down to refresh: a dot ring spins and the new price slides into the line.","mainFunctions":["drag the block down past 64px: a ring of dots spins, a new price is appended and the line morphs","click 1D to All: the line morphs to the new window and the end dot glides","hover the plot: the dot rides the line and the header reads that point","click the Updated button for the same refresh"],"release":"2026-11-04","videoIdea":"Pull Amazon down with rubber band resistance, release to the spin and the new tick, then morph 1D to 1Y."},{"slug":"execution-controls","label":"Execution Controls","tier":"showpiece","score":90,"why":"A hold to confirm buy button with a full state machine: sweep, working, filled, und

1o.","mainFunctions":["press and hold Hold to buy 25 TSLA: a green sweep fills the button over 900ms","let go early: the sweep runs back","hold to the end: Working shimmer, then Filled at $178.52 on a green tint","click Undo while its hairline drains to reset"],"release":"2026-10-07","videoIdea":"Let go once halfway so the sweep runs back, then hold through to Filled at $178.52 and tap Undo."},{"slug":"range-navigator","label":"Range Navigator","tier":"showpiece","score":89,"why":"Brush and zoom: drag the window on the mini map and the detail chart rescales one to one.","mainFunctions":["drag the window on the mini map: the detail chart pans and the header price, change and dates follow","drag a grip at the window edge: the window narrows or widens and the chart rescales","hover the detail chart: rule, dot and axis tag with that day in the header"],"release":"2026-10-16","videoIdea":"Grab the window, pan across all 240 days of NVDA, then pinch it narrow with a grip and scrub the zoomed line."},{"slug":"approval-quorum","label":"Approval Quorum","tier":"showpiece","score":88,"why":"A $250,000 sign off: the last approval fills the meter green and unlocks Release.","mainFunctions":["click a Pending row such as Ops: its clock turns to a check and the meter fills","with three of three, click Release: the button washes green and every row locks","click an approved row to take the signature back off","hover a row: the others dim"],"release":"2026-10-26","videoIdea":"Sign Ops so the meter closes green and reads 3 of 3, then press Release and hold on Released."},{"slug":"series-spotlight","label":"Series Spotlight","tier":"showpiece","score":88,"why":"Twelve crypto lines as a wash; sweeping the chip rail makes the lit line jump thread to thread.","mainFunctions":["hover the chip rail: each token line previews in accent and the header swaps to its close and return","click a chip to commit it: the lit line draws on","click 1W, 1M, 3M, 6M: all twelve lines tween to the new scale","scrub the plot: rule, dot, axis tag and a card with close and return"],"release":"2026-10-28","videoIdea":"Sweep the rail BTC to NEAR so the lit thread jumps across the wash, commit SOL, then tween 1W to 6M."},{"slug":"leverage-ticket","label":"Leverage Ticket","tier":"showpiece","score":87,"why":"Leverage slider moves liquidation price, size and the room strip live; Long and Short flip it all.","mainFunctions":["drag the Leverage slider 1x to 50x: position size, liquidation price and the room strip update live","click Short or Long: the thumb slides, the pill tints and liquidation flips to the other side of entry","click Max: margin fills to the balance, and typing past it reads Insufficient USDC","click Details: a modal lists entry, size, fee and liquidation"],"release":"2026-10-21","videoIdea":"Drag leverage from 2x to 50x so the room strip shrinks to nothing, flip to Short, then hit Max."},{"slug":"fills-blotter","label":"Fills Blotter","tier":"showpiece","score":87,"why":"Fills land as Working and resolve in place to Filled or a red Rejected shake.","mainFunctions":["rest on the header: a fill slides in every 1.8s as Working, then flashes Filled or shakes Rejected","hover a row: arrivals pause and venue, fee and order id swap in","click the live toggle to pin the stream on or pause it"],"release":"2026-10-30","videoIdea":"Pin the feed live, let four fills land with one red Rejected shake, then hover a row to read its venue and fee."},{"slug":"alert-stack","label":"Alert Stack","tier":"showpiece","score":86,"why":"A collapsed alert deck that fans open on hover and dismisses with a wash, tick and fold.","mainFunctions":["hover the stack: the pile fans open into three rows on a spring","click a row X: Dismissed on a wash, then it slides out and the rest close up","dismiss all three, then click Restore alerts to bring them back","leave the stack: it collapses back into the pile"],"release":"2026-10-23","videoIdea":"Hover so the deck fans open, dismiss Margin at 82% then the rest, and restore them in one beat."},{"slug":"date-range-picker","label":"Date Range Picker","tier":"showpiece","score":85,"why":"Two month sheet where the run fills behind the pointer live, with presets and a sliding thumb.","mainFunctions":["click a day, then move across the sheet: the run fills behind the pointer and the footer counts days","click a second day to set the window: the band goes solid and the footer swaps","click 7d, 90d, Year to date: the thumb slides and the band jumps","click the earlier chevron: both months slide in through a blur"],"release":"2026-10-14","videoIdea":"Drop an end, drag the run across both months with the day count ticking, set it, then tap 90d and Year to date."},{"slug":"dialog-stack","label":"Dialog Stack","tier":"showpiece","score":85,"why":"A three step ETH withdrawal where each step lays a new card on the pile and Back pops it.","mainFunctions":["click Withdraw ETH: step one springs in","click Continue, then Address is right: a new card lays on top and the old one shrinks back","click Back or press Escape: the top card drops out and the pile settles","click Approve on step three: the whole stack closes"],"release":"2026-11-02","videoIdea":"Walk Withdraw 2.5 ETH through all three cards, step Back once to show the pile, then Approve."},{"slug":"market-heatmap","label":"Market Heatmap","tier":"core","score":84,"why":"One of his four named exemplars; a sweep makes the card jump tile to tile beside, never over.","mainFunctions":["hover a tile: the others dim and a card parks beside it with price, change and cap","click a tile to pin its card, click again or Escape to release","tab between tiles for the same readout"]},{"slug":"graph-comparison","label":"Graph Comparison","tier":"core","score":83,"why":"Build a comparison: add a series and every line rescales, remove one from its chip.","mainFunctions":["click + and pick MSFT, VIX or AAPL: a new line fades in and every line rescales","hover a chip: its line stays full and the rest dim","click a chip to remove its series","switch 1M to 1Y and scrub for a card ranked by move"]},{"slug":"performance-chart","label":"Performance Chart","tier":"core","score":82,"why":"Return against a benchmark where the green and red lead split tweens on every window.","mainFunctions":["click 1M to 1Y: both lines and the green and red split tween to the new window","open the benchmark menu and pick Nasdaq 100: the split moves to the new crossings","scrub the plot: 

1you and benchmark dots with the gap in a card"]},{"slug":"depth-chart","label":"Depth Chart","tier":"core","score":82,"why":"Mirrored scrub around the mid and a real log zoom on the reach pills.","mainFunctions":["scrub across: two rules sit mirrored around the mid and a card reads bids and asks to that distance","click 0.25%, 0.5%, 1%: the window and height scale zoom with levels entering at the edges","arrow keys widen or narrow the distance"]},{"slug":"candlestick","label":"Candlestick Chart","tier":"core","score":81,"why":"Ninety candles rise from their middles and the shared chart card reads OHLC per candle.","mainFunctions":["hover a candle: rules, close tag, the rest dim and a card shows open, high, low, close and volume","move across the run: the card flips side past 60% of the width"]},{"slug":"flow-bars","label":"Net Flow Bars","tier":"core","score":80,"why":"Drag a range of daily net flows and the bars flip sign through zero when paging.","mainFunctions":["drag across the plot: a band covers the run and a card sums the net for those days","hover a day: crosshair, axis tag and a card","click Earlier or Later: every bar tweens to the new page through zero"]},{"slug":"sankey-flow","label":"Sankey Diagram","tier":"core","score":79,"why":"Exchange cash flow where pointing a node lights its strands and reads its share.","mainFunctions":["hover a node such as Trading fees: its strands light and the line reads its share of the flow","click a node to pin the highlight, Escape to release","hover the Cash hub: everything lights and reads all of it passes through"]},{"slug":"positions-table","label":"Positions Table","tier":"core","score":79,"why":"Close on the row plays the full commit: wash, tick, Closed, slide and fold.","mainFunctions":["hover a row and click Close: green or red wash, tick, then the row folds away","click Market, Size, Liquidation or P&L heads: rows glide to the new order","close them all, then Reset brings the rows back"]},{"slug":"quick-ticket","label":"Quick Ticket","tier":"core","score":78,"why":"A watchlist row that unfolds into a ticket and folds back after Order placed.","mainFunctions":["click Buy or Sell on the NVDA row: the ticket unfolds on that side","step shares with minus and plus: the estimate updates","switch Market and Limit: the price row swaps at the same height","click Buy NVDA: Order placed with a drawn check, then it folds back"]},{"slug":"kanban-board","label":"Kanban Board","tier":"core","score":76,"why":"Cards spring across columns on their arrow and the counts update.","mainFunctions":["hover a card and click its arrow: it springs to the next column and both columns reflow","click Reopen on a Done card: it springs back to Backlog","hover a card: the others dim"]},{"slug":"wallet-drawer","label":"Wallet Drawer","tier":"core","score":76,"why":"The deepest component: tabs, AI chat on real figures, receive QR and settings that mask every figure.","mainFunctions":["switch Crypto, Watchlist, DeFi, Activity: the thumb slides and rows stagger in","click AI chat and a suggestion: answers computed from the wallet slide in","open Settings and toggle Hide balances: every figure masks","hover a row: the line below shows its worked formula"]},{"slug":"uptime-bars","label":"Uptime Bars","tier":"core","score":75,"why":"Ninety day bars where scrubbing reads every incident by name and severity.","mainFunctions":["scrub the bars: the day stays full and a card shows uptime, down time and the incident title","arrow keys step one day at a time, Escape clears"]},{"slug":"price-target-fan","label":"Price Target Fan","tier":"core","score":75,"why":"Three analyst projections fan out from Now and the nearest one redraws solid under the pointer.","mainFunctions":["hover the fan right of Now: the nearest target redraws solid and the header swaps to it","hover the history: crosshair and the price of that week","focus a target label for the same pick"]},{"slug":"total-balance","label":"Total Balance","tier":"core","score":74,"why":"Balance line that tweens between 24h, 1w, 1m, All and dims ahead of the cursor.","mainFunctions":["click 24h, 1w, 1m, All: the line and area tween and the header swaps","scrub: the line right of the pointer dims and a card shows balance, change and drawdown"]},{"slug":"swap-ticket","label":"Swap Ticket","tier":"core","score":74,"why":"A full token swap with a flip, live receive math, a Swapped state and slippage settings.","mainFunctions":["click the flip button: it rotates and the tokens trade places","type an amount: receive and worth compute, past the balance it reads Insufficient ETH balance","click Swap ETH for USDC: a check and Swapped","open a token chip or the gear for slippage"]},{"slug":"trade-tape","label":"Trade Tape","tier":"core","score":73,"why":"Time and sales that drops a print every 700ms with block trades tinted.","mainFunctions":["point at the tape: a print drops in at the top every 700ms and rows glide down","hover a print: the others dim while the stream runs","click the live toggle to pin or pause"]},{"slug":"top-coins","label":"Top Coins","tier":"core","score":73,"why":"A coin rail whose charts tween between windows and slide one column at a time.","mainFunctions":["click 1Y, 6M, 3M: every line tweens and prices swap","scrub a column chart: price becomes that week and the other columns dim","click the chevrons: the rail slides a column"]},{"slug":"macos-dock","label":"macOS Dock","tier":"core","score":72,"why":"Striking magnify and a command menu, but a dock reads off the trading positioning.","mainFunctions":["sweep across the dock: icons magnify around the cursor with a name tip","click an icon: it bounces","click Command K: a menu springs open, Copy link shows Copied"]},{"slug":"index-card","label":"Index Card","tier":"core","score":72,"why":"Index tabs morph the line from one shape to the next.","mainFunctions":["click S&P 500, Dow 30, Nasdaq, Russell 2K: the line morphs and the note swaps","scrub the line: the right side dims and the header reads level and time"]},{"slug":"dotted-area-chart","label":"Dotted Area Chart","tier":"core","score":72,"why":"Ink line over a dot field that splits lit and dim at the pointer.","mainFunctions":["scrub: the stretch left of the pointer stays lit, the rest dims, and the header reads that price and time"]},{"slug":"volume-profile","label":"Volume Profile","tier":"core","score":71,"why":"Volume by price with a gliding row wash and point of control references.","mainFunctions":["scrub up and down: a wash glides row to row with an axis tag","read the card: volume, delta, share and whether the row is inside the value area"]},{"slug":"equity-drawdown","label":"Equity & Drawdown","tier":"core","score":71,"why":"One crosshair across equity and drawdown, shading the run below the last peak.","mainFunctions":["scrub: one crosshair spans both panels with a card for equity, return and drawdown","scrub inside a drawdown: a red band shades back to the high water mark"]},{"slug":"project-index","label":"Project Index","tier":"core","score":70,"why":"Holdings list with a cover that follows the cursor and cross fades each ticker chart.","mainFunctions":["hover a row: a floating 1D price cover appears beside the cursor and the rest dim","move up and down: the cover follows on a spring and cross fades between tickers"]},{"slug":"model-comparison","label":"Model Comparison","tier":"core","score":69,"why":"Model table where a row and column fill glides after the pointer, on point for AI infra.","mainFunctions":["hover a cell: its row and column light and a card shows the value and how far behind best","move cell to cell: the fills spring after the pointer","click a cell to pin the card"]},{"slug":"swap-confirm","label":"Swap Confirm","tier":"core","score":68,"why":"Stock convert ticket whose button runs Link account, Linking, Placing states.","mainFunctions":["click Half or Max: the amount fills and receive updates","click Confirm: Placing shimmers, then the amount clears","flip the pair or pick a stock from a chip"]},{"slug":"heat-calendar","label":"Heat Calendar","tier":"core","score":68,"why":"Transaction calendar that narrows from 13 to 52 weeks in the same box.","mainFunctions":["hover a day: ring and the header reads its amount and count","click 3M, 6M, 1Y: the grid crossfades to more, narrower weeks","click a day to hold it"]},{"slug":"stacked-bars","label":"Stacked Bar Chart","tier":"core","score":68,"why":"Inference spend by model, each series lights across all twelve months.","mainFunctions":["hover a segment: that series stays full in every month and a card lists the month","hover a legend name: the headline swaps to that series total and share"]},{"slug":"watchlist-stack","label":"Watchlist Stack","tier":"core","score":68,"why":"Watchlist with add, row remove fold and sparkline scrub.","mainFunctions":["click + and pick a stock: a row is added","hover a row and click Remove: tick, Removed, the row folds away","

1scrub a sparkline: the price swaps to that moment"]},{"slug":"matrix-ticker-board","label":"Matrix Ticker Board","tier":"core","score":66,"why":"Dot matrix quotes dissolve and bloom per changed digit; canvas and a license check keep it out of video.","mainFunctions":["rest the pointer on the board: every 2.5s one row quote updates, changed digits dissolve and bloom back"]},{"slug":"file-tree","label":"File Tree","tier":"core","score":66,"why":"Repo tree with a gliding row highlight and branch lines that draw down.","mainFunctions":["click a folder such as data: chevron turns, children grow in and branch lines draw","hover across rows: one highlight glides between them","click a file to select it"]},{"slug":"sma-chart","label":"SMA Chart","tier":"core","score":66,"why":"Price with 20 and 50 SMA that updates the legend values as you scrub.","mainFunctions":["scrub: three dots and the legend values read that day","hover 20 SMA or 50 SMA: that average stays lit and the rest dim"]},{"slug":"agent-run-timeline","label":"Agent Run Timeline","tier":"core","score":65,"why":"Agent run steps that open their input and output; the running timer counts on point.","mainFunctions":["click a step: its tool, input and output open","point at the card: the Running step timer counts up","hover a step: the others dim"]},{"slug":"simple-chart","label":"Mini Price Chart","tier":"core","score":64,"why":"Quiet sibling of Market Snapshot: 1H, 4H, 1D morph and a scrub.","mainFunctions":["click 1H, 4H, 1D: the line morphs point for point","scrub the sparkline: dot and the header read price and time"]},{"slug":"cross-chain-swap","label":"Cross Chain Swap","tier":"core","score":64,"why":"Bridge ticket that picks token and network together, but no swapped state.","mainFunctions":["open a chip and pick a token on a network: label and route time update","click flip: the whole route turns around","type or click Max: the Get figure computes"]},{"slug":"new-items-pill","label":"New Items Pill","tier":"core","score":63,"why":"Scroll away and a New pill counts arrivals; click it to jump back.","mainFunctions":["scroll down inside the tape: a New pill appears and counts up","click the pill: it scrolls to the top and goes","point at the tape at the top: fills rise in"]},{"slug":"order-ticket","label":"Order Ticket","tier":"core","score":63,"why":"Spot ticket with percent pills and two way amount and total math.","mainFunctions":["click 25%, 50%, 75%, Max: amount and You pay fill","type in Total: Amount is worked back","switch Buy and Sell, Limit and Market: the thumb tints and the price row changes"]},{"slug":"health-gauge","label":"Health Gauge","tier":"core","score":62,"why":"Dial sweeps and recolours across Health, Sentiment, Liquidity.","mainFunctions":["click Health, Sentiment, Liquidity: the arc sweeps and turns green, red or amber"]},{"slug":"scatter-plot","label":"Scatter Plot","tier":"core","score":60,"why":"Risk against return with a nearest point pick that never blinks out.","mainFunctions":["move anywhere: the nearest point rings and hairlines run to both axes with a card","click a point to pin it"]},{"slug":"historical-eps","label":"Historical EPS","tier":"core","score":60,"why":"Forecast against reported EPS per quarter with a surprise readout.","mainFunctions":["hover a quarter: the rest dim and a card shows forecast, reported and surprise","arrow keys walk quarters"]},{"slug":"screen-shuffle","label":"Screen Shuffle","tier":"core","score":60,"why":"Stack of screens where the front arcs to the back, but the mocks are grey skeletons.","mainFunctions":["click the stack: the front screen arcs to the back","hover: it shuffles every 2.6s"]},{"slug":"market-shelf","label":"Market Shelf","tier":"core","score":58,"why":"Trending tiles that lift on hover with a See all modal.","mainFunctions":["hover a tile: it scales up and the line reads its 7d move","click See all: a modal lists all markets"]},{"slug":"setup-stepper","label":"Setup Stepper","tier":"core","score":57,"why":"Rail fills to the next coin and draws its check on Continue.","mainFunctions":["click Continue: the rail fills down and the check draws","click a step title to jump there","Finish, then Start over"]},{"slug":"onboarding-checklist","label":"Onboarding Checklist","tier":"core","score":57,"why":"Start trading checklist where Start plays the commit and the bar grows.","mainFunctions":["hover a row and click Start: tick, then the disc fills and the label str

1ikes through","click a disc to tick or untick by hand"]},{"slug":"gantt-mini","label":"Gantt Chart","tier":"core","score":57,"why":"Rollout sprint strip with a card per task; read only.","mainFunctions":["hover a task row: the rest dim and a card shows dates, days and owner"]},{"slug":"tool-call-card","label":"Tool Call Card","tier":"core","score":56,"why":"Agent tool call that replays with a shimmer, fits the AI infra story.","mainFunctions":["click Run again: Running with a beat and shimmer, then Done and the JSON fades back","click the head row: the body folds shut"]},{"slug":"crypto-fiat","label":"Crypto/Fiat","tier":"core","score":56,"why":"Dollar and ETH switch where counter digits pop in one by one.","mainFunctions":["click the switch: the figure converts and counter digits pop in left to right","type: only the changed digits pop and the font steps down"]},{"slug":"comb-rows","label":"Comb Rows","tier":"core","score":55,"why":"P/E rulers that comb in on mount; hover only recolours.","mainFunctions":["hover a row: it takes the accent and the line reads its gap to AMZN"]},{"slug":"kpi-card-row","label":"KPI Card Row","tier":"quiet","score":54,"why":"Three KPI cards with a per card scrub; his curation leans away from KPI rows.","mainFunctions":["scrub a card chart: the figure and date read that point"]},{"slug":"empty-state","label":"Empty State","tier":"quiet","score":52,"why":"Empty alerts block that opens a subscribe popup and confirms in place.","mainFunctions":["click Create an alert: a popup opens","type an email and pick digests, then Subscribe: it swaps to Subscribed"]},{"slug":"amount-slider","label":"Amount Slider","tier":"quiet","score":52,"why":"Amount panel over the inline slider; numbers follow the handle.","mainFunctions":["drag the slider: amount, dollar value and share update live","click 25%, 75%, Max: the handle springs there"]},{"slug":"mouse-trail-cta","label":"Mouse-Trail CTA","tier":"quiet","score":52,"why":"Dot trail pulled into a button; subtle and needs a sized stage.","mainFunctions":["move around the stage: a trail of dots fades behind the pointer","move near the button: dots pull in and its top edge glows"]},{"slug":"inline-slider","label":"Inline Slider","tier":"quiet","score":50,"why":"Slider primitive with the label inside the track.","mainFunctions":["drag the track: the handle follows and springs to the nearest step","click the track to jump, arrows to step"]},{"slug":"request-log","label":"API Request Log","tier":"quiet","score":50,"why":"API log rows that unfold their response body.","mainFunctions":["click a row: its response body unfolds","click copy in an open body: it turns to Copied"]},{"slug":"allocation-treemap","label":"Allocation Treemap","tier":"quiet","score":50,"why":"Ink treemap with hover only; quieter than the heatmap.","mainFunctions":["hover a tile: it turns accent and a card shows share and value"]},{"slug":"donut-chart","label":"Donut Chart","tier":"quiet","score":50,"why":"Small donut whose centre swaps to the pointed slice.","mainFunctions":["hover an arc or legend row: the slice turns accent and the centre reads it"]},{"slug":"stat-tile","label":"Stat Tile","tier":"quiet","score":50,"why":"Compact tiles with a dot riding the bottom line.","mainFunctions":["move across a tile: the value reads that point and the others dim","arrow keys step points"]},{"slug":"release-feed","label":"Release Feed","tier":"quiet","score":48,"why":"Changelog with a kind filter.","mainFunctions":["hover or click Added, Changed, Fixed: other kinds fade","click a version Copy"]},{"slug":"radial-gauge","label":"Radial Gauge","tier":"quiet","score":48,"why":"Eval pass rate dial; after the sweep it only swaps text.","mainFunctions":["hover Fail, Watch, Pass: the line reads that band"]},{"slug":"ratings-radar","label":"Ratings Radar","tier":"quiet","score":47,"why":"Small analyst rating pentagon.","mainFunctions":["hover an axis: its point grows and the line reads its share of analysts"]},{"slug":"analyst-radar","label":"Analyst Radar","tier":"quiet","score":47,"why":"Small factor radar with legend toggles.","mainFunctions":["click Company or Sector: that shape fades out or in","hover an axis: both scores read in the legend"]}

1,{"slug":"trade-journal-table","label":"Trade Journal Table","tier":"quiet","score":46,"why":"Journal table; sort snaps and data tables score low with him.","mainFunctions":["hover a row: the net P&L formula swaps in below","click 7D, 30D, All to filter"]},{"slug":"ticker-tape","label":"Ticker Tape","tier":"quiet","score":46,"why":"Marquee strip, a common pattern.","mainFunctions":["hover: it scrolls on a loop","press and hold a symbol: the tape stops and the rest dim"]},{"slug":"holdings-table","label":"Holdings Table","tier":"quiet","score":45,"why":"Holdings table where the sort snaps without a glide.","mainFunctions":["click a column head: rows reorder","hover a row: its comb turns accent"]},{"slug":"event-feed","label":"Market Event Feed","tier":"quiet","score":44,"why":"Text heavy event list.","mainFunctions":["hover an event: its percent swaps to the dollar move","click to pin it"]},{"slug":"account-dropdown","label":"Account Dropdown","tier":"quiet","score":44,"why":"Account switcher pill and panel.","mainFunctions":["click the trigger: the panel drops in","click another account: the trigger swaps to it"]},{"slug":"assets-balance-card","label":"Assets Balance Card","tier":"quiet","score":43,"why":"Balance block with a small scrubbable sparkline.","mainFunctions":["scrub the sparkline: a card shows the time and balance"]},{"slug":"vitals-strip","label":"Key Stats Strip","tier":"quiet","score":42,"why":"Key stats row whose hint line shows the derivation.","mainFunctions":["hover a cell: the hint line shows how the figure is 

1worked out","point at the strip: Trades ticks up"]},{"slug":"news-card","label":"News Card","tier":"quiet","score":40,"why":"One headline with story dots.","mainFunctions":["click a dot: the headline swaps"]},{"slug":"payment-card","label":"Payment Card","tier":"quiet","score":40,"why":"Card on file with an update modal that detects the network.","mainFunctions":["click Update payment method and type a number: the network is detected","Save: the face recolours to the new network"]},{"slug":"preferences-card","label":"Preferences Card","tier":"quiet","score":36,"why":"Settings list with hover polish only.","mainFunctions":["hover a row: a chevron slides in and the rest dim"]},{"slug":"balance-header","label":"Balance Header","tier":"quiet","score":35,"why":"Balance header with a hide toggle.","mainFunctions":["click the eye: figures mask to dots"]},{"slug":"avatar-stack","label":"Avatar Stack","tier":"quiet","score":32,"why":"Tiny avatar row.","mainFunctions":["hover a coin: it lifts and the name line reads"]},{"slug":"view-switch","label":"View Switch","tier":"quiet","score":30,"why":"Desktop, Mobile, Code switch primitive.","mainFunctions":["click an icon: the thumb slides and the name widens in"]},{"slug":"info-card","label":"Info Card","tier":"quiet","score":28,"why":"Card that reveals one action on hover.","mainFunctions":["hover: the Move to yield row opens"]},{"slug":"morph-disclosure","label":"Morph Disclosure","tier":"quiet","score":28,"why":"A single disclosure.","mainFunctions":["click the head: the sheet folds shut and the cross turns to a plus"]},{"slug":"modal","label":"Modal","tier":"quiet","score":26,"why":"Controlled dialog; cannot dismiss or reopen on its own.","mainFunctions":["hover or press Keep orders and Cancel all"]},{"slug":"segmented-control","label":"Segmented Control","tier":"quiet","score":22,"why":"Bare primitive that needs options passed in.","mainFunctions":["click an option: the thumb slides"]},{"slug":"amount","label":"Currency Amount","tier":"quiet","score":20,"why":"Number formatters with no defaults; nothing shows without props.","mainFunctions":["hover a figure: a popover with exact value and change, when props supply them"]},{"slug":"browser-window","label":"Browser Window","tier":"quiet","score":15,"why":"Empty frame that needs children.","mainFunctions":["with the full header: Reload replays the content, the star fills, Copy link ticks"]},{"slug":"macbook-frame","label":"MacBook Frame","tier":"quiet","score":10,"why":"Pure device frame, no interaction.","mainFunctions":[]}]'),O={components:E},T="http://127.0.0.1:8773",y=O.components,L=[{id:"all",label:"All"},{id:"showpiece",label:"Showpiece"},{id:"core",label:"Core"},{id:"quiet",label:"Quiet"},{id:"later",label:"Saved for later"},{id:"broken",label:"Broken"}],j=(a,p)=>fetch(`${T}${a}`,{method:"POST",headers:{"content-type":"application/json"},body:JSON.stringify(p)}).then(s=>s.json());function X(){const[a,p]=h.useState({}),[s,u]=h.useState([]),[r,g]=h.useState("all"),[o,w]=h.useState(!1),[m,b]=h.useState(null),[i,k]=h.useState(null);h.useEffect(()=>{fetch(`${T}/api/state`).then(e=>e.json()).then(e=>{p(e.picks??{}),u(e.reports??[])}).catch(()=>w(!0))},[]);const f=e=>a[e.slug]??(e.tier==="showpiece"?"later":"now"),v=e=>s.filter(l=>l.slug===e&&l.status!=="fixed"),x=e=>{b(e),window.setTimeout(()=>b(null),1400)},q=(e,l)=>{const n={...a,[e.slug]:l};p(n),j("/api/picks",{picks:n}).catch(()=>w(!0))},F=h.useMemo(()=>y.filter(e=>r==="all"?!0:r==="later"?f(e)==="later":r==="broken"?v(e.slug).length>0:e.tier===r),[r,a,s]),S=y.filter(e=>f(e)==="later").length,R=new Set(s.filter(e=>e.status!=="fixed").map(e=>e.slug)).size,M=async()=>{const e=y.filter(c=>f(c)==="later").map(c=>c.slug),l=y.filter(c=>f(c)==="now").map(c=>c.slug),n=s.filter(c=>c.status!=="fixed").map(c=>`${c.slug}: ${c.note}`),C=`Save for later (${e.length}): ${e.join(", ")}
2Ship now (${l.length}): ${l.join(", ")}${n.length?`
3Broken (${n.length}):
4${n.join(`
5`)}`:""}`;try{await navigator.clipboard.writeText(C),x("Copied")}catch{window.prompt("Copy this:",C)}};return t.jsxs("div",{className:"min-h-screen bg-background text-foreground",children:[t.jsxs("div",{className:"mx-auto max-w-[1480px] px-6 pb-32 pt-10 max-sm:px-4",children:[t.jsx("h1",{className:"text-[20px] font-semibold tracking-[-0.01em]",children:"Component review"}),t.jsx("p",{className:"mt-1.5 max-w-[72ch] text-[13px] leading-relaxed text-foreground

5/50",children:"Every library component, live. Point at a card and it plays its demo; move onto the component to use it yourself. Mark each one to ship now or save for later (showpieces start on later), or press Broken and say what is wrong. Everything you mark is sent to Claude as you go."}),o&&t.jsx("p",{className:"mt-3 text-[12.5px] text-[#ff9a9a]",children:"The review server is not running, so marks are not being saved. Ask Claude to start it (lab-review/rollout/serve.mjs)."}),t.jsxs("div",{role:"toolbar","aria-label":"Filter",className:"sticky top-0 z-30 -mx-1 mt-6 flex flex-wrap items-center gap-2 bg-background/90 px-1 py-3 backdrop-blur",children:[L.map(e=>t.jsx("button",{type:"button","aria-pressed":r===e.id,onClick:()=>g(e.id),className:d("h-8 rounded-full px-3.5 text-[12.5px]",A,r===e.id?"text-foreground":"text-foreground/50"),children:e.label},e.id)),t.jsxs("span",{className:"ml-1 text-[12.5px] tabular-nums text-foreground/45",children:[t.jsx("b",{className:"font-medium text-foreground",children:F.length})," shown · ",t.jsx("b",{className:"font-medium text-foreground",children:y.length-S})," ship now ·"," ",t.jsx("b",{className:"font-medium text-foreground",children:S})," later · ",t.jsx("b",{className:"font-medium text-foreground",children:R})," broken"]}),t.jsx("span",{className:"flex-1"}),t.jsx("button",{type:"button",onClick:M,className:d("h-8 rounded-full px-4 text-[12.5px] font-semibold",N),children:"Copy list"})]}),t.jsx("div",{className:"mt-2 grid grid-cols-[repeat(auto-fill,minmax(340px,1fr))] gap-3.5 max-sm:grid-cols-1",children:F.map((e,l)=>t.jsx(H,{c:e,order:l,pick:f(e),reports:v(e.slug),onPick:n=>q(e,n),onBroken:()=>k(e)},e.slug))})]}),i&&t.jsx($,{c:i,onClose:()=>k(null),onSend:async e=>{const l=i;k(null);try{const n=await j("/api/report",{slug:l.slug,note:e});n.ok&&u(n.reports),x("Sent")}catch{w(!0),u(n=>[...n,{slug:l.slug,note:e,status:"open"}])}}}),t.jsx("div",{"aria-live":"polite",className:d("pointer-events-none fixed bottom-7 left-1/2 -translate-x-1/2 rounded-full bg-foreground px-4 py-2.5 text-[13px] font-semibold text-background transition-[opacity,translate] duration-200",m?"translate-y-0 opacity-100":"translate-y-3 opacity-0"),children:m})]})}function H({c:a,order:p,pick:s,reports:u,onPick:r,onBroken:g}){var b;const[o,w]=h.useState(!1),m="h-7 rounded-full text-[12.5px] transition-colors duration-150";return t.jsxs("article",{onPointerEnter:i=>i.nativeEvent.isTrusted&&w(!0),onPointerLeave:i=>i.nativeEvent.isTrusted&&w(!1),className:d("raised flex flex-col bg-foreground

5/[0.04] p-1.5",B),children:[t.jsx("div",{className:d("relative aspect-[4/3] overflow-hidden bg-background",I),children:t.jsx(D,{slug:a.slug,order:p,hot:o,onOpen:()=>window.open(`/library/${a.slug}`,"_blank","noopener")})}),t.jsxs("div",{className:"flex flex-col gap-1 px-2 pb-1.5 pt-3",children:[t.jsxs("div",{className:"flex items-baseline gap-2",children:[t.jsx("a",{href:`/library/${a.slug}`,target:"_blank",rel:"noopener",className:"text-[14px] font-semibold text-foreground hover:underline hover:underline-offset-[3px]",children:a.label}),t.jsx("span",{className:"ml-auto text-[12.5px] tabular-nums text-foreground/45",children:a.score})]}),t.jsxs("div",{className:"text-[12px] text-foreground/35",children:[a.tier,a.release?` · planned ${a.release}`:""]}),t.jsx("div",{className:"text-[12px] leading-snug text-foreground/50",children:a.why}),!!((b=a.mainFunctions)!=null&&b.length)&&t.jsx("ul",{className:"mt-0.5 list-disc pl-4 text-[12px] leading-snug text-foreground/35",children:a.mainFunctions.map(i=>t.jsx("li",{children:i},i))}),t.jsxs("div",{role:"group","aria-label":`${a.label}: ship, save or report`,className:"mt-2.5 grid grid-cols-[1fr_1fr_auto] gap-0.5 rounded-[16px] bg-foreground

5/[0.06] p-0.5",children:[t.jsx("button",{type:"button","aria-pressed":s==="now",onClick:()=>r("now"),className:d(m,s==="now"?"bg-[#3ecf8e]/15 text-[#3ecf8e]":"text-foreground/45 hover:text-foreground/75"),children:"Ship now"}),t.jsx("button",{type:"button","aria-pressed":s==="later",onClick:()=>r("later"),className:d(m,s==="later"?"bg-[#f0b45b]/15 text-[#f0b45b]":"text-foreground/45 hover:text-foreground/75"),children:"Save for later"}),t.jsx("button",{type:"button","aria-label":`Report ${a.label} as broken`,onClick:g,className:d(m,"px-3",u.length?"bg-[#ff5a5a]/15 text-[#ff7a7a]":"text-foreground/35 hover:text-[#ff7a7a]"),children:"Broken"})]}),u.map((i,k)=>t.jsxs("p",{className:"mt-1 whitespace-pre-wrap text-[12px] text-[#ff9a9a]",children:["Broken: ",i.note]},k))]})]})}function $({c:a,onClose:p,onSend:s}){const u=h.useRef(null),[r,g]=h.useState("");return h.useEffect(()=>{var o;(o=u.current)==null||o.showModal()},[]),t.jsx("dialog",{ref:u,onClose:p,className:"m-auto w-[min(440px,calc(100vw-32px))] rounded-[34px] border-0 bg-[color-mix(in_srgb,var(--foreground)_6%,var(--background))] p-5 text-foreground backdrop:bg-black/60",children:t.jsxs("form",{method:"dialog",onSubmit:o=>{o.preventDefault(),r.trim()&&s(r.trim())},children:[t.jsxs("h2",{className:"text-[15px] font-semibold",children:["What is broken in ",a.label,"?"]}),t.jsx("p",{className:"mb-3 mt-1 text-[12px] text-foreground/50",children:"Say what looks wrong in the demo or the component: a step that does nothing, a glitch, a wrong state."}),t.jsx("textarea",{autoFocus:!0,required:!0,value:r,onChange:o=>g(o.target.value),placeholder:"e.g. the cursor clicks Max but nothing changes",className:d("min-h-[120px] w-full resize-y rounded-[14px] px-3.5 py-3 text-[13px] outline-none",P)}),t.jsxs("div",{className:"mt-3 flex justify-end gap-2",children:[t.jsx("button",{type:"button",onClick:()=>{var o;return(o=u.current)==null?void 0:o.close()},className:d("h-8 rounded-full px-4 text-[12.5px]",A),children:"Cancel"}),t.jsx("button",{type:"submit",className:d("h-8 rounded-full px-4 text-[12.5px] font-semibold",N),children:"Send"})]})]})})}export{X as default};