@react-md/form/es/slider/useSlider.js

This package is for creating all the different form input types.

var __read = (this && this.__read) || function (o, n) {
    var m = typeof Symbol === "function" && o[Symbol.iterator];
    if (!m) return o;
    var i = m.call(o), r, ar = [], e;
    try {
        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
    }
    catch (error) { e = { error: error }; }
    finally {
        try {
            if (r && !r.done && (m = i["return"])) m.call(i);
        }
        finally { if (e) throw e.error; }
    }
    return ar;
};
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { nearest } from "@react-md/utils";
import { DEFAULT_SLIDER_MAX, DEFAULT_SLIDER_MIN, DEFAULT_SLIDER_STEP, } from "./constants";
import { getJumpValue, getSteps } from "./utils";
var noop = function () {
    // do nothing
};
/**
 * This hook is used to control the value and behavior of the `Slider`
 * component. The first argument will contain the current slider value while
 * the second argument will be all the props required to control the `Slider`
 * component.
 *
 * @param defaultValue - An optional default value to use for the slider. This
 * will default to the `min` option when undefined.
 * @param options - An object containing the `min` and `max` values allowed for
 * the slider as well as a `step` to indicate valid values between the `min` and
 * `max`.
 * @returns an ordered list containing the current value followed by the
 * `Slider` props
 * @remarks \@since 2.5.0
 */
export function useSlider(defaultValue, _a) {
    var _b = _a === void 0 ? {} : _a, _c = _b.min, min = _c === void 0 ? DEFAULT_SLIDER_MIN : _c, _d = _b.max, max = _d === void 0 ? DEFAULT_SLIDER_MAX : _d, _e = _b.step, step = _e === void 0 ? DEFAULT_SLIDER_STEP : _e, propJump = _b.jump, _f = _b.updateOn, updateOn = _f === void 0 ? "change" : _f, _g = _b.onChange, onChange = _g === void 0 ? noop : _g;
    var jump = useMemo(function () { return getJumpValue(min, max, step, propJump); }, [min, max, step, propJump]);
    // since the `currentValue` is a ref, this state is used to force a re-render
    // to get the updated value from the ref.
    var _h = __read(useState([]), 2), hack = _h[1];
    var _j = __read(useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : min), 2), value = _j[0], setValue = _j[1];
    var currentValue = useRef(value);
    var increment = useCallback(function () {
        setValue(function (prevValue) { return Math.max(min, Math.min(max, prevValue + step)); });
    }, [min, max, step]);
    var incrementJump = useCallback(function () {
        setValue(function (prevValue) { return Math.max(min, Math.min(max, prevValue + jump)); });
    }, [min, max, jump]);
    var decrement = useCallback(function () {
        setValue(function (prevValue) { return Math.max(min, Math.min(max, prevValue - step)); });
    }, [min, max, step]);
    var decrementJump = useCallback(function () {
        setValue(function (prevValue) { return Math.max(min, Math.min(max, prevValue - jump)); });
    }, [min, max, jump]);
    var minimum = useCallback(function () {
        setValue(min);
    }, [min]);
    var maximum = useCallback(function () {
        setValue(max);
    }, [max]);
    var persist = useCallback(function () {
        if (currentValue.current === value) {
            return;
        }
        onChange(value);
        currentValue.current = value;
        hack([]);
    }, [onChange, value]);
    var prev = useRef({ min: min, max: max, step: step });
    useEffect(function () {
        if (prev.current.min !== min ||
            prev.current.max !== max ||
            prev.current.step !== step) {
            // ensure that if the `min`, `max`, or `step` value changes that the value
            // is updated as well. Without this, there will be a runtime error if the
            // value is not within the new range.
            prev.current = { min: min, max: max, step: step };
            var nextValue = nearest(value, min, max, getSteps(min, max, step));
            currentValue.current = nextValue;
            setValue(nextValue);
        }
    }, [min, max, step, value]);
    if (updateOn === "change" && currentValue.current !== value) {
        currentValue.current = value;
    }
    return [
        currentValue.current,
        {
            min: min,
            max: max,
            step: step,
            value: value,
            increment: increment,
            incrementJump: incrementJump,
            decrement: decrement,
            decrementJump: decrementJump,
            minimum: minimum,
            maximum: maximum,
            persist: persist,
            setValue: setValue,
        },
    ];
}
//# sourceMappingURL=useSlider.js.map