Allow generic type for stringProp

README.md

@@ -62,9 +62,10 @@ numberProp(isPositive).optional
   // → prop type: number | undefined
 ```
 
-### `stringProp(validator?: Validator)`
+### `stringProp<T>(validator?: Validator)`
 
-Allows any string. No further runtime validation is performed by default.
+Allows any string. No further runtime validation is performed by default.  
+Type parameter `T` can be used to restrict the type at compile time with a union type.
 
 ```ts
 stringProp().optional
@@ -73,6 +74,15 @@ stringProp().required
   // → prop type: string
 stringProp().withDefault('foo')
   // → prop type: string
+
+type Foo = 'a' | 'b' | 'c';
+
+stringProp<Foo>().optional
+  // → prop type: Foo | undefined
+stringProp<Foo>().required
+  // → prop type: Foo
+stringProp<Foo>().withDefault('a')
+  // → prop type: Foo
 ```
 
 ### `booleanProp(validator?: Validator)`

src/prop-types/string.ts

@@ -1,11 +1,13 @@
-import type { PropOptionsGenerator } from '../types';
+import type { PropOptionsGenerator, PropType } from '../types';
 import { propOptionsGenerator } from '../util';
 import type { Validator } from '../validators';
 
 /**
  * Allows any string. No further runtime validation is performed by default.
  *
+ * Type parameter `T` can be used to restrict the type at compile time with a union type.
+ *
  * @param validator - Optional function for further runtime validation; should return `undefined` if valid, or an error string if invalid.
  */
-export const stringProp = (validator?: Validator): PropOptionsGenerator<string> =>
-  propOptionsGenerator(String, validator);
+export const stringProp = <T extends string = string>(validator?: Validator): PropOptionsGenerator<T> =>
+  propOptionsGenerator(String as unknown as PropType<T>, validator);

type-tests/prop-types/string.type.spec.ts

@@ -5,50 +5,76 @@ import { stringProp } from '../../src/prop-types/string';
 import { createVue2Component } from '../utils';
 import type { Vue2ComponentWithProp } from '../utils';
 
+type Foo = 'a' | 'b' | 'c';
+
 describe('stringProp().optional', () => {
   describe('Vue 2', () => {
     expectAssignable<Vue2.PropOptions<string | undefined>>(stringProp().optional);
+    expectAssignable<Vue2.PropOptions<Foo | undefined>>(stringProp<Foo>().optional);
     expectNotAssignable<Vue2.PropOptions<string>>(stringProp().optional);
+    expectNotAssignable<Vue2.PropOptions<Foo>>(stringProp<Foo>().optional);
 
     expectType<Vue2ComponentWithProp<string | undefined>>(
       createVue2Component(stringProp().optional),
     );
+
+    expectType<Vue2ComponentWithProp<Foo | undefined>>(
+      createVue2Component(stringProp<Foo>().optional),
+    );
   });
 
   describe('Composition API', () => {
     expectAssignable<CompositionApi.PropOptions<string | undefined>>(stringProp().optional);
+    expectAssignable<CompositionApi.PropOptions<Foo | undefined>>(stringProp<Foo>().optional);
     expectNotAssignable<CompositionApi.PropOptions<string>>(stringProp().optional);
+    expectNotAssignable<CompositionApi.PropOptions<Foo>>(stringProp<Foo>().optional);
   });
 });
 
 describe('stringProp().withDefault', () => {
   describe('Vue 2', () => {
     expectAssignable<Vue2.PropOptions<string>>(stringProp().withDefault('foo'));
+    expectAssignable<Vue2.PropOptions<Foo>>(stringProp<Foo>().withDefault('a'));
     expectNotAssignable<Vue2.PropOptions<number>>(stringProp().withDefault('foo'));
+    expectNotAssignable<Vue2.PropOptions<number>>(stringProp<Foo>().withDefault('a'));
 
     expectType<Vue2ComponentWithProp<string>>(
       createVue2Component(stringProp().withDefault('foo')),
     );
+
+    expectType<Vue2ComponentWithProp<Foo>>(
+      createVue2Component(stringProp<Foo>().withDefault('a')),
+    );
   });
 
   describe('Composition API', () => {
     expectAssignable<CompositionApi.PropOptions<string>>(stringProp().withDefault('foo'));
+    expectAssignable<CompositionApi.PropOptions<Foo>>(stringProp<Foo>().withDefault('a'));
     expectNotAssignable<CompositionApi.PropOptions<number>>(stringProp().withDefault('foo'));
+    expectNotAssignable<CompositionApi.PropOptions<number>>(stringProp<Foo>().withDefault('a'));
   });
 });
 
 describe('stringProp().required', () => {
   describe('Vue 2', () => {
     expectAssignable<Vue2.PropOptions<string>>(stringProp().required);
+    expectAssignable<Vue2.PropOptions<Foo>>(stringProp<Foo>().required);
     expectNotAssignable<Vue2.PropOptions<number>>(stringProp().required);
+    expectNotAssignable<Vue2.PropOptions<number>>(stringProp<Foo>().required);
 
     expectType<Vue2ComponentWithProp<string>>(
       createVue2Component(stringProp().required),
     );
+
+    expectType<Vue2ComponentWithProp<Foo>>(
+      createVue2Component(stringProp<Foo>().required),
+    );
   });
 
   describe('Composition API', () => {
     expectAssignable<CompositionApi.PropOptions<string>>(stringProp().required);
+    expectAssignable<CompositionApi.PropOptions<Foo>>(stringProp<Foo>().required);
     expectNotAssignable<CompositionApi.PropOptions<number>>(stringProp().required);
+    expectNotAssignable<CompositionApi.PropOptions<number>>(stringProp<Foo>().required);
   });
 });