@gluestack-ui/core/lib/esm/slider/creator/SliderFilledTrack.jsx

Universal UI components for React Native, Expo, and Next.js

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import React, { forwardRef } from 'react';
import { SliderContext } from './Context';
import { Platform } from 'react-native';
import { mergeRefs } from '@gluestack-ui/utils/common';
function SliderFilledTrack(StyledSliderFilledTrack) {
    return forwardRef((_a, ref) => {
        var { _experimentalSliderFilledTrack = false, _experimentalSliderFilledTrackValue = 0, style } = _a, props = __rest(_a, ["_experimentalSliderFilledTrack", "_experimentalSliderFilledTrackValue", "style"]);
        const _ref = React.useRef(null);
        const { state, trackLayout, orientation, isDisabled, isFocused, isHovered, isPressed, isFocusVisible, } = React.useContext(SliderContext);
        const getSliderTrackPosition = () => {
            if (orientation === 'vertical') {
                return trackLayout.height * state.getThumbPercent(0);
            }
            else {
                return trackLayout.width * state.getThumbPercent(0);
            }
        };
        const sliderTrackPosition = getSliderTrackPosition();
        let positionProps = orientation === 'vertical'
            ? { height: sliderTrackPosition }
            : { width: sliderTrackPosition };
        if (_experimentalSliderFilledTrack) {
            positionProps =
                orientation === 'vertical'
                    ? { height: _experimentalSliderFilledTrackValue }
                    : { width: _experimentalSliderFilledTrackValue };
        }
        return (<StyledSliderFilledTrack {...props} ref={mergeRefs([_ref, ref])} style={[style, positionProps]} states={{
                hover: isHovered,
                disabled: isDisabled,
                focus: isFocused,
                focusVisible: isFocusVisible,
                active: isPressed,
            }} dataSet={{
                hover: isHovered ? 'true' : 'false',
                disabled: isDisabled ? 'true' : 'false',
                focus: isFocused ? 'true' : 'false',
                focusVisible: isFocusVisible ? 'true' : 'false',
                active: isPressed ? 'true' : 'false',
            }} disabled={isDisabled} tabIndex={Platform.OS === 'web' ? -1 : undefined}/>);
    });
}
export default SliderFilledTrack;
//# sourceMappingURL=SliderFilledTrack.jsx.map