## タイムピッカー

時間インプットにはタイムピッカーを使用します。

### 固定タイムピッカー

ユーザーが選択できる固定時間のリストを提供する。

:::demo `el-time-select` ラベルを使用し、開始時刻、終了時刻、タイムステップを `start`, `end`, `step` で指定します。`
```html
<el-time-select
  v-model="value"
  start='08:30'
  step='00:15'
  end='18:30'
  placeholder="Select time">
</el-time-select>

<script>
  export default {
    data() {
      return {
        value: ''
      };
    }
  }
</script>
```
:::

### 固定時間範囲

開始時間が最初に選ばれた場合は、それに応じて終了時間が変更されます。

:::demo
```html
<template>
  <el-time-select
    placeholder="Start time"
    v-model="startTime"
    start='08:30'
  step='00:15'
  end='18:30'>
  </el-time-select>
  <el-time-select
    placeholder="End time"
    v-model="endTime"
    start='08:30'
    step='00:15'
    end='18:30'
    :minTime="startTime">
  </el-time-select>
</template>

<script>
  export default {
    data() {
      return {
        startTime: '',
        endTime: ''
      };
    }
  }
</script>
```
:::

### Attributes
| Attribute      | Description          | Type      | Accepted Values       | Default  |
|---------- |-------------- |---------- |--------------------------------  |-------- |
| model-value / v-model | バインディング値 | - | - |
| editable | 入力が編集可能かどうか | boolean | — | true |
| clearable | クリアボタンを表示するかどうか | boolean | — | true |
| size | 入力のサイズ | string | medium / small / mini | — |
| placeholder | 非範囲モード時のプレースホルダ | string | — | — |
| name | ネイティブ入力の `name` と同じ | string | — | — |
| prefix-icon | カスタムプレフィックスアイコンクラス | string | — | el-icon-time |
| clear-icon | カスタムクリアアイコンクラス | string | — | el-icon-circle-close |
| start | 開始時刻 | string | — | 09:00 |
| end | 終了時刻 | string | — | 18:00 |
| step | タイムステップ | string | — | 00:30 |
| minTime | 最低時間、それ以前の時間は無効化されます。 | string | — | 00:00 |
| maxTime | 最大時間、この時間以降は無効化されます。 | string | — | — |

### イベント
| Event Name | Description | Parameters |
|---------|--------|---------|
| change | ユーザーが値を確認したときにトリガされます。 | component's binding value |
| blur | インプットがぼやけたときされます | component instance |
| focus | 入力がフォーカスされているときにトリガされます。 | component instance |

### 方法
| Method | Description | Parameters |
| ---- | ---- | ---- |
| focus | インプットコンポーネントにフォーカス | - |
| blur | blur the Input component | - |