@fluentui/react-slider 1.0.0-beta.99 → 9.0.0-alpha.12

package/lib-commonjs/components/Slider/useSlider.js

@@ -1,280 +1,117 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSlider = exports.ONKEYDOWN_TIMEOUT_DURATION = void 0;
-var tslib_1 = require("tslib");
-var React = require("react");
-var react_hooks_1 = require("@fluentui/react-hooks");
-var utilities_1 = require("@fluentui/utilities");
-exports.ONKEYDOWN_TIMEOUT_DURATION = 1000;
-var getClassNames = utilities_1.classNamesFunction();
-var getSlotStyleFn = function (sty) {
-    return function (value) {
-        var _a;
-        return _a = {},
-            _a[sty] = value + "%",
-            _a;
-    };
-};
-var getPositionStyleFn = function (vertical, rtl) {
-    if (vertical === void 0) { vertical = false; }
-    if (rtl === void 0) { rtl = false; }
-    if (vertical) {
-        return getSlotStyleFn('bottom');
-    }
-    return getSlotStyleFn(rtl ? 'right' : 'left');
-};
-var getPercent = function (value, sliderMin, sliderMax) {
-    return sliderMax === sliderMin ? 0 : ((value - sliderMin) / (sliderMax - sliderMin)) * 100;
-};
-var getLineSectionStylesFn = function (vertical) {
-    if (vertical === void 0) { vertical = false; }
-    var lengthString = vertical ? 'height' : 'width';
-    return getSlotStyleFn(lengthString);
-};
-var useComponentRef = function (props, thumb, value) {
-    React.useImperativeHandle(props.componentRef, function () { return ({
-        get value() {
-            return value;
-        },
-        focus: function () {
-            if (thumb.current) {
-                thumb.current.focus();
-            }
-        },
-    }); }, [thumb, value]);
-};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useSlider = exports.sliderShorthandProps = void 0;
+
+var tslib_1 = /*#__PURE__*/require("tslib");
+
+var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+
+var useSliderState_1 = /*#__PURE__*/require("./useSliderState");
+/**
+ * Array of all shorthand properties listed in sliderShorthandProps
+ */
+
+
+exports.sliderShorthandProps = ['root', 'activeRail', 'input', 'rail', 'sliderWrapper', 'thumb', 'thumbWrapper', 'track', 'trackWrapper', 'marksWrapper'];
+/**
+ * Given user props, returns state and render function for a Slider.
+ */
+
 var useSlider = function (props, ref) {
-    var _a = props.step, step = _a === void 0 ? 1 : _a, className = props.className, _b = props.disabled, disabled = _b === void 0 ? false : _b, label = props.label, _c = props.max, max = _c === void 0 ? 10 : _c, _d = props.min, min = _d === void 0 ? 0 : _d, _e = props.showValue, showValue = _e === void 0 ? true : _e, _f = props.buttonProps, buttonProps = _f === void 0 ? {} : _f, _g = props.vertical, vertical = _g === void 0 ? false : _g, valueFormat = props.valueFormat, styles = props.styles, theme = props.theme, originFromZero = props.originFromZero, ariaLabel = props["aria-label"];
-    var disposables = React.useRef([]);
-    var sliderLine = React.useRef(null);
-    var _h = react_hooks_1.useControllableValue(props.value, props.defaultValue, function (ev, v) { return props.onChange && props.onChange(v); }), unclampedValue = _h[0], setValue = _h[1];
-    // Ensure that value is always a number and is clamped by min/max.
-    var value = Math.max(min, Math.min(max, unclampedValue || 0));
-    var id = react_hooks_1.useId('Slider');
-    var _j = react_hooks_1.useBoolean(true), useShowTransitions = _j[0], toggleUseShowTransitions = _j[1].toggle;
-    var classNames = getClassNames(styles, {
-        className: className,
-        disabled: disabled,
-        vertical: vertical,
-        showTransitions: useShowTransitions,
-        showValue: showValue,
-        theme: theme,
-    });
-    var _k = React.useState(0), timerId = _k[0], setTimerId = _k[1];
-    var clearOnKeyDownTimer = function () {
-        clearTimeout(timerId);
-    };
-    var setOnKeyDownTimer = function (event) {
-        clearOnKeyDownTimer();
-        setTimerId(setTimeout(function () {
-            if (props.onChanged) {
-                props.onChanged(event, value);
-            }
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        }, exports.ONKEYDOWN_TIMEOUT_DURATION));
-    };
-    var getAriaValueText = function (valueProps) {
-        var ariaValueText = props.ariaValueText;
-        if (valueProps !== undefined) {
-            return ariaValueText ? ariaValueText(valueProps) : valueProps.toString();
-        }
-        return undefined;
-    };
-    var updateValue = function (valueProp, renderedValueProp) {
-        var snapToStep = props.snapToStep;
-        var numDec = 0;
-        if (isFinite(step)) {
-            while (Math.round(step * Math.pow(10, numDec)) / Math.pow(10, numDec) !== step) {
-                numDec++;
-            }
-        }
-        // Make sure value has correct number of decimal places based on number of decimals in step
-        var roundedValue = parseFloat(valueProp.toFixed(numDec));
-        if (snapToStep) {
-            renderedValueProp = roundedValue;
-        }
-        setValue(roundedValue);
-    };
-    var onKeyDown = function (event) {
-        var newCurrentValue = value;
-        var diff = 0;
-        // eslint-disable-next-line deprecation/deprecation
-        switch (event.which) {
-            case utilities_1.getRTLSafeKeyCode(utilities_1.KeyCodes.left, props.theme):
-            case utilities_1.KeyCodes.down:
-                diff = -step;
-                clearOnKeyDownTimer();
-                setOnKeyDownTimer(event);
-                break;
-            case utilities_1.getRTLSafeKeyCode(utilities_1.KeyCodes.right, props.theme):
-            case utilities_1.KeyCodes.up:
-                diff = step;
-                clearOnKeyDownTimer();
-                setOnKeyDownTimer(event);
-                break;
-            case utilities_1.KeyCodes.home:
-                newCurrentValue = min;
-                break;
-            case utilities_1.KeyCodes.end:
-                newCurrentValue = max;
-                break;
-            default:
-                return;
-        }
-        var newValue = Math.min(max, Math.max(min, newCurrentValue + diff));
-        updateValue(newValue, newValue);
-        event.preventDefault();
-        event.stopPropagation();
-    };
-    var getPosition = function (event, verticalProp) {
-        var currentPosition;
-        switch (event.type) {
-            case 'mousedown':
-            case 'mousemove':
-                currentPosition = !verticalProp ? event.clientX : event.clientY;
-                break;
-            case 'touchstart':
-            case 'touchmove':
-                currentPosition = !verticalProp
-                    ? event.touches[0].clientX
-                    : event.touches[0].clientY;
-                break;
-        }
-        return currentPosition;
-    };
-    var onMouseMoveOrTouchMove = function (event, suppressEventCancelation) {
-        if (!sliderLine.current) {
-            return;
-        }
-        var steps = (max - min) / step;
-        var sliderPositionRect = sliderLine.current.getBoundingClientRect();
-        var sliderLength = !props.vertical ? sliderPositionRect.width : sliderPositionRect.height;
-        var stepLength = sliderLength / steps;
-        var currentSteps;
-        var distance;
-        if (!props.vertical) {
-            var left = getPosition(event, props.vertical);
-            distance = utilities_1.getRTL(props.theme) ? sliderPositionRect.right - left : left - sliderPositionRect.left;
-            currentSteps = distance / stepLength;
-        }
-        else {
-            var bottom = getPosition(event, props.vertical);
-            distance = sliderPositionRect.bottom - bottom;
-            currentSteps = distance / stepLength;
-        }
-        var newCurrentValue;
-        var newRenderedValue;
-        // The value shouldn't be bigger than max or be smaller than min.
-        if (currentSteps > Math.floor(steps)) {
-            newRenderedValue = newCurrentValue = max;
-        }
-        else if (currentSteps < 0) {
-            newRenderedValue = newCurrentValue = min;
-        }
-        else {
-            newRenderedValue = min + step * currentSteps;
-            newCurrentValue = min + step * Math.round(currentSteps);
-        }
-        updateValue(newCurrentValue, newRenderedValue);
-        if (!suppressEventCancelation) {
-            event.preventDefault();
-            event.stopPropagation();
-        }
-    };
-    var onMouseDownOrTouchStart = function (event) {
-        if (event.type === 'mousedown') {
-            disposables.current.push(utilities_1.on(window, 'mousemove', onMouseMoveOrTouchMove, true), utilities_1.on(window, 'mouseup', onMouseUpOrTouchEnd, true));
-        }
-        else if (event.type === 'touchstart') {
-            disposables.current.push(utilities_1.on(window, 'touchmove', onMouseMoveOrTouchMove, true), utilities_1.on(window, 'touchend', onMouseUpOrTouchEnd, true));
-        }
-        toggleUseShowTransitions();
-        onMouseMoveOrTouchMove(event, true);
-    };
-    var onMouseUpOrTouchEnd = function (event) {
-        if (props.onChanged) {
-            props.onChanged(event, value);
-        }
-        toggleUseShowTransitions();
-        disposeListeners();
-    };
-    var disposeListeners = function () {
-        disposables.current.forEach(function (dispose) { return dispose(); });
-        disposables.current = [];
-    };
-    var onMouseDownProp = disabled ? {} : { onMouseDown: onMouseDownOrTouchStart };
-    var onTouchStartProp = disabled ? {} : { onTouchStart: onMouseDownOrTouchStart };
-    var onKeyDownProp = disabled ? {} : { onKeyDown: onKeyDown };
-    var thumbRef = React.useRef(null);
-    useComponentRef(props, thumbRef, value);
-    var getPositionStyles = getPositionStyleFn(vertical, utilities_1.getRTL(props.theme));
-    var getTrackStyles = getLineSectionStylesFn(vertical);
-    var originValue = originFromZero ? 0 : min;
-    var valuePercent = getPercent(value, min, max);
-    var originPercentOfLine = getPercent(originValue, min, max);
-    var activeSectionWidth = Math.abs(originPercentOfLine - valuePercent);
-    var topSectionWidth = Math.min(100 - valuePercent, 100 - originPercentOfLine);
-    var bottomSectionWidth = Math.min(valuePercent, originPercentOfLine);
-    var rootProps = {
-        className: classNames.root,
-        ref: ref,
-    };
-    var divButtonProps = buttonProps
-        ? utilities_1.getNativeProps(buttonProps, utilities_1.divProperties)
-        : undefined;
-    var labelProps = {
-        className: classNames.titleLabel,
-        children: label,
-        disabled: disabled,
-        htmlFor: ariaLabel ? undefined : id,
-    };
-    var valueLabelProps = showValue && {
-        className: classNames.valueLabel,
-        children: valueFormat ? valueFormat(value) : value,
-        disabled: disabled,
-    };
-    var thumbProps = {
-        ref: thumbRef,
-        className: classNames.thumb,
-        style: getPositionStyles(valuePercent),
-    };
-    var zeroTickProps = originFromZero && {
-        className: classNames.zeroTick,
-        style: getPositionStyles(originPercentOfLine),
-    };
-    var trackActiveProps = {
-        className: utilities_1.css(classNames.lineContainer, classNames.activeSection),
-        style: getTrackStyles(activeSectionWidth),
-    };
-    var trackTopInactiveProps = {
-        className: utilities_1.css(classNames.lineContainer, classNames.inactiveSection),
-        style: getTrackStyles(topSectionWidth),
-    };
-    var trackBottomInactiveProps = {
-        className: utilities_1.css(classNames.lineContainer, classNames.inactiveSection),
-        style: getTrackStyles(bottomSectionWidth),
-    };
-    var sliderBoxProps = tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({ id: id, 'aria-valuenow': value, 'aria-valuemin': min, 'aria-valuemax': max, 'aria-valuetext': getAriaValueText(value), 'aria-label': ariaLabel || label, 'aria-disabled': disabled }, onMouseDownProp), onTouchStartProp), onKeyDownProp), divButtonProps), { className: utilities_1.css(classNames.slideBox, buttonProps.className), role: 'slider', tabIndex: disabled ? undefined : 0, 'data-is-focusable': !disabled });
-    var containerProps = {
-        className: classNames.container,
-    };
-    var sliderLineProps = {
-        ref: sliderLine,
-        className: classNames.line,
-    };
-    return {
-        root: rootProps,
-        label: labelProps,
-        sliderBox: sliderBoxProps,
-        container: containerProps,
-        valueLabel: valueLabelProps,
-        thumb: thumbProps,
-        zeroTick: zeroTickProps,
-        activeTrack: trackActiveProps,
-        topInactiveTrack: trackTopInactiveProps,
-        bottomInactiveTrack: trackBottomInactiveProps,
-        sliderLine: sliderLineProps,
-    };
+  var // Props
+  value = props.value,
+      defaultValue = props.defaultValue,
+      min = props.min,
+      max = props.max,
+      _a = props.step,
+      step = _a === void 0 ? 1 : _a,
+      keyboardStep = props.keyboardStep,
+      disabled = props.disabled,
+      ariaValueText = props.ariaValueText,
+      onChange = props.onChange,
+      marks = props.marks,
+      vertical = props.vertical,
+      _b = props.size,
+      size = _b === void 0 ? 'medium' : _b,
+      origin = props.origin,
+      // Slots
+  activeRail = props.activeRail,
+      input = props.input,
+      marksWrapper = props.marksWrapper,
+      rail = props.rail,
+      sliderWrapper = props.sliderWrapper,
+      thumb = props.thumb,
+      thumbWrapper = props.thumbWrapper,
+      track = props.track,
+      trackWrapper = props.trackWrapper;
+  var state = {
+    ariaValueText: ariaValueText,
+    defaultValue: defaultValue,
+    disabled: disabled,
+    keyboardStep: keyboardStep,
+    marks: marks,
+    max: max,
+    min: min,
+    onChange: onChange,
+    origin: origin,
+    size: size,
+    step: step,
+    vertical: vertical,
+    value: value,
+    components: {
+      activeRail: 'div',
+      input: 'input',
+      marksWrapper: 'div',
+      rail: 'div',
+      root: 'div',
+      sliderWrapper: 'div',
+      thumb: 'div',
+      thumbWrapper: 'div',
+      track: 'div',
+      trackWrapper: 'div'
+    },
+    root: react_utilities_1.getNativeElementProps('span', tslib_1.__assign(tslib_1.__assign({
+      ref: ref
+    }, props), {
+      id: react_utilities_1.useId('slider-', props.id)
+    })),
+    activeRail: react_utilities_1.resolveShorthand(activeRail, {
+      required: true
+    }),
+    input: react_utilities_1.resolveShorthand(input, {
+      required: true,
+      defaultProps: {
+        type: 'range'
+      }
+    }),
+    marksWrapper: react_utilities_1.resolveShorthand(marksWrapper, {
+      required: true
+    }),
+    rail: react_utilities_1.resolveShorthand(rail, {
+      required: true
+    }),
+    sliderWrapper: react_utilities_1.resolveShorthand(sliderWrapper, {
+      required: true
+    }),
+    thumb: react_utilities_1.resolveShorthand(thumb, {
+      required: true
+    }),
+    thumbWrapper: react_utilities_1.resolveShorthand(thumbWrapper, {
+      required: true
+    }),
+    track: react_utilities_1.resolveShorthand(track, {
+      required: true
+    }),
+    trackWrapper: react_utilities_1.resolveShorthand(trackWrapper, {
+      required: true
+    })
+  };
+  useSliderState_1.useSliderState(state);
+  return state;
 };
