Svelte Time Picker

What is it?

A very simple time picker component for Svelte, inspired by Material UI's time picker.

Installation

npm install @rschiang/svelte-timepicker

Usage

<script>
    import { TimePicker } from "@rschiang/svelte-timepicker";

    let hours = null;
    let minutes = null;
</script>

<TimePicker onChange={(h, m) => {
    hours = h;
    minutes = m;
}} />

Demo

https://svelte.dev/repl/54e378a10dac4c8cabd9d938d40a9364?version=4.2.8

Properties

| Property | Type | Description | | ----------- | ----------- | ----------- | | hours? | number \| null | Controls the hours value. | | minutes? | number \| null | Controls the minutes value. | | onChange? | function \| null | Function with two parameters: hours and minutes. | | containerClass? | string | Class name for the container element. | | inputClass? | string | Class name for the input element. | | popoverClass? | string | Class name for the popover element. | | popoverHeaderClass? | string | Class name for the popover header element. | | popoverHeaderColClass? | string | Class name for the popover header column element. | | popoverHeaderBtnClass? | string | Class name for the popover header button element. | | popoverFooterClass? | string | Class name for the popover footer element. | | popoverFooterBtnClass? | string | Class name for the popover footer button element. |

License

MIT