Method onEnd

core/src/components/range/range.tsx:558–595

* The value should be updated on touch end: * - When the user lifts their finger from the screen after * tapping the bar. * * @param detail The details of the gesture or mouse event.

(detail: GestureDetail | MouseEvent)

   * @param detail The details of the gesture or mouse event.
   */
  private onEnd(detail: GestureDetail | MouseEvent) {
    const { contentEl, initialContentScrollY } = this;
    const currentX = (detail as GestureDetail).currentX ?? (detail as MouseEvent).clientX;

    /**
     * The `pressedKnob` can be undefined if the user never
     * dragged the knob. They just tapped on the bar.
     *
     * This is necessary to determine which knob the user is changing,
     * especially when using dual knobs.
     * Plus, it determines when to apply certain styles.
     */
    if (this.pressedKnob === undefined) {
      this.setPressedKnob(currentX);
    }

    /**
     * The user is no longer dragging the bar or
     * knob (if they were dragging it).
     *
     * The user can now scroll on the view in the next gesture event.
     */
    if (contentEl && this.pressedKnob !== undefined) {
      resetContentScrollY(contentEl, initialContentScrollY);
    }

    // update the active knob's position
    this.update(currentX);

    /**
     * Reset the pressed knob to undefined since the user
     * may start dragging a different knob in the next gesture event.
     */
    this.pressedKnob = undefined;

    this.emitValueChange();
    this.ionKnobMoveEnd.emit({ value: this.ensureValueInBounds(this.value) });
  }

  private update(currentX: number) {
    // figure out where the pointer is currently at