Input Range

Render a custom range input. The min, max and step properties work like you would expect from a native HTML element (which this Blade component enhances with a webcomponent). When the min and max property values mismatch, the invalid and locked properties are automatically set to true.

'min' => 0.01,
'max' => 100,
'step' => 0.01,
'value' => 50,
'invalid' => false,
'locked' => false,
<x-inputRange value="25" />
<x-inputRange locked />
<x-inputRange invalid />
<x-inputRange min="500" max="100" />