Merge branch 'main' into psachs/node16-resolution

.eslintrc.js

@@ -120,7 +120,7 @@ const config = {
       },
     },
     {
-      files: ["**/eliza/*", "**/gen/**"], // generated code
+      files: ["**/eliza/*", "**/gen/**", "**/snapshots/**"], // generated code
       rules: {
         "eslint-comments/no-unused-enable": "off",
         "eslint-comments/no-unused-disable": "off",

README.md

@@ -402,11 +402,11 @@ No. The code generator just generates the method descriptors, but you are free t
 
 ### What if I have a custom `Transport`?
 
-If the `Transport` attached to React Context via the `TransportProvider` isn't working for you, then you can override transport at every level. For example, you can pass a custom transport directly to the lowest-level API like `useQuery` or `createUseQueryOptions`.
+If the `Transport` attached to React Context via the `TransportProvider` isn't working for you, then you can override transport at every level. For example, you can pass a custom transport directly to the lowest-level API like `useQuery` or `callUnaryMethod`.
 
 ### Does this only work with React?
 
-Connect-Query does require React, but the core (`createUseQueryOptions`) is not React specific so splitting off a `connect-solid-query` is possible.
+Connect-Query does require React, but the core (`createConnectQueryKey` and `callUnaryMethod`) is not React specific so splitting off a `connect-solid-query` is possible.
 
 ### How do I do Prefetching?
 
@@ -416,15 +416,11 @@ When you might not have access to React context, you can use the `create` series
 import { say } from "./gen/eliza-ElizaService_connectquery";
 
 function prefetch() {
-  return queryClient.prefetchQuery(
-    createUseQueryOptions(
-      say,
-      { sentence: "Hello" },
-      {
-        transport: myTransport,
-      },
-    ),
-  );
+  return queryClient.prefetchQuery({
+    queryKey: createConnectQueryKey(say, { sentence: "Hello" }),
+    queryFn: () =>
+      callUnaryMethod(say, { sentence: "Hello" }, { transport: myTransport }),
+  });
 }
 ```
 

assets/connect-query_dependency_graph.excalidraw

@@ -1027,12 +1027,12 @@
       "locked": false,
       "fontSize": 20,
       "fontFamily": 3,
-      "text": "Connect-React-Query",
+      "text": "Connect-Query",
       "baseline": 19,
       "textAlign": "center",
       "verticalAlign": "middle",
       "containerId": "NLMbxwdPMz1O8gu8ku7cT",
-      "originalText": "Connect-React-Query"
+      "originalText": "Connect-Query"
     },
     {
       "type": "rectangle",

examples/react/basic/package.json

@@ -13,8 +13,8 @@
   },
   "dependencies": {
     "@bufbuild/buf": "1.28.1",
-    "@bufbuild/protobuf": "^1.5.1",
-    "@bufbuild/protoc-gen-es": "^1.5.1",
+    "@bufbuild/protobuf": "^1.6.0",
+    "@bufbuild/protoc-gen-es": "^1.6.0",
     "@connectrpc/connect": "^1.1.4",
     "@connectrpc/connect-query": "workspace:*",
     "@connectrpc/connect-web": "^1.1.4",

examples/react/basic/src/example.tsx

@@ -21,7 +21,7 @@ import { Indicator, Indicators } from "./indicator";
 import { Page } from "./page";
 
 /**
- * This example demonstrates a basic usage of Connect-React-Query with `useQuery`
+ * This example demonstrates a basic usage of Connect-Query with `useQuery`
  */
 export const Example: FC = () => {
   const { status, fetchStatus, error, data } = useQuery(say);

examples/react/basic/src/gen/eliza-BigIntService_connectquery.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v1.0.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
+// @generated by protoc-gen-connect-query v1.1.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 

examples/react/basic/src/gen/eliza-ElizaService_connectquery.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v1.0.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
+// @generated by protoc-gen-connect-query v1.1.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 

examples/react/basic/src/gen/eliza-Haberdasher_connectquery.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v1.0.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
+// @generated by protoc-gen-connect-query v1.1.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 

examples/react/basic/src/gen/eliza-PaginatedService_connectquery.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v1.0.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
+// @generated by protoc-gen-connect-query v1.1.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 

examples/react/basic/src/gen/eliza-SecondService_connectquery.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v1.0.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
+// @generated by protoc-gen-connect-query v1.1.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 

examples/react/basic/src/gen/eliza-Slouch_connectquery.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v1.0.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
+// @generated by protoc-gen-connect-query v1.1.0 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 

examples/react/basic/src/gen/eliza_pb.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-es v1.5.1 with parameter "target=ts"
+// @generated by protoc-gen-es v1.6.0 with parameter "target=ts"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 // @ts-nocheck

packages/connect-query/README.md

@@ -4,4 +4,4 @@ This is the runtime library package for Connect-Query. You'll find its code gene
 
 Connect-Query is a wrapper around [TanStack Query](https://tanstack.com/query) (react-query), written in TypeScript and thoroughly tested. It enables effortless communication with servers that speak the [Connect Protocol](https://connectrpc.com/docs/protocol).
 
-To get started, head over to the [docs](https://connectrpc.com/docs/query/getting-started) for a tutorial, or take a look at [our examples](https://github.com/connectrpc/connect-query-es/examples) for integration with various frameworks.
+To get started, head over to the [docs](https://github.com/connectrpc/connect-query-es) for a tutorial, or take a look at [our examples](https://github.com/connectrpc/connect-query-es/examples) for integration with various frameworks.

packages/connect-query/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@connectrpc/connect-query",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "TypeScript-first expansion pack for TanStack Query that gives you Protobuf superpowers.",
   "license": "Apache-2.0",
   "repository": {
@@ -36,8 +36,8 @@
     "@arethetypeswrong/cli": "^0.13.3",
     "@bufbuild/buf": "1.28.1",
     "@bufbuild/jest-environment-jsdom": "^0.1.1",
-    "@bufbuild/protobuf": "^1.5.1",
-    "@bufbuild/protoc-gen-es": "^1.5.1",
+    "@bufbuild/protobuf": "^1.6.0",
+    "@bufbuild/protoc-gen-es": "^1.6.0",
     "@connectrpc/connect": "^1.1.4",
     "@connectrpc/connect-web": "^1.1.4",
     "@connectrpc/protoc-gen-connect-es": "^1.1.4",
@@ -52,7 +52,7 @@
   "peerDependencies": {
     "@bufbuild/protobuf": "^1.3.3",
     "@connectrpc/connect": "^1.1.2",
-    "@tanstack/react-query": "^5.4.3",
+    "@tanstack/react-query": "5.x",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

packages/connect-query/src/connect-query-key.ts

@@ -21,7 +21,7 @@ import { disableQuery } from "./utils.js";
 /**
  * TanStack Query requires query keys in order to decide when the query should automatically update.
  *
- * `QueryKey`s in TanStack Query are usually arbitrary, but Connect-React-Query uses the approach of creating a query key that begins with the least specific information: the service's `typeName`, followed by the method name, and ending with the most specific information to identify a particular request: the input message itself.
+ * `QueryKey`s in TanStack Query are usually arbitrary, but Connect-Query uses the approach of creating a query key that begins with the least specific information: the service's `typeName`, followed by the method name, and ending with the most specific information to identify a particular request: the input message itself.
  *
  * For example, for a query key might look like this:
  *
@@ -41,9 +41,9 @@ export type ConnectQueryKey<I extends Message<I>> = [
 /**
  * TanStack Query requires query keys in order to decide when the query should automatically update.
  *
- * In Connect-React-Query, much of this is handled automatically by this function.
+ * In Connect-Query, much of this is handled automatically by this function.
  *
- * @see ConnectQueryKey for information on the components of Connect-React-Query's keys.
+ * @see ConnectQueryKey for information on the components of Connect-Query's keys.
  */
 export function createConnectQueryKey<
   I extends Message<I>,

packages/connect-query/src/gen/eliza_pb.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-es v1.5.1 with parameter "target=ts"
+// @generated by protoc-gen-es v1.6.0 with parameter "target=ts"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 // @ts-nocheck

packages/connect-query/src/jest/test-utils.tsx

@@ -34,7 +34,7 @@ import { CountResponse, SayResponse } from "../gen/eliza_pb.js";
 import { TransportProvider } from "../use-transport.js";
 
 /**
- * A utils wrapper that supplies Tanstack Query's `QueryClientProvider` as well as Connect-React-Query's `TransportProvider`.
+ * A utils wrapper that supplies Tanstack Query's `QueryClientProvider` as well as Connect-Query's `TransportProvider`.
  */
 export const wrapper = (
   config?: QueryClientConfig,

packages/connect-query/src/use-transport.tsx

@@ -38,7 +38,7 @@ const transportContext = createContext(fallbackTransport);
 export const useTransport = () => useContext(transportContext);
 
 /**
- * `TransportProvider` is the main mechanism by which Connect-React-Query keeps track of the `Transport` used by your application.
+ * `TransportProvider` is the main mechanism by which Connect-Query keeps track of the `Transport` used by your application.
  *
  * Broadly speaking, "transport" joins two concepts:
  *
@@ -49,7 +49,7 @@ export const useTransport = () => useContext(transportContext);
  *
  * To learn more about the two modes of transport, take a look at the npm package `@connectrpc/connect-web`.
  *
- * To get started with Connect-React-Query, simply import a transport (either `createConnectTransport` or `createGrpcWebTransport` from `@connectrpc/connect-web`) and pass it to the provider.
+ * To get started with Connect-Query, simply import a transport (either `createConnectTransport` or `createGrpcWebTransport` from `@connectrpc/connect-web`) and pass it to the provider.
  *
  * @example
  * import { QueryClient, QueryClientProvider } from "@tanstack/react-query";

packages/protoc-gen-connect-query/README.md

@@ -13,6 +13,7 @@
     - [`target`](#target)
     - [`import_extension=.js`](#import_extensionjs)
     - [`keep_empty_files=true`](#keep_empty_filestrue)
+    - [`js_import_style`](#js_import_style)
   - [Example Generated Code](#example-generated-code)
 
 The code generator for Connect-Query, a expansion pack for [TanStack Query](https://tanstack.com/query) (react-query), that enables effortless communication with servers that speak the [Connect Protocol](https://connectrpc.com/docs/protocol).
@@ -198,6 +199,20 @@ Unfortunately, not all bundlers and tools have caught up yet, and Deno requires
 
 This option exists for other plugins but is not applicable to `protoc-gen-connect-query` because, unlike most other plugins, it does not generate a maximum of one output file for every input proto file. Instead, it generates one output file per service. If you provide a valid proto file that contains no services, `protoc-gen-connect-query` will have no output.
 
+### `js_import_style`
+
+By default, [protoc-gen-connect-query](https://www.npmjs.com/package/@connectrpc/protoc-gen-connect-query)
+(and all other plugins based on [@bufbuild/protoplugin](https://www.npmjs.com/package/@bufbuild/protoplugin))
+generate ECMAScript `import` and `export` statements. For use cases where
+CommonJS is difficult to avoid, this option can be used to generate CommonJS
+`require()` calls.
+
+Possible values:
+
+- `js_import_style=module` generate ECMAScript `import` / `export` statements -
+  the default behavior.
+- `js_import_style=legacy_commonjs` generate CommonJS `require()` calls.
+
 ## Example Generated Code
 
 See [`eliza.proto`](../../examples/react/basic/eliza.proto) for example inputs, and look [here](../../examples/react/basic/src/gen) to see the outputs those files generate.

packages/protoc-gen-connect-query/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@connectrpc/protoc-gen-connect-query",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Code generator for connect-query",
   "license": "Apache-2.0",
   "sideEffects": false,
@@ -22,22 +22,22 @@
     "clean": "rm -rf dist",
     "build": "pnpm clean && tsc --project tsconfig.build.json",
     "format": "prettier . --write --ignore-path ./.eslintignore && eslint . --fix && license-header",
-    "generate": "rm -rf snapshots/gen && cd snapshots && buf generate buf.build/connectrpc/eliza:8b8b971d6fde4dc8ba5d96f9fda7d53c",
+    "generate": "rm -rf snapshots/gen* && cd snapshots && buf generate buf.build/connectrpc/eliza:8b8b971d6fde4dc8ba5d96f9fda7d53c",
     "test": "tsc --declaration --declarationDir .type-dump --emitDeclarationOnly"
   },
   "preferUnplugged": true,
   "devDependencies": {
-    "@bufbuild/buf": "1.27.2",
-    "@bufbuild/protoc-gen-es": "^1.4.1",
-    "@connectrpc/connect": "^1.1.3",
+    "@bufbuild/buf": "1.28.1",
+    "@bufbuild/protoc-gen-es": "^1.6.0",
+    "@connectrpc/connect": "^1.1.4",
     "@connectrpc/connect-query": "workspace:*",
-    "@connectrpc/protoc-gen-connect-es": "^1.1.3",
+    "@connectrpc/protoc-gen-connect-es": "^1.1.4",
     "@tanstack/react-query": "^5.4.3",
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "@bufbuild/protobuf": "^1.4.1",
-    "@bufbuild/protoplugin": "^1.4.1"
+    "@bufbuild/protobuf": "^1.6.0",
+    "@bufbuild/protoplugin": "^1.6.0"
   },
   "peerDependencies": {
     "@bufbuild/protoc-gen-es": "1.x"

packages/protoc-gen-connect-query/snapshots/buf.gen.yaml

@@ -1,16 +1,32 @@
-# buf.gen.yaml defines a local generation template.
-# For details, see https://docs.buf.build/configuration/v1/buf-gen-yaml
 version: v1
 plugins:
+  # js
   - plugin: es
-    out: gen
+    out: gen_js
+  - plugin: connect-query
+    path: ../bin/protoc-gen-connect-query
+    out: gen_js
+
+  # cjs
+  - plugin: es
+    out: gen_cjs
     opt:
-      - target=ts
+      - js_import_style=legacy_commonjs
+  - plugin: connect-query
+    path: ../bin/protoc-gen-connect-query
+    out: gen_cjs
+    opt:
+      - js_import_style=legacy_commonjs
+      - ts_nocheck=false # we only set this for our tests
 
+  # ts
+  - plugin: es
+    out: gen_ts
+    opt:
+      - target=ts
   - plugin: connect-query
     path: ../bin/protoc-gen-connect-query
-    out: gen
+    out: gen_ts
     opt:
-      - target=ts+dts+js
-      - import_extension=none
-      - ts_nocheck=false
+      - target=ts
+      - ts_nocheck=false # we only set this for our tests

packages/protoc-gen-connect-query/snapshots/gen/connectrpc/eliza/v1/eliza-ElizaService_connectquery.d.ts → packages/protoc-gen-connect-query/snapshots/gen_cjs/connectrpc/eliza/v1/eliza-ElizaService_connectquery.d.ts

@@ -12,11 +12,11 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v1.0.0 with parameter "target=ts+dts+js,import_extension=none,ts_nocheck=false"
+// @generated by protoc-gen-connect-query v1.1.0 with parameter "js_import_style=legacy_commonjs,ts_nocheck=false"
 // @generated from file connectrpc/eliza/v1/eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
 
-import { SayRequest, SayResponse } from "./eliza_pb";
+import { SayRequest, SayResponse } from "./eliza_pb.js";
 import { MethodKind } from "@bufbuild/protobuf";
 
 /**

packages/protoc-gen-connect-query/snapshots/gen_cjs/connectrpc/eliza/v1/eliza-ElizaService_connectquery.js

@@ -0,0 +1,41 @@
+// Copyright 2021-2023 The Connect Authors
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+// @generated by protoc-gen-connect-query v1.1.0 with parameter "js_import_style=legacy_commonjs,ts_nocheck=false"
+// @generated from file connectrpc/eliza/v1/eliza.proto (package connectrpc.eliza.v1, syntax proto3)
+/* eslint-disable */
+
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+
+const { MethodKind } = require("@bufbuild/protobuf");
+const { SayRequest, SayResponse } = require("./eliza_pb.js");
+
+/**
+ * Say is a unary RPC. Eliza responds to the prompt with a single sentence.
+ *
+ * @generated from rpc connectrpc.eliza.v1.ElizaService.Say
+ */
+const say = {
+  localName: "say",
+  name: "Say",
+  kind: MethodKind.Unary,
+  I: SayRequest,
+  O: SayResponse,
+  service: {
+    typeName: "connectrpc.eliza.v1.ElizaService",
+  },
+};
+
+exports.say = say;