component config

overview


components are units of functionality that are bundled together as a single unit, typically as a javascript module. Components are things like charts or tables, although they do not necessarily require a visual aspect.

config properties


In order to design a component, you must write your code to comply with the component specification. The primary requirement for a component is that it is encoded in javascript module as below.

  • attributes - reserved for use by the component designer to save information about the component
  • body - reserved for use by the component designer to save information about the component
  • children - if children is present, it should be an array. This array should be present if the component acts as a container, i.e. it can contain other components as children. This is usually the case for components that are visual containers that contain other components.
  • directives - the directives property specifies directives to the platform on how to treat the component. For example, if the component should not be deletable by the user, this can be specified in the directives object.
  • script - a string that indicates the URL of the javascript library that contains the constructor for the component

children property


The children property is an array to contain child components. If a component does not have children, the children property should be left undefined. Typically, components that represent visual containers in a blog, such as a layout section, should have a children array, as well as implementing the $insert method on the component itself.

directives property


The directives property contains various properties that indicates to the platform how the component should be handled. For instance, if you want to prevent a user from being able to delete a component, you can add the deletable property to the directives object and set it to false.

A sample directives property in the config. 

directives:{
  deletable:false,
  viewable:false
}
Some directives are accomplished through the presence of the component lifecycle methods. For instance, there is no need to have a selectable directive since a component is only selectable if the $select method is present on the component. However, it is necessary to have a deletable directive even though there is a $remove method on the component, because the $remove method is required even if the user is not allowed to delete the component themselves. (for instance, if the component is in a container that can be deleted or is being reloaded for some reason, the $remove method is needed.)

Contents