{
 "schema_version": 1,
 "generated": "2026-10-26",
 "id": "kvnkld-aicss--copy-thinking-state-with-shadcn",
 "repo": "kvnkld/aicss",
 "repo_url": "https://github.com/kvnkld/aicss",
 "repo_slug": "kvnkld-aicss",
 "title": "Copy the thinking-state component into a shadcn project",
 "page_title": "How to copy the thinking-state component into a shadcn project with Aicss",
 "summary": "Add the thinking-state component source to a shadcn project with one npx command.",
 "who": "A developer using shadcn in a React app who wants the AICSS thinking-state component as local source code they can edit.",
 "problem": "Pulling in a UI component as an npm dependency can hide the code, while the team wants to own and change the component directly.",
 "outcome": "The thinking-state component files are added to the shadcn project so the team can edit them in their own codebase.",
 "steps": [
  "Open a terminal in the root of the shadcn project.",
  "Run `npx shadcn@latest add https://www.aicss.dev/r/thinking-state.json`.",
  "Find the added thinking-state files in the project and open them.",
  "Import the component in the chat view and render it where agent replies are pending."
 ],
 "agent_prompt": "In the repo kvnkld/aicss, add the thinking-state component to the shadcn project at <project-path} by running the shadcn add command from the README. Report the files that were created and confirm that the component is imported in <chat-component-path>.",
 "agents": [
  "any"
 ],
 "difficulty": "Intermediate",
 "time": "15 minutes",
 "basis": "readme",
 "caveat": "The shadcn install path is listed in the README, but the README does not describe what files it creates, so check the output after running it.",
 "category": "Software and DevOps",
 "tags": [
  "Software and DevOps"
 ],
 "lang": "typescript",
 "requirements": [
  "An existing React, Vue, or Svelte project",
  "npm and npx available in a terminal",
  "For Pro components only: an AICSS account and an AICSS_TOKEN from https://www.aicss.dev/account"
 ],
 "risk": "none",
 "seen_in_the_wild": false,
 "mentioned_publicly": false,
 "risks": [
  {
   "tag": "remote-script",
   "notice": "The shadcn command downloads component code from a remote URL at https://www.aicss.dev, so review the added files before you commit them."
  }
 ],
 "best": false,
 "score": 0.9,
 "evidence": [],
 "url": "https://dedupedai.com/use-cases/kvnkld-aicss/copy-thinking-state-with-shadcn/",
 "md": "https://dedupedai.com/use-cases/kvnkld-aicss/copy-thinking-state-with-shadcn/index.md",
 "disclaimer": "Deduped lists open-source repositories that belong to other people. We do not own, maintain, audit, or vouch for any of them, and a repo appearing here is not an endorsement or a safety check. The use cases, steps, and prompts are written by AI and may be incomplete, outdated, or just wrong. Where a use case is marked \"Seen in the wild\", we link to public posts where someone described something similar, but we have not verified those posts and the use case itself is still our AI's own write-up. Use all of this at your own risk. Only run code, commands, or agents on systems and accounts you are authorized to use, and read the code and every command before you run it, especially anything that touches credentials, files, or the network. Nothing here is professional, security, legal, or financial advice. All trademarks and project names belong to their respective owners, and their use here does not imply affiliation. Content is provided as is, without warranties of any kind. Found a mistake, a safety problem, or something you want removed? Email hello@dedupedai.com and we will look at it promptly.",
 "api": "https://dedupedai.com/api/v1/usecases/kvnkld-aicss--copy-thinking-state-with-shadcn.json",
 "api_version": "v1"
}