Adds your components to the Makeswift builder.
Options for site version and locale.
Box
component. 'box'
is the value for type
, which must
be unique, as Makeswift uses this value to identify the component. This value shouldn’t change once you use the
component in the Makeswift builder. 'Box'
is the label
, which appears in
the Makeswift builder. The example applies a Style
control to the
className
prop.
Cube
and a Sphere
component under a “Visuals” section. In each
components’ label
, use slashes to separate the section name and component name. In the Makeswift
builder, both components appear under the same Visuals collapsible section:
ImageGallery
component with a custom icon. We
import ComponentIcon
from @makeswift/runtime
and pass
ComponentIcon.Gallery
as the icon
for our component.
Circle
component with a rich description. We
can define a description string using markdown formatting, and pass it into the component description field.
makeswift/components.tsx
, you may notice this file growing rather large. To keep your codebase organized, we recommend breaking out your Makeswift registration code into separate files and co-locating it with your component file.
For example, if you have a Box
component, you can create a Box.makeswift.ts
file next to your Box.tsx
file. This file will contain the registration code for the Box
component.
makeswift/components.tsx
file to import all of the component registrations, like so:
makeswift/components.ts
should be imported wherever you use <ReactRuntimeProvider>
in your app.