Skip to main content

Native Components

Native Components allows you to integrate your custom web components into the Plateau Studio environment, treating them as native elements. This provides a bridge between your local component development and the Plateau Studio ecosystem.

Once imported, Plateau Studio enables the definition of component properties and events, allowing for a comprehensive configuration that aligns with your specific requirements.

You can add, update your properties, events and code files by using the Edit button located on top. You can also see your native component on the Explorer Tree.

How to create a native component in Studio?

  • Go to App Components and click Native.

  • Click Plus button next to the search box.

  • Type your Component Name and Group. Optionally enter your Properties and Events.

  • After the component has been created, click the Start Working button.

  • Click Upload Code Files.

How to upload your component code?

In order to load the component code, the name of the component and the name of the draft must be the same.

Follow the steps below to create a draft component vue project.

  • Create with the name you will give to the draft following the symphony-cli nc-create command

  • Build the draft and look at the output under dist.

  • Upload the dist output to the Code Files Upload section.

How to add property and event?

  • Select the name of the property, which group(optional) it will be in and its type.

  • Enter event name and description(optional).

  • Enter parameter for Event.(optional)

  • Use the added event in your vue project file in the draft.