# Switch property definition

Information noteSTABLE.   
  
This API is reliable and breaking changes are unlikely.

## Fields

The switch definition property template can be used to add a custom property of switch type. When defining a switch property, the following fields can be used:

### type

This field is mandatory and should always be "boolean" for a switch property type definition.

Information noteThe switch effect is achieved by defining the component field to "switch", see below.

### component

Used for defining how the property is visualized in the property panel. Used to override the default component that comes with the type setting.

This field is mandatory for a switch property and should always be "switch".

### label

Used for defining the label that is displayed in the property panel.

### ref

Name or ID used to reference a property.

### defaultValue

Used for defining the default value of your custom property.

### options

Array of options. Can be value and label.

Example:

```
options: [{
	value: "v",
	label: "Vertical"
}, {
	value: "h",
	label: "Horizontal"
}],
```

## Examples

Defining a custom property of switch type can look like below.

Example: Add custom switch property to Appearance accordion

Information noteCustomization of properties always start with items:.

```
	return {
		type: "items",
		component: "accordion",
		items: {
		settings: {
				uses: "settings",
				items: {
					MySwitchProp: {
						type: "boolean",
						component: "switch",
						label: "Switch me On",
						ref: "myproperties.border",
						options: [{
							value: true,
							label: "On"
						}, {
							value: false,
							label: "Not On"
						}],
						defaultValue: true
					}
				}
			}
```

This is what it looks like in the property panel

![An interface titled "MyNewExtension" with the subtitle "Appearance". Under "Appearance", there are two hide and show buttons called "General" and "Switch me On". "Switch me On" contains a toggle button, which is toggled to "On"](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/APIs/Content/Resources/Images/ex_ExtensionPropertiesCustomSwitchProp.png)

You can also define a new accordion item as a switch property.

Example: Add custom switch property as a new accordion item

```
	return {
		type: "items",
		component: "accordion",
		items: {
			MyAccordion: {
				type: "boolean",
				component: "switch",
				label: "Switch me Off",
				ref: "myproperties.border",
				options: [{
					value: true,
					label: "On"
				}, {
					value: false,
					label: "Not on"
				}],
				defaultValue: false
			}
```

This is what it looks like in the property panel

![An interface titled "MyNewExtension" with the subtitle "Switch me Off". Under "Switch me Off", there is a toggle button labelled "Not on", with the button toggled off.](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/APIs/Content/Resources/Images/ex_ExtensionPropertiesCustomSwitchProp2.png)