Interface: UiTouchSliderProps<S>

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:18

Component props for UiTouchSlider.

Extends

• Omit<TouchSliderProps<S>, "onValueChanged" | "onDragStarted" | "onDragMoved" | "onDragEnded" | "focusOnDrag" | "lockFocusOnDrag" | "class">

Type Parameters

Type Parameter
S extends Subscribable<number> | MutableSubscribable<number>

Properties

background?

optional background: VNode

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:91

The background for the slider, as a VNode. The background is visible along the area of the slider corresponding to values greater than the slider's current value.

Inherited from

Omit.background

---

bus?

optional bus: EventBus

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:16

The event bus. If defined, the mouse drags on the slider will end when the mouse leaves the instrument window, including when focus is locked.

Inherited from

Omit.bus

---

canBeFocused?

optional canBeFocused: boolean | Subscribable<boolean>

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:105

Whether the slider can be focused. Irrespective of this value, the slider cannot be focused while it is disabled or not visible. Defaults to true.

---

changeValueOnDrag?

optional changeValueOnDrag: boolean

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:34

Whether to change the slider's value immediately when dragging. If false, the slider's value will only be changed when dragging stops. Defaults to false.

Inherited from

Omit.changeValueOnDrag

---

children?

optional children: DisplayChildren[]

Defined in: src/sdk/components/FSComponent.ts:122

The children of the display component.

Inherited from

Omit.children

---

class?

optional class: string | ToggleableClassNameRecord | SubscribableSet<string>

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:111

CSS class(es) to apply to the slider's root element.

---

dragInhibitThresholdPx?

optional dragInhibitThresholdPx: number

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:149

The distance along the slider's cross-axis, in pixels, the mouse can click and drag before the slider begins to ignore mouse events. Ignored if inhibitOnDrag is false. Defaults to 40 pixels.

Inherited from

Omit.dragInhibitThresholdPx

---

dragLockFocusThresholdPx?

optional dragLockFocusThresholdPx: number

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:136

The distance along the slider's main axis, in pixels, the mouse must click and drag before the slider locks focus. Ignored if lockFocusOnDrag is false. Defaults to 10 pixels.

Inherited from

Omit.dragLockFocusThresholdPx

---

focusController?

optional focusController: UiFocusController

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:99

A UI focus controller with which to automatically register the slider after it is rendered. If not defined, then the slider will not be automatically registered with any controller, but it may still be registered manually.

---

focusOnDrag?

optional focusOnDrag: boolean

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:80

Whether the slider should focus all mouse events when dragging, preventing them from bubbling up to any ancestors in the DOM tree. Defaults to true.

---

focusOptions?

optional focusOptions: Readonly<UiTouchSliderFocusModuleOptions>

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:108

Options to configure the slider's behavior related to UI focus.

---

foreground?

optional foreground: VNode

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:97

The foreground for the slider, as a VNode. The foreground is visible along the area of the slider corresponding to values less than the slider's current value.

Inherited from

Omit.foreground

---

gduFormat?

optional gduFormat: GduFormat

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:93

The format of the slider's parent GDU display. Used to set the slider's drag lock focus and inhibit on drag thresholds unless otherwise specified by the dragLockFocusThresholdPx and dragInhibitThresholdPx props, respectively. Defaults to '460'.

---

inhibitOnDrag?

optional inhibitOnDrag: boolean

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:143

Whether the slider should stop responding to mouse events and instead forward them to its parent after clicking and dragging for a certain distance defined by dragThresholdPx along the slider's cross-axis. The inhibit function is disabled when focus is locked. Defaults to false.

Inherited from

Omit.inhibitOnDrag

---

inset?

optional inset: VNode

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:103

The inset for the slider, as a VNode. The inset is placed above the background and foreground and below the thumb and is always visible.

Inherited from

Omit.inset

---

isEnabled?

optional isEnabled: boolean | Subscribable<boolean>

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:82

Whether the slider is enabled, or a subscribable which provides it. Disabled sliders cannot be interacted with. Defaults to true.

Inherited from

Omit.isEnabled

---

isVisible?

optional isVisible: boolean | Subscribable<boolean>

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:85

Whether the slider is visible. Defaults to true.

Inherited from

Omit.isVisible

---

lockFocusOnDrag?

optional lockFocusOnDrag: boolean

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:86

Whether the slider should lock focus when dragging, consuming mouse events for the entire document window instead of just the slider's root element and disabling the inhibit function. Defaults to true.

