@contentful/experiences-react 0.8.5 → 0.8.6

package/CHANGELOG.md

@@ -1,3 +1,20 @@
+## 0.8.6 (2026-09-21)
+
+### 🚀 Features
+
+- deprecate the SDK viewport surface, guard absent viewports [SPA-5272] ([4a74473](https://github.com/contentful/experiences/commit/4a74473))
+
+### 🩹 Fixes
+
+- reword deprecation notices, drop internal ticket link [SPA-5272] ([8361460](https://github.com/contentful/experiences/commit/8361460))
+
+### 🧱 Updated Dependencies
+
+- Updated live-preview to 0.1.4
+- Updated client to 0.4.5
+- Updated design to 0.8.4
+- Updated core to 0.8.4
+
 ## 0.8.5 (2026-09-21)
 
 ### 🧱 Updated Dependencies

package/dist/use-active-viewport.d.ts

@@ -1,8 +1,18 @@
 import { ViewportDef } from '@contentful/experiences-sdk-core';
 
+/**
+ * @deprecated Viewports are being removed from the Experiences APIs, with no
+ * direct replacement — use CSS media queries or `window.matchMedia` instead.
+ * Will not be removed before 2026-10-06.
+ */
 interface UseActiveViewportResult {
     activeViewportIndex: number;
 }
+/**
+ * @deprecated Viewports are being removed from the Experiences APIs, with no
+ * direct replacement — use CSS media queries or `window.matchMedia` instead.
+ * Will not be removed before 2026-10-06.
+ */
 declare function useActiveViewport(viewports: ViewportDef[], initialViewportId?: string): UseActiveViewportResult;
 
 export { type UseActiveViewportResult, useActiveViewport };

package/dist/use-active-viewport.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/use-active-viewport.ts"],"sourcesContent":["/*\n * Reactive viewport-matcher hook.\n *\n * \"Active viewport\" = the last-matching media query in the ordered viewports\n * list. With desktop-first ordering (`*`, `<992px`, `<576px`), the narrowest\n * matching query wins. With mobile-first ordering, the widest wins. Either\n * way: the last `findLastIndex` of `mediaQueryMatches[i] === true`.\n *\n * Pass `initialViewportId` (typically derived from User-Agent on the server)\n * to seed the first render so SSR + client agree on viewport before\n * window.matchMedia takes over.\n */\n\n'use client';\n\nimport { useEffect, useState } from 'react';\n\nimport type { ViewportDef } from '@contentful/experiences-sdk-core';\nimport { createMediaQueryMatchers, getViewportIndex } from '@contentful/experiences-design';\n\nfunction useMediaQueryMatchers(viewports: ViewportDef[]): boolean[] {\n  const [, initialMatches] = createMediaQueryMatchers(viewports);\n  const [matches, setMatches] = useState<boolean[]>(initialMatches);\n\n  useEffect(() => {\n    const [matchers] = createMediaQueryMatchers(viewports);\n    const listeners = matchers.map(({ index, signal }) => {\n      const onChange = (): void =>\n        setMatches((prev) => {\n          const next = [...prev];\n          next[index] = signal.matches;\n          return next;\n        });\n      signal.addEventListener('change', onChange);\n      return onChange;\n    });\n    return () => {\n      listeners.forEach((listener, i) => {\n        const matcher = matchers[i];\n        if (matcher) matcher.signal.removeEventListener('change', listener);\n      });\n    };\n  }, [viewports]);\n\n  return matches;\n}\n\nexport interface UseActiveViewportResult {\n  activeViewportIndex: number;\n}\n\nexport function useActiveViewport(\n  viewports: ViewportDef[],\n  initialViewportId?: string\n): UseActiveViewportResult {\n  const matches = useMediaQueryMatchers(viewports);\n  const [activeViewportIndex, setActiveViewportIndex] = useState<number>(() =>\n    getViewportIndex(viewports, initialViewportId)\n  );\n\n  useEffect(() => {\n    const currentIndex = matches.findLastIndex((isMatch) => isMatch);\n    if (currentIndex !== -1 && currentIndex !== activeViewportIndex) {\n      setActiveViewportIndex(currentIndex);\n    }\n  }, [activeViewportIndex, matches]);\n\n  return { activeViewportIndex };\n}\n"],"mappings":";AAeA,SAAS,WAAW,gBAAgB;AAGpC,SAAS,0BAA0B,wBAAwB;AAE3D,SAAS,sBAAsB,WAAqC;AAClE,QAAM,CAAC,EAAE,cAAc,IAAI,yBAAyB,SAAS;AAC7D,QAAM,CAAC,SAAS,UAAU,IAAI,SAAoB,cAAc;AAEhE,YAAU,MAAM;AACd,UAAM,CAAC,QAAQ,IAAI,yBAAyB,SAAS;AACrD,UAAM,YAAY,SAAS,IAAI,CAAC,EAAE,OAAO,OAAO,MAAM;AACpD,YAAM,WAAW,MACf,WAAW,CAAC,SAAS;AACnB,cAAM,OAAO,CAAC,GAAG,IAAI;AACrB,aAAK,KAAK,IAAI,OAAO;AACrB,eAAO;AAAA,MACT,CAAC;AACH,aAAO,iBAAiB,UAAU,QAAQ;AAC1C,aAAO;AAAA,IACT,CAAC;AACD,WAAO,MAAM;AACX,gBAAU,QAAQ,CAAC,UAAU,MAAM;AACjC,cAAM,UAAU,SAAS,CAAC;AAC1B,YAAI,QAAS,SAAQ,OAAO,oBAAoB,UAAU,QAAQ;AAAA,MACpE,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,SAAS,CAAC;AAEd,SAAO;AACT;AAMO,SAAS,kBACd,WACA,mBACyB;AACzB,QAAM,UAAU,sBAAsB,SAAS;AAC/C,QAAM,CAAC,qBAAqB,sBAAsB,IAAI;AAAA,IAAiB,MACrE,iBAAiB,WAAW,iBAAiB;AAAA,EAC/C;AAEA,YAAU,MAAM;AACd,UAAM,eAAe,QAAQ,cAAc,CAAC,YAAY,OAAO;AAC/D,QAAI,iBAAiB,MAAM,iBAAiB,qBAAqB;AAC/D,6BAAuB,YAAY;AAAA,IACrC;AAAA,EACF,GAAG,CAAC,qBAAqB,OAAO,CAAC;AAEjC,SAAO,EAAE,oBAAoB;AAC/B;","names":[]}
+{"version":3,"sources":["../src/use-active-viewport.ts"],"sourcesContent":["/*\n * Reactive viewport-matcher hook.\n *\n * \"Active viewport\" = the last-matching media query in the ordered viewports\n * list. With desktop-first ordering (`*`, `<992px`, `<576px`), the narrowest\n * matching query wins. With mobile-first ordering, the widest wins. Either\n * way: the last `findLastIndex` of `mediaQueryMatches[i] === true`.\n *\n * Pass `initialViewportId` (typically derived from User-Agent on the server)\n * to seed the first render so SSR + client agree on viewport before\n * window.matchMedia takes over.\n */\n\n'use client';\n\nimport { useEffect, useState } from 'react';\n\nimport type { ViewportDef } from '@contentful/experiences-sdk-core';\nimport { createMediaQueryMatchers, getViewportIndex } from '@contentful/experiences-design';\n\nfunction useMediaQueryMatchers(viewports: ViewportDef[]): boolean[] {\n  const [, initialMatches] = createMediaQueryMatchers(viewports);\n  const [matches, setMatches] = useState<boolean[]>(initialMatches);\n\n  useEffect(() => {\n    const [matchers] = createMediaQueryMatchers(viewports);\n    const listeners = matchers.map(({ index, signal }) => {\n      const onChange = (): void =>\n        setMatches((prev) => {\n          const next = [...prev];\n          next[index] = signal.matches;\n          return next;\n        });\n      signal.addEventListener('change', onChange);\n      return onChange;\n    });\n    return () => {\n      listeners.forEach((listener, i) => {\n        const matcher = matchers[i];\n        if (matcher) matcher.signal.removeEventListener('change', listener);\n      });\n    };\n  }, [viewports]);\n\n  return matches;\n}\n\n/**\n * @deprecated Viewports are being removed from the Experiences APIs, with no\n * direct replacement — use CSS media queries or `window.matchMedia` instead.\n * Will not be removed before 2026-10-06.\n */\nexport interface UseActiveViewportResult {\n  activeViewportIndex: number;\n}\n\n/**\n * @deprecated Viewports are being removed from the Experiences APIs, with no\n * direct replacement — use CSS media queries or `window.matchMedia` instead.\n * Will not be removed before 2026-10-06.\n */\nexport function useActiveViewport(\n  viewports: ViewportDef[],\n  initialViewportId?: string\n): UseActiveViewportResult {\n  const matches = useMediaQueryMatchers(viewports);\n  const [activeViewportIndex, setActiveViewportIndex] = useState<number>(() =>\n    getViewportIndex(viewports, initialViewportId)\n  );\n\n  useEffect(() => {\n    const currentIndex = matches.findLastIndex((isMatch) => isMatch);\n    if (currentIndex !== -1 && currentIndex !== activeViewportIndex) {\n      setActiveViewportIndex(currentIndex);\n    }\n  }, [activeViewportIndex, matches]);\n\n  return { activeViewportIndex };\n}\n"],"mappings":";AAeA,SAAS,WAAW,gBAAgB;AAGpC,SAAS,0BAA0B,wBAAwB;AAE3D,SAAS,sBAAsB,WAAqC;AAClE,QAAM,CAAC,EAAE,cAAc,IAAI,yBAAyB,SAAS;AAC7D,QAAM,CAAC,SAAS,UAAU,IAAI,SAAoB,cAAc;AAEhE,YAAU,MAAM;AACd,UAAM,CAAC,QAAQ,IAAI,yBAAyB,SAAS;AACrD,UAAM,YAAY,SAAS,IAAI,CAAC,EAAE,OAAO,OAAO,MAAM;AACpD,YAAM,WAAW,MACf,WAAW,CAAC,SAAS;AACnB,cAAM,OAAO,CAAC,GAAG,IAAI;AACrB,aAAK,KAAK,IAAI,OAAO;AACrB,eAAO;AAAA,MACT,CAAC;AACH,aAAO,iBAAiB,UAAU,QAAQ;AAC1C,aAAO;AAAA,IACT,CAAC;AACD,WAAO,MAAM;AACX,gBAAU,QAAQ,CAAC,UAAU,MAAM;AACjC,cAAM,UAAU,SAAS,CAAC;AAC1B,YAAI,QAAS,SAAQ,OAAO,oBAAoB,UAAU,QAAQ;AAAA,MACpE,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,SAAS,CAAC;AAEd,SAAO;AACT;AAgBO,SAAS,kBACd,WACA,mBACyB;AACzB,QAAM,UAAU,sBAAsB,SAAS;AAC/C,QAAM,CAAC,qBAAqB,sBAAsB,IAAI;AAAA,IAAiB,MACrE,iBAAiB,WAAW,iBAAiB;AAAA,EAC/C;AAEA,YAAU,MAAM;AACd,UAAM,eAAe,QAAQ,cAAc,CAAC,YAAY,OAAO;AAC/D,QAAI,iBAAiB,MAAM,iBAAiB,qBAAqB;AAC/D,6BAAuB,YAAY;AAAA,IACrC;AAAA,EACF,GAAG,CAAC,qBAAqB,OAAO,CAAC;AAEjC,SAAO,EAAE,oBAAoB;AAC/B;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/experiences-react",
-  "version": "0.8.5",
+  "version": "0.8.6",
   "description": "React adapter for Contentful Experiences — Server and Client renderers over a PortableRenderPlan",
   "license": "MIT",
   "type": "module",
@@ -30,10 +30,10 @@
     "directory": "packages/adapter-react"
   },
   "dependencies": {
-    "@contentful/experiences-client": "0.4.4",
-    "@contentful/experiences-sdk-core": "0.8.3",
-    "@contentful/experiences-design": "0.8.3",
-    "@contentful/experiences-live-preview": "0.1.3"
+    "@contentful/experiences-client": "0.4.5",
+    "@contentful/experiences-sdk-core": "0.8.4",
+    "@contentful/experiences-design": "0.8.4",
+    "@contentful/experiences-live-preview": "0.1.4"
   },
   "devDependencies": {
     "jsdom": "^30.0.1"