ziggy-js 2.3.1 → 2.4.0

package/README.md

@@ -44,7 +44,7 @@ Add the `@routes` Blade directive to your main layout (_before_ your application
 
 ### `route()` function
 
-Ziggy's `route()` function works like [Laravel's `route()` helper](https://laravel.com/docs/10.x/helpers#method-route)—you can pass it the name of a route, and the parameters you want to pass to the route, and it will generate a URL.
+Ziggy's `route()` function works like [Laravel's `route()` helper](https://laravel.com/docs/helpers#method-route)—you can pass it the name of a route, and the parameters you want to pass to the route, and it will generate a URL.
 
 #### Basic usage
 
@@ -378,6 +378,16 @@ Now you can use the `route()` function anywhere in your Vue components and templ
 <a class="nav-link" :href="route('home')">Home</a>
 ```
 
+With `<script setup>` in Vue 3 you can use `inject` to make the `route()` function available in your component script:
+
+```vue
+<script setup>
+import { inject } from 'vue';
+
+const route = inject('route');
+</script>
+```
+
 If you are not using the `@routes` Blade directive, import Ziggy's configuration too and pass it to `.use()`:
 
 ```js

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "ziggy-js",
-    "version": "2.3.1",
+    "version": "2.4.0",
     "description": "Use your Laravel named routes in JavaScript.",
     "keywords": [
         "laravel",
@@ -56,11 +56,12 @@
         "qs": "~6.9.7"
     },
     "devDependencies": {
+        "@types/qs": "^6.9.17",
         "jsdom": "^25.0.1",
         "microbundle": "^0.15.1",
         "prettier": "^3.3.3",
         "typescript": "^5.6.3",
-        "vitest": "^2.1.3"
+        "vitest": "^2.1.4"
     },
     "prettier": {
         "printWidth": 100,

package/src/js/index.d.ts

@@ -1,3 +1,5 @@
+import { ParsedQs } from 'qs';
+
 /**
  * A list of routes and their parameters and bindings.
  *
@@ -5,6 +7,11 @@
  */
 export interface RouteList {}
 
+/**
+ * Marker interface to configure Ziggy's type checking behavior.
+ */
+export interface TypeConfig {}
+
 /**
  * A route name registered with Ziggy.
  */
@@ -13,7 +20,9 @@ type KnownRouteName = keyof RouteList;
 /**
  * A route name, or any string.
  */
-type RouteName = KnownRouteName | (string & {});
+type RouteName = TypeConfig extends { strictRouteNames: true }
+    ? KnownRouteName
+    : KnownRouteName | (string & {});
 // `(string & {})` prevents TypeScript from reducing this type to just `string`,
 // which would prevent intellisense from autocompleting known route names.
 // See https://stackoverflow.com/a/61048124/6484459.
@@ -159,7 +168,7 @@ interface Router {
     current<T extends RouteName>(name: T, params?: ParameterValue | RouteParams<T>): boolean;
     get params(): Record<string, string>;
     get routeParams(): Record<string, string>;
-    get queryParams(): Record<string, string>;
+    get queryParams(): ParsedQs;
     has<T extends RouteName>(name: T): boolean;
 }
 
@@ -168,6 +177,15 @@ interface Router {
  */
 // Called with no arguments - returns a Router instance
 export function route(): Router;
+
+// Called with configuration arguments only - returns a configured Router instance
+export function route(
+    name: undefined,
+    params: undefined,
+    absolute?: boolean,
+    config?: Config,
+): Router;
+
 // Called with a route name and optional additional arguments - returns a URL string
 export function route<T extends RouteName>(
     name: T,
@@ -175,19 +193,13 @@ export function route<T extends RouteName>(
     absolute?: boolean,
     config?: Config,
 ): string;
+
 export function route<T extends RouteName>(
     name: T,
     params?: ParameterValue | undefined,
     absolute?: boolean,
     config?: Config,
 ): string;
-// Called with configuration arguments only - returns a configured Router instance
-export function route(
-    name: undefined,
-    params: undefined,
-    absolute?: boolean,
-    config?: Config,
-): Router;
 
 /**
  * Ziggy's Vue plugin.