Slider - sydsutton/FS.FluentUI GitHub Wiki

open FS.FluentUI.V8toV9

[<ReactComponent>]
let SliderTest() =
    let value, setValue = React.useState (100)
    let valueText = $"Current Value: {value}"
    Fui.stack [
        stack.horizontal false
        stack.children [
            Fui.label [
                label.htmlFor "sliderId"
                label.text valueText
            ]
            Fui.slider [
                slider.ariaValueText valueText
                slider.value value
                slider.min 0
                slider.max 200
                slider.size.medium
                slider.step 20
                slider.id "sliderId"
                slider.onChange (fun (d: ValueProp<int>) -> setValue d.value)
            ]
            Fui.button [
                button.text "Reset"
                button.onClick (fun (e: MouseEvent) -> setValue 100)
            ]
        ]
    ]