vuetifyjs / vuetify

🐉 Vue Component Framework
https://vuetifyjs.com
MIT License
39.88k stars 6.97k forks source link

[Feature Request] Keep `modelValue` and `onUpdate:modelValue` callback argument types in sync for VTabs and others #17782

Open Maxim-Mazurok opened 1 year ago

Maxim-Mazurok commented 1 year ago

Problem to solve

image

As you can see, I'm trying to use a long-hand version of v-model by manually providing value and manually updating it on changes.

It should be clear to TS from here that my model is of type 0 | 1 | 2, and that tabIndex in the callback should also have 0 | 1 | 2 type so that I can do two-way binding. However, because of the way typings are defined in Vuetify, this isn't happening.

Proposed solution

image

This patch for v3.3.2 works for me:

diff --git a/node_modules/vuetify/lib/components/index.d.mts b/node_modules/vuetify/lib/components/index.d.mts
index 8bfb5ac..80edc0a 100644
--- a/node_modules/vuetify/lib/components/index.d.mts
+++ b/node_modules/vuetify/lib/components/index.d.mts
@@ -45963,7 +45963,7 @@ type VSystemBar = InstanceType<typeof VSystemBar>;

 type TabItem = string | Record<string, any>;
 declare const VTabs: {
-    new (...args: any[]): {
+    new <T>(...args: any[]): {
         $: vue.ComponentInternalInstance;
         $data: {};
         $props: {
@@ -45977,7 +45977,7 @@ declare const VTabs: {
             mandatory?: NonNullable<boolean | "force"> | undefined;
             items?: readonly TabItem[] | undefined;
             density?: Density | undefined;
-            modelValue?: any;
+            modelValue?: T;
             selectedClass?: string | undefined;
             stacked?: boolean | undefined;
             grow?: boolean | undefined;
@@ -46039,7 +46039,7 @@ declare const VTabs: {
             }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>) => void)[] | undefined;
-            "onUpdate:modelValue"?: ((v: unknown) => any) | undefined;
+            "onUpdate:modelValue"?: ((v: T) => any) | undefined;
             bgColor?: string | undefined;
             showArrows?: string | boolean | undefined;
             sliderColor?: string | undefined;
Maxim-Mazurok commented 7 months ago

Unstale and reopen please

Bot should've left a comment, BTW

Maxim-Mazurok commented 7 months ago

@johnleider please reopen, I didn't have a chance to make activity before it was closed ;(