@sanity/preview-kit-compat - npm Package Compare versions

Comparing version 1.2.3 to 1.3.0

CHANGELOG.md

@@ -15,2 +15,23 @@ # Changelog
 
+## [1.3.0](https://github.com/sanity-io/visual-editing/compare/preview-kit-compat-v1.2.3...preview-kit-compat-v1.3.0) (2023-12-12)
+
+
+### Features
+
+* **channels:** simplify implementation and API ([#542](https://github.com/sanity-io/visual-editing/issues/542)) ([4854e7f](https://github.com/sanity-io/visual-editing/commit/4854e7f22dabe1aafad340342d1dbc209a94e9e0))
+
+
+### Bug Fixes
+
+* deprecate `allowStudioOrigin`, as it's no longer needed ([7ad52a0](https://github.com/sanity-io/visual-editing/commit/7ad52a03dfc05e3b3b7323468be4ebb1ae78c78a))
+* **deps:** update dependency @sanity/client to ^6.10.0 ([#551](https://github.com/sanity-io/visual-editing/issues/551)) ([5dc24c9](https://github.com/sanity-io/visual-editing/commit/5dc24c98bb84d7bc6dea5e77ac88dc4ca2cc9c6b))
+
+
+### Dependencies
+
+* The following workspace dependencies were updated
+  * devDependencies
+    * @sanity/channels bumped from 0.1.0 to 0.2.0
+    * @sanity/visual-editing-helpers bumped from 0.1.3 to 0.1.4
+
 ## [1.2.2](https://github.com/sanity-io/visual-editing/compare/preview-kit-compat-v1.2.1...preview-kit-compat-v1.2.2) (2023-12-07)
@@ -17,0 +38,0 @@

dist/index.d.ts

@@ -18,3 +18,2 @@ import type { ContentSourceMapDocuments } from '@sanity/client/csm'
   documentsInUse: Map<string, ContentSourceMapDocuments[number]>,
-  allowStudioOrigin: string | null,
   projectId: string,
@@ -21,0 +20,0 @@ dataset: string,

dist/index.js

@@ -1,1 +0,1 @@
-import{useState as n,useEffect as e,useMemo as t,useSyncExternalStore as o,useCallback as i}from"react";let s;const a=new Uint8Array(16);function r(){if(!s&&(s="undefined"!=typeof crypto&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!s))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return s(a)}const c=[];for(let n=0;n<256;++n)c.push((n+256).toString(16).slice(1));var d={randomUUID:"undefined"!=typeof crypto&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};function u(n,e,t){if(d.randomUUID&&!e&&!n)return d.randomUUID();const o=(n=n||{}).random||(n.rng||r)();if(o[6]=15&o[6]|64,o[8]=63&o[8]|128,e){t=t||0;for(let n=0;n<16;++n)e[t+n]=o[n];return e}return function(n,e=0){return c[n[e+0]]+c[n[e+1]]+c[n[e+2]]+c[n[e+3]]+"-"+c[n[e+4]]+c[n[e+5]]+"-"+c[n[e+6]]+c[n[e+7]]+"-"+c[n[e+8]]+c[n[e+9]]+"-"+c[n[e+10]]+c[n[e+11]]+c[n[e+12]]+c[n[e+13]]+c[n[e+14]]+c[n[e+15]]}(o)}const f=1e3,l=3e3,h=["channel/disconnect","channel/response"],p=["handshake/syn","handshake/syn-ack","handshake/ack"],g=n=>Boolean(n)&&"object"==typeof n&&!Array.isArray(n),m=n=>h.some((e=>e===n)),y=n=>p.some((e=>e===n)),w=n=>"channel/heartbeat"===n;function v(n){const e=window.self!==window.top,t=n.connections.map((n=>({buffer:[],config:n,heartbeat:null,id:null,status:"fresh"})));function o(n){n.heartbeat&&window.clearInterval(n.heartbeat)}function i(e,t){const i=e.status;i!==t&&(e.status=t,n.onStatusUpdate?.(t,i,e),"connected"===t&&(function(n){const e=[...n.buffer];n.buffer.splice(0,n.buffer.length),e.forEach((({type:e,data:t})=>{s(n,e,t)}))}(e),function(n){if(o(n),n.config.heartbeat){const e="number"==typeof n.config.heartbeat?n.config.heartbeat:l;n.heartbeat=window.setInterval((()=>{c("channel/heartbeat",void 0,[n])}),e)}}(e)),"disconnected"===t&&o(e))}function s(e,o,i){return new Promise(((s,a)=>{const r={id:u(),type:o,connectionId:e.id,from:n.id,to:e.config.id,data:i},c=m(o),d=y(o),l=w(o),h=t.find((n=>n.id===e.id&&"connected"===n.status));if(c||d||l||h){if(!c||l){const t=setTimeout((()=>{r.connectionId===e.id?a({reason:`Received no response to message '${r.id}' on client '${n.id}'`,msg:r,connection:e}):s(r.id)}),f),o=n=>{const{data:e}=n;"channel/response"===e.type&&e.data?.responseTo&&e.data.responseTo===r.id&&(window.removeEventListener("message",o,!1),clearTimeout(t),s(r.id))};window.addEventListener("message",o,!1)}try{const n=d?"*":e.config.targetOrigin;return e.config.target.postMessage(r,{targetOrigin:n}),void((c||d)&&s(r.id))}catch(t){console.error("Failed to postMessage",t,{msg:r,connection:e}),a({reason:`Failed to postMessage '${r.id}' on client '${n.id}'`,msg:r,connection:e})}}"fresh"!==e.status&&"connecting"!==e.status||(e.buffer.push({type:o,data:i}),s(r.id)),a({reason:`Will not send message '${r.id}' on client '${n.id}'`,msg:r,connection:e})}))}function a(n,e,t){return Promise.allSettled(n.map((n=>s(n,e,t))))}function r(e){const o=function(e){const{source:o,origin:i,data:s}=e;if(g(s))return t.find((e=>n.id===s.to&&e.config.id===s.from&&e.config.target===o&&(e.config.targetOrigin===i||"*"===e.config.targetOrigin)&&(e.id===s.connectionId||y(s.type))))}(e);if(!o)return;const{data:a}=e;if(y(a.type))!function(n,e){if("handshake/syn"===e.data.type){const t=e.data.data?.id||n.id;n.id=t,s(n,"handshake/syn-ack",{id:t})}if("handshake/syn-ack"===e.data.type){const t=e.data.data?.id||n.id;n.id=t,i(n,"connected"),s(n,"handshake/ack",{id:t})}if("handshake/ack"===e.data.type){const t=e.data.data?.id||n.id;n.id=t,i(n,"connected")}}(o,e);else if("channel/disconnect"===a.type)i(o,"disconnected");else if("channel/response"===a.type);else{const e=[a.type,a.data];n.handler(...e),s(o,"channel/response",{responseTo:a.id})}}async function c(n,e,o){const s=await a(o||t,n,e);return s.forEach((n=>{if("rejected"===n.status){const e=t.find((e=>"connected"===e.status&&e.id===n.reason.connection.id));e&&i(e,"unhealthy")}})),s}return function(){window.addEventListener("message",r,!1);const n=t.filter((n=>["disconnected","fresh","unhealthy"].includes(n.status)));Promise.all(n.map((n=>(i(n,"connecting"),s(n,"handshake/syn",{id:u()})))))}(),{disconnect:function(){window.removeEventListener("message",r,!1);const n=t.filter((({status:n})=>"connecting"===n||"connected"===n));n.length&&(a(n,"channel/disconnect"),n.forEach((n=>{i(n,"disconnected")})))},inFrame:e,send:c}}function b(t,o,i,s){const[a,r]=n(),[c,d]=n(!1);e((()=>{if(window.self===window.top)return;const n=new URL(o||"/",location.origin).origin,e=v({id:"preview-kit",onStatusUpdate(n){"connected"===n?d(!0):"disconnected"!==n&&"unhealthy"!==n||d(!1)},connections:[{target:parent,targetOrigin:n,id:"presentation"}],handler:()=>{}}),t=setTimeout((()=>r(e)),0);return()=>{clearTimeout(t),e.disconnect(),r(void 0)}}),[o,s,i]);const u=JSON.stringify(Array.from(t.keys()));e((()=>{"[]"!==u&&a&&c&&a.send("preview-kit/documents",{projectId:i,dataset:s,perspective:"previewDrafts",documents:Array.from(t.values())})}),[u,a,c,s,t,i])}function k(n){const e=t((()=>JSON.stringify(n||{})),[n]);return t((()=>JSON.parse(e)),[e])}function E(t){const{refreshInterval:s}=t,a=function(){const[t,i]=n(!1);e((()=>{i(navigator.onLine);const n=()=>i(!0),e=()=>i(!1);return window.addEventListener("online",n),window.addEventListener("offline",e),()=>{window.removeEventListener("online",n),window.removeEventListener("offline",e)}}),[]);const s=o(L,(()=>document.visibilityState),(()=>"hidden"));return!t||"hidden"===s}(),[r,c]=n("hit"),d=i((()=>(c("inflight"),()=>c("hit"))),[]);return e((()=>{if(!s||"hit"!==r)return;const n=setTimeout((()=>c("stale")),s);return()=>clearTimeout(n)}),[s,r]),e((()=>{if("hit"!==r)return;const n=()=>c("stale");return window.addEventListener("focus",n),()=>window.removeEventListener("focus",n)}),[s,r]),e((()=>{a&&"hit"===r&&c("stale"),a||"stale"!==r||c("refresh")}),[a,r]),[r,d]}function L(n){return document.addEventListener("visibilitychange",n),()=>document.removeEventListener("visibilitychange",n)}export{b as useDocumentsInUse,k as useQueryParams,E as useRevalidate};//# sourceMappingURL=index.js.map
+import{useState as n,useEffect as e,useMemo as t,useSyncExternalStore as o,useCallback as i}from"react";let r;const s=new Uint8Array(16);function c(){if(!r&&(r="undefined"!=typeof crypto&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!r))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return r(s)}const a=[];for(let n=0;n<256;++n)a.push((n+256).toString(16).slice(1));var d={randomUUID:"undefined"!=typeof crypto&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};function u(n,e,t){if(d.randomUUID&&!e&&!n)return d.randomUUID();const o=(n=n||{}).random||(n.rng||c)();if(o[6]=15&o[6]|64,o[8]=63&o[8]|128,e){t=t||0;for(let n=0;n<16;++n)e[t+n]=o[n];return e}return function(n,e=0){return a[n[e+0]]+a[n[e+1]]+a[n[e+2]]+a[n[e+3]]+"-"+a[n[e+4]]+a[n[e+5]]+"-"+a[n[e+6]]+a[n[e+7]]+"-"+a[n[e+8]]+a[n[e+9]]+"-"+a[n[e+10]]+a[n[e+11]]+a[n[e+12]]+a[n[e+13]]+a[n[e+14]]+a[n[e+15]]}(o)}const f=["channel/disconnect","channel/response","channel/heartbeat"],p=["handshake/syn","handshake/syn-ack","handshake/ack"],l=n=>f.some((e=>e===n)),h=n=>p.some((e=>e===n));function m(n){const e=window.self!==window.top,t={buffer:[],id:null,origin:null,status:"connecting"};function o(e,o){if(h(e)||l(e)||"connecting"!==t.status&&"reconnecting"!==t.status){if(t.id&&t.origin){const i={connectionId:t.id,data:o,domain:"sanity/channels",from:n.id,id:u(),to:n.connectTo,type:e};try{parent.postMessage(i,{targetOrigin:t.origin})}catch(e){throw new Error(`Failed to postMessage '${i.id}' on '${n.id}'`)}}}else t.buffer.push({type:e,data:o})}function i(e){if(function(e){const{data:t}=e;return"sanity/channels"===t.domain&&t.to===n.id&&t.from===n.connectTo&&"channel/response"!==t.type}(e)){const{data:i}=e;if(h(i.type)&&i.data){if("handshake/syn"===i.type)return t.origin=e.origin,t.id=i.data.id,r("connecting"),void o("handshake/syn-ack",{id:t.id});if("handshake/ack"===i.type&&i.data.id===t.id)return void r("connected")}else if(i.connectionId===t.id&&e.origin===t.origin){if("channel/disconnect"===i.type)return void r("disconnected");{const e=[i.type,i.data];n.onEvent?.(...e),o("channel/response",{responseTo:i.id})}return}}}function r(e){t.status=e,n?.onStatusUpdate?.(e),"connected"===e&&function(){const n=[...t.buffer];t.buffer.splice(0,t.buffer.length),n.forEach((({type:n,data:e})=>{o(n,e)}))}()}return window.addEventListener("message",i,!1),r("connecting"),{destroy:function(){["disconnected"].includes(t.status)||r("disconnected"),window.removeEventListener("message",i,!1)},inFrame:e,send:function(n,e){o(n,e)}}}function y(t,o,i){const[r,s]=n(),[c,a]=n(!1);e((()=>{if(window.self===window.top)return;const n=m({id:"preview-kit",connectTo:"presentation",onStatusUpdate(n){"connected"===n?a(!0):"disconnected"===n&&a(!1)}}),e=setTimeout((()=>s(n)),0);return()=>{clearTimeout(e),n.destroy(),s(void 0)}}),[i,o]);const d=JSON.stringify(Array.from(t.keys()));e((()=>{"[]"!==d&&r&&c&&r.send("preview-kit/documents",{projectId:o,dataset:i,perspective:"previewDrafts",documents:Array.from(t.values())})}),[d,r,c,i,t,o])}function v(n){const e=t((()=>JSON.stringify(n||{})),[n]);return t((()=>JSON.parse(e)),[e])}function g(t){const{refreshInterval:r}=t,s=function(){const[t,i]=n(!1);e((()=>{i(navigator.onLine);const n=()=>i(!0),e=()=>i(!1);return window.addEventListener("online",n),window.addEventListener("offline",e),()=>{window.removeEventListener("online",n),window.removeEventListener("offline",e)}}),[]);const r=o(w,(()=>document.visibilityState),(()=>"hidden"));return!t||"hidden"===r}(),[c,a]=n("hit"),d=i((()=>(a("inflight"),()=>a("hit"))),[]);return e((()=>{if(!r||"hit"!==c)return;const n=setTimeout((()=>a("stale")),r);return()=>clearTimeout(n)}),[r,c]),e((()=>{if("hit"!==c)return;const n=()=>a("stale");return window.addEventListener("focus",n),()=>window.removeEventListener("focus",n)}),[r,c]),e((()=>{s&&"hit"===c&&a("stale"),s||"stale"!==c||a("refresh")}),[s,c]),[c,d]}function w(n){return document.addEventListener("visibilitychange",n),()=>document.removeEventListener("visibilitychange",n)}export{y as useDocumentsInUse,v as useQueryParams,g as useRevalidate};//# sourceMappingURL=index.js.map

package.json

 {
   "name": "@sanity/preview-kit-compat",
-  "version": "1.2.3",
+  "version": "1.3.0",
   "homepage": "https://github.com/sanity-io/visual-editing/tree/main/packages/preview-kit-compat#readme",
@@ -106,9 +106,9 @@ "bugs": {
   "devDependencies": {
-    "@sanity/channels": "0.1.0",
-    "@sanity/client": "^6.9.3",
-    "@sanity/pkg-utils": "^3.3.4",
-    "@sanity/visual-editing-helpers": "0.1.3",
-    "@types/react": "^18.2.42",
-    "@typescript-eslint/eslint-plugin": "^6.13.2",
-    "@typescript-eslint/parser": "^6.13.2",
+    "@sanity/channels": "0.2.0",
+    "@sanity/client": "^6.10.0",
+    "@sanity/pkg-utils": "^3.3.5",
+    "@sanity/visual-editing-helpers": "0.1.4",
+    "@types/react": "^18.2.43",
+    "@typescript-eslint/eslint-plugin": "^6.14.0",
+    "@typescript-eslint/parser": "^6.14.0",
     "eslint": "^8.55.0",
@@ -120,6 +120,6 @@ "eslint-config-prettier": "^9.1.0",
     "typescript": "^5.3.3",
-    "vitest": "^1.0.2"
+    "vitest": "^1.0.4"
   },
   "peerDependencies": {
-    "@sanity/client": "^6.9.3",
+    "@sanity/client": "^6.10.0",
     "react": "^18.2.0"
@@ -126,0 +126,0 @@ },

src/useDocumentsInUse.ts

@@ -1,2 +0,2 @@
-import { type ChannelReturns, createChannel } from '@sanity/channels'
+import { type ChannelsNode, createChannelsNode } from '@sanity/channels'
 import type { ContentSourceMapDocuments } from '@sanity/client/csm'
@@ -15,3 +15,2 @@ import {
   documentsInUse: Map<string, ContentSourceMapDocuments[number]>,
-  allowStudioOrigin: string | null,
   projectId: string,
@@ -21,3 +20,3 @@ dataset: string,
   const [channel, setChannel] = useState<
-    ChannelReturns<VisualEditingMsg> | undefined
+    ChannelsNode<VisualEditingMsg> | undefined
   >()
@@ -29,21 +28,12 @@ const [connected, setConnected] = useState(false)
     }
-    const targetOrigin = new URL(allowStudioOrigin || '/', location.origin)
-      .origin
-    const channel = createChannel<VisualEditingMsg>({
+    const channel = createChannelsNode<VisualEditingMsg>({
       id: 'preview-kit' satisfies VisualEditingConnectionIds,
+      connectTo: 'presentation' satisfies VisualEditingConnectionIds,
       onStatusUpdate(status) {
         if (status === 'connected') {
           setConnected(true)
-        } else if (status === 'disconnected' || status === 'unhealthy') {
+        } else if (status === 'disconnected') {
           setConnected(false)
         }
       },
-      connections: [
-        {
-          target: parent,
-          targetOrigin,
-          id: 'presentation' satisfies VisualEditingConnectionIds,
-        },
-      ],
-      handler: () => {},
     })
@@ -53,6 +43,6 @@ const timeout = setTimeout(() => setChannel(channel), 0)
       clearTimeout(timeout)
-      channel.disconnect()
+      channel.destroy()
       setChannel(undefined)
     }
-  }, [allowStudioOrigin, dataset, projectId])
+  }, [dataset, projectId])
 
@@ -59,0 +49,0 @@ const changedKeys = JSON.stringify(Array.from(documentsInUse.keys()))

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

57063

decreased by-27.74%

Lines of code

134

decreased by-15.72%

No dependency changes