---

onDestroy()?

optional onDestroy: () => void

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:152

A callback function which will be called when the slider is destroyed.

Returns

void

Inherited from

Omit.onDestroy

---

onDragEnded()?

optional onDragEnded: <T>(position, initialPosition, slider) => void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:58

A function which is called when a drag motion ends.

Type Parameters

Type Parameter	Default type
T extends UiTouchSlider<S>	UiTouchSlider<S>

Parameters

Parameter	Type	Description
position	ReadonlyFloat64Array	The current position of the mouse.
initialPosition	ReadonlyFloat64Array	The position of the mouse at the start of the drag motion.
slider	T	The slider.

Returns

void

---

onDragMoved()?

optional onDragMoved: <T>(position, prevPosition, initialPosition, slider) => void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:45

A function which is called when the mouse is moved during a drag motion.

Type Parameters

Type Parameter	Default type
T extends UiTouchSlider<S>	UiTouchSlider<S>

Parameters

Parameter	Type	Description
position	ReadonlyFloat64Array	The current position of the mouse.
prevPosition	ReadonlyFloat64Array	The position of the mouse at the previous update.
initialPosition	ReadonlyFloat64Array	The position of the mouse at the start of the current drag motion.
slider	T	The slider.

Returns

void

---

onDragStarted()?

optional onDragStarted: <T>(position, slider) => void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:36

A function which is called when a drag motion starts. If not defined, then the slider will default to attempting to set focus on itself when a drag motion starts.

Type Parameters

Type Parameter	Default type
T extends UiTouchSlider<S>	UiTouchSlider<S>

Parameters

Parameter	Type	Description
position	ReadonlyFloat64Array	The current position of the mouse.
slider	T	The slider.

Returns

void

---

onFocusGained()?

optional onFocusGained: <T>(slider, direction) => void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:68

A function which is called when the slider gains UI focus.

Type Parameters

Type Parameter	Default type
T extends UiTouchSlider<S>	UiTouchSlider<S>

Parameters

Parameter	Type	Description
slider	T	The slider that gained UI focus.
direction	UiFocusDirection	-

Returns

void

---

onFocusLost()?

optional onFocusLost: <T>(slider) => void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:74

A function which is called when the slider loses UI focus.

Type Parameters

Type Parameter	Default type
T extends UiTouchSlider<S>	UiTouchSlider<S>

Parameters

Parameter	Type	Description
slider	T	The slider that lost UI focus.

Returns

void

---

onValueChanged()?

optional onValueChanged: <T>(value, state, slider) => void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchSlider/UiTouchSlider.tsx:28

A function which is called when the slider's value changes from user input. If this function is not defined and the slider's bound state is a mutable subscribable, the new value will be automatically written to the bound state.

Type Parameters

Type Parameter	Default type
T extends UiTouchSlider<S>	UiTouchSlider<S>

Parameters

Parameter	Type	Description
value	number	The new slider value.
state	S	The slider's bound state.
slider	T	The slider.

Returns

void

---

orientation

orientation: "to-left" | "to-right" | "to-top" | "to-bottom"

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:19

The orientation of the slider's main axis.

Inherited from

Omit.orientation

---

ref?

optional ref: NodeReference<any>

Defined in: src/sdk/components/FSComponent.ts:125

A reference to the display component.

Inherited from

Omit.ref

---

snapAnimationEasing?

optional snapAnimationEasing: AnimatorEasingFunc

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:118

The easing function to apply to the snapping-to-stop animation. Defaults to a cubic ease-out function.

Inherited from

Omit.snapAnimationEasing

---

snapAnimationSpeed?

optional snapAnimationSpeed: number | Subscribable<number>

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:115

The speed of the animation when snapping to a stop, in units of slider value per second. A speed of zero will result in no animation. Defaults to zero.

Inherited from

Omit.snapAnimationSpeed

---

state

state: S

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:22

A subscribable whose state will be bound to the slider's value.

Inherited from

Omit.state

---

stops?

optional stops: readonly number[] | Subscribable<readonly number[]>

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:28

An array of stops on the slider, defined as values in the range [0, 1]. The slider will snap to each stop. If not defined or is equal to the empty array, then the slider will be able to take any value in the range [0, 1].

Inherited from

Omit.stops

---

thumb?

optional thumb: VNode

Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:109

The thumb for the slider, as a VNode. The thumb is placed at the location along the slider corresponding to the slider's current value.

Inherited from

Omit.thumb