+
 exports.useSlider = useSlider;
 //# sourceMappingURL=useSlider.js.map

package/lib-commonjs/components/Slider/useSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSlider.js","sourceRoot":"../src/","sources":["components/Slider/useSlider.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ISliderProps, ISliderStyleProps, ISliderStyles } from './Slider.types';\nimport { useId, useBoolean, useControllableValue } from '@fluentui/react-hooks';\nimport {\n  KeyCodes,\n  css,\n  getRTL,\n  getRTLSafeKeyCode,\n  on,\n  classNamesFunction,\n  getNativeProps,\n  divProperties,\n} from '@fluentui/utilities';\n\nexport const ONKEYDOWN_TIMEOUT_DURATION = 1000;\n\nconst getClassNames = classNamesFunction<ISliderStyleProps, ISliderStyles>();\n\ntype Dimension = 'height' | 'width';\ntype Position = 'bottom' | 'left' | 'right';\ntype PositionOrDimension = Dimension | Position;\n\nconst getSlotStyleFn = (sty: PositionOrDimension) => {\n  return (value: number) => {\n    return {\n      [sty]: `${value}%`,\n    };\n  };\n};\nconst getPositionStyleFn = (vertical: boolean = false, rtl: boolean = false) => {\n  if (vertical) {\n    return getSlotStyleFn('bottom');\n  }\n  return getSlotStyleFn(rtl ? 'right' : 'left');\n};\n\nconst getPercent = (value: number, sliderMin: number, sliderMax: number) => {\n  return sliderMax === sliderMin ? 0 : ((value! - sliderMin!) / (sliderMax! - sliderMin!)) * 100;\n};\n\nconst getLineSectionStylesFn = (vertical: boolean = false) => {\n  const lengthString = vertical ? 'height' : 'width';\n  return getSlotStyleFn(lengthString);\n};\n\nconst useComponentRef = (props: ISliderProps, thumb: React.RefObject<HTMLSpanElement>, value: number | undefined) => {\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      get value() {\n        return value;\n      },\n      focus() {\n        if (thumb.current) {\n          thumb.current.focus();\n        }\n      },\n    }),\n    [thumb, value],\n  );\n};\n\nexport const useSlider = (props: ISliderProps, ref: React.Ref<HTMLDivElement>) => {\n  const {\n    step = 1,\n    className,\n    disabled = false,\n    label,\n    max = 10,\n    min = 0,\n    showValue = true,\n    buttonProps = {},\n    vertical = false,\n    valueFormat,\n    styles,\n    theme,\n    originFromZero,\n    'aria-label': ariaLabel,\n  } = props;\n\n  const disposables = React.useRef<(() => void)[]>([]);\n  const sliderLine = React.useRef<HTMLDivElement>(null);\n\n  const [unclampedValue, setValue] = useControllableValue(\n    props.value,\n    props.defaultValue,\n    (ev: React.FormEvent<HTMLElement> | undefined, v: ISliderProps['value']) => props.onChange && props.onChange(v!),\n  );\n\n  // Ensure that value is always a number and is clamped by min/max.\n  const value = Math.max(min, Math.min(max, unclampedValue || 0));\n  const id = useId('Slider');\n  const [useShowTransitions, { toggle: toggleUseShowTransitions }] = useBoolean(true);\n  const classNames = getClassNames(styles, {\n    className,\n    disabled,\n    vertical,\n    showTransitions: useShowTransitions,\n    showValue,\n    theme: theme!,\n  });\n\n  const [timerId, setTimerId] = React.useState(0);\n\n  const clearOnKeyDownTimer = (): void => {\n    clearTimeout(timerId);\n  };\n\n  const setOnKeyDownTimer = (event: KeyboardEvent) => {\n    clearOnKeyDownTimer();\n    setTimerId(\n      setTimeout(() => {\n        if (props.onChanged) {\n          props.onChanged(event, value as number);\n        }\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      }, ONKEYDOWN_TIMEOUT_DURATION) as any,\n    );\n  };\n\n  const getAriaValueText = (valueProps: number | undefined): string | undefined => {\n    const { ariaValueText } = props;\n    if (valueProps !== undefined) {\n      return ariaValueText ? ariaValueText(valueProps) : valueProps.toString();\n    }\n    return undefined;\n  };\n\n  const updateValue = (valueProp: number, renderedValueProp: number): void => {\n    const { snapToStep } = props;\n    let numDec = 0;\n    if (isFinite(step!)) {\n      while (Math.round(step! * Math.pow(10, numDec)) / Math.pow(10, numDec) !== step!) {\n        numDec++;\n      }\n    }\n    // Make sure value has correct number of decimal places based on number of decimals in step\n    const roundedValue = parseFloat(valueProp.toFixed(numDec));\n\n    if (snapToStep) {\n      renderedValueProp = roundedValue;\n    }\n    setValue(roundedValue);\n  };\n\n  const onKeyDown = (event: KeyboardEvent): void => {\n    let newCurrentValue: number | undefined = value;\n    let diff: number | undefined = 0;\n    // eslint-disable-next-line deprecation/deprecation\n    switch (event.which) {\n      case getRTLSafeKeyCode(KeyCodes.left, props.theme):\n      case KeyCodes.down:\n        diff = -(step as number);\n        clearOnKeyDownTimer();\n        setOnKeyDownTimer(event);\n        break;\n      case getRTLSafeKeyCode(KeyCodes.right, props.theme):\n      case KeyCodes.up:\n        diff = step;\n        clearOnKeyDownTimer();\n        setOnKeyDownTimer(event);\n        break;\n      case KeyCodes.home:\n        newCurrentValue = min;\n        break;\n      case KeyCodes.end:\n        newCurrentValue = max;\n        break;\n      default:\n        return;\n    }\n    const newValue: number = Math.min(max as number, Math.max(min as number, newCurrentValue! + diff!));\n    updateValue(newValue, newValue);\n    event.preventDefault();\n    event.stopPropagation();\n  };\n\n  const getPosition = (event: MouseEvent | TouchEvent, verticalProp: boolean | undefined): number | undefined => {\n    let currentPosition: number | undefined;\n    switch (event.type) {\n      case 'mousedown':\n      case 'mousemove':\n        currentPosition = !verticalProp ? (event as MouseEvent).clientX : (event as MouseEvent).clientY;\n        break;\n      case 'touchstart':\n      case 'touchmove':\n        currentPosition = !verticalProp\n          ? (event as TouchEvent).touches[0].clientX\n          : (event as TouchEvent).touches[0].clientY;\n        break;\n    }\n    return currentPosition;\n  };\n\n  const onMouseMoveOrTouchMove = (event: MouseEvent | TouchEvent, suppressEventCancelation?: boolean): void => {\n    if (!sliderLine.current) {\n      return;\n    }\n    const steps: number = (max! - min!) / step!;\n    const sliderPositionRect: ClientRect = sliderLine.current.getBoundingClientRect();\n    const sliderLength: number = !props.vertical ? sliderPositionRect.width : sliderPositionRect.height;\n    const stepLength: number = sliderLength / steps;\n    let currentSteps: number | undefined;\n    let distance: number | undefined;\n    if (!props.vertical) {\n      const left: number | undefined = getPosition(event, props.vertical);\n      distance = getRTL(props.theme) ? sliderPositionRect.right - left! : left! - sliderPositionRect.left;\n      currentSteps = distance / stepLength;\n    } else {\n      const bottom: number | undefined = getPosition(event, props.vertical);\n      distance = sliderPositionRect.bottom - bottom!;\n      currentSteps = distance / stepLength;\n    }\n    let newCurrentValue: number | undefined;\n    let newRenderedValue: number | undefined;\n    // The value shouldn't be bigger than max or be smaller than min.\n    if (currentSteps! > Math.floor(steps)) {\n      newRenderedValue = newCurrentValue = max as number;\n    } else if (currentSteps! < 0) {\n      newRenderedValue = newCurrentValue = min as number;\n    } else {\n      newRenderedValue = min! + step! * currentSteps!;\n      newCurrentValue = min! + step! * Math.round(currentSteps!);\n    }\n    updateValue(newCurrentValue, newRenderedValue);\n    if (!suppressEventCancelation) {\n      event.preventDefault();\n      event.stopPropagation();\n    }\n  };\n\n  const onMouseDownOrTouchStart = (event: MouseEvent | TouchEvent): void => {\n    if (event.type === 'mousedown') {\n      disposables.current.push(\n        on(window, 'mousemove', onMouseMoveOrTouchMove as (ev: Event) => void, true),\n        on(window, 'mouseup', onMouseUpOrTouchEnd as (ev: Event) => void, true),\n      );\n    } else if (event.type === 'touchstart') {\n      disposables.current.push(\n        on(window, 'touchmove', onMouseMoveOrTouchMove as (ev: Event) => void, true),\n        on(window, 'touchend', onMouseUpOrTouchEnd as (ev: Event) => void, true),\n      );\n    }\n    toggleUseShowTransitions();\n    onMouseMoveOrTouchMove(event, true);\n  };\n\n  const onMouseUpOrTouchEnd = (event: MouseEvent | TouchEvent): void => {\n    if (props.onChanged) {\n      props.onChanged(event, value as number);\n    }\n    toggleUseShowTransitions();\n    disposeListeners();\n  };\n\n  const disposeListeners = (): void => {\n    disposables.current.forEach(dispose => dispose());\n    disposables.current = [];\n  };\n\n  const onMouseDownProp: {} = disabled ? {} : { onMouseDown: onMouseDownOrTouchStart };\n  const onTouchStartProp: {} = disabled ? {} : { onTouchStart: onMouseDownOrTouchStart };\n  const onKeyDownProp: {} = disabled ? {} : { onKeyDown: onKeyDown };\n\n  const thumbRef = React.useRef<HTMLSpanElement>(null);\n  useComponentRef(props, thumbRef, value);\n  const getPositionStyles = getPositionStyleFn(vertical, getRTL(props.theme));\n  const getTrackStyles = getLineSectionStylesFn(vertical);\n  const originValue = originFromZero ? 0 : min;\n  const valuePercent = getPercent(value, min, max);\n  const originPercentOfLine = getPercent(originValue, min, max);\n  const activeSectionWidth = Math.abs(originPercentOfLine - valuePercent);\n  const topSectionWidth = Math.min(100 - valuePercent, 100 - originPercentOfLine);\n  const bottomSectionWidth = Math.min(valuePercent, originPercentOfLine);\n\n  const rootProps = {\n    className: classNames.root,\n    ref: ref,\n  };\n\n  const divButtonProps = buttonProps\n    ? getNativeProps<React.HTMLAttributes<HTMLDivElement>>(buttonProps, divProperties)\n    : undefined;\n\n  const labelProps = {\n    className: classNames.titleLabel,\n    children: label,\n    disabled,\n    htmlFor: ariaLabel ? undefined : id,\n  };\n\n  const valueLabelProps = showValue && {\n    className: classNames.valueLabel,\n    children: valueFormat ? valueFormat(value!) : value,\n    disabled,\n  };\n\n  const thumbProps = {\n    ref: thumbRef,\n    className: classNames.thumb,\n    style: getPositionStyles(valuePercent),\n  };\n\n  const zeroTickProps = originFromZero && {\n    className: classNames.zeroTick,\n    style: getPositionStyles(originPercentOfLine),\n  };\n\n  const trackActiveProps = {\n    className: css(classNames.lineContainer, classNames.activeSection),\n    style: getTrackStyles(activeSectionWidth),\n  };\n\n  const trackTopInactiveProps = {\n    className: css(classNames.lineContainer, classNames.inactiveSection),\n    style: getTrackStyles(topSectionWidth),\n  };\n\n  const trackBottomInactiveProps = {\n    className: css(classNames.lineContainer, classNames.inactiveSection),\n    style: getTrackStyles(bottomSectionWidth),\n  };\n\n  const sliderBoxProps = {\n    id,\n    'aria-valuenow': value,\n    'aria-valuemin': min,\n    'aria-valuemax': max,\n    'aria-valuetext': getAriaValueText(value),\n    'aria-label': ariaLabel || label,\n    'aria-disabled': disabled,\n    ...onMouseDownProp,\n    ...onTouchStartProp,\n    ...onKeyDownProp,\n    ...divButtonProps,\n    className: css(classNames.slideBox, buttonProps!.className),\n    role: 'slider',\n    tabIndex: disabled ? undefined : 0,\n    'data-is-focusable': !disabled,\n  };\n\n  const containerProps = {\n    className: classNames.container,\n  };\n  const sliderLineProps = {\n    ref: sliderLine,\n    className: classNames.line,\n  };\n\n  return {\n    root: rootProps,\n    label: labelProps,\n    sliderBox: sliderBoxProps,\n    container: containerProps,\n    valueLabel: valueLabelProps,\n    thumb: thumbProps,\n    zeroTick: zeroTickProps,\n    activeTrack: trackActiveProps,\n    topInactiveTrack: trackTopInactiveProps,\n    bottomInactiveTrack: trackBottomInactiveProps,\n    sliderLine: sliderLineProps,\n  };\n};\n"]}
+{"version":3,"sources":["../../../src/components/Slider/useSlider.ts"],"names":[],"mappings":"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","sourceRoot":""}

package/lib-commonjs/components/Slider/useSliderState.d.ts

@@ -0,0 +1,3 @@
+import type { SliderState } from './Slider.types';
+export declare const animationTime = "0.1s";
+export declare const useSliderState: (state: SliderState) => SliderState;