# @tygr/vue-time-picker

> Time picker

Latest version **1.0.9** (published 2019-07-20) · ISC license · 0 weekly downloads

## Install

```sh
npm install @tygr/vue-time-picker
pnpm add @tygr/vue-time-picker
yarn add @tygr/vue-time-picker
bun add @tygr/vue-time-picker
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.9 |
| Published | 2019-07-20 |
| First published | 2019-02-24 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 18.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 6 |
| Author | Tyler J Grinn |
| Maintainers | tygrinn |
| Keywords | time, picker, vue, mobile, desktop |

## Links

- npm: https://www.npmjs.com/package/@tygr/vue-time-picker
- Repository: https://github.com/tylergrinn/vue-time-picker
- Homepage: https://github.com/tylergrinn/vue-time-picker#readme
- Issues: https://github.com/tylergrinn/vue-time-picker/issues
- npm.io page: https://npm.io/package/@tygr/vue-time-picker

## Alternatives

- [@js-joda/timezone](https://npm.io/package/@js-joda/timezone.md) — 383.4K weekly downloads
- [chartjs-adapter-moment](https://npm.io/package/chartjs-adapter-moment.md) — 210.8K weekly downloads
- [strftime](https://npm.io/package/strftime.md) — 171.2K weekly downloads
- [vue-flatpickr-component](https://npm.io/package/vue-flatpickr-component.md) — 115.8K weekly downloads
- [timepicker](https://npm.io/package/timepicker.md) — 51.0K weekly downloads

## Recent versions

- 1.0.9 (latest) — 2019-07-20
- 1.0.8 — 2019-02-26
- 1.0.7 — 2019-02-26
- 1.0.6 — 2019-02-25
- 1.0.5 — 2019-02-25
- 1.0.4 — 2019-02-24
- 1.0.3 — 2019-02-24
- 1.0.2 — 2019-02-24
- 1.0.1 — 2019-02-24
- 1.0.0 — 2019-02-24

## README

# Vue Time Picker

[![Build Status](https://travis-ci.org/tylergrinn/vue-time-picker.svg?branch=master)](https://travis-ci.org/tylergrinn/vue-time-picker)

## [DEMO](http://vue-time-picker.surge.sh/demo.html)

Simple, no nonsense time picker built and optimized for Vue.

![mobile](docs/time-picker-mobile.gif)
![desktop](docs/time-picker-desktop.gif)

## Installation

### Yarn
```
yarn add -D @tygr/vue-time-picker
```
```js
import TimePicker from '@tygr/vue-time-picker'

export default {
  components: {
    TimePicker,
  }
}
```

### Browser
```html
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/@tygr/vue-time-picker/dist/vue-time-picker.min.js" charset="utf-8"></script>
<script>
  Vue.use(TimePicker)
</script>
```

* Charset attribute required

## Usage

```html
<time-picker v-model="time"></time-picker>
```

```js
export default {
  data: () => ({
    time: ''
  })
}
```

Time format is `h:mm A`

## Props

| prop         | type   | default                               | description                                     |
| ------------ | ------ | ------------------------------------- | ----------------------------------------------- |
| am-color     | string | 'green'                               | Color of the slider when 'AM' is chosen         |
| pm-color     | string | 'blue'                                | Color of the slider when 'PM' is chosen         |
| value        | string | '12:00 AM'                            | The value of the time picker. (used by v-model) |
| mobile-query | string | 'only screen and (max-width : 839px)' | Media query used to check if mobile user        |

## Events

| event | payload | description                     |
| ----- | ------- | ------------------------------- |
| input | string  | Time selected (used by v-model) |

---
_Source: https://npm.io/package/@tygr/vue-time-picker · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._