@knocklabs/react-core 0.7.4 → 0.8.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # Changelog
 
+## 0.8.0
+
+### Minor Changes
+
+- 48e9c77: - Support guides ordering and throttle settings
+  - Add `useGuides` hook
+
+### Patch Changes
+
+- Updated dependencies [48e9c77]
+  - @knocklabs/client@0.16.0
+
+## 0.7.5
+
+### Patch Changes
+
+- d7e5371: chore(deps): bump @tanstack/react-store from 0.7.1 to 0.7.3
+- Updated dependencies [fb68ce1]
+  - @knocklabs/client@0.15.2
+
 ## 0.7.4
 
 ### Patch Changes

package/dist/cjs/modules/guide/context/KnockGuideProvider.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("@knocklabs/client"),b=require("react"),k=require("../../core/context/KnockProvider.js"),p=require("../../core/hooks/useStableOptions.js");require("date-fns");function v(e){if(e&&typeof e=="object"&&"default"in e)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const c=v(b),a=c.createContext(void 0),K=({channelId:e,readyToTarget:r,listenForUpdates:t=!0,colorMode:o="light",targetParams:l={},trackLocationFromWindow:u=!0,children:d})=>{let i;try{i=k.useKnockClient()}catch{throw new Error("KnockGuideProvider must be used within a KnockProvider")}const s=p(l),n=c.useMemo(()=>new f.KnockGuideClient(i,e,s,{trackLocationFromWindow:u}),[i,e,s,u]);return c.useEffect(()=>(r&&(n.fetch(),t&&n.subscribe()),()=>n.cleanup()),[r,t,n]),c.createElement(a.Provider,{value:{client:n,colorMode:o}},d)};exports.KnockGuideContext=a;exports.KnockGuideProvider=K;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("@knocklabs/client"),p=require("react"),K=require("../../core/context/KnockProvider.js"),P=require("../../core/hooks/useStableOptions.js");require("date-fns");function m(e){if(e&&typeof e=="object"&&"default"in e)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const c=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,c.get?c:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const o=m(p),l=o.createContext(void 0),v=({channelId:e,readyToTarget:r,listenForUpdates:t=!0,colorMode:c="light",targetParams:f={},trackLocationFromWindow:u=!0,orderResolutionDuration:s=0,throttleCheckInterval:a,children:b})=>{let i;try{i=K.useKnockClient()}catch{throw new Error("KnockGuideProvider must be used within a KnockProvider")}const d=P(f),n=o.useMemo(()=>new k.KnockGuideClient(i,e,d,{trackLocationFromWindow:u,orderResolutionDuration:s,throttleCheckInterval:a}),[i,e,d,u,s,a]);return o.useEffect(()=>(r&&(n.fetch(),t&&n.subscribe()),()=>n.cleanup()),[r,t,n]),o.createElement(l.Provider,{value:{client:n,colorMode:c}},b)};exports.KnockGuideContext=l;exports.KnockGuideProvider=v;
 //# sourceMappingURL=KnockGuideProvider.js.map

package/dist/cjs/modules/guide/context/KnockGuideProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"KnockGuideProvider.js","sources":["../../../../../src/modules/guide/context/KnockGuideProvider.tsx"],"sourcesContent":["import Knock, {\n  KnockGuideClient,\n  KnockGuideTargetParams,\n} from \"@knocklabs/client\";\nimport * as React from \"react\";\n\nimport { useKnockClient, useStableOptions } from \"../../core\";\nimport { ColorMode } from \"../../core/constants\";\n\ntype KnockGuideProviderValue = {\n  client: KnockGuideClient;\n  colorMode: ColorMode;\n};\n\nexport const KnockGuideContext = React.createContext<\n  KnockGuideProviderValue | undefined\n>(undefined);\n\ntype Props = {\n  channelId: string;\n  readyToTarget: boolean;\n  listenForUpdates?: boolean;\n  colorMode?: ColorMode;\n  targetParams?: KnockGuideTargetParams;\n  trackLocationFromWindow?: boolean;\n};\n\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n  channelId,\n  readyToTarget,\n  listenForUpdates = true,\n  colorMode = \"light\",\n  targetParams = {},\n  trackLocationFromWindow = true,\n  children,\n}) => {\n  let knock: Knock;\n\n  try {\n    knock = useKnockClient();\n  } catch (_) {\n    throw new Error(\"KnockGuideProvider must be used within a KnockProvider\");\n  }\n\n  const stableTargetParams = useStableOptions(targetParams);\n\n  const knockGuideClient = React.useMemo(() => {\n    return new KnockGuideClient(knock, channelId, stableTargetParams, {\n      trackLocationFromWindow,\n    });\n  }, [knock, channelId, stableTargetParams, trackLocationFromWindow]);\n\n  React.useEffect(() => {\n    if (readyToTarget) {\n      knockGuideClient.fetch();\n      if (listenForUpdates) knockGuideClient.subscribe();\n    }\n\n    return () => knockGuideClient.cleanup();\n  }, [readyToTarget, listenForUpdates, knockGuideClient]);\n\n  return (\n    <KnockGuideContext.Provider\n      value={{\n        client: knockGuideClient,\n        colorMode,\n      }}\n    >\n      {children}\n    </KnockGuideContext.Provider>\n  );\n};\n"],"names":["KnockGuideContext","React","createContext","undefined","KnockGuideProvider","channelId","readyToTarget","listenForUpdates","colorMode","targetParams","trackLocationFromWindow","children","knock","useKnockClient","Error","stableTargetParams","useStableOptions","knockGuideClient","useMemo","KnockGuideClient","useEffect","fetch","subscribe","cleanup","client"],"mappings":"0kBAcaA,EAAoBC,EAAMC,cAErCC,MAAS,EAWEC,EAA+DA,CAAC,CAC3EC,UAAAA,EACAC,cAAAA,EACAC,iBAAAA,EAAmB,GACnBC,UAAAA,EAAY,QACZC,aAAAA,EAAe,CAAC,EAChBC,wBAAAA,EAA0B,GAC1BC,SAAAA,CACF,IAAM,CACAC,IAAAA,EAEA,GAAA,CACFA,EAAQC,EAAAA,eAAe,OACb,CACJ,MAAA,IAAIC,MAAM,wDAAwD,CAAA,CAGpEC,MAAAA,EAAqBC,EAAiBP,CAAY,EAElDQ,EAAmBhB,EAAMiB,QAAQ,IAC9B,IAAIC,EAAAA,iBAAiBP,EAAOP,EAAWU,EAAoB,CAChEL,wBAAAA,CAAAA,CACD,EACA,CAACE,EAAOP,EAAWU,EAAoBL,CAAuB,CAAC,EAElET,OAAAA,EAAMmB,UAAU,KACVd,IACFW,EAAiBI,MAAM,EACnBd,KAAmCe,UAAU,GAG5C,IAAML,EAAiBM,QAAQ,GACrC,CAACjB,EAAeC,EAAkBU,CAAgB,CAAC,EAGnDhB,EAAA,cAAAD,EAAkB,SAAlB,CACC,MAAO,CACLwB,OAAQP,EACRT,UAAAA,IAGDG,CACH,CAEJ"}
+{"version":3,"file":"KnockGuideProvider.js","sources":["../../../../../src/modules/guide/context/KnockGuideProvider.tsx"],"sourcesContent":["import Knock, {\n  KnockGuideClient,\n  KnockGuideTargetParams,\n} from \"@knocklabs/client\";\nimport * as React from \"react\";\n\nimport { useKnockClient, useStableOptions } from \"../../core\";\nimport { ColorMode } from \"../../core/constants\";\n\ntype KnockGuideProviderValue = {\n  client: KnockGuideClient;\n  colorMode: ColorMode;\n};\n\nexport const KnockGuideContext = React.createContext<\n  KnockGuideProviderValue | undefined\n>(undefined);\n\ntype Props = {\n  channelId: string;\n  readyToTarget: boolean;\n  listenForUpdates?: boolean;\n  colorMode?: ColorMode;\n  targetParams?: KnockGuideTargetParams;\n  trackLocationFromWindow?: boolean;\n  orderResolutionDuration?: number; // in milliseconds\n  throttleCheckInterval?: number; // in milliseconds\n};\n\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n  channelId,\n  readyToTarget,\n  listenForUpdates = true,\n  colorMode = \"light\",\n  targetParams = {},\n  trackLocationFromWindow = true,\n  // Default to 0 which works well for react apps as this \"yields\" to react for\n  // one render cyle first and close the group stage.\n  orderResolutionDuration = 0,\n  throttleCheckInterval,\n  children,\n}) => {\n  let knock: Knock;\n\n  try {\n    knock = useKnockClient();\n  } catch (_) {\n    throw new Error(\"KnockGuideProvider must be used within a KnockProvider\");\n  }\n\n  const stableTargetParams = useStableOptions(targetParams);\n\n  const knockGuideClient = React.useMemo(() => {\n    return new KnockGuideClient(knock, channelId, stableTargetParams, {\n      trackLocationFromWindow,\n      orderResolutionDuration,\n      throttleCheckInterval,\n    });\n  }, [\n    knock,\n    channelId,\n    stableTargetParams,\n    trackLocationFromWindow,\n    orderResolutionDuration,\n    throttleCheckInterval,\n  ]);\n\n  React.useEffect(() => {\n    if (readyToTarget) {\n      knockGuideClient.fetch();\n      if (listenForUpdates) knockGuideClient.subscribe();\n    }\n\n    return () => knockGuideClient.cleanup();\n  }, [readyToTarget, listenForUpdates, knockGuideClient]);\n\n  return (\n    <KnockGuideContext.Provider\n      value={{\n        client: knockGuideClient,\n        colorMode,\n      }}\n    >\n      {children}\n    </KnockGuideContext.Provider>\n  );\n};\n"],"names":["KnockGuideContext","React","createContext","undefined","KnockGuideProvider","channelId","readyToTarget","listenForUpdates","colorMode","targetParams","trackLocationFromWindow","orderResolutionDuration","throttleCheckInterval","children","knock","useKnockClient","Error","stableTargetParams","useStableOptions","knockGuideClient","useMemo","KnockGuideClient","useEffect","fetch","subscribe","cleanup","client"],"mappings":"0kBAcaA,EAAoBC,EAAMC,cAErCC,MAAS,EAaEC,EAA+DA,CAAC,CAC3EC,UAAAA,EACAC,cAAAA,EACAC,iBAAAA,EAAmB,GACnBC,UAAAA,EAAY,QACZC,aAAAA,EAAe,CAAC,EAChBC,wBAAAA,EAA0B,GAG1BC,wBAAAA,EAA0B,EAC1BC,sBAAAA,EACAC,SAAAA,CACF,IAAM,CACAC,IAAAA,EAEA,GAAA,CACFA,EAAQC,EAAAA,eAAe,OACb,CACJ,MAAA,IAAIC,MAAM,wDAAwD,CAAA,CAGpEC,MAAAA,EAAqBC,EAAiBT,CAAY,EAElDU,EAAmBlB,EAAMmB,QAAQ,IAC9B,IAAIC,EAAAA,iBAAiBP,EAAOT,EAAWY,EAAoB,CAChEP,wBAAAA,EACAC,wBAAAA,EACAC,sBAAAA,CAAAA,CACD,EACA,CACDE,EACAT,EACAY,EACAP,EACAC,EACAC,CAAqB,CACtB,EAEDX,OAAAA,EAAMqB,UAAU,KACVhB,IACFa,EAAiBI,MAAM,EACnBhB,KAAmCiB,UAAU,GAG5C,IAAML,EAAiBM,QAAQ,GACrC,CAACnB,EAAeC,EAAkBY,CAAgB,CAAC,EAGnDlB,EAAA,cAAAD,EAAkB,SAAlB,CACC,MAAO,CACL0B,OAAQP,EACRX,UAAAA,IAGDK,CACH,CAEJ"}

package/dist/cjs/modules/guide/hooks/useGuide.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("@tanstack/react-store"),c=require("./useGuideContext.js"),d=e=>{const u=c.useGuideContext();if(!e.key&&!e.type)throw new Error("useGuide must be used with at least one filter: either a guide key or a guide type");const{client:t,colorMode:r}=u,[o]=n.useStore(t.store,s=>t.select(s,e)),i=o&&o.steps.find(s=>!s.message.archived_at);return{client:t,colorMode:r,guide:o,step:i}};exports.useGuide=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("@tanstack/react-store"),c=require("./useGuideContext.js"),d=e=>{const r=c.useGuideContext();if(!e.key&&!e.type)throw new Error("useGuide must be given at least one filter: { key?: string; type?: string; }");const{client:t,colorMode:s}=r,o=i.useStore(t.store,n=>t.selectGuide(n,e)),u=o&&o.getStep();return{client:t,colorMode:s,guide:o,step:u}};exports.useGuide=d;
 //# sourceMappingURL=useGuide.js.map

package/dist/cjs/modules/guide/hooks/useGuide.js.map

@@ -1 +1 @@
-{"version":3,"file":"useGuide.js","sources":["../../../../../src/modules/guide/hooks/useGuide.ts"],"sourcesContent":["import {\n  KnockGuide,\n  KnockGuideFilterParams,\n  KnockGuideStep,\n} from \"@knocklabs/client\";\nimport { useStore } from \"@tanstack/react-store\";\n\nimport { UseGuideContextReturn, useGuideContext } from \"./useGuideContext\";\n\ninterface UseGuideReturn extends UseGuideContextReturn {\n  guide: KnockGuide | undefined;\n  step: KnockGuideStep | undefined;\n}\n\nexport const useGuide = (filters: KnockGuideFilterParams): UseGuideReturn => {\n  const context = useGuideContext();\n\n  if (!filters.key && !filters.type) {\n    throw new Error(\n      \"useGuide must be used with at least one filter: either a guide key or a guide type\",\n    );\n  }\n\n  const { client, colorMode } = context;\n\n  const [guide] = useStore(client.store, (state) =>\n    client.select(state, filters),\n  );\n\n  const step = guide && guide.steps.find((s) => !s.message.archived_at);\n\n  return { client, colorMode, guide, step };\n};\n"],"names":["useGuide","filters","context","useGuideContext","key","type","Error","client","colorMode","guide","useStore","store","state","select","step","steps","find","s","message","archived_at"],"mappings":"2JAcaA,EAAYC,GAAoD,CAC3E,MAAMC,EAAUC,EAAAA,gBAAgB,EAEhC,GAAI,CAACF,EAAQG,KAAO,CAACH,EAAQI,KACrB,MAAA,IAAIC,MACR,oFACF,EAGI,KAAA,CAAEC,OAAAA,EAAQC,UAAAA,CAAAA,EAAcN,EAExB,CAACO,CAAK,EAAIC,EAASH,SAAAA,EAAOI,MAAQC,GACtCL,EAAOM,OAAOD,EAAOX,CAAO,CAC9B,EAEMa,EAAOL,GAASA,EAAMM,MAAMC,KAAY,GAAA,CAACC,EAAEC,QAAQC,WAAW,EAE7D,MAAA,CAAEZ,OAAAA,EAAQC,UAAAA,EAAWC,MAAAA,EAAOK,KAAAA,CAAK,CAC1C"}
+{"version":3,"file":"useGuide.js","sources":["../../../../../src/modules/guide/hooks/useGuide.ts"],"sourcesContent":["import {\n  KnockGuide,\n  KnockGuideFilterParams,\n  KnockGuideStep,\n} from \"@knocklabs/client\";\nimport { useStore } from \"@tanstack/react-store\";\n\nimport { UseGuideContextReturn, useGuideContext } from \"./useGuideContext\";\n\ninterface UseGuideReturn extends UseGuideContextReturn {\n  guide: KnockGuide | undefined;\n  step: KnockGuideStep | undefined;\n}\n\nexport const useGuide = (filters: KnockGuideFilterParams): UseGuideReturn => {\n  const context = useGuideContext();\n\n  if (!filters.key && !filters.type) {\n    throw new Error(\n      \"useGuide must be given at least one filter: { key?: string; type?: string; }\",\n    );\n  }\n\n  const { client, colorMode } = context;\n\n  const guide = useStore(client.store, (state) =>\n    client.selectGuide(state, filters),\n  );\n\n  const step = guide && guide.getStep();\n\n  return { client, colorMode, guide, step };\n};\n"],"names":["useGuide","filters","context","useGuideContext","key","type","Error","client","colorMode","guide","useStore","store","selectGuide","state","step","getStep"],"mappings":"2JAcaA,EAAYC,GAAoD,CAC3E,MAAMC,EAAUC,EAAAA,gBAAgB,EAEhC,GAAI,CAACF,EAAQG,KAAO,CAACH,EAAQI,KACrB,MAAA,IAAIC,MACR,8EACF,EAGI,KAAA,CAAEC,OAAAA,EAAQC,UAAAA,CAAAA,EAAcN,EAExBO,EAAQC,EAAAA,SAASH,EAAOI,SAC5BJ,EAAOK,YAAYC,EAAOZ,CAAO,CACnC,EAEMa,EAAOL,GAASA,EAAMM,QAAQ,EAE7B,MAAA,CAAER,OAAAA,EAAQC,UAAAA,EAAWC,MAAAA,EAAOK,KAAAA,CAAK,CAC1C"}

package/dist/esm/modules/guide/context/KnockGuideProvider.mjs

@@ -1,16 +1,20 @@
-import { KnockGuideClient as k } from "@knocklabs/client";
+import { KnockGuideClient as d } from "@knocklabs/client";
 import * as t from "react";
 import { useKnockClient as l } from "../../core/context/KnockProvider.mjs";
-import a from "../../core/hooks/useStableOptions.mjs";
+import K from "../../core/hooks/useStableOptions.mjs";
 import "date-fns";
-const d = t.createContext(void 0), G = ({
+const a = t.createContext(void 0), w = ({
   channelId: o,
   readyToTarget: i,
   listenForUpdates: n = !0,
-  colorMode: s = "light",
-  targetParams: m = {},
+  colorMode: f = "light",
+  targetParams: k = {},
   trackLocationFromWindow: c = !0,
-  children: f
+  // Default to 0 which works well for react apps as this "yields" to react for
+  // one render cyle first and close the group stage.
+  orderResolutionDuration: u = 0,
+  throttleCheckInterval: s,
+  children: p
 }) => {
   let r;
   try {
@@ -18,16 +22,18 @@ const d = t.createContext(void 0), G = ({
   } catch {
     throw new Error("KnockGuideProvider must be used within a KnockProvider");
   }
-  const u = a(m), e = t.useMemo(() => new k(r, o, u, {
-    trackLocationFromWindow: c
-  }), [r, o, u, c]);
-  return t.useEffect(() => (i && (e.fetch(), n && e.subscribe()), () => e.cleanup()), [i, n, e]), /* @__PURE__ */ t.createElement(d.Provider, { value: {
+  const m = K(k), e = t.useMemo(() => new d(r, o, m, {
+    trackLocationFromWindow: c,
+    orderResolutionDuration: u,
+    throttleCheckInterval: s
+  }), [r, o, m, c, u, s]);
+  return t.useEffect(() => (i && (e.fetch(), n && e.subscribe()), () => e.cleanup()), [i, n, e]), /* @__PURE__ */ t.createElement(a.Provider, { value: {
     client: e,
-    colorMode: s
-  } }, f);
+    colorMode: f
+  } }, p);
 };
 export {
-  d as KnockGuideContext,
-  G as KnockGuideProvider
+  a as KnockGuideContext,
+  w as KnockGuideProvider
 };
 //# sourceMappingURL=KnockGuideProvider.mjs.map

package/dist/esm/modules/guide/context/KnockGuideProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"KnockGuideProvider.mjs","sources":["../../../../../src/modules/guide/context/KnockGuideProvider.tsx"],"sourcesContent":["import Knock, {\n  KnockGuideClient,\n  KnockGuideTargetParams,\n} from \"@knocklabs/client\";\nimport * as React from \"react\";\n\nimport { useKnockClient, useStableOptions } from \"../../core\";\nimport { ColorMode } from \"../../core/constants\";\n\ntype KnockGuideProviderValue = {\n  client: KnockGuideClient;\n  colorMode: ColorMode;\n};\n\nexport const KnockGuideContext = React.createContext<\n  KnockGuideProviderValue | undefined\n>(undefined);\n\ntype Props = {\n  channelId: string;\n  readyToTarget: boolean;\n  listenForUpdates?: boolean;\n  colorMode?: ColorMode;\n  targetParams?: KnockGuideTargetParams;\n  trackLocationFromWindow?: boolean;\n};\n\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n  channelId,\n  readyToTarget,\n  listenForUpdates = true,\n  colorMode = \"light\",\n  targetParams = {},\n  trackLocationFromWindow = true,\n  children,\n}) => {\n  let knock: Knock;\n\n  try {\n    knock = useKnockClient();\n  } catch (_) {\n    throw new Error(\"KnockGuideProvider must be used within a KnockProvider\");\n  }\n\n  const stableTargetParams = useStableOptions(targetParams);\n\n  const knockGuideClient = React.useMemo(() => {\n    return new KnockGuideClient(knock, channelId, stableTargetParams, {\n      trackLocationFromWindow,\n    });\n  }, [knock, channelId, stableTargetParams, trackLocationFromWindow]);\n\n  React.useEffect(() => {\n    if (readyToTarget) {\n      knockGuideClient.fetch();\n      if (listenForUpdates) knockGuideClient.subscribe();\n    }\n\n    return () => knockGuideClient.cleanup();\n  }, [readyToTarget, listenForUpdates, knockGuideClient]);\n\n  return (\n    <KnockGuideContext.Provider\n      value={{\n        client: knockGuideClient,\n        colorMode,\n      }}\n    >\n      {children}\n    </KnockGuideContext.Provider>\n  );\n};\n"],"names":["KnockGuideContext","React","createContext","undefined","KnockGuideProvider","channelId","readyToTarget","listenForUpdates","colorMode","targetParams","trackLocationFromWindow","children","knock","useKnockClient","Error","stableTargetParams","useStableOptions","knockGuideClient","useMemo","KnockGuideClient","useEffect","fetch","subscribe","cleanup","client"],"mappings":";;;;;AAcaA,MAAAA,IAAoBC,EAAMC,cAErCC,MAAS,GAWEC,IAA+DA,CAAC;AAAA,EAC3EC,WAAAA;AAAAA,EACAC,eAAAA;AAAAA,EACAC,kBAAAA,IAAmB;AAAA,EACnBC,WAAAA,IAAY;AAAA,EACZC,cAAAA,IAAe,CAAC;AAAA,EAChBC,yBAAAA,IAA0B;AAAA,EAC1BC,UAAAA;AACF,MAAM;AACAC,MAAAA;AAEA,MAAA;AACFA,IAAAA,IAAQC,EAAe;AAAA,UACb;AACJ,UAAA,IAAIC,MAAM,wDAAwD;AAAA,EAAA;AAGpEC,QAAAA,IAAqBC,EAAiBP,CAAY,GAElDQ,IAAmBhB,EAAMiB,QAAQ,MAC9B,IAAIC,EAAiBP,GAAOP,GAAWU,GAAoB;AAAA,IAChEL,yBAAAA;AAAAA,EAAAA,CACD,GACA,CAACE,GAAOP,GAAWU,GAAoBL,CAAuB,CAAC;AAElET,SAAAA,EAAMmB,UAAU,OACVd,MACFW,EAAiBI,MAAM,GACnBd,OAAmCe,UAAU,IAG5C,MAAML,EAAiBM,QAAQ,IACrC,CAACjB,GAAeC,GAAkBU,CAAgB,CAAC,GAGnD,gBAAAhB,EAAA,cAAAD,EAAkB,UAAlB,EACC,OAAO;AAAA,IACLwB,QAAQP;AAAAA,IACRT,WAAAA;AAAAA,OAGDG,CACH;AAEJ;"}
+{"version":3,"file":"KnockGuideProvider.mjs","sources":["../../../../../src/modules/guide/context/KnockGuideProvider.tsx"],"sourcesContent":["import Knock, {\n  KnockGuideClient,\n  KnockGuideTargetParams,\n} from \"@knocklabs/client\";\nimport * as React from \"react\";\n\nimport { useKnockClient, useStableOptions } from \"../../core\";\nimport { ColorMode } from \"../../core/constants\";\n\ntype KnockGuideProviderValue = {\n  client: KnockGuideClient;\n  colorMode: ColorMode;\n};\n\nexport const KnockGuideContext = React.createContext<\n  KnockGuideProviderValue | undefined\n>(undefined);\n\ntype Props = {\n  channelId: string;\n  readyToTarget: boolean;\n  listenForUpdates?: boolean;\n  colorMode?: ColorMode;\n  targetParams?: KnockGuideTargetParams;\n  trackLocationFromWindow?: boolean;\n  orderResolutionDuration?: number; // in milliseconds\n  throttleCheckInterval?: number; // in milliseconds\n};\n\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n  channelId,\n  readyToTarget,\n  listenForUpdates = true,\n  colorMode = \"light\",\n  targetParams = {},\n  trackLocationFromWindow = true,\n  // Default to 0 which works well for react apps as this \"yields\" to react for\n  // one render cyle first and close the group stage.\n  orderResolutionDuration = 0,\n  throttleCheckInterval,\n  children,\n}) => {\n  let knock: Knock;\n\n  try {\n    knock = useKnockClient();\n  } catch (_) {\n    throw new Error(\"KnockGuideProvider must be used within a KnockProvider\");\n  }\n\n  const stableTargetParams = useStableOptions(targetParams);\n\n  const knockGuideClient = React.useMemo(() => {\n    return new KnockGuideClient(knock, channelId, stableTargetParams, {\n      trackLocationFromWindow,\n      orderResolutionDuration,\n      throttleCheckInterval,\n    });\n  }, [\n    knock,\n    channelId,\n    stableTargetParams,\n    trackLocationFromWindow,\n    orderResolutionDuration,\n    throttleCheckInterval,\n  ]);\n\n  React.useEffect(() => {\n    if (readyToTarget) {\n      knockGuideClient.fetch();\n      if (listenForUpdates) knockGuideClient.subscribe();\n    }\n\n    return () => knockGuideClient.cleanup();\n  }, [readyToTarget, listenForUpdates, knockGuideClient]);\n\n  return (\n    <KnockGuideContext.Provider\n      value={{\n        client: knockGuideClient,\n        colorMode,\n      }}\n    >\n      {children}\n    </KnockGuideContext.Provider>\n  );\n};\n"],"names":["KnockGuideContext","React","createContext","undefined","KnockGuideProvider","channelId","readyToTarget","listenForUpdates","colorMode","targetParams","trackLocationFromWindow","orderResolutionDuration","throttleCheckInterval","children","knock","useKnockClient","Error","stableTargetParams","useStableOptions","knockGuideClient","useMemo","KnockGuideClient","useEffect","fetch","subscribe","cleanup","client"],"mappings":";;;;;AAcaA,MAAAA,IAAoBC,EAAMC,cAErCC,MAAS,GAaEC,IAA+DA,CAAC;AAAA,EAC3EC,WAAAA;AAAAA,EACAC,eAAAA;AAAAA,EACAC,kBAAAA,IAAmB;AAAA,EACnBC,WAAAA,IAAY;AAAA,EACZC,cAAAA,IAAe,CAAC;AAAA,EAChBC,yBAAAA,IAA0B;AAAA;AAAA;AAAA,EAG1BC,yBAAAA,IAA0B;AAAA,EAC1BC,uBAAAA;AAAAA,EACAC,UAAAA;AACF,MAAM;AACAC,MAAAA;AAEA,MAAA;AACFA,IAAAA,IAAQC,EAAe;AAAA,UACb;AACJ,UAAA,IAAIC,MAAM,wDAAwD;AAAA,EAAA;AAGpEC,QAAAA,IAAqBC,EAAiBT,CAAY,GAElDU,IAAmBlB,EAAMmB,QAAQ,MAC9B,IAAIC,EAAiBP,GAAOT,GAAWY,GAAoB;AAAA,IAChEP,yBAAAA;AAAAA,IACAC,yBAAAA;AAAAA,IACAC,uBAAAA;AAAAA,EAAAA,CACD,GACA,CACDE,GACAT,GACAY,GACAP,GACAC,GACAC,CAAqB,CACtB;AAEDX,SAAAA,EAAMqB,UAAU,OACVhB,MACFa,EAAiBI,MAAM,GACnBhB,OAAmCiB,UAAU,IAG5C,MAAML,EAAiBM,QAAQ,IACrC,CAACnB,GAAeC,GAAkBY,CAAgB,CAAC,GAGnD,gBAAAlB,EAAA,cAAAD,EAAkB,UAAlB,EACC,OAAO;AAAA,IACL0B,QAAQP;AAAAA,IACRX,WAAAA;AAAAA,OAGDK,CACH;AAEJ;"}

package/dist/esm/modules/guide/hooks/useGuide.mjs

@@ -1,21 +1,21 @@
-import { useStore as n } from "@tanstack/react-store";
+import { useStore as u } from "@tanstack/react-store";
 import { useGuideContext as c } from "./useGuideContext.mjs";
-const p = (e) => {
+const g = (e) => {
   const r = c();
   if (!e.key && !e.type)
-    throw new Error("useGuide must be used with at least one filter: either a guide key or a guide type");
+    throw new Error("useGuide must be given at least one filter: { key?: string; type?: string; }");
   const {
     client: t,
-    colorMode: i
-  } = r, [o] = n(t.store, (s) => t.select(s, e)), u = o && o.steps.find((s) => !s.message.archived_at);
+    colorMode: n
+  } = r, o = u(t.store, (i) => t.selectGuide(i, e)), s = o && o.getStep();
   return {
     client: t,
-    colorMode: i,
+    colorMode: n,
     guide: o,
-    step: u
+    step: s
   };
 };
 export {
-  p as useGuide
+  g as useGuide
 };
 //# sourceMappingURL=useGuide.mjs.map

package/dist/esm/modules/guide/hooks/useGuide.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useGuide.mjs","sources":["../../../../../src/modules/guide/hooks/useGuide.ts"],"sourcesContent":["import {\n  KnockGuide,\n  KnockGuideFilterParams,\n  KnockGuideStep,\n} from \"@knocklabs/client\";\nimport { useStore } from \"@tanstack/react-store\";\n\nimport { UseGuideContextReturn, useGuideContext } from \"./useGuideContext\";\n\ninterface UseGuideReturn extends UseGuideContextReturn {\n  guide: KnockGuide | undefined;\n  step: KnockGuideStep | undefined;\n}\n\nexport const useGuide = (filters: KnockGuideFilterParams): UseGuideReturn => {\n  const context = useGuideContext();\n\n  if (!filters.key && !filters.type) {\n    throw new Error(\n      \"useGuide must be used with at least one filter: either a guide key or a guide type\",\n    );\n  }\n\n  const { client, colorMode } = context;\n\n  const [guide] = useStore(client.store, (state) =>\n    client.select(state, filters),\n  );\n\n  const step = guide && guide.steps.find((s) => !s.message.archived_at);\n\n  return { client, colorMode, guide, step };\n};\n"],"names":["useGuide","filters","context","useGuideContext","key","type","Error","client","colorMode","guide","useStore","store","state","select","step","steps","find","s","message","archived_at"],"mappings":";;AAcaA,MAAAA,IAAWA,CAACC,MAAoD;AAC3E,QAAMC,IAAUC,EAAgB;AAEhC,MAAI,CAACF,EAAQG,OAAO,CAACH,EAAQI;AACrB,UAAA,IAAIC,MACR,oFACF;AAGI,QAAA;AAAA,IAAEC,QAAAA;AAAAA,IAAQC,WAAAA;AAAAA,EAAAA,IAAcN,GAExB,CAACO,CAAK,IAAIC,EAASH,EAAOI,OAAQC,CAAAA,MACtCL,EAAOM,OAAOD,GAAOX,CAAO,CAC9B,GAEMa,IAAOL,KAASA,EAAMM,MAAMC,KAAMC,CAAM,MAAA,CAACA,EAAEC,QAAQC,WAAW;AAE7D,SAAA;AAAA,IAAEZ,QAAAA;AAAAA,IAAQC,WAAAA;AAAAA,IAAWC,OAAAA;AAAAA,IAAOK,MAAAA;AAAAA,EAAK;AAC1C;"}
+{"version":3,"file":"useGuide.mjs","sources":["../../../../../src/modules/guide/hooks/useGuide.ts"],"sourcesContent":["import {\n  KnockGuide,\n  KnockGuideFilterParams,\n  KnockGuideStep,\n} from \"@knocklabs/client\";\nimport { useStore } from \"@tanstack/react-store\";\n\nimport { UseGuideContextReturn, useGuideContext } from \"./useGuideContext\";\n\ninterface UseGuideReturn extends UseGuideContextReturn {\n  guide: KnockGuide | undefined;\n  step: KnockGuideStep | undefined;\n}\n\nexport const useGuide = (filters: KnockGuideFilterParams): UseGuideReturn => {\n  const context = useGuideContext();\n\n  if (!filters.key && !filters.type) {\n    throw new Error(\n      \"useGuide must be given at least one filter: { key?: string; type?: string; }\",\n    );\n  }\n\n  const { client, colorMode } = context;\n\n  const guide = useStore(client.store, (state) =>\n    client.selectGuide(state, filters),\n  );\n\n  const step = guide && guide.getStep();\n\n  return { client, colorMode, guide, step };\n};\n"],"names":["useGuide","filters","context","useGuideContext","key","type","Error","client","colorMode","guide","useStore","store","state","selectGuide","step","getStep"],"mappings":";;AAcaA,MAAAA,IAAWA,CAACC,MAAoD;AAC3E,QAAMC,IAAUC,EAAgB;AAEhC,MAAI,CAACF,EAAQG,OAAO,CAACH,EAAQI;AACrB,UAAA,IAAIC,MACR,8EACF;AAGI,QAAA;AAAA,IAAEC,QAAAA;AAAAA,IAAQC,WAAAA;AAAAA,EAAAA,IAAcN,GAExBO,IAAQC,EAASH,EAAOI,OAAQC,OACpCL,EAAOM,YAAYD,GAAOX,CAAO,CACnC,GAEMa,IAAOL,KAASA,EAAMM,QAAQ;AAE7B,SAAA;AAAA,IAAER,QAAAA;AAAAA,IAAQC,WAAAA;AAAAA,IAAWC,OAAAA;AAAAA,IAAOK,MAAAA;AAAAA,EAAK;AAC1C;"}

package/dist/types/modules/guide/context/KnockGuideProvider.d.ts

@@ -13,6 +13,8 @@ type Props = {
     colorMode?: ColorMode;
     targetParams?: KnockGuideTargetParams;
     trackLocationFromWindow?: boolean;
+    orderResolutionDuration?: number;
+    throttleCheckInterval?: number;
 };
 export declare const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>>;
 export {};

package/dist/types/modules/guide/context/KnockGuideProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KnockGuideProvider.d.ts","sourceRoot":"","sources":["../../../../../src/modules/guide/context/KnockGuideProvider.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,gBAAgB,EAChB,sBAAsB,EACvB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,KAAK,uBAAuB,GAAG;IAC7B,MAAM,EAAE,gBAAgB,CAAC;IACzB,SAAS,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,iBAAiB,oDAElB,CAAC;AAEb,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,sBAAsB,CAAC;IACtC,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,CA4CvE,CAAC"}
+{"version":3,"file":"KnockGuideProvider.d.ts","sourceRoot":"","sources":["../../../../../src/modules/guide/context/KnockGuideProvider.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,gBAAgB,EAChB,sBAAsB,EACvB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,KAAK,uBAAuB,GAAG;IAC7B,MAAM,EAAE,gBAAgB,CAAC;IACzB,SAAS,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,iBAAiB,oDAElB,CAAC;AAEb,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,sBAAsB,CAAC;IACtC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAyDvE,CAAC"}

package/dist/types/modules/guide/hooks/useGuides.d.ts

@@ -0,0 +1,8 @@
+import { KnockGuide, KnockGuideFilterParams } from '@knocklabs/client';
+import { UseGuideContextReturn } from './useGuideContext';
+interface UseGuidesReturn extends UseGuideContextReturn {
+    guides: KnockGuide[];
+}
+export declare const useGuides: (filters: KnockGuideFilterParams) => UseGuidesReturn;
+export {};
+//# sourceMappingURL=useGuides.d.ts.map

package/dist/types/modules/guide/hooks/useGuides.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGuides.d.ts","sourceRoot":"","sources":["../../../../../src/modules/guide/hooks/useGuides.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,sBAAsB,EAAE,MAAM,mBAAmB,CAAC;AAGvE,OAAO,EAAE,qBAAqB,EAAmB,MAAM,mBAAmB,CAAC;AAE3E,UAAU,eAAgB,SAAQ,qBAAqB;IACrD,MAAM,EAAE,UAAU,EAAE,CAAC;CACtB;AAED,eAAO,MAAM,SAAS,GAAI,SAAS,sBAAsB,KAAG,eAS3D,CAAC"}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@knocklabs/react-core",
   "description": "A set of React components to build notification experiences powered by Knock",
   "author": "@knocklabs",
-  "version": "0.7.4",
+  "version": "0.8.0",
   "license": "MIT",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.mjs",
@@ -47,8 +47,8 @@
     "react": "^16.11.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@knocklabs/client": "^0.15.1",
-    "@tanstack/react-store": "^0.7.1",
+    "@knocklabs/client": "^0.16.0",
+    "@tanstack/react-store": "^0.7.3",
     "date-fns": "^4.0.0",
     "fast-deep-equal": "^3.1.3",
     "swr": "^2.3.3"

package/src/modules/guide/context/KnockGuideProvider.tsx

@@ -23,6 +23,8 @@ type Props = {
   colorMode?: ColorMode;
   targetParams?: KnockGuideTargetParams;
   trackLocationFromWindow?: boolean;
+  orderResolutionDuration?: number; // in milliseconds
+  throttleCheckInterval?: number; // in milliseconds
 };
 
 export const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({
@@ -32,6 +34,10 @@ export const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({
   colorMode = "light",
   targetParams = {},
   trackLocationFromWindow = true,
+  // Default to 0 which works well for react apps as this "yields" to react for
+  // one render cyle first and close the group stage.
+  orderResolutionDuration = 0,
+  throttleCheckInterval,
   children,
 }) => {
   let knock: Knock;
@@ -47,8 +53,17 @@ export const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({
   const knockGuideClient = React.useMemo(() => {
     return new KnockGuideClient(knock, channelId, stableTargetParams, {
       trackLocationFromWindow,
+      orderResolutionDuration,
+      throttleCheckInterval,
     });
-  }, [knock, channelId, stableTargetParams, trackLocationFromWindow]);
+  }, [
+    knock,
+    channelId,
+    stableTargetParams,
+    trackLocationFromWindow,
+    orderResolutionDuration,
+    throttleCheckInterval,
+  ]);
 
   React.useEffect(() => {
     if (readyToTarget) {

package/src/modules/guide/hooks/useGuide.ts

@@ -17,17 +17,17 @@ export const useGuide = (filters: KnockGuideFilterParams): UseGuideReturn => {
 
   if (!filters.key && !filters.type) {
     throw new Error(
-      "useGuide must be used with at least one filter: either a guide key or a guide type",
+      "useGuide must be given at least one filter: { key?: string; type?: string; }",
     );
   }
 
   const { client, colorMode } = context;
 
-  const [guide] = useStore(client.store, (state) =>
-    client.select(state, filters),
+  const guide = useStore(client.store, (state) =>
+    client.selectGuide(state, filters),
   );
 
-  const step = guide && guide.steps.find((s) => !s.message.archived_at);
+  const step = guide && guide.getStep();
 
   return { client, colorMode, guide, step };
 };

package/src/modules/guide/hooks/useGuides.ts

@@ -0,0 +1,19 @@
+import { KnockGuide, KnockGuideFilterParams } from "@knocklabs/client";
+import { useStore } from "@tanstack/react-store";
+
+import { UseGuideContextReturn, useGuideContext } from "./useGuideContext";
+
+interface UseGuidesReturn extends UseGuideContextReturn {
+  guides: KnockGuide[];
+}
+
+export const useGuides = (filters: KnockGuideFilterParams): UseGuidesReturn => {
+  const context = useGuideContext();
+  const { client, colorMode } = context;
+
+  const guides = useStore(client.store, (state) =>
+    client.selectGuides(state, filters),
+  );
+
+  return { client, colorMode, guides };
+};