Supabase UI uses storybook to develop and organise components. They can be viewed locally in the Storybook docs explorer
make sure you are in the supabase-ui folder
cd supabase-ui
run storybook
npm run storybook
(you may need to run npm install
first)
Storybook runs by default on http://localhost:6006/
If you want to test Supabase UI components locally, in context in another project locally, then you will need to npm link
the supabase-ui project locally.
Follow these instructions here -> NPM Linking and Unlinking instructions
A common issue found with local testing is multiple versions of react running.
You may need to npm-link the react node module in the target app you want to locally test the library in. Then use that version of react inside the library, and then npm-link the library so the target app can use the library with just the 1 version of react.
Step by step:
• run npm link
in /your-app/node_modules/react. This should make the React's global link.
• run npm link react
in /supabase/ui. This should make the library use the application’s React copy.
• run npm link @supabase/ui
in /your-app
There is a script that generates new icon files, and sets them up for individual export.
npm run build:icons