palantir/blueprint

Add a "onGrab" event to the Slider

Open

#3,575 opened on May 29, 2019

View on GitHub
 (5 comments) (0 reactions) (0 assignees)TypeScript (20,263 stars) (2,167 forks)batch import
P2Package: coreType: feature requesthelp wanted

Description

Environment

Package version: @blueprintjs/core 3.15.1 Browser: Chrome 74+

Feature request

Currently the slider supports an onChange and onRelease event - it would be useful to also have an onGrab (or similar) event which is invoked when the user grabs the slider handle without releasing it.

Examples

A scenario when this would be useful is when using the slider as a scrubber control for a video. If the value of the slider is updated due to the user grabbing the handle and sliding, we would want to:

  • Immediately reflect the new value in the slider so that it stays responsive; but
  • Debounce the updates that tell the video to load at the current time. Otherwise we end up loading/trying to show a lot of "intermediate" frames that just get dropped as the user slides the handle.

Contributor guide

Tech stack
typescriptreact
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
ReactTypeScriptBlueprint Slider component
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
75
Research direction
Investigate the Slider component implementation (likely in packages/core/src/components/slider) to understand how onChange and onRelease are currently handled. Identify where the handle grab event occurs (e.g., mousedown or touchstart). Add a new onGrab prop to the Slider interface and invoke it at the appropriate time. Ensure the new event is properly typed in TypeScript. Refer to existing event handlers for consistency.
Add a "onGrab" event to the Slider · palantir/blueprint#3575 | Good First Issue