Buttons

Loupe UX supports several types of button behaviors. To specify the behavior, add the appropriate class to the HTML element.

Set Buttons

Set buttons write a value to a variable when they are pressed.

Class name: lux-btn-set

Attribute	Description	Default Value
data-set-value	Value to write when pressed	true

Momentary Buttons

Momentary buttons write one value to a variable when they are pressed and another value when they are released (like a jog button).

Class name: lux-btn-momentary

Attribute	Description	Default Value
data-set-value	Value to write when pressed	true
data-reset-value	Value to write when released	false

Toggle Buttons

Toggle buttons toggle a variable value between two possible values. The value written depends on the current value of the variable as read from the machine. When the value is equal to data-set-value, the toggle-active class is added to the element.

Class name: lux-btn-toggle

Attribute	Description	Default Value
data-set-value	Value to write when the current value is not equal to data-set-value	true
data-reset-value	Value to write when the current value is equal to data-set-value	false

Button Modifiers

Modify the behavior of the set, momentary, and toggle buttons by adding additional Loupe UX classes.

Class Name	Description
lux-confirm	Produce an on-click modal prompt asking the user for confirmation prior to execution
lux-ignore-bubbling	Respond only to clicks of which button is the sole target (use case: nested Loupe UX buttons)