Create or Edit a Component
New components are only created due to client requests and if native components do not offer specific functionalities. They can only be created by developers specialized in specific technologies. In addition, for react components, the Veritran Components team must be informed of the request and approve the creation.
Therefore, to create a new component, it takes two steps. First, you must write the new component code using the information provided by the client and considering the attributes that must be available for configuration in the screens editor. Then, you will import the component code and create it in Studio.
Once the component code has been writen, go to the Components page (Design > Components) to create the component in Studio. You can create react components both for the web and mobile channels. Once imported and published, they behave as native components and appear in the left panel of the screens editor (Components tab) so you can use them in your app screens. In addition, you can edit them.
Warning
To learn more about widget components, their purpose and creation, contact the Engineering team.
Refer to the intructions below to learn how to create or edit react components. You can only create the component in Studio if you have the code file already created.
Important
To learn more about the creation process and approval, and the documentation required, contact the Components team.
On the Components page, click + Create. The New Component modal opens, where you configure different fields:
In the Component type field, select React.
Note
The Attribute field cannot be edited, which refers to how to the component will be configured in the right panel.
In the Zip File field, click the file browser and select the file from your device. Then, click Open to upload the file. Once the zip is uploaded, the ID, Name, Simulator Image, Tree Icon, Drag Image and Component Definition fields appear automatically configured using the react code stored in the zip file.
Click Save to create the component.
If you need to upload a new zip file with changes on a react component (either published or pending publication), click the pencil icon and upload the new file. The fields will appear automatically completed as if you were creating the component. Then, click Save to confirm the changes.