Controls

A header provides a short summary of content.

Original control

Header

Properties:

Property Description
Name Name
Content Main text
Subheader Second text
Size Size of control
Text Align The property is used for aligning the inner content of a block element

Events: none

Input

An Input is a field used to elicit a response from a user. The field displays differently in and out of a form.

Original control

Input

Properties:

Property Description
Name Name
Type Type of element
Options Style of element
Label Label text
Label position Position of label
Placeholder Placeholder text
Size Size of control

Events:

Event Description
onClick onClick event
onChange onChange event

TextArea

A TextArea can be used to allow for extended user input. The field displays differently in and out of a form.

Original control

Textarea

Properties:

Property Description
Name Name
Rows Height of element
Options Style of element
Label Label text
Placeholder Placeholder text
Auto height Auto-size by height

Events:

Event Description
onClick onClick event
onChange onChange event

Dictionary

A Dictionaty can be used to allow for extended user input. The field displays differently in and out of a form.

Original control

Dictionary

Properties:

Property Description
Name Name
Data model Data model for showing in drop-down
Columns Columns for showing in drop-down. You might to set order by column.
Label Label text
Placeholder Placeholder text
Options Style of element

Events:

Event Description
onClick onClick event
onChange onChange event

A Dropdown can be used to allow for extended user input. The field displays differently in and out of a form.

Original control

Dropdown

Properties:

Property Description
Name Name
Data Data for showing in drop-down
Label Label text
Placeholder Placeholder text
Options Style of element

Events:

Event Description
onClick onClick event
onChange onChange event

Checkbox

A Checkbox allows a user to select a value from a small set of options, often binary.

Original control

Checkbox

Properties:

Property Description
Name Name
Label Label text
Options Style of element

Events:

Event Description
onClick onClick event
onChange onChange event

Radio group

A Radio group allows a user to select a value from a set of options.

Original control

Radio group

Properties:

Property Description
Name Name
Data Elements of a group
Label Label text
Group direct Location of elements each other
ReadOnly Read-only option

Events:

Event Description
onClick onClick event
onChange onChange event

Button

A Button indicates a possible user action.

Original control

Button

Properties:

Property Description
Name Name
Content Text inside a button
Options Style of element
Type Not used
Size Size of control
Float A control can be aligned to the left or right of its container.

Events:

Event Description
onClick onClick event

Label

A label displays content classification.

Original control

Label

Properties:

Property Description
Name Name
Content Text inside a button
Size Size of control
Attached Position relative to the associated item
Options Style of element

Events: none

Message

A message displays information that explains nearby content.

Original control

Message

Properties:

Property Description
Name Name
Header Subject
Content Content
Options Style of element
Size Size of control

Events: none

Image

An image is a graphic representation of something.

Original control

Image

Properties:

Property Description
Name Name
Src Subject
Href Content
Options Style of element
Floated A control can be aligned to the left or right of its container
VerticalAlign Posigion of element

Events: none

Statistic

A statistic emphasizes the current value of an attribute.

Original control

Statistic

Properties:

Property Description
Name Name
Data Values for showing
Options Style of element
Size Size of control

Events: none

Custom control

A dynamic control. You might set type, props, and children as a string value.

Properties:

Property Description
Name Name
Type control react type of element
Props react props
Children Children of the element

Events: none

Static Content

A Static Content displays static HTML content.

Static content

Properties:

Property Description
Name Name
Content Content
Font size Font size
Allow HTML Allow HTML-tags

Events: none

A Dropdown Trigger can be used to allow for extended user input.

Original control

Dropdown trigger

Properties:

Property Description
Name Name
Items Data for showing in drop-down. You might to set URL in target column directly.
Default value Label text
ImageUrl Image before label

Events:

Event Description
onItemClick onClick on item event