Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Talent Scout Chat Block for Solid

A recruiter's sourcing thread with one card of six candidates, eight skill toggles under the log that re-rank them in place by how many wanted skills each has, skill dots out of five, availability, a Shortlist toggle on each and a Shortlisted popover.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

Source people in conversation, with this talent scout chat for Solid with Ark UI. A hairline frame holds a window of fixed height for Scoutwell, a recruiter's sourcing chat: the sourcing partner, Fenella Brockhurst, posts one card in the log that lists six candidates, each with initials, a role, three skills drawn as dots out of five, an availability and a Toggle to shortlist. The eight skills under the log are a Toggle Group of what you want, and the list re-ranks in place by how many of the chosen skills each person has, such as 3 of 4 skills, inside a list of fixed height. The Shortlisted button in the top bar opens a Popover of the people you picked. The composer's Shine Button is the only colored control.

FAQ

What stays in the page, and how do I make it real?

Everything. The six candidates, their skills and availability are typed in this file, the replies come from a short script keyed on words, and the shortlist lives in state. Nothing is sent, no interview is scheduled and no model scores anyone. To wire it for real, replace CANDIDATES with a search of your applicant system and send the shortlist from toggleShort.

How does the ranking work?

A pure helper counts, for each person, how many of the chosen skills are among their three, sorts by that count and keeps the order found for ties. Toggling a skill re-ranks at once and the status line names the best match. The list has a fixed height and scrolls, so the card never changes size.

What does Shortlist do?

It toggles the person into your shortlist, which the top bar counts and its popover lists. It books nothing and contacts nobody.

Is it usable with a keyboard and a screen reader?

The log is a focusable region announced as a log and the candidate list is a focusable scroll region. The dots are hidden and each skill is also text such as TypeScript, 4 of 5, wanted, so match is never a color or a fill alone.

How does it look on a phone?

The same single column. The skill toggles wrap onto more lines, the card is as wide as the message area, and the window keeps its height while only the log and the candidate list scroll.