| Data                                      | Description                                                                                                                                                                                                                                                                                                                                                    |
| ----------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| <span className="ndl-data">Enabled</span> | {/*##output:enabled##*/}A boolean output that is true if the control is in **Enabled** state and false if it is **Disabled**. This is useful when using this control as a base for your own component that will represent visually that it is enabled or disabled.{/*##output##*/}                                                                                     |
| <span className="ndl-data">Focused</span> | {/*##output:focusState##*/}This is a boolean type output that will be true if the control is in **Focused** state, and false otherwise. This is useful when using this control as a base for your own component that will represent visually that it is focused. This can be due to the user selecting the control for input or by using the keyboard.{/*##output##*/} |
| <span className="ndl-data">Hover</span>   | {/*##output:hoverState##*/}A boolean type output that is true when the user hovers over this control with the mouse and false otherwise. This is useful when using this control as a base for your own component that will represent visually that it is hovered.{/*##output##*/}                                                                                      |
| <span className="ndl-data">Pressed</span> | {/*##output:pressedState##*/}A boolean output that is true when the user is currently pressing the control. This is useful when using this control as a base for your own component that will represent visually that it is pressed.{/*##output##*/}                                                                                                                   |