Basic usage

<BOBInputNumberSlider TValue="int" @bind-Value="_basic" Label="Volume" />

Min, Max & Step

<BOBInputNumberSlider TValue="int" @bind-Value="_brightness" Label="Brightness" Min="0" Max="100" Step="5" />

Decimal values

<BOBInputNumberSlider TValue="decimal" @bind-Value="_temperature" Label="Temperature" Min="-20m" Max="40m" Step="0.5m" ValueLabelFormat="0.0 °C" />

Ticks

<BOBInputNumberSlider TValue="int" @bind-Value="_zoom" Label="Zoom" Min="0" Max="100" Step="10" ShowTicks="true" />

Vertical orientation

<div style="height: 240px; display: flex; gap: 2rem;">
    <BOBInputNumberSlider TValue="int" @bind-Value="_verticalA" Label="Bass" Orientation="BOBSliderOrientation.Vertical" Min="0" Max="100" />
    <BOBInputNumberSlider TValue="int" @bind-Value="_verticalB" Label="Mid" Orientation="BOBSliderOrientation.Vertical" Min="0" Max="100" />
    <BOBInputNumberSlider TValue="int" @bind-Value="_verticalC" Label="Treble" Orientation="BOBSliderOrientation.Vertical" Min="0" Max="100" />
</div>

Sizes

<BOBInputNumberSlider TValue="int" @bind-Value="_sizeS" Label="Small" Size="BOBSize.Small" />
<BOBInputNumberSlider TValue="int" @bind-Value="_sizeM" Label="Medium (Default)" Size="BOBSize.Medium" />
<BOBInputNumberSlider TValue="int" @bind-Value="_sizeL" Label="Large" Size="BOBSize.Large" />

Color & Background

<BOBInputNumberSlider TValue="int" @bind-Value="_colored" Label="Custom Color" Color="@PaletteColor.Secondary" BackgroundColor="@PaletteColor.SecondaryContrast" />

States

Validation message goes here.

<BOBInputNumberSlider TValue="int" @bind-Value="_required" Label="Required" Required="true" />
<BOBInputNumberSlider TValue="int" @bind-Value="_readonly" Label="ReadOnly" ReadOnly="true" />
<BOBInputNumberSlider TValue="int" @bind-Value="_disabled" Label="Disabled" Disabled="true" />
<BOBInputNumberSlider TValue="int" @bind-Value="_errorValue" Label="Error" Error="true" HelperText="Validation message goes here." />

Properties

Property	Type	Default	Description
`Size`	`BOBSize`	`BOBSize.Medium`	Visual size of the slider.
`Density`	`BOBDensity`	`BOBDensity.Standard`	Vertical density (gap) of the slider.
`Shadow`	`ShadowStyle?`		Shadow style applied to the slider container.
`BackgroundColor`	`string?`		Background color of the rail. Accepts any valid CSS color value.
`Color`	`string?`		Filled-segment and thumb color. Accepts any valid CSS color value.
`FullWidth`	`bool`	`true`	When , the slider spans the full width (or height in vertical) of its container.
`Label`	`string?`		Floating label rendered above the slider.
`HelperText`	`string?`		Helper text rendered below the slider for additional context.
`Min`	`TValue`	`TValue.Zero`	Lower bound. Defaults to TValue.Zero.
`Max`	`TValue`	`TValue.CreateChecked(100)`	Upper bound. Defaults to 100.
`Step`	`TValue`	`TValue.One`	Step size. Defaults to TValue.One.
`Orientation`	`BOBSliderOrientation`	`BOBSliderOrientation.Horizontal`	Layout orientation of the track.
`ShowTicks`	`bool`		When , tick marks are rendered along the rail at spacing.
`TickInterval`	`TValue?`		Distance between rendered ticks. Falls back to when .
`ShowValueLabel`	`bool`	`true`	When , a label surfaces over the thumb during drag or focus.
`ValueLabelFormat`	`string?`		Format string applied to the value label and aria-valuetext. Standard or custom format.
`Culture`	`CultureInfo?`		Culture used to format . Defaults to .
`AriaLabel`	`string?`		Accessible label for the thumb. Falls back to .