WIP: jsrepo v3 proposal v3

[ieedan]

I hope you might like this one better, I think it strikes a good balance between minimizing the config needed and the magic while also maximizing the configurability.

This proposal rotates around a function in the config file called defineComponent. This function takes in the title, category, and description and defines the files necessary for each variant.

For example:

defineComponent({
  title: 'AnimatedContent',
  category: 'Animations',
  description:
    'Wrapper that animates any children on scroll or mount with configurable direction, distance, duration and easing.'
}),

We define all our items with defineComponent in the items array and then we can build the registry with:

jsrepo build
# watch mode
jsrepo build --watch

We use the @jsrepo/shadcn package to adapt the jsrepo build output to something that the shadcn CLI can understand using the output exported from the package:

import { output } from '@jsrepo/shadcn';

// ...
{
	// ...
	outputs: [output({ dir: 'public/r', format: true })],
	// ...
}

We set dir to public/r to tell jsrepo to output the registry under public/r.

I also added 2 new commands to the package.json that will do the work of the other commands before:

• registry:build - Builds the registry
• registry:dev - Builds the registry in watch mode

Users

shadcn CLI users

• No change

jsrepo users

jsrepo users will have a few options for how to add components:

# init registry
jsrepo init https://reactbits.dev/r
# list components
jsrepo add --registry https://reactbits.dev/r

# setup namespace registry using shadcn directory
jsrepo config provider @jsrepo/shadcn
# add components using shadcn provider
jsrepo add --registry shadcn:@react-bits

TODO:

• Delete make-define-component-code.ts
• Delete registry.json
• Update jsrepo section of the docs
• Untrack the registry output (optional)

[DavidHDev]

seems pretty nice, I think we can go with it. The only problem is, with this approach, I still have to manage two different files for component data, which will easily go out of sync if I'm not careful (Information.js and jsrepo.config.ts)

[ieedan]

seems pretty nice, I think we can go with it. The only problem is, with this approach, I still have to manage two different files for component data, which will easily go out of sync if I'm not careful (Information.js and jsrepo.config.ts)

Ahh I didn't see this. We could also just delete this now :) Just need to move that info into the jsrepo.config before I do.

[ieedan]

It's also worth mentioning that it seems like a lot of the meta data from that file is being left out of the registry currently so I can make that work as well.

[ieedan]

Okay now everything will instead be based off of Information.js and you just need to make sure that stays up to date. It looks like it's missing a few components atm.

[DavidHDev]

I don't think it's missing anything, I keep that one updated with every addition/deletion, it should be the single source of truth for what's in the library

[ieedan]

It looks like all that's missing right now is rolling gallery

[DavidHDev]

Yeah no, that one was completely deleted from the library, should not exist anymore

[ieedan]

Oh perfect then :)