Stuck at code component registration process

I created a route in the index.js file where the component PlasmicCanvasHost is called

you can register it in that same file. It just needs to be exeuted before that

in the index.js file

so I make the registerComponent calls in the index.js file … ok

is a “plasmic-init.js” alternative to that ?

plasmic-init is a file that we create autoamtically for you if you use our CLI to create your project

You can check it here

Ah ok … to confirm. The importPath prop is the same as in the import statement if I want to use the component.
For instance to use the Button component from the MUI library, I import { Button } from ‘@mui/material’
So the importPath = ‘@mui/material’ ?


And the name is the { } part, and if it’s the default export, remember to check the isDefaultExport flag!

is the name prop or the first argument of the RegisterComponent function ?

that must match the name of the component in the library ?

the importName prop.
The first argument should be the component itself, in this case Button


The docs for our component registration API can be found here

awesome ! it works … yepee … I’m able to add Material UI button directly in plasmic studio … now I need to figure out how I can change the button label … I guess I haven’t registered all the props I need (only exposed “variant”)

You can probably expose the prop children as a slot (or label, I don’t know how it is set up in material UI)

yes that’s what I found in the MUI API doc


don’t you have “standard”/template registration call for most used UI components from major libraries ?

(happy to recode everything but :slightly_smiling_face: )