@yandex/ui/esm/Slider/__examples__/customThumb.js

Yandex UI components

import { __assign } from "tslib";
import React from 'react';
import { Slider, useSliderState } from '@yandex-lego/components/Slider/desktop/bundle';
export var CustomThumb = function () {
    var state1 = useSliderState({ value: [20] });
    var state2 = useSliderState({ value: [20, 50] });
    return (React.createElement(React.Fragment, null,
        React.createElement(Slider, __assign({ filled: true, step: 20, view: "default" }, state1, { renderThumb: function (props, Thumb) { return (React.createElement(Thumb, __assign({}, props, { style: { width: 40, height: 20, borderRadius: 4 } }), props.value)); } })),
        React.createElement(Slider, __assign({ filled: true, step: 20, view: "default" }, state2, { renderThumb: function (props, Thumb) { return (React.createElement(Thumb, __assign({}, props, { style: { width: 40, height: 20, borderRadius: 4 } }), props.value)); } }))));
};