Toggle

The Toggle component is a customizable switch control designed to be used in forms.

Schema

[
    {
        "name": "toggle-feature",
        "meta": {
            "displayName": "Enable Feature",
            "description": "Toggle to enable or disable the feature.",
            "displayType": "toggle",
            "readOnly": false,
            "value": false,
            "validation": {
                "disabled": false
            }
        }
    },
    {
        "name": "toggle-feature-2",
        "meta": {
            "displayName": "Disabled Feature",
            "description": "Soon Feature",
            "displayType": "toggle",
            "value": false,
            "readOnly": false,
            "validation": {
                "disabled": true
            }
        }
    }
]

Example

Form Data:

{}

Schema for a Required Switch

[
    {
        "name": "toggle-feature",
        "form": {
            "displayName": "Enable Feature",
            "displayType": "toggle",
            "description": "Toggle to enable or disable the feature.",
            "value": false,
            "validation": {
                "required": true,
                "disabled": false
            }
        }
    }
]

Schema for a Disabled Switch

[
    {
        "name": "toggle-feature-disabled",
        "meta": {
            "displayName": "Enable Feature (Disabled)",
            "displayType": "toggle",
            "description": "This switch is disabled.",
            "value": false,
            "validation": {
                "required": false,
                "disabled": true
            }
        }
    }
]

Schema for a Switch with Initial Value Set to True

[
    {
        "name": "toggle-feature-on",
        "meta": {
            "displayName": "Enable Feature (Initially On)",
            "displayType": "toggle",
            "description": "This switch is initially on.",
            "value": true,
            "validation": {
                "required": false,
                "disabled": false
            }
        }
    }
]

Field Properties

Properties used by this field (inside form field in schema)

Name	Description	Type
`name`	The unique identifier for the switch control instance.	string
`displayName`	A string that sets the display name of the switch control.	string
`description`	A string providing additional information or instructions about the switch control.	string
`value`	The initial value of the switch control.	boolean
`validation`	An object for validation rules.	object
`required`	A boolean indicating if the switch control is required (within validation).	boolean
`readOnly`	A readonly field is not editable and value cannot be changed	boolean
`disabled`	A boolean indicating if the switch control is disabled (within validation).	boolean

Field Properties - Validation Details

The validation settings within the Textarea component are crucial for ensuring that user input meets specific requirements. Here’s a breakdown of the available validation properties:

`Property`	`Description`
`required`	Boolean value that specifies whether entering data into the field is mandatory.
`validate`	A function for custom validation logic, which can return a boolean or an error message.
`requiredDetail`	Contains info msgs about the required validation property

Schema​

Example​

Schema for a Required Switch​

Schema for a Disabled Switch​

Schema for a Switch with Initial Value Set to True​

Field Properties​

Field Properties - Validation Details​