What the JSX viewer runs
A React component, JSX or TypeScript, with its hooks and its state: what Claude and ChatGPT write when you ask for an app. Its import lines load the libraries it names, such as lucide-react, recharts or framer-motion, and shadcn/ui's components from @/components/ui. Tailwind classes are styled as you type.
The component runs in a sealed frame on another address, so it cannot read solta.now, your cookies or your accounts. What it logs, and every error, shows in the Console under the page, with the line of your code it came from.
Open a React artifact from Claude or ChatGPT
- In the chat, copy the component's code, from its first
importline to the end. - Press Paste above, or paste it into the code. The page shows beside it, or under it on a phone.
- If something doesn't work, the Console names the error and the line: tell your AI both, and paste what it sends back.
Opened any other way, the same code shows a blank page: why a React artifact opens blank.
What can look different at the link
The preview is built here, in your browser. Your link is built on Solta's server, with the same libraries at the same versions and the same shadcn/ui components, but with other software: esbuild instead of Sucrase for the JSX, and a stylesheet made ahead of time instead of Tailwind's browser version. Now and then a small detail, most often a style, looks different at the link. Open the link once before you send it.
Two limits are the same in both places. A component is one file, so an import of another file of yours, such as ./utils, finds nothing. And the libraries come from the internet, so the preview needs a connection to show a component.
From a preview to a link
When it works, Get a link, under the page, builds it and publishes it at its own address, and it opens without an account, on any phone. A page of plain HTML opens in the HTML viewer, and the HTML tester starts from a page to write, with the Console open.
Questions
What is a JSX file?
JSX is JavaScript with tags that look like HTML, the way React components are written. A .jsx or .tsx file is a component, not a page: it has to be built before a browser can show it. This viewer builds it as you type.
Why is my Claude artifact blank when I open it?
A React artifact is a component, not a page. Opened as a file, or in a plain HTML viewer, it has nothing a browser can draw, so it shows a blank page. Paste it here instead, and the viewer builds it.
Which libraries can it load?
React 18.3.1, and the packages Claude and ChatGPT use most: lucide-react, recharts, framer-motion, shadcn/ui's components and others, at the versions a site on Solta uses. Any other package from npm loads too, through esm.sh.
Does it work with TypeScript?
Yes. A .tsx file runs, its types taken out before it does. The viewer doesn't check the types, so a type error doesn't stop the preview.
Is my code sent anywhere?
It is kept in this browser until you press Clear. The preview fetches the libraries your code imports, from esm.sh and from Solta, but not your code. Nothing of it is sent to Solta until you press Get a link.
Can I open a .jsx file from my computer?
Yes. Open a file takes .jsx, .tsx and .html files. On a phone, Code and Page take turns on the screen, and Phone shows the page 390 pixels wide on a computer.
How long does the link stay up?
A site published without an account stays up for 24 hours. To keep it, sign in from the card that shows its address, and it stays at the same address.