MaestroThe UI design product. | Form Builder | All versions This feature is related to all versions.
A custom native component is a custom component that can be shared with other Maestro Form Builders and Platform Developers. A native component consists of a collection of files that are packaged together in a ZIP file using a specific folder structure, as shown below.
| File Name | Description |
|---|---|
|
|
A file with this exact name must be in the ZIP file’s root folder. This file identifies the ZIP file as a Maestro Library and provides meta-data such as dates and author. |
|
|
A folder with this exact name must be in the ZIP file’s root folder. This folder contains a sub-folder for each native component. |
|
|
Each component has a sub-folder under the top-level "widgets" folder. A component sub-folder contains the files that define the native component. |
|
|
A file with this exact name must be in the component sub-folder. This file includes JSON properties that defines various component attributes. |
|
|
A 24x24 pixel, 32-bit color image with a transparency layer. This is used as the component’s icon in the Maestro Palette pane. |
|
|
HTML code defining the component’s structure. |
|
|
CSS code defining the component’s look and feel. |
|
|
JavaScript code defining the component’s behavior. |
|
|
Other JavaScript files that the component depends on, such as jQuery plugins. |
Multiple native components can be packaged into a single ZIP file. The ZIP file is shared in Maestro by importing it into a project or organization library. Once imported, the components in the ZIP file are available on the Maestro Palette pane and can be used like any other component.
Next, learn how to develop a custom native component.