feat(ts/use-validation): Greatly improve the 'rules' prop type (fix: #11043)

[yusufkandemir]

What kind of change does this PR introduce?

• Feature

Does this PR introduce a breaking change?

• No

The PR fulfills these requirements:

• It's submitted to the dev branch
• When resolving a specific issue, it's referenced in the PR's title (e.g. fix: #xxx[,#xxx], where "xxx" is the issue number)

Other information:
Resolves #11043.

It has a custom type because it wasn't really possible with the way were defining the APIs and generate the types. Also, the custom types allow generics, so it's a bonus.

import { ValidationRule } from 'quasar'

// Custom rules can be defined with type-safety
const positiveNumber: ValidationRule<number> = (value) => value > 0 || 'The value must be positive'

// 'rules' prop will now have auto-completion, and will be safer. It can't infer the type of the generic parameter, because Vue doesn't allow generic components, yet

// It's now possible to define the rules to be passed to the prop, with type safety and generics, like this
const rules: ValidationRule<number>[] = [
  // 'datetime', // not relevant in the number example, but embedded validator names will also get auto-completed
  positiveNumber,
  (value) => value % 3 === 0 // value: number
]

// It's also possible to get auto-completion on :props="[...]" when defining the rules inline

dist/types/index.d.ts diff:

@@ -4218,9 +4218,9 @@
   noErrorIcon?: boolean | undefined;
   /**
    * Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules
    */
-  rules?: any[] | undefined;
+  rules?: ValidationRule[] | undefined;
   /**
    * By default a change in the rules does not trigger a new validation until the model changes; If set to true then a change in the rules will trigger a validation; Has a performance penalty, so use it only when you really need it
    */
   reactiveRules?: boolean | undefined;
@@ -4530,9 +4530,9 @@
   noErrorIcon?: boolean | undefined;
   /**
    * Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules
    */
-  rules?: any[] | undefined;
+  rules?: ValidationRule[] | undefined;
   /**
    * By default a change in the rules does not trigger a new validation until the model changes; If set to true then a change in the rules will trigger a validation; Has a performance penalty, so use it only when you really need it
    */
   reactiveRules?: boolean | undefined;
@@ -5351,9 +5351,9 @@
   noErrorIcon?: boolean | undefined;
   /**
    * Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules
    */
-  rules?: any[] | undefined;
+  rules?: ValidationRule[] | undefined;
   /**
    * By default a change in the rules does not trigger a new validation until the model changes; If set to true then a change in the rules will trigger a validation; Has a performance penalty, so use it only when you really need it
    */
   reactiveRules?: boolean | undefined;
@@ -7777,9 +7777,9 @@
   noErrorIcon?: boolean | undefined;
   /**
    * Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules
    */
-  rules?: any[] | undefined;
+  rules?: ValidationRule[] | undefined;
   /**
    * By default a change in the rules does not trigger a new validation until the model changes; If set to true then a change in the rules will trigger a validation; Has a performance penalty, so use it only when you really need it
    */
   reactiveRules?: boolean | undefined;
@@ -13151,8 +13151,9 @@
 import { WebStorageGetItemMethodType } from "./api";
 import { WebStorageGetIndexMethodType } from "./api";
 import { WebStorageGetKeyMethodType } from "./api";
 import { WebStorageGetAllKeysMethodType } from "./api";
+import { ValidationRule } from "./api";

[rstoenescu]

Keep them going :)