Unable to extract Sanity schema after installing sanity-range-slider

[rcmaples]

---

Sanity v3.62.3
sanity-range-slider v1.0.10

Description

Studio fails to build after installing and implementing sanity-range-slider. The error seems related to Shopify's Polaris:
mql.addEventListener is not function

Reproduction Steps

1. Install sanity-range-slider into a Studio project:
   ╰→ npm install @frontvibe/sanity-plugin-range-slider
2. Add the plugin to your sanity config:

// sanity.config.ts/js
import {rangeSlider} from '@frontvibe/sanity-range-slider'

export default defineConfig({
    ...,
    plugins: [
        rangeSlider(), 
        ...
    ]
})

3. Attempt to build or extract the schema
   ╰→ npm run dev | npm run build | sanity schema extract (any of them)

4. Notice you receive an error:

❌️ Failed to extract schema

TypeError: Failed to load configuration file "~/my-project/sanity.config.ts":
mql.addEventListener is not a function
    at ~/my-project/node_modules/@shopify/polaris/build/cjs/utilities/breakpoints.js:55:11
    at Array.forEach (<anonymous>)
    at Object.<anonymous> (~/my-project/node_modules/@shopify/polaris/build/cjs/utilities/breakpoints.js:45:27)
    at Object.newLoader [as .js] (~/my-project/node_modules/esbuild-register/dist/node.js:2262:9)
    at extensions..js (~/my-project/node_modules/esbuild-register/dist/node.js:4833:24)

[thomasKn]

@rcmaples, can you try again with v1.0.11? I tried to reproduce the issue on my side, but I can run npm run dev | npm run build successfully. Also, are you using the classic Sanity Vite studio or do you embed Sanity in a Remix or Next app?

[rcmaples]

Yea, I'll give it a shot and let you know what comes of it; thanks! Its an embedded Studio in a Next app. (Next 15, React 18.31.1) I think I'm missing something related to Polaris.

I'm also attempting to recreate the input with Radix UI's slider instead of Polaris.

I'll let you know what I find, but this is likely a local environment issue. 🤦

[hacknug]

I can confirm this is an issue. I worked around it by adding a pnpm patch for @shopify/polaris@13.9.5 (in ./patches/@shopify__polaris@13.9.5.patch) with the following contents:

diff --git a/build/cjs/utilities/breakpoints.js b/build/cjs/utilities/breakpoints.js
index 41dc896bd46db6a53cba6c2c7ab4aa5d0196b353..18577a354eae0ff89b838f7c1e1d0bbea940f622 100644
--- a/build/cjs/utilities/breakpoints.js
+++ b/build/cjs/utilities/breakpoints.js
@@ -51,7 +51,7 @@ if (!target.isServer) {
     const mql = window.matchMedia(query);
     if (mql.addListener) {
       mql.addListener(eventListener);
-    } else {
+    } else if (mql.addEventListener) {
       mql.addEventListener('change', eventListener);
     }
   });

Will mention this still being an issue upstream in case they can add the check and release a new version 👍