feat(Range): new component (#290)

Co-authored-by: Tom Smith <tom.smith2711@gmail.com>
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
Co-authored-by: Tom Smith <tom.smith@qunifi.com>

docs/content/3.forms/8.range.md

@@ -0,0 +1,101 @@
+---
+github: true
+description: Display a range field
+navigation:
+  badge: "Edge"
+---
+
+## Usage
+
+Use a `v-model` to make the Range reactive.
+
+::component-example
+#default
+:range-example
+
+#code
+```vue
+<script setup>
+const value = ref(50)
+</script>
+
+<template>
+  <URange v-model="value" />
+</template>
+```
+::
+
+### Style
+
+Use the `color` prop to change the visual style of the Range.
+
+::component-card
+---
+baseProps:
+  name: range'
+  placeholder: 'Search...'
+props:
+  color: 'primary'
+---
+::
+
+### Size
+
+Use the `size` prop to change the size of the Range.
+
+::component-card
+---
+baseProps:
+  name: 'range'
+props:
+  size: 'md'
+---
+::
+
+### Disabled
+
+Use the `disabled` prop to disable the Range.
+
+::component-card
+---
+baseProps:
+  name: 'range'
+props:
+  disabled: true
+---
+::
+
+### Min and Max
+
+Use the `min` and `max` prop to configure the Range.
+
+::component-card
+---
+baseProps:
+  name: 'range'
+props:
+  min: 0
+  max: 100
+---
+::
+
+### Step
+
+Use the `step` prop to change the step increment.
+
+::component-card
+---
+baseProps:
+  name: 'range'
+props:
+  step: 20
+---
+::
+
+## Props
+
+:component-props
+
+## Preset
+
+:component-preset