vueless 0.0.587 → 0.0.589

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.587",
+  "version": "0.0.589",
   "license": "MIT",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "keywords": [

package/ui.form-calendar/UCalendar.vue

@@ -559,6 +559,8 @@ function onClickSubmit() {
   emit("submit");
 }
 
+let timeInputCount = 0;
+
 function onClickTimeInput(event: MouseEvent) {
   const input = event.target as HTMLInputElement;
 
@@ -568,6 +570,8 @@ function onClickTimeInput(event: MouseEvent) {
 function onFocusTimeInput(event: FocusEvent) {
   const input = event.target as HTMLInputElement;
 
+  timeInputCount = 0;
+
   selectTimeInput(input);
 }
 
@@ -578,6 +582,8 @@ function selectTimeInput(input: HTMLInputElement) {
 }
 
 function onTimeInput(event: InputEvent, type: InputType) {
+  timeInputCount += 1;
+
   const input = event.target as HTMLInputElement;
   const value = input.value;
   const numericValue = Number(value);
@@ -666,6 +672,22 @@ function onTimeInput(event: InputEvent, type: InputType) {
   }
 
   input.value = String(numericValue).padStart(2, "0");
+
+  if (timeInputCount >= 2) {
+    if (isHours && minutesRef.value) {
+      minutesRef.value.focus();
+    }
+
+    if (isMinutes && secondsRef.value) {
+      secondsRef.value.focus();
+    }
+
+    if (isSeconds && okButton.value) {
+      okButton.value.buttonRef?.focus();
+    }
+
+    timeInputCount = 0;
+  }
 }
 
 defineExpose({

package/ui.form-date-picker-range/UDatePickerRange.vue

@@ -65,7 +65,7 @@ import type {
   Config,
 } from "./types.ts";
 import type { RangeDate, Config as UCalendarConfig } from "../ui.form-calendar/types.ts";
-import type { ComponentExposed } from "../types.ts";
+import type { ComponentExposed, KeyAttrsWithConfig } from "../types.ts";
 
 defineOptions({ inheritAttrs: false });
 
@@ -722,8 +722,8 @@ watchEffect(() => {
           v-model="calendarValue"
           :min-date="minDate"
           :max-date="maxDate"
-          v-bind="datepickerCalendarAttrs"
           :date-format="dateFormat"
+          v-bind="datepickerCalendarAttrs as KeyAttrsWithConfig<UCalendarConfig>"
           range
           @mouseenter="onMouseoverCalendar"
           @input="onInputCalendar"

package/ui.form-input/UInput.vue

@@ -127,7 +127,7 @@ onMounted(() => {
   setLabelPosition();
 });
 
-function onInput(inputEvent: InputEvent) {
+function onInput(inputEvent: Event) {
   const target = inputEvent.target as HTMLInputElement | null;
 
   if (!target) return;
@@ -149,7 +149,7 @@ function onInput(inputEvent: InputEvent) {
   emit("input", value);
 }
 
-function onChange(event: CustomEvent) {
+function onChange(event: Event) {
   emit("change", event);
 }
 

package/ui.navigation-tabs/types.ts

@@ -8,7 +8,7 @@ export type SetUTabsSelectedItem = (
   value: string | number | boolean | UnknownArray | UnknownObject,
 ) => void;
 
-interface UTabsOption {
+export interface UTabsOption {
   value: string | number;
   label: string;
   disabled?: boolean;

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "vueless",
-  "version": "0.0.587",
+  "version": "0.0.589",
   "contributions": {
     "html": {
       "description-markup": "markdown",