Closed xecei closed 5 months ago
I've been slow to add documentation here since I think I can improve the contribution process a lot still. Right now you need to create two files and edit one, and I think I can get it down to just adding a single file (or cloning from a template).
npm run dev -w site
REGISTRY_URL=http://localhost:3000/ npx @sly-cli/sly add
to connect to it locallynpx @sly-cli/sly refresh
to clear the cache at any time which should make them all appear. There are three steps to adding a library
site/app/routes/registry+/draft-ui[.json].ts
) that returns JSON for all the items in the librarysite/app/routes/registry+/draft-ui.$name[.json].ts
) that returns JSON for an individual itemsite/app/routes/registry+/index[.json].ts
)I'd recommend just copy/pasting the two files from an existing library (like draft UI above) and editing it to return your component data instead. There are helper functions to fetch from Github since that's where most of them are, but at the end of the day the registry is just returning URLs and some meta data so you could serve it from anywhere
In site/app/schemas.ts
you can see the zod schemas that everything conforms to. If you're just serving from github you can copy/paste an existing library and not have to deal with these, but if you're doing something more custom then you might need to know about them
The library index site/app/routes/registry+/draft-ui[.json].ts
returns a resources
array that looks like this
The library item route site/app/routes/registry+/draft-ui.$name[.json].ts
returns the same as above, except only one item, and it's extended with this files
array. Each file has name
which is the filename it should create, and content
which is the file contents.
In the sly.json
that you get after you add a library, there's a transformers
array that can point to typescript files. When you install a component, it will be passed through these functions in order (string input, string output) before being saved. If you have multiple different repos with styling differences, or if some use the "use client" tags and some don't, for example, then each one could provide its own transformers to modify the components to match. If not, you probably won't get much use out of this feature for a private registry. You could also just modify the library endpoints to manipulate the files further there.
Thank you for help! :)
I want to try to create an internal library and connect it to sly/cli. Is there any guide for this? I saw REGISTRY_URL=http://localhost:3000 npx @sly-cli/sly , but there is no any other documentation for this case