mirror of
https://github.com/solidtime-io/solidtime.git
synced 2026-08-14 03:02:15 +01:00
improve focus handling in time tracker component, improve focus-visible state for timetracker start and stop button
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import Dropdown from '@/packages/ui/src/Input/Dropdown.vue';
|
||||
import { computed, ref } from 'vue';
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import TimeRangeSelector from '@/packages/ui/src/Input/TimeRangeSelector.vue';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import parse from 'parse-duration';
|
||||
@@ -131,6 +131,12 @@ const startTime = computed(() => {
|
||||
}
|
||||
return dayjs().utc().format();
|
||||
});
|
||||
const inputField = ref<HTMLInputElement | null>(null);
|
||||
watch(open, (isOpen) => {
|
||||
if (!isOpen) {
|
||||
inputField.value?.focus();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -144,6 +150,7 @@ const startTime = computed(() => {
|
||||
<input
|
||||
placeholder="00:00:00"
|
||||
@focus="pauseLiveTimerUpdate"
|
||||
ref="inputField"
|
||||
data-testid="time_entry_time"
|
||||
@blur="updateTimerAndStartLiveTimerUpdate"
|
||||
@keydown.enter="onTimeEntryEnterPress"
|
||||
|
||||
Reference in New Issue
Block a user