Project Created Success Block for React

Nothing was created or cloned. The repository name, the branch, the region, the clone address (a .example host) and the four installers' commands are typed constants at the top of the file. To wire it, fill REPO, BRANCH, REGION and CLONE_URL from the project your API just created, keep the commands of the installers you support in MANAGERS, and point Open the dashboard at the project's own route. The commands are built from those constants, so nothing is typed twice.

Only the install and start lines: the clone and the folder are the same, so bun shows bun install and bun dev, npm shows npm install and npm run dev, and yarn shows yarn and yarn dev. The tabs follow the library's own keys (arrow keys move between them, Home and End go to the first and last), and the box keeps the same height whichever tab is open.

The four lines of the open tab as plain text, one per line, without the dollar sign that is drawn before each line (it is not selectable and screen readers skip it). The polite status says "Copied the pnpm commands." and, if the browser refuses the clipboard, "Couldn't copy. Copy the commands by hand." Nothing else on the page is copied.

No. It follows the theme, light in a light theme and dark in a dark one, so it never clashes with the page, and its text is the foreground colour. Each tab's commands sit in a named, focusable region that scrolls sideways inside the box, so a long clone address never widens the page on a phone.

Open the dashboard is the one primary, a link to your own route. It is a Shine Button with render set to an a element and nativeButton={false}. On a phone it is pinned to the bottom of the screen while the page scrolls, and from the small breakpoint it sits in the flow under the code box.