Time Picker
Basic usage
09:30
<script setup lang="ts">
import { ref } from "vue";
import { NmorphTimePicker } from "@nmorph/nmorph-ui-kit";
const time = ref("09:30");
</script><template>
<div class="time-picker-basic-usage-overview">
<NmorphTimePicker v-model="time" />
<span>{{ time || "empty" }}</span>
</div>
</template>Seconds
14:45:20
<script setup lang="ts">
import { ref } from "vue";
import { NmorphTimePicker } from "@nmorph/nmorph-ui-kit";
const time = ref("14:45:20");
</script><template>
<div class="time-picker-seconds-overview">
<NmorphTimePicker
v-model="time"
show-seconds
:minute-step="15"
:second-step="10"
/>
</div>
</template>Disabled
12:00
<script setup lang="ts">
import { NmorphTimePicker } from "@nmorph/nmorph-ui-kit";
</script><template>
<NmorphTimePicker model-value="12:00" disabled />
</template>NmorphTimePicker Api
Attributes
Events
Translations i18n
Use these keys to configure custom text for languages that the library does not support out of the box.