Registry
Install a component's source with the shadcn CLI.
Every component is a shadcn registry
item. shadcn add copies the source into your project; it renders through
GPUix, not the DOM.
Install
npx shadcn@latest add @sudokw/primitives-buttonOr by direct address:
npx shadcn@latest add https://gpuixui.sudokw.com/primitives-button.jsonThat installs the component, its parts, the @gpuixui/* runtime and the npm
packages they import. Items are <package>-<component>; list them with
npx shadcn@latest search @sudokw.
Set the JSX runtime
{
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "@gpuix/react"
}
}Render it
import { render } from "@gpuix/react";
import { Button } from "@/components/ui/gpuixui/primitives/components/Button";
import { ThemeProvider } from "@/components/ui/gpuixui/primitives/components/ThemeProvider";
import { darkTheme } from "@/components/ui/gpuixui/tokens";
render(
<ThemeProvider theme={darkTheme}>
<Button variant="primary" onActivate={save}>
Save changes
</Button>
</ThemeProvider>,
);ThemeProvider is required. @gpuix/native ships binaries for Apple Silicon,
Linux x64 and Windows.
Files land under your ui alias in gpuixui/:
src/components/ui/gpuixui/primitives/components/Button.tsx
src/components/ui/gpuixui/tokens/index.tsThe runtime items (gpuix-tokens, gpuix-tw, gpuix-motion,
gpuix-primitives) install once per project. The site serves the index at
/registry.json and one document per item at /<name>.json.
Edit this page on GitHubapps/docs/content/docs/registry.mdx