Merge branch 'next' into next

Author: niklasbec

.github/workflows/milestone-automation.yml

@@ -16,7 +16,7 @@ jobs:
       - name: Check if PR was in Backlog
         id: check_milestone
         run: |
-          milestone_id=$(gh pr view ${{ github.repository }}#${{ github.event.pull_request.number }} --json milestone --jq '.milestone.number')
+          milestone_id=$(gh api repos/${{ github.repository }}/pulls/${{ github.event.pull_request.number }} --jq '.milestone.number')
           if [[ "$milestone_id" == "3" ]]; then
             echo "backlog_milestone=true" >> $GITHUB_OUTPUT
           else
@@ -36,7 +36,7 @@ jobs:
       - name: Find and update associated issues to "shipping next"
         if: steps.check_milestone.outputs.backlog_milestone == 'true'
         run: |
-          issues=$(gh pr view ${{ github.repository }}#${{ github.event.pull_request.number }} --json closingIssuesReferences --jq '.closingIssuesReferences[].number')
+          issues=$(gh api repos/${{ github.repository }}/pulls/${{ github.event.pull_request.number }} --jq '.closingIssuesReferences[].number')
           for issue in $issues; do
             echo "Updating issue #$issue to milestone ID 2 (shipping next)"
 

errors/NUQS-101.md

@@ -0,0 +1,28 @@
+# This package is ESM only.
+
+Since version 2.0.0, `nuqs` is now an [ESM-only package](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c).
+
+## Probable cause
+
+You may have encountered this error when trying to import `nuqs` in a CommonJS
+environment, like Jest or ESLint.
+
+## Possible solutions
+
+If you cannot update your project to use ESM (which would be the most future-proof
+solution), please refer to the following guides:
+
+### Jest
+
+See the [testing adapter documentation](https://nuqs.47ng.com/docs/testing#with-jest)
+for its configuration with Jest.
+
+### ESLint
+
+See issue [#691](https://github.com/47ng/nuqs/issues/691) for more details.
+
+### Something else?
+
+If you are encountering this error in a different context, please
+[open an issue](https://github.com/47ng/nuqs/issues/new/choose) with details about
+your setup (a reproduction repository would be even better).

packages/docs/content/docs/testing.mdx

@@ -6,6 +6,8 @@ description: Some tips on testing components that use `nuqs`
 Since nuqs 2, you can unit-test components that use `useQueryState(s){:ts}` hooks
 by wrapping your rendered component in a `NuqsTestingAdapter{:ts}`.
 
+## With Vitest
+
 Here is an example for Vitest and Testing Library to test a button rendering
 a counter:
 
@@ -78,3 +80,35 @@ it('should increment the count when clicked', async () => {
 </Tabs>
 
 See issue [#259](https://github.com/47ng/nuqs/issues/259) for more testing-related discussions.
+
+## With Jest
+
+Since nuqs 2 is an [ESM-only package](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c),
+there are a few hoops you need to jump through to make it work with Jest.
+This is extracted from the [Jest ESM guide](https://jestjs.io/docs/ecmascript-modules).
+
+1. Add the following options to your jest.config.ts file:
+
+```ts title="jest.config.ts"
+const config: Config = {
+  // <Other options here>
+  // [!code highlight:3]
+  extensionsToTreatAsEsm: [".ts", ".tsx"],
+  transform: {}
+};
+```
+
+2. Change your test command to include the `--experimental-vm-modules` flag:
+
+```json title="package.json"
+// [!code word:--experimental-vm-modules]
+{
+  "scripts": {
+    "test": "NODE_OPTIONS=\"$NODE_OPTIONS --experimental-vm-modules\" jest"
+  }
+}
+```
+
+<Callout>
+Adapt accordingly for Windows with [`cross-env`](https://www.npmjs.com/package/cross-env).
+</Callout>

packages/docs/src/app/(pages)/_landing/sponsors.tsx

@@ -11,7 +11,7 @@ export async function SponsorsSection() {
       <h2 className="mb-12 text-center text-3xl font-bold tracking-tighter dark:text-white md:text-4xl xl:text-5xl">
         Sponsors
       </h2>
-      <ul className="container grid grid-cols-1 gap-y-12 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-5">
+      <ul className="container grid grid-cols-2 gap-y-12 md:grid-cols-3 xl:grid-cols-6">
         {sponsors.map(sponsor => (
           <li key={sponsor.handle} className="flex flex-col items-center">
             <a href={sponsor.url} className="h-32 w-32 rounded-full">
@@ -84,11 +84,16 @@ async function fetchSponsors(): Promise<Sponsors> {
   // }
   return [
     {
-      handle: 'YoannFleuryDev',
-      name: 'Yoann Fleury',
-      url: 'https://www.yoannfleury.dev/',
-      img: 'https://pbs.twimg.com/profile_images/1594632934245498880/CJTKNRCO_400x400.jpg',
-      title: 'Front end developer'
+      handle: 'vercel',
+      name: 'Vercel',
+      url: 'https://vercel.com/',
+      img: 'https://avatars.githubusercontent.com/u/14985020?v=4'
+    },
+    {
+      handle: 'ryanmagoon',
+      name: 'Ryan Magoon',
+      url: 'https://x.com/Ryan_Magoon',
+      img: 'https://avatars.githubusercontent.com/u/5327290?v=4'
     },
     {
       handle: 'pontusab',
@@ -104,12 +109,6 @@ async function fetchSponsors(): Promise<Sponsors> {
         </>
       )
     },
-    {
-      handle: 'vercel',
-      name: 'Vercel',
-      url: 'https://vercel.com/',
-      img: 'https://avatars.githubusercontent.com/u/14985020?v=4'
-    },
     {
       handle: 'CarlLindesvard',
       name: 'Carl Lindesvärd',
@@ -137,6 +136,13 @@ async function fetchSponsors(): Promise<Sponsors> {
           </a>
         </>
       )
+    },
+    {
+      handle: 'YoannFleuryDev',
+      name: 'Yoann Fleury',
+      url: 'https://www.yoannfleury.dev/',
+      img: 'https://pbs.twimg.com/profile_images/1594632934245498880/CJTKNRCO_400x400.jpg',
+      title: 'Front end developer'
     }
   ]
 }

packages/nuqs/esm-only.cjs

@@ -5,5 +5,5 @@
 
 throw new Error(
   `This package is ESM only.
-  See https://github.com/47ng/nuqs/issues/691 for more details.`
+  See https://err.47ng.com/NUQS-101 for more details.`
 )