Interface: TouchSliderProps<S>
Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:11
Component props for TouchSlider.
Extends
ComponentProps
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.
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.
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
.
children?
optional
children:DisplayChildren
[]
Defined in: src/sdk/components/FSComponent.ts:122
The children of the display component.
Inherited from
ComponentProps.children
class?
optional
class:string
|SubscribableSet
<string
>
Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:155
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.
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.
focusOnDrag?
optional
focusOnDrag:boolean
Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:124
Whether the slider should focus all mouse events when dragging, preventing them from bubbling up to any ancestors
in the DOM tree. Defaults to false
.
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.
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
.
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.
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
.
isVisible?
optional
isVisible:boolean
|Subscribable
<boolean
>
Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:85
Whether the slider is visible. Defaults to true
.
lockFocusOnDrag?
optional
lockFocusOnDrag:boolean
Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:130
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 false
.
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
onDragEnded()?
optional
onDragEnded: <T
>(position
,initialPosition
,slider
) =>void
Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:72
A function which is called when a drag motion ends.
Type Parameters
Type Parameter | Default type |
---|---|
T extends TouchSlider <S , TouchSliderProps <S >> | TouchSlider <S , TouchSliderProps <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/garminsdk/components/touchslider/TouchSlider.tsx:59
A function which is called when the mouse is moved during a drag motion.
Type Parameters
Type Parameter | Default type |
---|---|
T extends TouchSlider <S , TouchSliderProps <S >> | TouchSlider <S , TouchSliderProps <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/garminsdk/components/touchslider/TouchSlider.tsx:50
A function which is called when a drag motion starts.
Type Parameters
Type Parameter | Default type |
---|---|
T extends TouchSlider <S , TouchSliderProps <S >> | TouchSlider <S , TouchSliderProps <S >> |
Parameters
Parameter | Type | Description |
---|---|---|
position | ReadonlyFloat64Array | The current position of the mouse. |
slider | T | The slider. |
Returns
void
onValueChanged()?
optional
onValueChanged: <T
>(value
,state
,slider
) =>void
Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:43
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 TouchSlider <S , TouchSliderProps <S >> | TouchSlider <S , TouchSliderProps <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.
ref?
optional
ref:NodeReference
<any
>
Defined in: src/sdk/components/FSComponent.ts:125
A reference to the display component.
Inherited from
ComponentProps.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.
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.
state
state:
S
Defined in: src/garminsdk/components/touchslider/TouchSlider.tsx:22
A subscribable whose state will be bound to the slider's value.
stops?
optional
stops: readonlynumber
[] |Subscribable
<readonlynumber
[]>
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]
.
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.