Component Property Reference¶
A key step in creating your own custom component is defining which properties the user will be able to use and set. Skuid has a variety of built-in properties available, which allow users to create fields without having to build them from the ground up. For example, instead of having to write net-new code for a “Model” property, Skuid has a Model property built-in.
The properties below are a complete list of supported basic property types.
Basic Component Builder Property Settings¶
The following fields are defined in your custom component’s builder code. You’ll want to fill in the appropriate information so your users understand both how to properly configure your custom component, as well as its functions.
* denotes that field is required
fields¶
- *id (string): A unique identification string that will be used as the attribute name for this property in the XML.
- *label (string): The text used to label and identify the property in the properties panel.
- onChange (function): A function that is called every time the property is changed.
- helptext (string): An optional brief description of what this property does and affects. It will appear in a tooltip.
- *type (string): The type of property that is to be rendered in the property panel. Valid property types are listed below. If a property is not given a valid type, its type will default to “string”.
Property Types¶
For the field builder *type indicated above, the following property types are available:
* denotes that field is required
Autocomplete¶
A generic autocomplete that can pull values from any number of fields in an SObject.
type: autocomplete
fields:
- *sobject (string) [required]: The SObject to pull fields/values from.
- *fieldsToReturn ([string]): The fields to be returned to be made available by value templates.
- *fieldsToSearch ([string]): The fields to search the SObject rows by. Fields must be of type “String”. Textarea or any other type will not work.
- displayTemplate (string): The template for the autocomplete dropdown results.
- valueTemplates ({string: string, …}): Any number of templates to be evaluated and stored as XML attributes on the component. Data will be stored in the same key-value configuration in the XML as defined in this object.
- order (string): The field to order the results by.
Field¶
Provides a field picker. Requires a model property type—modelprop—to be specified as well.
For example, see lines 4-5 below:
1 2 3 4 5 6 7 8 9 | {
id: "endfield",
label: "End Date",
type: "field",
modelprop: "model_d",
onChange: function(){
component.refresh();
},
}
|
type: field
Model¶
type: models
Models¶
User can specify any number of models.
type: models
fields
- location (string): Where in the xml the data for this property will be saved
valid values: “attribute”, “node”
Multipicklist¶
A list of options. The user may select any number of the given options.
type: multipicklist
fields
picklistEntries *([{string: string}]): An array of objects with “value” and “label” properties defined
Picklist¶
A list of options. The user may only select one.
type: picklist
fields
- *picklistEntries ([{string: string}]): An array of objects with “value” and “label” properties defined.
- defaultValue (string): The default value selected by the picklist.
Template¶
type: template
fields
- location (string): Where in the xml the data for this property will be saved
valid values: “attribute”, “node”