# ef-slider

Allows users to make selections from a range of values

## Properties

| Property         | Attribute          | Type                       | Default | Description                                      |
|------------------|--------------------|----------------------------|---------|--------------------------------------------------|
| `disabled`       | `disabled`         | `boolean`                  | false   | Set disabled state                               |
| `from`           | `from`             | `string`                   | "0"     | Uses with `range`. Low value of slider in range mode. |
| `max`            | `max`              | `string`                   | "100"   | Set maximum value of slider.                     |
| `min`            | `min`              | `string`                   | "0"     | Set minimum value of slider.                     |
| `minRange`       | `min-range`        | `string`                   | "0"     | Uses with `range`. Set minimum allowance value (distance) between `from` and `to`. |
| `range`          | `range`            | `boolean`                  | false   | Set slider to range mode. Instead of a single value, slider will provide `from` and `to`. |
| `readonly`       | `readonly`         | `boolean`                  | false   | Set readonly state                               |
| `showInputField` | `show-input-field` | `"" \| "readonly" \| null` | null    | Show input number field.                         |
| `showSteps`      | `show-steps`       | `boolean`                  | false   | Show steps marker on slider.                     |
| `step`           | `step`             | `string`                   | "1"     | Specified size of increment or decrement jump between value. |
| `to`             | `to`               | `string`                   | "100"   | Uses with `range`. High value of slider in range mode |
| `value`          | `value`            | `string`                   | "0"     | Value of slider. Not applicable in range mode.   |

## Events

| Event           | Description                                      |
|-----------------|--------------------------------------------------|
| `from-changed`  | Fired when the user changes from's value. The event is not triggered if `from` property is changed programmatically. |
| `from-input`    | Fired when the user inputs from's value by interacting with the slider or updating its input field. |
| `input`         | Fired with the value of the input in `e.detail.value` like another custom events when the user inputs a value by interacting with the slider or updating its input field. |
| `to-changed`    | Fired when the user changes to's value. The event is not triggered if `to` property is changed programmatically. |
| `to-input`      | Fired when the user inputs to's value by interacting with the slider or updating its input field. |
| `value-changed` | Fired when the user commits a value change. The event is not triggered if `value` property is changed programmatically. |