@knocklabs/react 0.10.2 → 0.10.4

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## 0.10.4
+
+### Patch Changes
+
+- f9aca69: fix: poll to check if OAuth connection succeeded in case popup communication fails during Slack and Microsoft Teams auth flows
+- Updated dependencies [f9aca69]
+  - @knocklabs/react-core@0.12.4
+
+## 0.10.3
+
+### Patch Changes
+
+- Updated dependencies [cf04e5f]
+  - @knocklabs/client@0.20.3
+  - @knocklabs/react-core@0.12.3
+
 ## 0.10.2
 
 ### Patch Changes

package/dist/cjs/modules/core/utils.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=e=>{const n=window.screenLeft??window.screenX,t=window.screenTop??window.screenY,o=window.innerWidth??document.documentElement.clientWidth??screen.width,i=window.innerHeight??document.documentElement.clientHeight??screen.height,c=o/2-600/2+n,d=`width=600,height=800,top=${i/2-800/2+t},left=${c}`;window.open(e,"_blank",d)},h=()=>{if(typeof window<"u")return window};exports.checkForWindow=h;exports.openPopupWindow=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=e=>{const n=window.screenLeft??window.screenX,t=window.screenTop??window.screenY,o=window.innerWidth??document.documentElement.clientWidth??screen.width,i=window.innerHeight??document.documentElement.clientHeight??screen.height,c=o/2-600/2+n,d=`width=600,height=800,top=${i/2-800/2+t},left=${c}`;return window.open(e,"_blank",d)},h=()=>{if(typeof window<"u")return window};exports.checkForWindow=h;exports.openPopupWindow=w;
 //# sourceMappingURL=utils.js.map

package/dist/cjs/modules/core/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../src/modules/core/utils.ts"],"sourcesContent":["export const openPopupWindow = (url: string) => {\n  const width = 600;\n  const height = 800;\n  // Calculate the position to center the window\n  const screenLeft = window.screenLeft ?? window.screenX;\n  const screenTop = window.screenTop ?? window.screenY;\n\n  const innerWidth =\n    window.innerWidth ?? document.documentElement.clientWidth ?? screen.width;\n  const innerHeight =\n    window.innerHeight ??\n    document.documentElement.clientHeight ??\n    screen.height;\n\n  const left = innerWidth / 2 - width / 2 + screenLeft;\n  const top = innerHeight / 2 - height / 2 + screenTop;\n\n  // Window features\n  const features = `width=${width},height=${height},top=${top},left=${left}`;\n\n  window.open(url, \"_blank\", features);\n};\n\nexport const checkForWindow = () => {\n  if (typeof window !== \"undefined\") {\n    return window;\n  }\n};\n"],"names":["openPopupWindow","url","screenLeft","window","screenX","screenTop","screenY","innerWidth","document","documentElement","clientWidth","screen","width","innerHeight","clientHeight","height","left","features","open","checkForWindow"],"mappings":"gFAAaA,MAAAA,EAAmBC,GAAgB,CAIxCC,MAAAA,EAAaC,OAAOD,YAAcC,OAAOC,QACzCC,EAAYF,OAAOE,WAAaF,OAAOG,QAEvCC,EACJJ,OAAOI,YAAcC,SAASC,gBAAgBC,aAAeC,OAAOC,MAChEC,EACJV,OAAOU,aACPL,SAASC,gBAAgBK,cACzBH,OAAOI,OAEHC,EAAOT,EAAa,EAAIK,IAAQ,EAAIV,EAIpCe,EAAW,4BAHLJ,EAAc,EAAIE,IAAS,EAAIV,CAGgB,SAASW,CAAI,GAEjEE,OAAAA,KAAKjB,EAAK,SAAUgB,CAAQ,CACrC,EAEaE,EAAiBA,IAAM,CAC9B,GAAA,OAAOhB,OAAW,IACbA,OAAAA,MAEX"}
+{"version":3,"file":"utils.js","sources":["../../../../src/modules/core/utils.ts"],"sourcesContent":["export const openPopupWindow = (url: string) => {\n  const width = 600;\n  const height = 800;\n  // Calculate the position to center the window\n  const screenLeft = window.screenLeft ?? window.screenX;\n  const screenTop = window.screenTop ?? window.screenY;\n\n  const innerWidth =\n    window.innerWidth ?? document.documentElement.clientWidth ?? screen.width;\n  const innerHeight =\n    window.innerHeight ??\n    document.documentElement.clientHeight ??\n    screen.height;\n\n  const left = innerWidth / 2 - width / 2 + screenLeft;\n  const top = innerHeight / 2 - height / 2 + screenTop;\n\n  // Window features\n  const features = `width=${width},height=${height},top=${top},left=${left}`;\n\n  return window.open(url, \"_blank\", features);\n};\n\nexport const checkForWindow = () => {\n  if (typeof window !== \"undefined\") {\n    return window;\n  }\n};\n"],"names":["openPopupWindow","url","screenLeft","window","screenX","screenTop","screenY","innerWidth","document","documentElement","clientWidth","screen","width","innerHeight","clientHeight","height","left","features","open","checkForWindow"],"mappings":"gFAAaA,MAAAA,EAAmBC,GAAgB,CAIxCC,MAAAA,EAAaC,OAAOD,YAAcC,OAAOC,QACzCC,EAAYF,OAAOE,WAAaF,OAAOG,QAEvCC,EACJJ,OAAOI,YAAcC,SAASC,gBAAgBC,aAAeC,OAAOC,MAChEC,EACJV,OAAOU,aACPL,SAASC,gBAAgBK,cACzBH,OAAOI,OAEHC,EAAOT,EAAa,EAAIK,IAAQ,EAAIV,EAIpCe,EAAW,4BAHLJ,EAAc,EAAIE,IAAS,EAAIV,CAGgB,SAASW,CAAI,GAExE,OAAOb,OAAOe,KAAKjB,EAAK,SAAUgB,CAAQ,CAC5C,EAEaE,EAAiBA,IAAM,CAC9B,GAAA,OAAOhB,OAAW,IACbA,OAAAA,MAEX"}

package/dist/cjs/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),u=require("@knocklabs/react-core"),b=require("../../../core/utils.js");;/* empty css               */const l=require("../MsTeamsIcon/MsTeamsIcon.js");;/* empty css            */const M=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=M(T),w=({redirectUrl:t,onAuthenticationComplete:s,...i})=>{const p="graphApiClientId"in i?i.graphApiClientId:i.msTeamsBotId,{t:n}=u.useTranslations(),d=u.useKnockClient(),{setConnectionStatus:o,connectionStatus:c,setActionLabel:a,actionLabel:m,errorLabel:g}=u.useKnockMsTeamsClient(),{buildMsTeamsAuthUrl:_,disconnectFromMsTeams:h}=u.useMsTeamsAuth(p,t);T.useEffect(()=>{const f=r=>{if(r.origin===d.host)try{r.data==="authComplete"&&o("connected"),r.data==="authFailed"&&o("error"),s==null||s(r.data)}catch{o("error")}};return window.addEventListener("message",f,!1),()=>{window.removeEventListener("message",f)}},[d.host,s,o]);const E=n("msTeamsDisconnect")||null,k=n("msTeamsReconnect")||null;return c==="connecting"||c==="disconnecting"?e.default.createElement("div",{className:"rtk-connect__button rtk-connect__button--loading"},e.default.createElement(l.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n(c==="connecting"?"msTeamsConnecting":"msTeamsDisconnecting"))):c==="error"?e.default.createElement("button",{onClick:()=>b.openPopupWindow(_()),className:"rtk-connect__button rtk-connect__button--error",onMouseEnter:()=>a(k),onMouseLeave:()=>a(null)},e.default.createElement(l.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rtk-connect__button__text--error"},m||g||n("msTeamsError"))):c==="disconnected"?e.default.createElement("button",{onClick:()=>b.openPopupWindow(_()),className:"rtk-connect__button rtk-connect__button--disconnected"},e.default.createElement(l.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n("msTeamsConnect"))):e.default.createElement("button",{onClick:h,className:"rtk-connect__button rtk-connect__button--connected",onMouseEnter:()=>a(E),onMouseLeave:()=>a(null)},e.default.createElement(l.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rtk-connect__button__text--connected"},m||n("msTeamsConnected")))};exports.MsTeamsAuthButton=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),c=require("@knocklabs/react-core"),T=require("../../../core/utils.js");;/* empty css               */const r=require("../MsTeamsIcon/MsTeamsIcon.js");;/* empty css            */const I=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=I(b),x=({redirectUrl:t,onAuthenticationComplete:d,...l})=>{const f="graphApiClientId"in l?l.graphApiClientId:l.msTeamsBotId,{t:n}=c.useTranslations(),i=c.useKnockClient(),{setConnectionStatus:s,connectionStatus:o,setActionLabel:a,actionLabel:p,errorLabel:g,tenantId:h,knockMsTeamsChannelId:_,popupWindowRef:u}=c.useKnockMsTeamsClient(),{buildMsTeamsAuthUrl:k,disconnectFromMsTeams:C}=c.useMsTeamsAuth(f,t);c.useAuthPostMessageListener({knockHost:i.host,popupWindowRef:u,setConnectionStatus:s,onAuthenticationComplete:d}),c.useAuthPolling({popupWindowRef:u,setConnectionStatus:s,onAuthenticationComplete:d,authCheckFn:b.useCallback(async()=>i.msTeams.authCheck({tenant:h,knockChannelId:_}),[i.msTeams,h,_])});const M=n("msTeamsDisconnect")||null,E=n("msTeamsReconnect")||null;return o==="connecting"||o==="disconnecting"?e.default.createElement("div",{className:"rtk-connect__button rtk-connect__button--loading"},e.default.createElement(r.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n(o==="connecting"?"msTeamsConnecting":"msTeamsDisconnecting"))):o==="error"?e.default.createElement("button",{onClick:()=>{const m=T.openPopupWindow(k());u.current=m,s("connecting")},className:"rtk-connect__button rtk-connect__button--error",onMouseEnter:()=>a(E),onMouseLeave:()=>a(null)},e.default.createElement(r.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rtk-connect__button__text--error"},p||g||n("msTeamsError"))):o==="disconnected"?e.default.createElement("button",{onClick:()=>{const m=T.openPopupWindow(k());u.current=m,s("connecting")},className:"rtk-connect__button rtk-connect__button--disconnected"},e.default.createElement(r.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n("msTeamsConnect"))):e.default.createElement("button",{onClick:C,className:"rtk-connect__button rtk-connect__button--connected",onMouseEnter:()=>a(M),onMouseLeave:()=>a(null)},e.default.createElement(r.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rtk-connect__button__text--connected"},p||n("msTeamsConnected")))};exports.MsTeamsAuthButton=x;
 //# sourceMappingURL=MsTeamsAuthButton.js.map

package/dist/cjs/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MsTeamsAuthButton.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.tsx"],"sourcesContent":["import {\n  useKnockClient,\n  useKnockMsTeamsClient,\n  useMsTeamsAuth,\n  useTranslations,\n} from \"@knocklabs/react-core\";\nimport { FunctionComponent, useEffect } from \"react\";\n\nimport { openPopupWindow } from \"../../../core/utils\";\nimport \"../../theme.css\";\nimport { MsTeamsIcon } from \"../MsTeamsIcon\";\n\nimport \"./styles.css\";\n\nexport type MsTeamsAuthButtonProps = {\n  redirectUrl?: string;\n  onAuthenticationComplete?: (authenticationResp: string) => void;\n} & (\n  | {\n      /**\n       * The client ID of your Microsoft Graph API-enabled application registered with Microsoft Entra. This should\n       * match the \"Graph API client ID\" setting of your Microsoft Teams channel in the Knock dashboard.\n       */\n      graphApiClientId: string;\n    }\n  | {\n      /**\n       * @deprecated Use `graphApiClientId` instead. This field will be removed in a future release.\n       */\n      msTeamsBotId: string;\n    }\n);\n\nexport const MsTeamsAuthButton: FunctionComponent<MsTeamsAuthButtonProps> = ({\n  redirectUrl,\n  onAuthenticationComplete,\n  ...props\n}) => {\n  const graphApiClientId =\n    \"graphApiClientId\" in props ? props.graphApiClientId : props.msTeamsBotId;\n\n  const { t } = useTranslations();\n  const knock = useKnockClient();\n\n  const {\n    setConnectionStatus,\n    connectionStatus,\n    setActionLabel,\n    actionLabel,\n    errorLabel,\n  } = useKnockMsTeamsClient();\n\n  const { buildMsTeamsAuthUrl, disconnectFromMsTeams } = useMsTeamsAuth(\n    graphApiClientId,\n    redirectUrl,\n  );\n\n  useEffect(() => {\n    const receiveMessage = (event: MessageEvent) => {\n      if (event.origin !== knock.host) {\n        return;\n      }\n\n      try {\n        if (event.data === \"authComplete\") {\n          setConnectionStatus(\"connected\");\n        }\n\n        if (event.data === \"authFailed\") {\n          setConnectionStatus(\"error\");\n        }\n\n        onAuthenticationComplete?.(event.data);\n      } catch (_error) {\n        setConnectionStatus(\"error\");\n      }\n    };\n\n    window.addEventListener(\"message\", receiveMessage, false);\n\n    // Cleanup the event listener when the component unmounts\n    return () => {\n      window.removeEventListener(\"message\", receiveMessage);\n    };\n  }, [knock.host, onAuthenticationComplete, setConnectionStatus]);\n\n  const disconnectLabel = t(\"msTeamsDisconnect\") || null;\n  const reconnectLabel = t(\"msTeamsReconnect\") || null;\n\n  // Loading states\n  if (\n    connectionStatus === \"connecting\" ||\n    connectionStatus === \"disconnecting\"\n  ) {\n    return (\n      <div className=\"rtk-connect__button rtk-connect__button--loading\">\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span>\n          {connectionStatus === \"connecting\"\n            ? t(\"msTeamsConnecting\")\n            : t(\"msTeamsDisconnecting\")}\n        </span>\n      </div>\n    );\n  }\n\n  // Error state\n  if (connectionStatus === \"error\") {\n    return (\n      <button\n        onClick={() => openPopupWindow(buildMsTeamsAuthUrl())}\n        className=\"rtk-connect__button rtk-connect__button--error\"\n        onMouseEnter={() => setActionLabel(reconnectLabel)}\n        onMouseLeave={() => setActionLabel(null)}\n      >\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span className=\"rtk-connect__button__text--error\">\n          {actionLabel || errorLabel || t(\"msTeamsError\")}\n        </span>\n      </button>\n    );\n  }\n\n  // Disconnected state\n  if (connectionStatus === \"disconnected\") {\n    return (\n      <button\n        onClick={() => openPopupWindow(buildMsTeamsAuthUrl())}\n        className=\"rtk-connect__button rtk-connect__button--disconnected\"\n      >\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span>{t(\"msTeamsConnect\")}</span>\n      </button>\n    );\n  }\n\n  // Connected state\n  return (\n    <button\n      onClick={disconnectFromMsTeams}\n      className=\"rtk-connect__button rtk-connect__button--connected\"\n      onMouseEnter={() => setActionLabel(disconnectLabel)}\n      onMouseLeave={() => setActionLabel(null)}\n    >\n      <MsTeamsIcon height=\"16px\" width=\"16px\" />\n      <span className=\"rtk-connect__button__text--connected\">\n        {actionLabel || t(\"msTeamsConnected\")}\n      </span>\n    </button>\n  );\n};\n"],"names":["MsTeamsAuthButton","redirectUrl","onAuthenticationComplete","props","graphApiClientId","msTeamsBotId","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","useKnockMsTeamsClient","buildMsTeamsAuthUrl","disconnectFromMsTeams","useMsTeamsAuth","useEffect","receiveMessage","event","origin","host","data","addEventListener","removeEventListener","disconnectLabel","reconnectLabel","React","MsTeamsIcon","openPopupWindow"],"mappings":"+VAiCaA,EAA+DA,CAAC,CAC3EC,YAAAA,EACAC,yBAAAA,EACA,GAAGC,CACL,IAAM,CACJ,MAAMC,EACJ,qBAAsBD,EAAQA,EAAMC,iBAAmBD,EAAME,aAEzD,CAAEC,EAAAA,GAAMC,kBAAgB,EACxBC,EAAQC,EAAAA,eAAe,EAEvB,CACJC,oBAAAA,EACAC,iBAAAA,EACAC,eAAAA,EACAC,YAAAA,EACAC,WAAAA,GACEC,wBAAsB,EAEpB,CAAEC,oBAAAA,EAAqBC,sBAAAA,CAAAA,EAA0BC,EACrDd,eAAAA,EACAH,CACF,EAEAkB,EAAAA,UAAU,IAAM,CACRC,MAAAA,EAAkBC,GAAwB,CAC1CA,GAAAA,EAAMC,SAAWd,EAAMe,KAIvB,GAAA,CACEF,EAAMG,OAAS,gBACjBd,EAAoB,WAAW,EAG7BW,EAAMG,OAAS,cACjBd,EAAoB,OAAO,EAG7BR,GAAAA,MAAAA,EAA2BmB,EAAMG,WAClB,CACfd,EAAoB,OAAO,CAAA,CAE/B,EAEOe,cAAAA,iBAAiB,UAAWL,EAAgB,EAAK,EAGjD,IAAM,CACJM,OAAAA,oBAAoB,UAAWN,CAAc,CACtD,GACC,CAACZ,EAAMe,KAAMrB,EAA0BQ,CAAmB,CAAC,EAExDiB,MAAAA,EAAkBrB,EAAE,mBAAmB,GAAK,KAC5CsB,EAAiBtB,EAAE,kBAAkB,GAAK,KAI9CK,OAAAA,IAAqB,cACrBA,IAAqB,gBAGnBkB,EAAA,QAAA,cAAC,OAAI,UAAU,kDAAA,0BACZC,EAAY,YAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACtCD,EAAAA,QAAA,cAAA,OAAA,KAEKvB,EADHK,IAAqB,aAChB,oBACA,sBADmB,CAE3B,CACF,EAKAA,IAAqB,gCAEpB,SACC,CAAA,QAAS,IAAMoB,EAAAA,gBAAgBf,GAAqB,EACpD,UAAU,iDACV,aAAc,IAAMJ,EAAegB,CAAc,EACjD,aAAc,IAAMhB,EAAe,IAAI,CAAA,0BAEtCkB,EAAAA,YAAY,CAAA,OAAO,OAAO,MAAM,OAAM,EACvCD,UAAA,cAAC,OAAK,CAAA,UAAU,oCACbhB,GAAeC,GAAcR,EAAE,cAAc,CAChD,CACF,EAKAK,IAAqB,eAErBkB,EAAA,QAAA,cAAC,UACC,QAAS,IAAME,EAAAA,gBAAgBf,EAAoB,CAAC,EACpD,UAAU,uDAEV,EAAAa,EAAA,QAAA,cAACC,eAAY,OAAO,OAAO,MAAM,MAAM,CAAA,0BACtC,OAAMxB,KAAAA,EAAE,gBAAgB,CAAE,CAC7B,EAMDuB,EAAAA,QAAA,cAAA,SAAA,CACC,QAASZ,EACT,UAAU,qDACV,aAAc,IAAML,EAAee,CAAe,EAClD,aAAc,IAAMf,EAAe,IAAI,GAEvCiB,EAAAA,QAAA,cAACC,EAAAA,YAAY,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACvCD,EAAA,QAAA,cAAC,OAAK,CAAA,UAAU,sCACbhB,EAAAA,GAAeP,EAAE,kBAAkB,CACtC,CACF,CAEJ"}
+{"version":3,"file":"MsTeamsAuthButton.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.tsx"],"sourcesContent":["import {\n  useAuthPolling,\n  useAuthPostMessageListener,\n  useKnockClient,\n  useKnockMsTeamsClient,\n  useMsTeamsAuth,\n  useTranslations,\n} from \"@knocklabs/react-core\";\nimport { FunctionComponent, useCallback } from \"react\";\n\nimport { openPopupWindow } from \"../../../core/utils\";\nimport \"../../theme.css\";\nimport { MsTeamsIcon } from \"../MsTeamsIcon\";\n\nimport \"./styles.css\";\n\nexport type MsTeamsAuthButtonProps = {\n  redirectUrl?: string;\n  onAuthenticationComplete?: (authenticationResp: string) => void;\n} & (\n  | {\n      /**\n       * The client ID of your Microsoft Graph API-enabled application registered with Microsoft Entra. This should\n       * match the \"Graph API client ID\" setting of your Microsoft Teams channel in the Knock dashboard.\n       */\n      graphApiClientId: string;\n    }\n  | {\n      /**\n       * @deprecated Use `graphApiClientId` instead. This field will be removed in a future release.\n       */\n      msTeamsBotId: string;\n    }\n);\n\nexport const MsTeamsAuthButton: FunctionComponent<MsTeamsAuthButtonProps> = ({\n  redirectUrl,\n  onAuthenticationComplete,\n  ...props\n}) => {\n  const graphApiClientId =\n    \"graphApiClientId\" in props ? props.graphApiClientId : props.msTeamsBotId;\n\n  const { t } = useTranslations();\n  const knock = useKnockClient();\n\n  const {\n    setConnectionStatus,\n    connectionStatus,\n    setActionLabel,\n    actionLabel,\n    errorLabel,\n    tenantId,\n    knockMsTeamsChannelId,\n    popupWindowRef,\n  } = useKnockMsTeamsClient();\n\n  const { buildMsTeamsAuthUrl, disconnectFromMsTeams } = useMsTeamsAuth(\n    graphApiClientId,\n    redirectUrl,\n  );\n\n  useAuthPostMessageListener({\n    knockHost: knock.host,\n    popupWindowRef,\n    setConnectionStatus,\n    onAuthenticationComplete,\n  });\n\n  useAuthPolling({\n    popupWindowRef,\n    setConnectionStatus,\n    onAuthenticationComplete,\n    authCheckFn: useCallback(async () => {\n      return knock.msTeams.authCheck({\n        tenant: tenantId,\n        knockChannelId: knockMsTeamsChannelId,\n      });\n    }, [knock.msTeams, tenantId, knockMsTeamsChannelId]),\n  });\n\n  const disconnectLabel = t(\"msTeamsDisconnect\") || null;\n  const reconnectLabel = t(\"msTeamsReconnect\") || null;\n\n  // Loading states\n  if (\n    connectionStatus === \"connecting\" ||\n    connectionStatus === \"disconnecting\"\n  ) {\n    return (\n      <div className=\"rtk-connect__button rtk-connect__button--loading\">\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span>\n          {connectionStatus === \"connecting\"\n            ? t(\"msTeamsConnecting\")\n            : t(\"msTeamsDisconnecting\")}\n        </span>\n      </div>\n    );\n  }\n\n  // Error state\n  if (connectionStatus === \"error\") {\n    return (\n      <button\n        onClick={() => {\n          const popup = openPopupWindow(buildMsTeamsAuthUrl());\n          popupWindowRef.current = popup;\n          setConnectionStatus(\"connecting\");\n        }}\n        className=\"rtk-connect__button rtk-connect__button--error\"\n        onMouseEnter={() => setActionLabel(reconnectLabel)}\n        onMouseLeave={() => setActionLabel(null)}\n      >\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span className=\"rtk-connect__button__text--error\">\n          {actionLabel || errorLabel || t(\"msTeamsError\")}\n        </span>\n      </button>\n    );\n  }\n\n  // Disconnected state\n  if (connectionStatus === \"disconnected\") {\n    return (\n      <button\n        onClick={() => {\n          const popup = openPopupWindow(buildMsTeamsAuthUrl());\n          popupWindowRef.current = popup;\n          setConnectionStatus(\"connecting\");\n        }}\n        className=\"rtk-connect__button rtk-connect__button--disconnected\"\n      >\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span>{t(\"msTeamsConnect\")}</span>\n      </button>\n    );\n  }\n\n  // Connected state\n  return (\n    <button\n      onClick={disconnectFromMsTeams}\n      className=\"rtk-connect__button rtk-connect__button--connected\"\n      onMouseEnter={() => setActionLabel(disconnectLabel)}\n      onMouseLeave={() => setActionLabel(null)}\n    >\n      <MsTeamsIcon height=\"16px\" width=\"16px\" />\n      <span className=\"rtk-connect__button__text--connected\">\n        {actionLabel || t(\"msTeamsConnected\")}\n      </span>\n    </button>\n  );\n};\n"],"names":["MsTeamsAuthButton","redirectUrl","onAuthenticationComplete","props","graphApiClientId","msTeamsBotId","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","tenantId","knockMsTeamsChannelId","popupWindowRef","useKnockMsTeamsClient","buildMsTeamsAuthUrl","disconnectFromMsTeams","useMsTeamsAuth","useAuthPostMessageListener","knockHost","host","useAuthPolling","authCheckFn","useCallback","msTeams","authCheck","tenant","knockChannelId","disconnectLabel","reconnectLabel","React","MsTeamsIcon","popup","openPopupWindow","current"],"mappings":"+VAmCaA,EAA+DA,CAAC,CAC3EC,YAAAA,EACAC,yBAAAA,EACA,GAAGC,CACL,IAAM,CACJ,MAAMC,EACJ,qBAAsBD,EAAQA,EAAMC,iBAAmBD,EAAME,aAEzD,CAAEC,EAAAA,GAAMC,kBAAgB,EACxBC,EAAQC,EAAAA,eAAe,EAEvB,CACJC,oBAAAA,EACAC,iBAAAA,EACAC,eAAAA,EACAC,YAAAA,EACAC,WAAAA,EACAC,SAAAA,EACAC,sBAAAA,EACAC,eAAAA,GACEC,wBAAsB,EAEpB,CAAEC,oBAAAA,EAAqBC,sBAAAA,CAAAA,EAA0BC,EACrDjB,eAAAA,EACAH,CACF,EAE2BqB,6BAAA,CACzBC,UAAWf,EAAMgB,KACjBP,eAAAA,EACAP,oBAAAA,EACAR,yBAAAA,CAAAA,CACD,EAEcuB,iBAAA,CACbR,eAAAA,EACAP,oBAAAA,EACAR,yBAAAA,EACAwB,YAAaC,cAAY,SAChBnB,EAAMoB,QAAQC,UAAU,CAC7BC,OAAQf,EACRgB,eAAgBf,CAAAA,CACjB,EACA,CAACR,EAAMoB,QAASb,EAAUC,CAAqB,CAAC,CAAA,CACpD,EAEKgB,MAAAA,EAAkB1B,EAAE,mBAAmB,GAAK,KAC5C2B,EAAiB3B,EAAE,kBAAkB,GAAK,KAI9CK,OAAAA,IAAqB,cACrBA,IAAqB,gBAGnBuB,EAAA,QAAA,cAAC,OAAI,UAAU,kDAAA,0BACZC,EAAY,YAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACtCD,EAAAA,QAAA,cAAA,OAAA,KAEK5B,EADHK,IAAqB,aAChB,oBACA,sBADmB,CAE3B,CACF,EAKAA,IAAqB,QAErBuB,EAAA,QAAA,cAAC,SACC,CAAA,QAAS,IAAM,CACPE,MAAAA,EAAQC,kBAAgBlB,GAAqB,EACnDF,EAAeqB,QAAUF,EACzB1B,EAAoB,YAAY,CAAA,EAElC,UAAU,iDACV,aAAc,IAAME,EAAeqB,CAAc,EACjD,aAAc,IAAMrB,EAAe,IAAI,CAEvC,EAAAsB,EAAA,QAAA,cAACC,EAAY,YAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACtCD,EAAAA,QAAA,cAAA,OAAA,CAAK,UAAU,kCAAA,EACbrB,GAAeC,GAAcR,EAAE,cAAc,CAChD,CACF,EAKAK,IAAqB,eAErBuB,EAAA,QAAA,cAAC,SACC,CAAA,QAAS,IAAM,CACPE,MAAAA,EAAQC,kBAAgBlB,GAAqB,EACnDF,EAAeqB,QAAUF,EACzB1B,EAAoB,YAAY,CAAA,EAElC,UAAU,uDAEV,EAAAwB,EAAA,QAAA,cAACC,eAAY,OAAO,OAAO,MAAM,OAAM,EACtCD,EAAA,QAAA,cAAA,OAAA,KAAM5B,EAAE,gBAAgB,CAAE,CAC7B,EAMD4B,EAAAA,QAAA,cAAA,SAAA,CACC,QAASd,EACT,UAAU,qDACV,aAAc,IAAMR,EAAeoB,CAAe,EAClD,aAAc,IAAMpB,EAAe,IAAI,GAEvCsB,EAAAA,QAAA,cAACC,EAAAA,YAAY,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACvCD,EAAA,QAAA,cAAC,OAAK,CAAA,UAAU,sCACbrB,EAAAA,GAAeP,EAAE,kBAAkB,CACtC,CACF,CAEJ"}

package/dist/cjs/modules/slack/components/SlackAuthButton/SlackAuthButton.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react"),s=require("@knocklabs/react-core"),h=require("../../../core/utils.js");;/* empty css               */const l=require("../SlackIcon/SlackIcon.js");;/* empty css            */const C=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=C(i),L=({slackClientId:t,redirectUrl:p,onAuthenticationComplete:u,scopes:d,additionalScopes:k})=>{const{t:n}=s.useTranslations(),f=s.useKnockClient(),{setConnectionStatus:o,connectionStatus:c,setActionLabel:a,actionLabel:_,errorLabel:E}=s.useKnockSlackClient(),g=i.useMemo(()=>({scopes:d,additionalScopes:k}),[d,k]),{buildSlackAuthUrl:m,disconnectFromSlack:S}=s.useSlackAuth(t,p,g);i.useEffect(()=>{const b=r=>{if(r.origin===f.host)try{r.data==="authComplete"&&o("connected"),r.data==="authFailed"&&o("error"),u&&u(r.data)}catch{o("error")}};return window.addEventListener("message",b,!1),()=>{window.removeEventListener("message",b)}},[f.host,u,o]);const w=n("slackDisconnect")||null,x=n("slackReconnect")||null;return c==="connecting"||c==="disconnecting"?e.default.createElement("div",{className:"rsk-connect__button rsk-connect__button--loading"},e.default.createElement(l.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n(c==="connecting"?"slackConnecting":"slackDisconnecting"))):c==="error"?e.default.createElement("button",{onClick:()=>h.openPopupWindow(m()),className:"rsk-connect__button rsk-connect__button--error",onMouseEnter:()=>a(x),onMouseLeave:()=>a(null)},e.default.createElement(l.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rsk-connect__button__text--error"},_||E||n("slackError"))):c==="disconnected"?e.default.createElement("button",{onClick:()=>h.openPopupWindow(m()),className:"rsk-connect__button rsk-connect__button--disconnected"},e.default.createElement(l.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n("slackConnect"))):e.default.createElement("button",{onClick:S,className:"rsk-connect__button rsk-connect__button--connected",onMouseEnter:()=>a(w),onMouseLeave:()=>a(null)},e.default.createElement(l.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rsk-connect__button__text--connected"},_||n("slackConnected")))};exports.SlackAuthButton=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("react"),c=require("@knocklabs/react-core"),g=require("../../../core/utils.js");;/* empty css               */const u=require("../SlackIcon/SlackIcon.js");;/* empty css            */const w=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=w(k),A=({slackClientId:t,redirectUrl:S,onAuthenticationComplete:d,scopes:p,additionalScopes:_})=>{const{t:n}=c.useTranslations(),r=c.useKnockClient(),{setConnectionStatus:a,connectionStatus:o,setActionLabel:l,actionLabel:h,errorLabel:C,tenantId:b,knockSlackChannelId:f,popupWindowRef:s}=c.useKnockSlackClient(),E=k.useMemo(()=>({scopes:p,additionalScopes:_}),[p,_]),{buildSlackAuthUrl:m,disconnectFromSlack:x}=c.useSlackAuth(t,S,E);c.useAuthPostMessageListener({knockHost:r.host,popupWindowRef:s,setConnectionStatus:a,onAuthenticationComplete:d}),c.useAuthPolling({popupWindowRef:s,setConnectionStatus:a,onAuthenticationComplete:d,authCheckFn:k.useCallback(async()=>r.slack.authCheck({tenant:b,knockChannelId:f}),[r.slack,b,f])});const I=n("slackDisconnect")||null,L=n("slackReconnect")||null;return o==="connecting"||o==="disconnecting"?e.default.createElement("div",{className:"rsk-connect__button rsk-connect__button--loading"},e.default.createElement(u.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n(o==="connecting"?"slackConnecting":"slackDisconnecting"))):o==="error"?e.default.createElement("button",{onClick:()=>{const i=g.openPopupWindow(m());s.current=i,a("connecting")},className:"rsk-connect__button rsk-connect__button--error",onMouseEnter:()=>l(L),onMouseLeave:()=>l(null)},e.default.createElement(u.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rsk-connect__button__text--error"},h||C||n("slackError"))):o==="disconnected"?e.default.createElement("button",{onClick:()=>{const i=g.openPopupWindow(m());s.current=i,a("connecting")},className:"rsk-connect__button rsk-connect__button--disconnected"},e.default.createElement(u.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n("slackConnect"))):e.default.createElement("button",{onClick:x,className:"rsk-connect__button rsk-connect__button--connected",onMouseEnter:()=>l(I),onMouseLeave:()=>l(null)},e.default.createElement(u.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rsk-connect__button__text--connected"},h||n("slackConnected")))};exports.SlackAuthButton=A;
 //# sourceMappingURL=SlackAuthButton.js.map

package/dist/cjs/modules/slack/components/SlackAuthButton/SlackAuthButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SlackAuthButton.js","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"sourcesContent":["import {\n  useKnockClient,\n  useKnockSlackClient,\n  useSlackAuth,\n  useTranslations,\n} from \"@knocklabs/react-core\";\nimport { FunctionComponent, useMemo } from \"react\";\nimport { useEffect } from \"react\";\n\nimport { openPopupWindow } from \"../../../core/utils\";\nimport \"../../theme.css\";\nimport { SlackIcon } from \"../SlackIcon\";\n\nimport \"./styles.css\";\n\nexport interface SlackAuthButtonProps {\n  slackClientId: string;\n  redirectUrl?: string;\n  onAuthenticationComplete?: (authenticationResp: string) => void;\n  // When provided, the default scopes will be overridden with the provided scopes\n  scopes?: string[];\n  // Additional scopes to add to the default scopes\n  additionalScopes?: string[];\n}\n\nexport const SlackAuthButton: FunctionComponent<SlackAuthButtonProps> = ({\n  slackClientId,\n  redirectUrl,\n  onAuthenticationComplete,\n  scopes,\n  additionalScopes,\n}) => {\n  const { t } = useTranslations();\n  const knock = useKnockClient();\n\n  const {\n    setConnectionStatus,\n    connectionStatus,\n    setActionLabel,\n    actionLabel,\n    errorLabel,\n  } = useKnockSlackClient();\n\n  const useSlackAuthOptions = useMemo(\n    () => ({\n      scopes,\n      additionalScopes,\n    }),\n    [scopes, additionalScopes],\n  );\n\n  const { buildSlackAuthUrl, disconnectFromSlack } = useSlackAuth(\n    slackClientId,\n    redirectUrl,\n    useSlackAuthOptions,\n  );\n\n  useEffect(() => {\n    const receiveMessage = (event: MessageEvent) => {\n      if (event.origin !== knock.host) {\n        return;\n      }\n\n      try {\n        if (event.data === \"authComplete\") {\n          setConnectionStatus(\"connected\");\n        }\n\n        if (event.data === \"authFailed\") {\n          setConnectionStatus(\"error\");\n        }\n\n        if (onAuthenticationComplete) {\n          onAuthenticationComplete(event.data);\n        }\n      } catch (_error) {\n        setConnectionStatus(\"error\");\n      }\n    };\n\n    window.addEventListener(\"message\", receiveMessage, false);\n\n    // Cleanup the event listener when the component unmounts\n    return () => {\n      window.removeEventListener(\"message\", receiveMessage);\n    };\n  }, [knock.host, onAuthenticationComplete, setConnectionStatus]);\n\n  const disconnectLabel = t(\"slackDisconnect\") || null;\n  const reconnectLabel = t(\"slackReconnect\") || null;\n\n  // Loading states\n  if (\n    connectionStatus === \"connecting\" ||\n    connectionStatus === \"disconnecting\"\n  ) {\n    return (\n      <div className=\"rsk-connect__button rsk-connect__button--loading\">\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span>\n          {connectionStatus === \"connecting\"\n            ? t(\"slackConnecting\")\n            : t(\"slackDisconnecting\")}\n        </span>\n      </div>\n    );\n  }\n\n  // Error state\n  if (connectionStatus === \"error\") {\n    return (\n      <button\n        onClick={() => openPopupWindow(buildSlackAuthUrl())}\n        className=\"rsk-connect__button rsk-connect__button--error\"\n        onMouseEnter={() => setActionLabel(reconnectLabel)}\n        onMouseLeave={() => setActionLabel(null)}\n      >\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span className=\"rsk-connect__button__text--error\">\n          {actionLabel || errorLabel || t(\"slackError\")}\n        </span>\n      </button>\n    );\n  }\n\n  // Disconnected state\n  if (connectionStatus === \"disconnected\") {\n    return (\n      <button\n        onClick={() => openPopupWindow(buildSlackAuthUrl())}\n        className=\"rsk-connect__button rsk-connect__button--disconnected\"\n      >\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span>{t(\"slackConnect\")}</span>\n      </button>\n    );\n  }\n\n  // Connected state\n  return (\n    <button\n      onClick={disconnectFromSlack}\n      className=\"rsk-connect__button rsk-connect__button--connected\"\n      onMouseEnter={() => setActionLabel(disconnectLabel)}\n      onMouseLeave={() => setActionLabel(null)}\n    >\n      <SlackIcon height=\"16px\" width=\"16px\" />\n      <span className=\"rsk-connect__button__text--connected\">\n        {actionLabel || t(\"slackConnected\")}\n      </span>\n    </button>\n  );\n};\n"],"names":["SlackAuthButton","slackClientId","redirectUrl","onAuthenticationComplete","scopes","additionalScopes","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","useKnockSlackClient","useSlackAuthOptions","useMemo","buildSlackAuthUrl","disconnectFromSlack","useSlackAuth","useEffect","receiveMessage","event","origin","host","data","addEventListener","removeEventListener","disconnectLabel","reconnectLabel","React","SlackIcon","openPopupWindow"],"mappings":"2VAyBaA,EAA2DA,CAAC,CACvEC,cAAAA,EACAC,YAAAA,EACAC,yBAAAA,EACAC,OAAAA,EACAC,iBAAAA,CACF,IAAM,CACE,KAAA,CAAEC,EAAAA,GAAMC,kBAAgB,EACxBC,EAAQC,EAAAA,eAAe,EAEvB,CACJC,oBAAAA,EACAC,iBAAAA,EACAC,eAAAA,EACAC,YAAAA,EACAC,WAAAA,GACEC,sBAAoB,EAElBC,EAAsBC,EAAAA,QAC1B,KAAO,CACLb,OAAAA,EACAC,iBAAAA,CAAAA,GAEF,CAACD,EAAQC,CAAgB,CAC3B,EAEM,CAAEa,kBAAAA,EAAmBC,oBAAAA,CAAwBC,EAAAA,eACjDnB,EACAC,EACAc,CACF,EAEAK,EAAAA,UAAU,IAAM,CACRC,MAAAA,EAAkBC,GAAwB,CAC1CA,GAAAA,EAAMC,SAAWhB,EAAMiB,KAIvB,GAAA,CACEF,EAAMG,OAAS,gBACjBhB,EAAoB,WAAW,EAG7Ba,EAAMG,OAAS,cACjBhB,EAAoB,OAAO,EAGzBP,GACFA,EAAyBoB,EAAMG,IAAI,OAEtB,CACfhB,EAAoB,OAAO,CAAA,CAE/B,EAEOiB,cAAAA,iBAAiB,UAAWL,EAAgB,EAAK,EAGjD,IAAM,CACJM,OAAAA,oBAAoB,UAAWN,CAAc,CACtD,GACC,CAACd,EAAMiB,KAAMtB,EAA0BO,CAAmB,CAAC,EAExDmB,MAAAA,EAAkBvB,EAAE,iBAAiB,GAAK,KAC1CwB,EAAiBxB,EAAE,gBAAgB,GAAK,KAI5CK,OAAAA,IAAqB,cACrBA,IAAqB,gBAGnBoB,EAAA,QAAA,cAAC,OAAI,UAAU,kDAAA,0BACZC,EAAU,UAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACpCD,EAAAA,QAAA,cAAA,OAAA,KAEKzB,EADHK,IAAqB,aAChB,kBACA,oBADiB,CAEzB,CACF,EAKAA,IAAqB,gCAEpB,SACC,CAAA,QAAS,IAAMsB,EAAAA,gBAAgBf,GAAmB,EAClD,UAAU,iDACV,aAAc,IAAMN,EAAekB,CAAc,EACjD,aAAc,IAAMlB,EAAe,IAAI,CAAA,0BAEtCoB,EAAAA,UAAU,CAAA,OAAO,OAAO,MAAM,OAAM,EACrCD,UAAA,cAAC,OAAK,CAAA,UAAU,oCACblB,GAAeC,GAAcR,EAAE,YAAY,CAC9C,CACF,EAKAK,IAAqB,eAErBoB,EAAA,QAAA,cAAC,UACC,QAAS,IAAME,EAAAA,gBAAgBf,EAAkB,CAAC,EAClD,UAAU,uDAEV,EAAAa,EAAA,QAAA,cAACC,aAAU,OAAO,OAAO,MAAM,MAAM,CAAA,0BACpC,OAAM1B,KAAAA,EAAE,cAAc,CAAE,CAC3B,EAMDyB,EAAAA,QAAA,cAAA,SAAA,CACC,QAASZ,EACT,UAAU,qDACV,aAAc,IAAMP,EAAeiB,CAAe,EAClD,aAAc,IAAMjB,EAAe,IAAI,GAEvCmB,EAAAA,QAAA,cAACC,EAAAA,UAAU,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACrCD,EAAA,QAAA,cAAC,OAAK,CAAA,UAAU,sCACblB,EAAAA,GAAeP,EAAE,gBAAgB,CACpC,CACF,CAEJ"}
+{"version":3,"file":"SlackAuthButton.js","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"sourcesContent":["import {\n  useAuthPolling,\n  useAuthPostMessageListener,\n  useKnockClient,\n  useKnockSlackClient,\n  useSlackAuth,\n  useTranslations,\n} from \"@knocklabs/react-core\";\nimport { FunctionComponent, useCallback, useMemo } from \"react\";\n\nimport { openPopupWindow } from \"../../../core/utils\";\nimport \"../../theme.css\";\nimport { SlackIcon } from \"../SlackIcon\";\n\nimport \"./styles.css\";\n\nexport interface SlackAuthButtonProps {\n  slackClientId: string;\n  redirectUrl?: string;\n  onAuthenticationComplete?: (authenticationResp: string) => void;\n  // When provided, the default scopes will be overridden with the provided scopes\n  scopes?: string[];\n  // Additional scopes to add to the default scopes\n  additionalScopes?: string[];\n}\n\nexport const SlackAuthButton: FunctionComponent<SlackAuthButtonProps> = ({\n  slackClientId,\n  redirectUrl,\n  onAuthenticationComplete,\n  scopes,\n  additionalScopes,\n}) => {\n  const { t } = useTranslations();\n  const knock = useKnockClient();\n\n  const {\n    setConnectionStatus,\n    connectionStatus,\n    setActionLabel,\n    actionLabel,\n    errorLabel,\n    tenantId,\n    knockSlackChannelId,\n    popupWindowRef,\n  } = useKnockSlackClient();\n\n  const useSlackAuthOptions = useMemo(\n    () => ({\n      scopes,\n      additionalScopes,\n    }),\n    [scopes, additionalScopes],\n  );\n\n  const { buildSlackAuthUrl, disconnectFromSlack } = useSlackAuth(\n    slackClientId,\n    redirectUrl,\n    useSlackAuthOptions,\n  );\n\n  useAuthPostMessageListener({\n    knockHost: knock.host,\n    popupWindowRef,\n    setConnectionStatus,\n    onAuthenticationComplete,\n  });\n\n  useAuthPolling({\n    popupWindowRef,\n    setConnectionStatus,\n    onAuthenticationComplete,\n    authCheckFn: useCallback(async () => {\n      return knock.slack.authCheck({\n        tenant: tenantId,\n        knockChannelId: knockSlackChannelId,\n      });\n    }, [knock.slack, tenantId, knockSlackChannelId]),\n  });\n\n  const disconnectLabel = t(\"slackDisconnect\") || null;\n  const reconnectLabel = t(\"slackReconnect\") || null;\n\n  // Loading states\n  if (\n    connectionStatus === \"connecting\" ||\n    connectionStatus === \"disconnecting\"\n  ) {\n    return (\n      <div className=\"rsk-connect__button rsk-connect__button--loading\">\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span>\n          {connectionStatus === \"connecting\"\n            ? t(\"slackConnecting\")\n            : t(\"slackDisconnecting\")}\n        </span>\n      </div>\n    );\n  }\n\n  // Error state\n  if (connectionStatus === \"error\") {\n    return (\n      <button\n        onClick={() => {\n          const popup = openPopupWindow(buildSlackAuthUrl());\n          popupWindowRef.current = popup;\n          setConnectionStatus(\"connecting\");\n        }}\n        className=\"rsk-connect__button rsk-connect__button--error\"\n        onMouseEnter={() => setActionLabel(reconnectLabel)}\n        onMouseLeave={() => setActionLabel(null)}\n      >\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span className=\"rsk-connect__button__text--error\">\n          {actionLabel || errorLabel || t(\"slackError\")}\n        </span>\n      </button>\n    );\n  }\n\n  // Disconnected state\n  if (connectionStatus === \"disconnected\") {\n    return (\n      <button\n        onClick={() => {\n          const popup = openPopupWindow(buildSlackAuthUrl());\n          popupWindowRef.current = popup;\n          setConnectionStatus(\"connecting\");\n        }}\n        className=\"rsk-connect__button rsk-connect__button--disconnected\"\n      >\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span>{t(\"slackConnect\")}</span>\n      </button>\n    );\n  }\n\n  // Connected state\n  return (\n    <button\n      onClick={disconnectFromSlack}\n      className=\"rsk-connect__button rsk-connect__button--connected\"\n      onMouseEnter={() => setActionLabel(disconnectLabel)}\n      onMouseLeave={() => setActionLabel(null)}\n    >\n      <SlackIcon height=\"16px\" width=\"16px\" />\n      <span className=\"rsk-connect__button__text--connected\">\n        {actionLabel || t(\"slackConnected\")}\n      </span>\n    </button>\n  );\n};\n"],"names":["SlackAuthButton","slackClientId","redirectUrl","onAuthenticationComplete","scopes","additionalScopes","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","tenantId","knockSlackChannelId","popupWindowRef","useKnockSlackClient","useSlackAuthOptions","useMemo","buildSlackAuthUrl","disconnectFromSlack","useSlackAuth","useAuthPostMessageListener","knockHost","host","useAuthPolling","authCheckFn","useCallback","slack","authCheck","tenant","knockChannelId","disconnectLabel","reconnectLabel","React","SlackIcon","popup","openPopupWindow","current"],"mappings":"2VA0BaA,EAA2DA,CAAC,CACvEC,cAAAA,EACAC,YAAAA,EACAC,yBAAAA,EACAC,OAAAA,EACAC,iBAAAA,CACF,IAAM,CACE,KAAA,CAAEC,EAAAA,GAAMC,kBAAgB,EACxBC,EAAQC,EAAAA,eAAe,EAEvB,CACJC,oBAAAA,EACAC,iBAAAA,EACAC,eAAAA,EACAC,YAAAA,EACAC,WAAAA,EACAC,SAAAA,EACAC,oBAAAA,EACAC,eAAAA,GACEC,sBAAoB,EAElBC,EAAsBC,EAAAA,QAC1B,KAAO,CACLhB,OAAAA,EACAC,iBAAAA,CAAAA,GAEF,CAACD,EAAQC,CAAgB,CAC3B,EAEM,CAAEgB,kBAAAA,EAAmBC,oBAAAA,CAAwBC,EAAAA,eACjDtB,EACAC,EACAiB,CACF,EAE2BK,6BAAA,CACzBC,UAAWjB,EAAMkB,KACjBT,eAAAA,EACAP,oBAAAA,EACAP,yBAAAA,CAAAA,CACD,EAEcwB,iBAAA,CACbV,eAAAA,EACAP,oBAAAA,EACAP,yBAAAA,EACAyB,YAAaC,cAAY,SAChBrB,EAAMsB,MAAMC,UAAU,CAC3BC,OAAQjB,EACRkB,eAAgBjB,CAAAA,CACjB,EACA,CAACR,EAAMsB,MAAOf,EAAUC,CAAmB,CAAC,CAAA,CAChD,EAEKkB,MAAAA,EAAkB5B,EAAE,iBAAiB,GAAK,KAC1C6B,EAAiB7B,EAAE,gBAAgB,GAAK,KAI5CK,OAAAA,IAAqB,cACrBA,IAAqB,gBAGnByB,EAAA,QAAA,cAAC,OAAI,UAAU,kDAAA,0BACZC,EAAU,UAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACpCD,EAAAA,QAAA,cAAA,OAAA,KAEK9B,EADHK,IAAqB,aAChB,kBACA,oBADiB,CAEzB,CACF,EAKAA,IAAqB,QAErByB,EAAA,QAAA,cAAC,SACC,CAAA,QAAS,IAAM,CACPE,MAAAA,EAAQC,kBAAgBlB,GAAmB,EACjDJ,EAAeuB,QAAUF,EACzB5B,EAAoB,YAAY,CAAA,EAElC,UAAU,iDACV,aAAc,IAAME,EAAeuB,CAAc,EACjD,aAAc,IAAMvB,EAAe,IAAI,CAEvC,EAAAwB,EAAA,QAAA,cAACC,EAAU,UAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACpCD,EAAAA,QAAA,cAAA,OAAA,CAAK,UAAU,kCAAA,EACbvB,GAAeC,GAAcR,EAAE,YAAY,CAC9C,CACF,EAKAK,IAAqB,eAErByB,EAAA,QAAA,cAAC,SACC,CAAA,QAAS,IAAM,CACPE,MAAAA,EAAQC,kBAAgBlB,GAAmB,EACjDJ,EAAeuB,QAAUF,EACzB5B,EAAoB,YAAY,CAAA,EAElC,UAAU,uDAEV,EAAA0B,EAAA,QAAA,cAACC,aAAU,OAAO,OAAO,MAAM,OAAM,EACpCD,EAAA,QAAA,cAAA,OAAA,KAAM9B,EAAE,cAAc,CAAE,CAC3B,EAMD8B,EAAAA,QAAA,cAAA,SAAA,CACC,QAASd,EACT,UAAU,qDACV,aAAc,IAAMV,EAAesB,CAAe,EAClD,aAAc,IAAMtB,EAAe,IAAI,GAEvCwB,EAAAA,QAAA,cAACC,EAAAA,UAAU,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACrCD,EAAA,QAAA,cAAC,OAAK,CAAA,UAAU,sCACbvB,EAAAA,GAAeP,EAAE,gBAAgB,CACpC,CACF,CAEJ"}

package/dist/esm/modules/core/utils.mjs

@@ -1,6 +1,6 @@
 const r = (e) => {
   const n = window.screenLeft ?? window.screenX, t = window.screenTop ?? window.screenY, o = window.innerWidth ?? document.documentElement.clientWidth ?? screen.width, i = window.innerHeight ?? document.documentElement.clientHeight ?? screen.height, c = o / 2 - 600 / 2 + n, d = `width=600,height=800,top=${i / 2 - 800 / 2 + t},left=${c}`;
-  window.open(e, "_blank", d);
+  return window.open(e, "_blank", d);
 }, p = () => {
   if (typeof window < "u")
     return window;

package/dist/esm/modules/core/utils.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.mjs","sources":["../../../../src/modules/core/utils.ts"],"sourcesContent":["export const openPopupWindow = (url: string) => {\n  const width = 600;\n  const height = 800;\n  // Calculate the position to center the window\n  const screenLeft = window.screenLeft ?? window.screenX;\n  const screenTop = window.screenTop ?? window.screenY;\n\n  const innerWidth =\n    window.innerWidth ?? document.documentElement.clientWidth ?? screen.width;\n  const innerHeight =\n    window.innerHeight ??\n    document.documentElement.clientHeight ??\n    screen.height;\n\n  const left = innerWidth / 2 - width / 2 + screenLeft;\n  const top = innerHeight / 2 - height / 2 + screenTop;\n\n  // Window features\n  const features = `width=${width},height=${height},top=${top},left=${left}`;\n\n  window.open(url, \"_blank\", features);\n};\n\nexport const checkForWindow = () => {\n  if (typeof window !== \"undefined\") {\n    return window;\n  }\n};\n"],"names":["openPopupWindow","url","screenLeft","window","screenX","screenTop","screenY","innerWidth","document","documentElement","clientWidth","screen","width","innerHeight","clientHeight","height","left","features","open","checkForWindow"],"mappings":"AAAaA,MAAAA,IAAkBA,CAACC,MAAgB;AAIxCC,QAAAA,IAAaC,OAAOD,cAAcC,OAAOC,SACzCC,IAAYF,OAAOE,aAAaF,OAAOG,SAEvCC,IACJJ,OAAOI,cAAcC,SAASC,gBAAgBC,eAAeC,OAAOC,OAChEC,IACJV,OAAOU,eACPL,SAASC,gBAAgBK,gBACzBH,OAAOI,QAEHC,IAAOT,IAAa,IAAIK,MAAQ,IAAIV,GAIpCe,IAAW,4BAHLJ,IAAc,IAAIE,MAAS,IAAIV,CAGgB,SAASW,CAAI;AAEjEE,SAAAA,KAAKjB,GAAK,UAAUgB,CAAQ;AACrC,GAEaE,IAAiBA,MAAM;AAC9B,MAAA,OAAOhB,SAAW;AACbA,WAAAA;AAEX;"}
+{"version":3,"file":"utils.mjs","sources":["../../../../src/modules/core/utils.ts"],"sourcesContent":["export const openPopupWindow = (url: string) => {\n  const width = 600;\n  const height = 800;\n  // Calculate the position to center the window\n  const screenLeft = window.screenLeft ?? window.screenX;\n  const screenTop = window.screenTop ?? window.screenY;\n\n  const innerWidth =\n    window.innerWidth ?? document.documentElement.clientWidth ?? screen.width;\n  const innerHeight =\n    window.innerHeight ??\n    document.documentElement.clientHeight ??\n    screen.height;\n\n  const left = innerWidth / 2 - width / 2 + screenLeft;\n  const top = innerHeight / 2 - height / 2 + screenTop;\n\n  // Window features\n  const features = `width=${width},height=${height},top=${top},left=${left}`;\n\n  return window.open(url, \"_blank\", features);\n};\n\nexport const checkForWindow = () => {\n  if (typeof window !== \"undefined\") {\n    return window;\n  }\n};\n"],"names":["openPopupWindow","url","screenLeft","window","screenX","screenTop","screenY","innerWidth","document","documentElement","clientWidth","screen","width","innerHeight","clientHeight","height","left","features","open","checkForWindow"],"mappings":"AAAaA,MAAAA,IAAkBA,CAACC,MAAgB;AAIxCC,QAAAA,IAAaC,OAAOD,cAAcC,OAAOC,SACzCC,IAAYF,OAAOE,aAAaF,OAAOG,SAEvCC,IACJJ,OAAOI,cAAcC,SAASC,gBAAgBC,eAAeC,OAAOC,OAChEC,IACJV,OAAOU,eACPL,SAASC,gBAAgBK,gBACzBH,OAAOI,QAEHC,IAAOT,IAAa,IAAIK,MAAQ,IAAIV,GAIpCe,IAAW,4BAHLJ,IAAc,IAAIE,MAAS,IAAIV,CAGgB,SAASW,CAAI;AAExE,SAAOb,OAAOe,KAAKjB,GAAK,UAAUgB,CAAQ;AAC5C,GAEaE,IAAiBA,MAAM;AAC9B,MAAA,OAAOhB,SAAW;AACbA,WAAAA;AAEX;"}

package/dist/esm/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.mjs

@@ -1,43 +1,53 @@
-import e, { useEffect as T } from "react";
-import { useTranslations as f, useKnockClient as x, useKnockMsTeamsClient as M, useMsTeamsAuth as w } from "@knocklabs/react-core";
-import { openPopupWindow as _ } from "../../../core/utils.mjs";
+import e, { useCallback as M } from "react";
+import { useTranslations as x, useKnockClient as f, useKnockMsTeamsClient as A, useMsTeamsAuth as I, useAuthPostMessageListener as L, useAuthPolling as w } from "@knocklabs/react-core";
+import { openPopupWindow as k } from "../../../core/utils.mjs";
 /* empty css               */
 import { MsTeamsIcon as a } from "../MsTeamsIcon/MsTeamsIcon.mjs";
 /* empty css            */
-const D = ({
-  redirectUrl: p,
-  onAuthenticationComplete: c,
-  ...i
+const F = ({
+  redirectUrl: _,
+  onAuthenticationComplete: l,
+  ...r
 }) => {
-  const b = "graphApiClientId" in i ? i.graphApiClientId : i.msTeamsBotId, {
-    t
-  } = f(), m = x(), {
-    setConnectionStatus: o,
-    connectionStatus: n,
-    setActionLabel: s,
-    actionLabel: l,
-    errorLabel: h
-  } = M(), {
-    buildMsTeamsAuthUrl: u,
-    disconnectFromMsTeams: E
-  } = w(b, p);
-  T(() => {
-    const d = (r) => {
-      if (r.origin === m.host)
-        try {
-          r.data === "authComplete" && o("connected"), r.data === "authFailed" && o("error"), c == null || c(r.data);
-        } catch {
-          o("error");
-        }
-    };
-    return window.addEventListener("message", d, !1), () => {
-      window.removeEventListener("message", d);
-    };
-  }, [m.host, c, o]);
-  const g = t("msTeamsDisconnect") || null, k = t("msTeamsReconnect") || null;
-  return n === "connecting" || n === "disconnecting" ? /* @__PURE__ */ e.createElement("div", { className: "rtk-connect__button rtk-connect__button--loading" }, /* @__PURE__ */ e.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", null, t(n === "connecting" ? "msTeamsConnecting" : "msTeamsDisconnecting"))) : n === "error" ? /* @__PURE__ */ e.createElement("button", { onClick: () => _(u()), className: "rtk-connect__button rtk-connect__button--error", onMouseEnter: () => s(k), onMouseLeave: () => s(null) }, /* @__PURE__ */ e.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", { className: "rtk-connect__button__text--error" }, l || h || t("msTeamsError"))) : n === "disconnected" ? /* @__PURE__ */ e.createElement("button", { onClick: () => _(u()), className: "rtk-connect__button rtk-connect__button--disconnected" }, /* @__PURE__ */ e.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", null, t("msTeamsConnect"))) : /* @__PURE__ */ e.createElement("button", { onClick: E, className: "rtk-connect__button rtk-connect__button--connected", onMouseEnter: () => s(g), onMouseLeave: () => s(null) }, /* @__PURE__ */ e.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", { className: "rtk-connect__button__text--connected" }, l || t("msTeamsConnected")));
+  const b = "graphApiClientId" in r ? r.graphApiClientId : r.msTeamsBotId, {
+    t: n
+  } = x(), m = f(), {
+    setConnectionStatus: c,
+    connectionStatus: t,
+    setActionLabel: o,
+    actionLabel: u,
+    errorLabel: T,
+    tenantId: p,
+    knockMsTeamsChannelId: d,
+    popupWindowRef: s
+  } = A(), {
+    buildMsTeamsAuthUrl: h,
+    disconnectFromMsTeams: g
+  } = I(b, _);
+  L({
+    knockHost: m.host,
+    popupWindowRef: s,
+    setConnectionStatus: c,
+    onAuthenticationComplete: l
+  }), w({
+    popupWindowRef: s,
+    setConnectionStatus: c,
+    onAuthenticationComplete: l,
+    authCheckFn: M(async () => m.msTeams.authCheck({
+      tenant: p,
+      knockChannelId: d
+    }), [m.msTeams, p, d])
+  });
+  const C = n("msTeamsDisconnect") || null, E = n("msTeamsReconnect") || null;
+  return t === "connecting" || t === "disconnecting" ? /* @__PURE__ */ e.createElement("div", { className: "rtk-connect__button rtk-connect__button--loading" }, /* @__PURE__ */ e.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", null, n(t === "connecting" ? "msTeamsConnecting" : "msTeamsDisconnecting"))) : t === "error" ? /* @__PURE__ */ e.createElement("button", { onClick: () => {
+    const i = k(h());
+    s.current = i, c("connecting");
+  }, className: "rtk-connect__button rtk-connect__button--error", onMouseEnter: () => o(E), onMouseLeave: () => o(null) }, /* @__PURE__ */ e.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", { className: "rtk-connect__button__text--error" }, u || T || n("msTeamsError"))) : t === "disconnected" ? /* @__PURE__ */ e.createElement("button", { onClick: () => {
+    const i = k(h());
+    s.current = i, c("connecting");
+  }, className: "rtk-connect__button rtk-connect__button--disconnected" }, /* @__PURE__ */ e.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", null, n("msTeamsConnect"))) : /* @__PURE__ */ e.createElement("button", { onClick: g, className: "rtk-connect__button rtk-connect__button--connected", onMouseEnter: () => o(C), onMouseLeave: () => o(null) }, /* @__PURE__ */ e.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", { className: "rtk-connect__button__text--connected" }, u || n("msTeamsConnected")));
 };
 export {
-  D as MsTeamsAuthButton
+  F as MsTeamsAuthButton
 };
 //# sourceMappingURL=MsTeamsAuthButton.mjs.map

package/dist/esm/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MsTeamsAuthButton.mjs","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.tsx"],"sourcesContent":["import {\n  useKnockClient,\n  useKnockMsTeamsClient,\n  useMsTeamsAuth,\n  useTranslations,\n} from \"@knocklabs/react-core\";\nimport { FunctionComponent, useEffect } from \"react\";\n\nimport { openPopupWindow } from \"../../../core/utils\";\nimport \"../../theme.css\";\nimport { MsTeamsIcon } from \"../MsTeamsIcon\";\n\nimport \"./styles.css\";\n\nexport type MsTeamsAuthButtonProps = {\n  redirectUrl?: string;\n  onAuthenticationComplete?: (authenticationResp: string) => void;\n} & (\n  | {\n      /**\n       * The client ID of your Microsoft Graph API-enabled application registered with Microsoft Entra. This should\n       * match the \"Graph API client ID\" setting of your Microsoft Teams channel in the Knock dashboard.\n       */\n      graphApiClientId: string;\n    }\n  | {\n      /**\n       * @deprecated Use `graphApiClientId` instead. This field will be removed in a future release.\n       */\n      msTeamsBotId: string;\n    }\n);\n\nexport const MsTeamsAuthButton: FunctionComponent<MsTeamsAuthButtonProps> = ({\n  redirectUrl,\n  onAuthenticationComplete,\n  ...props\n}) => {\n  const graphApiClientId =\n    \"graphApiClientId\" in props ? props.graphApiClientId : props.msTeamsBotId;\n\n  const { t } = useTranslations();\n  const knock = useKnockClient();\n\n  const {\n    setConnectionStatus,\n    connectionStatus,\n    setActionLabel,\n    actionLabel,\n    errorLabel,\n  } = useKnockMsTeamsClient();\n\n  const { buildMsTeamsAuthUrl, disconnectFromMsTeams } = useMsTeamsAuth(\n    graphApiClientId,\n    redirectUrl,\n  );\n\n  useEffect(() => {\n    const receiveMessage = (event: MessageEvent) => {\n      if (event.origin !== knock.host) {\n        return;\n      }\n\n      try {\n        if (event.data === \"authComplete\") {\n          setConnectionStatus(\"connected\");\n        }\n\n        if (event.data === \"authFailed\") {\n          setConnectionStatus(\"error\");\n        }\n\n        onAuthenticationComplete?.(event.data);\n      } catch (_error) {\n        setConnectionStatus(\"error\");\n      }\n    };\n\n    window.addEventListener(\"message\", receiveMessage, false);\n\n    // Cleanup the event listener when the component unmounts\n    return () => {\n      window.removeEventListener(\"message\", receiveMessage);\n    };\n  }, [knock.host, onAuthenticationComplete, setConnectionStatus]);\n\n  const disconnectLabel = t(\"msTeamsDisconnect\") || null;\n  const reconnectLabel = t(\"msTeamsReconnect\") || null;\n\n  // Loading states\n  if (\n    connectionStatus === \"connecting\" ||\n    connectionStatus === \"disconnecting\"\n  ) {\n    return (\n      <div className=\"rtk-connect__button rtk-connect__button--loading\">\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span>\n          {connectionStatus === \"connecting\"\n            ? t(\"msTeamsConnecting\")\n            : t(\"msTeamsDisconnecting\")}\n        </span>\n      </div>\n    );\n  }\n\n  // Error state\n  if (connectionStatus === \"error\") {\n    return (\n      <button\n        onClick={() => openPopupWindow(buildMsTeamsAuthUrl())}\n        className=\"rtk-connect__button rtk-connect__button--error\"\n        onMouseEnter={() => setActionLabel(reconnectLabel)}\n        onMouseLeave={() => setActionLabel(null)}\n      >\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span className=\"rtk-connect__button__text--error\">\n          {actionLabel || errorLabel || t(\"msTeamsError\")}\n        </span>\n      </button>\n    );\n  }\n\n  // Disconnected state\n  if (connectionStatus === \"disconnected\") {\n    return (\n      <button\n        onClick={() => openPopupWindow(buildMsTeamsAuthUrl())}\n        className=\"rtk-connect__button rtk-connect__button--disconnected\"\n      >\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span>{t(\"msTeamsConnect\")}</span>\n      </button>\n    );\n  }\n\n  // Connected state\n  return (\n    <button\n      onClick={disconnectFromMsTeams}\n      className=\"rtk-connect__button rtk-connect__button--connected\"\n      onMouseEnter={() => setActionLabel(disconnectLabel)}\n      onMouseLeave={() => setActionLabel(null)}\n    >\n      <MsTeamsIcon height=\"16px\" width=\"16px\" />\n      <span className=\"rtk-connect__button__text--connected\">\n        {actionLabel || t(\"msTeamsConnected\")}\n      </span>\n    </button>\n  );\n};\n"],"names":["MsTeamsAuthButton","redirectUrl","onAuthenticationComplete","props","graphApiClientId","msTeamsBotId","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","useKnockMsTeamsClient","buildMsTeamsAuthUrl","disconnectFromMsTeams","useMsTeamsAuth","useEffect","receiveMessage","event","origin","host","data","addEventListener","removeEventListener","disconnectLabel","reconnectLabel","React","MsTeamsIcon","openPopupWindow"],"mappings":";;;;;;AAiCO,MAAMA,IAA+DA,CAAC;AAAA,EAC3EC,aAAAA;AAAAA,EACAC,0BAAAA;AAAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IACJ,sBAAsBD,IAAQA,EAAMC,mBAAmBD,EAAME,cAEzD;AAAA,IAAEC;AAAAA,MAAMC,EAAgB,GACxBC,IAAQC,EAAe,GAEvB;AAAA,IACJC,qBAAAA;AAAAA,IACAC,kBAAAA;AAAAA,IACAC,gBAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,YAAAA;AAAAA,MACEC,EAAsB,GAEpB;AAAA,IAAEC,qBAAAA;AAAAA,IAAqBC,uBAAAA;AAAAA,EAAAA,IAA0BC,EACrDd,GACAH,CACF;AAEAkB,EAAAA,EAAU,MAAM;AACRC,UAAAA,IAAiBA,CAACC,MAAwB;AAC1CA,UAAAA,EAAMC,WAAWd,EAAMe;AAIvB,YAAA;AACEF,UAAAA,EAAMG,SAAS,kBACjBd,EAAoB,WAAW,GAG7BW,EAAMG,SAAS,gBACjBd,EAAoB,OAAO,GAG7BR,KAAAA,QAAAA,EAA2BmB,EAAMG;AAAAA,gBAClB;AACfd,UAAAA,EAAoB,OAAO;AAAA,QAAA;AAAA,IAE/B;AAEOe,kBAAAA,iBAAiB,WAAWL,GAAgB,EAAK,GAGjD,MAAM;AACJM,aAAAA,oBAAoB,WAAWN,CAAc;AAAA,IACtD;AAAA,KACC,CAACZ,EAAMe,MAAMrB,GAA0BQ,CAAmB,CAAC;AAExDiB,QAAAA,IAAkBrB,EAAE,mBAAmB,KAAK,MAC5CsB,IAAiBtB,EAAE,kBAAkB,KAAK;AAI9CK,SAAAA,MAAqB,gBACrBA,MAAqB,kBAGnBkB,gBAAAA,EAAA,cAAC,SAAI,WAAU,mDAAA,mCACZC,GAAY,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACtCD,gBAAAA,EAAA,cAAA,QAAA,MAEKvB,EADHK,MAAqB,eAChB,sBACA,sBADmB,CAE3B,CACF,IAKAA,MAAqB,0CAEpB,UACC,EAAA,SAAS,MAAMoB,EAAgBf,GAAqB,GACpD,WAAU,kDACV,cAAc,MAAMJ,EAAegB,CAAc,GACjD,cAAc,MAAMhB,EAAe,IAAI,EAAA,mCAEtCkB,GAAY,EAAA,QAAO,QAAO,OAAM,QAAM,GACvCD,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAU,sCACbhB,KAAeC,KAAcR,EAAE,cAAc,CAChD,CACF,IAKAK,MAAqB,iBAErBkB,gBAAAA,EAAA,cAAC,YACC,SAAS,MAAME,EAAgBf,EAAoB,CAAC,GACpD,WAAU,wDAEV,GAAAa,gBAAAA,EAAA,cAACC,KAAY,QAAO,QAAO,OAAM,OAAM,CAAA,mCACtC,QAAMxB,MAAAA,EAAE,gBAAgB,CAAE,CAC7B,IAMDuB,gBAAAA,EAAA,cAAA,UAAA,EACC,SAASZ,GACT,WAAU,sDACV,cAAc,MAAML,EAAee,CAAe,GAClD,cAAc,MAAMf,EAAe,IAAI,KAEvCiB,gBAAAA,EAAA,cAACC,GAAY,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACvCD,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAU,uCACbhB,GAAAA,KAAeP,EAAE,kBAAkB,CACtC,CACF;AAEJ;"}
+{"version":3,"file":"MsTeamsAuthButton.mjs","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.tsx"],"sourcesContent":["import {\n  useAuthPolling,\n  useAuthPostMessageListener,\n  useKnockClient,\n  useKnockMsTeamsClient,\n  useMsTeamsAuth,\n  useTranslations,\n} from \"@knocklabs/react-core\";\nimport { FunctionComponent, useCallback } from \"react\";\n\nimport { openPopupWindow } from \"../../../core/utils\";\nimport \"../../theme.css\";\nimport { MsTeamsIcon } from \"../MsTeamsIcon\";\n\nimport \"./styles.css\";\n\nexport type MsTeamsAuthButtonProps = {\n  redirectUrl?: string;\n  onAuthenticationComplete?: (authenticationResp: string) => void;\n} & (\n  | {\n      /**\n       * The client ID of your Microsoft Graph API-enabled application registered with Microsoft Entra. This should\n       * match the \"Graph API client ID\" setting of your Microsoft Teams channel in the Knock dashboard.\n       */\n      graphApiClientId: string;\n    }\n  | {\n      /**\n       * @deprecated Use `graphApiClientId` instead. This field will be removed in a future release.\n       */\n      msTeamsBotId: string;\n    }\n);\n\nexport const MsTeamsAuthButton: FunctionComponent<MsTeamsAuthButtonProps> = ({\n  redirectUrl,\n  onAuthenticationComplete,\n  ...props\n}) => {\n  const graphApiClientId =\n    \"graphApiClientId\" in props ? props.graphApiClientId : props.msTeamsBotId;\n\n  const { t } = useTranslations();\n  const knock = useKnockClient();\n\n  const {\n    setConnectionStatus,\n    connectionStatus,\n    setActionLabel,\n    actionLabel,\n    errorLabel,\n    tenantId,\n    knockMsTeamsChannelId,\n    popupWindowRef,\n  } = useKnockMsTeamsClient();\n\n  const { buildMsTeamsAuthUrl, disconnectFromMsTeams } = useMsTeamsAuth(\n    graphApiClientId,\n    redirectUrl,\n  );\n\n  useAuthPostMessageListener({\n    knockHost: knock.host,\n    popupWindowRef,\n    setConnectionStatus,\n    onAuthenticationComplete,\n  });\n\n  useAuthPolling({\n    popupWindowRef,\n    setConnectionStatus,\n    onAuthenticationComplete,\n    authCheckFn: useCallback(async () => {\n      return knock.msTeams.authCheck({\n        tenant: tenantId,\n        knockChannelId: knockMsTeamsChannelId,\n      });\n    }, [knock.msTeams, tenantId, knockMsTeamsChannelId]),\n  });\n\n  const disconnectLabel = t(\"msTeamsDisconnect\") || null;\n  const reconnectLabel = t(\"msTeamsReconnect\") || null;\n\n  // Loading states\n  if (\n    connectionStatus === \"connecting\" ||\n    connectionStatus === \"disconnecting\"\n  ) {\n    return (\n      <div className=\"rtk-connect__button rtk-connect__button--loading\">\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span>\n          {connectionStatus === \"connecting\"\n            ? t(\"msTeamsConnecting\")\n            : t(\"msTeamsDisconnecting\")}\n        </span>\n      </div>\n    );\n  }\n\n  // Error state\n  if (connectionStatus === \"error\") {\n    return (\n      <button\n        onClick={() => {\n          const popup = openPopupWindow(buildMsTeamsAuthUrl());\n          popupWindowRef.current = popup;\n          setConnectionStatus(\"connecting\");\n        }}\n        className=\"rtk-connect__button rtk-connect__button--error\"\n        onMouseEnter={() => setActionLabel(reconnectLabel)}\n        onMouseLeave={() => setActionLabel(null)}\n      >\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span className=\"rtk-connect__button__text--error\">\n          {actionLabel || errorLabel || t(\"msTeamsError\")}\n        </span>\n      </button>\n    );\n  }\n\n  // Disconnected state\n  if (connectionStatus === \"disconnected\") {\n    return (\n      <button\n        onClick={() => {\n          const popup = openPopupWindow(buildMsTeamsAuthUrl());\n          popupWindowRef.current = popup;\n          setConnectionStatus(\"connecting\");\n        }}\n        className=\"rtk-connect__button rtk-connect__button--disconnected\"\n      >\n        <MsTeamsIcon height=\"16px\" width=\"16px\" />\n        <span>{t(\"msTeamsConnect\")}</span>\n      </button>\n    );\n  }\n\n  // Connected state\n  return (\n    <button\n      onClick={disconnectFromMsTeams}\n      className=\"rtk-connect__button rtk-connect__button--connected\"\n      onMouseEnter={() => setActionLabel(disconnectLabel)}\n      onMouseLeave={() => setActionLabel(null)}\n    >\n      <MsTeamsIcon height=\"16px\" width=\"16px\" />\n      <span className=\"rtk-connect__button__text--connected\">\n        {actionLabel || t(\"msTeamsConnected\")}\n      </span>\n    </button>\n  );\n};\n"],"names":["MsTeamsAuthButton","redirectUrl","onAuthenticationComplete","props","graphApiClientId","msTeamsBotId","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","tenantId","knockMsTeamsChannelId","popupWindowRef","useKnockMsTeamsClient","buildMsTeamsAuthUrl","disconnectFromMsTeams","useMsTeamsAuth","useAuthPostMessageListener","knockHost","host","useAuthPolling","authCheckFn","useCallback","msTeams","authCheck","tenant","knockChannelId","disconnectLabel","reconnectLabel","React","MsTeamsIcon","popup","openPopupWindow","current"],"mappings":";;;;;;AAmCO,MAAMA,IAA+DA,CAAC;AAAA,EAC3EC,aAAAA;AAAAA,EACAC,0BAAAA;AAAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IACJ,sBAAsBD,IAAQA,EAAMC,mBAAmBD,EAAME,cAEzD;AAAA,IAAEC,GAAAA;AAAAA,MAAMC,EAAgB,GACxBC,IAAQC,EAAe,GAEvB;AAAA,IACJC,qBAAAA;AAAAA,IACAC,kBAAAA;AAAAA,IACAC,gBAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,uBAAAA;AAAAA,IACAC,gBAAAA;AAAAA,MACEC,EAAsB,GAEpB;AAAA,IAAEC,qBAAAA;AAAAA,IAAqBC,uBAAAA;AAAAA,EAAAA,IAA0BC,EACrDjB,GACAH,CACF;AAE2B,EAAAqB,EAAA;AAAA,IACzBC,WAAWf,EAAMgB;AAAAA,IACjBP,gBAAAA;AAAAA,IACAP,qBAAAA;AAAAA,IACAR,0BAAAA;AAAAA,EAAAA,CACD,GAEcuB,EAAA;AAAA,IACbR,gBAAAA;AAAAA,IACAP,qBAAAA;AAAAA,IACAR,0BAAAA;AAAAA,IACAwB,aAAaC,EAAY,YAChBnB,EAAMoB,QAAQC,UAAU;AAAA,MAC7BC,QAAQf;AAAAA,MACRgB,gBAAgBf;AAAAA,IAAAA,CACjB,GACA,CAACR,EAAMoB,SAASb,GAAUC,CAAqB,CAAC;AAAA,EAAA,CACpD;AAEKgB,QAAAA,IAAkB1B,EAAE,mBAAmB,KAAK,MAC5C2B,IAAiB3B,EAAE,kBAAkB,KAAK;AAI9CK,SAAAA,MAAqB,gBACrBA,MAAqB,kBAGnBuB,gBAAAA,EAAA,cAAC,SAAI,WAAU,mDAAA,mCACZC,GAAY,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACtCD,gBAAAA,EAAA,cAAA,QAAA,MAEK5B,EADHK,MAAqB,eAChB,sBACA,sBADmB,CAE3B,CACF,IAKAA,MAAqB,UAErBuB,gBAAAA,EAAA,cAAC,UACC,EAAA,SAAS,MAAM;AACPE,UAAAA,IAAQC,EAAgBlB,GAAqB;AACnDF,IAAAA,EAAeqB,UAAUF,GACzB1B,EAAoB,YAAY;AAAA,EAAA,GAElC,WAAU,kDACV,cAAc,MAAME,EAAeqB,CAAc,GACjD,cAAc,MAAMrB,EAAe,IAAI,EAEvC,GAAAsB,gBAAAA,EAAA,cAACC,GAAY,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACtCD,gBAAAA,EAAA,cAAA,QAAA,EAAK,WAAU,mCAAA,GACbrB,KAAeC,KAAcR,EAAE,cAAc,CAChD,CACF,IAKAK,MAAqB,iBAErBuB,gBAAAA,EAAA,cAAC,UACC,EAAA,SAAS,MAAM;AACPE,UAAAA,IAAQC,EAAgBlB,GAAqB;AACnDF,IAAAA,EAAeqB,UAAUF,GACzB1B,EAAoB,YAAY;AAAA,EAAA,GAElC,WAAU,wDAEV,GAAAwB,gBAAAA,EAAA,cAACC,KAAY,QAAO,QAAO,OAAM,QAAM,GACtCD,gBAAAA,EAAA,cAAA,QAAA,MAAM5B,EAAE,gBAAgB,CAAE,CAC7B,IAMD4B,gBAAAA,EAAA,cAAA,UAAA,EACC,SAASd,GACT,WAAU,sDACV,cAAc,MAAMR,EAAeoB,CAAe,GAClD,cAAc,MAAMpB,EAAe,IAAI,KAEvCsB,gBAAAA,EAAA,cAACC,GAAY,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACvCD,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAU,uCACbrB,GAAAA,KAAeP,EAAE,kBAAkB,CACtC,CACF;AAEJ;"}

package/dist/esm/modules/slack/components/SlackAuthButton/SlackAuthButton.mjs

@@ -1,46 +1,56 @@
-import e, { useMemo as w, useEffect as L } from "react";
-import { useTranslations as C, useKnockClient as S, useKnockSlackClient as M, useSlackAuth as N } from "@knocklabs/react-core";
+import n, { useMemo as L, useCallback as w } from "react";
+import { useTranslations as A, useKnockClient as M, useKnockSlackClient as N, useSlackAuth as I, useAuthPostMessageListener as v, useAuthPolling as P } from "@knocklabs/react-core";
 import { openPopupWindow as d } from "../../../core/utils.mjs";
 /* empty css               */
-import { SlackIcon as s } from "../SlackIcon/SlackIcon.mjs";
+import { SlackIcon as r } from "../SlackIcon/SlackIcon.mjs";
 /* empty css            */
 const B = ({
-  slackClientId: p,
-  redirectUrl: b,
-  onAuthenticationComplete: a,
-  scopes: l,
-  additionalScopes: i
+  slackClientId: b,
+  redirectUrl: E,
+  onAuthenticationComplete: u,
+  scopes: i,
+  additionalScopes: k
 }) => {
   const {
-    t
-  } = C(), u = S(), {
+    t: e
+  } = A(), a = M(), {
     setConnectionStatus: c,
-    connectionStatus: n,
+    connectionStatus: t,
     setActionLabel: o,
     actionLabel: m,
-    errorLabel: h
-  } = M(), E = w(() => ({
-    scopes: l,
-    additionalScopes: i
-  }), [l, i]), {
-    buildSlackAuthUrl: k,
-    disconnectFromSlack: f
-  } = N(p, b, E);
-  L(() => {
-    const _ = (r) => {
-      if (r.origin === u.host)
-        try {
-          r.data === "authComplete" && c("connected"), r.data === "authFailed" && c("error"), a && a(r.data);
-        } catch {
-          c("error");
-        }
-    };
-    return window.addEventListener("message", _, !1), () => {
-      window.removeEventListener("message", _);
-    };
-  }, [u.host, a, c]);
-  const g = t("slackDisconnect") || null, x = t("slackReconnect") || null;
-  return n === "connecting" || n === "disconnecting" ? /* @__PURE__ */ e.createElement("div", { className: "rsk-connect__button rsk-connect__button--loading" }, /* @__PURE__ */ e.createElement(s, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", null, t(n === "connecting" ? "slackConnecting" : "slackDisconnecting"))) : n === "error" ? /* @__PURE__ */ e.createElement("button", { onClick: () => d(k()), className: "rsk-connect__button rsk-connect__button--error", onMouseEnter: () => o(x), onMouseLeave: () => o(null) }, /* @__PURE__ */ e.createElement(s, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", { className: "rsk-connect__button__text--error" }, m || h || t("slackError"))) : n === "disconnected" ? /* @__PURE__ */ e.createElement("button", { onClick: () => d(k()), className: "rsk-connect__button rsk-connect__button--disconnected" }, /* @__PURE__ */ e.createElement(s, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", null, t("slackConnect"))) : /* @__PURE__ */ e.createElement("button", { onClick: f, className: "rsk-connect__button rsk-connect__button--connected", onMouseEnter: () => o(g), onMouseLeave: () => o(null) }, /* @__PURE__ */ e.createElement(s, { height: "16px", width: "16px" }), /* @__PURE__ */ e.createElement("span", { className: "rsk-connect__button__text--connected" }, m || t("slackConnected")));
+    errorLabel: g,
+    tenantId: p,
+    knockSlackChannelId: _,
+    popupWindowRef: s
+  } = N(), C = L(() => ({
+    scopes: i,
+    additionalScopes: k
+  }), [i, k]), {
+    buildSlackAuthUrl: h,
+    disconnectFromSlack: x
+  } = I(b, E, C);
+  v({
+    knockHost: a.host,
+    popupWindowRef: s,
+    setConnectionStatus: c,
+    onAuthenticationComplete: u
+  }), P({
+    popupWindowRef: s,
+    setConnectionStatus: c,
+    onAuthenticationComplete: u,
+    authCheckFn: w(async () => a.slack.authCheck({
+      tenant: p,
+      knockChannelId: _
+    }), [a.slack, p, _])
+  });
+  const f = e("slackDisconnect") || null, S = e("slackReconnect") || null;
+  return t === "connecting" || t === "disconnecting" ? /* @__PURE__ */ n.createElement("div", { className: "rsk-connect__button rsk-connect__button--loading" }, /* @__PURE__ */ n.createElement(r, { height: "16px", width: "16px" }), /* @__PURE__ */ n.createElement("span", null, e(t === "connecting" ? "slackConnecting" : "slackDisconnecting"))) : t === "error" ? /* @__PURE__ */ n.createElement("button", { onClick: () => {
+    const l = d(h());
+    s.current = l, c("connecting");
+  }, className: "rsk-connect__button rsk-connect__button--error", onMouseEnter: () => o(S), onMouseLeave: () => o(null) }, /* @__PURE__ */ n.createElement(r, { height: "16px", width: "16px" }), /* @__PURE__ */ n.createElement("span", { className: "rsk-connect__button__text--error" }, m || g || e("slackError"))) : t === "disconnected" ? /* @__PURE__ */ n.createElement("button", { onClick: () => {
+    const l = d(h());
+    s.current = l, c("connecting");
+  }, className: "rsk-connect__button rsk-connect__button--disconnected" }, /* @__PURE__ */ n.createElement(r, { height: "16px", width: "16px" }), /* @__PURE__ */ n.createElement("span", null, e("slackConnect"))) : /* @__PURE__ */ n.createElement("button", { onClick: x, className: "rsk-connect__button rsk-connect__button--connected", onMouseEnter: () => o(f), onMouseLeave: () => o(null) }, /* @__PURE__ */ n.createElement(r, { height: "16px", width: "16px" }), /* @__PURE__ */ n.createElement("span", { className: "rsk-connect__button__text--connected" }, m || e("slackConnected")));
 };
 export {
   B as SlackAuthButton

package/dist/esm/modules/slack/components/SlackAuthButton/SlackAuthButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SlackAuthButton.mjs","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"sourcesContent":["import {\n  useKnockClient,\n  useKnockSlackClient,\n  useSlackAuth,\n  useTranslations,\n} from \"@knocklabs/react-core\";\nimport { FunctionComponent, useMemo } from \"react\";\nimport { useEffect } from \"react\";\n\nimport { openPopupWindow } from \"../../../core/utils\";\nimport \"../../theme.css\";\nimport { SlackIcon } from \"../SlackIcon\";\n\nimport \"./styles.css\";\n\nexport interface SlackAuthButtonProps {\n  slackClientId: string;\n  redirectUrl?: string;\n  onAuthenticationComplete?: (authenticationResp: string) => void;\n  // When provided, the default scopes will be overridden with the provided scopes\n  scopes?: string[];\n  // Additional scopes to add to the default scopes\n  additionalScopes?: string[];\n}\n\nexport const SlackAuthButton: FunctionComponent<SlackAuthButtonProps> = ({\n  slackClientId,\n  redirectUrl,\n  onAuthenticationComplete,\n  scopes,\n  additionalScopes,\n}) => {\n  const { t } = useTranslations();\n  const knock = useKnockClient();\n\n  const {\n    setConnectionStatus,\n    connectionStatus,\n    setActionLabel,\n    actionLabel,\n    errorLabel,\n  } = useKnockSlackClient();\n\n  const useSlackAuthOptions = useMemo(\n    () => ({\n      scopes,\n      additionalScopes,\n    }),\n    [scopes, additionalScopes],\n  );\n\n  const { buildSlackAuthUrl, disconnectFromSlack } = useSlackAuth(\n    slackClientId,\n    redirectUrl,\n    useSlackAuthOptions,\n  );\n\n  useEffect(() => {\n    const receiveMessage = (event: MessageEvent) => {\n      if (event.origin !== knock.host) {\n        return;\n      }\n\n      try {\n        if (event.data === \"authComplete\") {\n          setConnectionStatus(\"connected\");\n        }\n\n        if (event.data === \"authFailed\") {\n          setConnectionStatus(\"error\");\n        }\n\n        if (onAuthenticationComplete) {\n          onAuthenticationComplete(event.data);\n        }\n      } catch (_error) {\n        setConnectionStatus(\"error\");\n      }\n    };\n\n    window.addEventListener(\"message\", receiveMessage, false);\n\n    // Cleanup the event listener when the component unmounts\n    return () => {\n      window.removeEventListener(\"message\", receiveMessage);\n    };\n  }, [knock.host, onAuthenticationComplete, setConnectionStatus]);\n\n  const disconnectLabel = t(\"slackDisconnect\") || null;\n  const reconnectLabel = t(\"slackReconnect\") || null;\n\n  // Loading states\n  if (\n    connectionStatus === \"connecting\" ||\n    connectionStatus === \"disconnecting\"\n  ) {\n    return (\n      <div className=\"rsk-connect__button rsk-connect__button--loading\">\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span>\n          {connectionStatus === \"connecting\"\n            ? t(\"slackConnecting\")\n            : t(\"slackDisconnecting\")}\n        </span>\n      </div>\n    );\n  }\n\n  // Error state\n  if (connectionStatus === \"error\") {\n    return (\n      <button\n        onClick={() => openPopupWindow(buildSlackAuthUrl())}\n        className=\"rsk-connect__button rsk-connect__button--error\"\n        onMouseEnter={() => setActionLabel(reconnectLabel)}\n        onMouseLeave={() => setActionLabel(null)}\n      >\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span className=\"rsk-connect__button__text--error\">\n          {actionLabel || errorLabel || t(\"slackError\")}\n        </span>\n      </button>\n    );\n  }\n\n  // Disconnected state\n  if (connectionStatus === \"disconnected\") {\n    return (\n      <button\n        onClick={() => openPopupWindow(buildSlackAuthUrl())}\n        className=\"rsk-connect__button rsk-connect__button--disconnected\"\n      >\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span>{t(\"slackConnect\")}</span>\n      </button>\n    );\n  }\n\n  // Connected state\n  return (\n    <button\n      onClick={disconnectFromSlack}\n      className=\"rsk-connect__button rsk-connect__button--connected\"\n      onMouseEnter={() => setActionLabel(disconnectLabel)}\n      onMouseLeave={() => setActionLabel(null)}\n    >\n      <SlackIcon height=\"16px\" width=\"16px\" />\n      <span className=\"rsk-connect__button__text--connected\">\n        {actionLabel || t(\"slackConnected\")}\n      </span>\n    </button>\n  );\n};\n"],"names":["SlackAuthButton","slackClientId","redirectUrl","onAuthenticationComplete","scopes","additionalScopes","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","useKnockSlackClient","useSlackAuthOptions","useMemo","buildSlackAuthUrl","disconnectFromSlack","useSlackAuth","useEffect","receiveMessage","event","origin","host","data","addEventListener","removeEventListener","disconnectLabel","reconnectLabel","React","SlackIcon","openPopupWindow"],"mappings":";;;;;;AAyBO,MAAMA,IAA2DA,CAAC;AAAA,EACvEC,eAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,0BAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,kBAAAA;AACF,MAAM;AACE,QAAA;AAAA,IAAEC;AAAAA,MAAMC,EAAgB,GACxBC,IAAQC,EAAe,GAEvB;AAAA,IACJC,qBAAAA;AAAAA,IACAC,kBAAAA;AAAAA,IACAC,gBAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,YAAAA;AAAAA,MACEC,EAAoB,GAElBC,IAAsBC,EAC1B,OAAO;AAAA,IACLb,QAAAA;AAAAA,IACAC,kBAAAA;AAAAA,EAAAA,IAEF,CAACD,GAAQC,CAAgB,CAC3B,GAEM;AAAA,IAAEa,mBAAAA;AAAAA,IAAmBC,qBAAAA;AAAAA,EAAwBC,IAAAA,EACjDnB,GACAC,GACAc,CACF;AAEAK,EAAAA,EAAU,MAAM;AACRC,UAAAA,IAAiBA,CAACC,MAAwB;AAC1CA,UAAAA,EAAMC,WAAWhB,EAAMiB;AAIvB,YAAA;AACEF,UAAAA,EAAMG,SAAS,kBACjBhB,EAAoB,WAAW,GAG7Ba,EAAMG,SAAS,gBACjBhB,EAAoB,OAAO,GAGzBP,KACFA,EAAyBoB,EAAMG,IAAI;AAAA,gBAEtB;AACfhB,UAAAA,EAAoB,OAAO;AAAA,QAAA;AAAA,IAE/B;AAEOiB,kBAAAA,iBAAiB,WAAWL,GAAgB,EAAK,GAGjD,MAAM;AACJM,aAAAA,oBAAoB,WAAWN,CAAc;AAAA,IACtD;AAAA,KACC,CAACd,EAAMiB,MAAMtB,GAA0BO,CAAmB,CAAC;AAExDmB,QAAAA,IAAkBvB,EAAE,iBAAiB,KAAK,MAC1CwB,IAAiBxB,EAAE,gBAAgB,KAAK;AAI5CK,SAAAA,MAAqB,gBACrBA,MAAqB,kBAGnBoB,gBAAAA,EAAA,cAAC,SAAI,WAAU,mDAAA,mCACZC,GAAU,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACpCD,gBAAAA,EAAA,cAAA,QAAA,MAEKzB,EADHK,MAAqB,eAChB,oBACA,oBADiB,CAEzB,CACF,IAKAA,MAAqB,0CAEpB,UACC,EAAA,SAAS,MAAMsB,EAAgBf,GAAmB,GAClD,WAAU,kDACV,cAAc,MAAMN,EAAekB,CAAc,GACjD,cAAc,MAAMlB,EAAe,IAAI,EAAA,mCAEtCoB,GAAU,EAAA,QAAO,QAAO,OAAM,QAAM,GACrCD,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAU,sCACblB,KAAeC,KAAcR,EAAE,YAAY,CAC9C,CACF,IAKAK,MAAqB,iBAErBoB,gBAAAA,EAAA,cAAC,YACC,SAAS,MAAME,EAAgBf,EAAkB,CAAC,GAClD,WAAU,wDAEV,GAAAa,gBAAAA,EAAA,cAACC,KAAU,QAAO,QAAO,OAAM,OAAM,CAAA,mCACpC,QAAM1B,MAAAA,EAAE,cAAc,CAAE,CAC3B,IAMDyB,gBAAAA,EAAA,cAAA,UAAA,EACC,SAASZ,GACT,WAAU,sDACV,cAAc,MAAMP,EAAeiB,CAAe,GAClD,cAAc,MAAMjB,EAAe,IAAI,KAEvCmB,gBAAAA,EAAA,cAACC,GAAU,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACrCD,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAU,uCACblB,GAAAA,KAAeP,EAAE,gBAAgB,CACpC,CACF;AAEJ;"}
+{"version":3,"file":"SlackAuthButton.mjs","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"sourcesContent":["import {\n  useAuthPolling,\n  useAuthPostMessageListener,\n  useKnockClient,\n  useKnockSlackClient,\n  useSlackAuth,\n  useTranslations,\n} from \"@knocklabs/react-core\";\nimport { FunctionComponent, useCallback, useMemo } from \"react\";\n\nimport { openPopupWindow } from \"../../../core/utils\";\nimport \"../../theme.css\";\nimport { SlackIcon } from \"../SlackIcon\";\n\nimport \"./styles.css\";\n\nexport interface SlackAuthButtonProps {\n  slackClientId: string;\n  redirectUrl?: string;\n  onAuthenticationComplete?: (authenticationResp: string) => void;\n  // When provided, the default scopes will be overridden with the provided scopes\n  scopes?: string[];\n  // Additional scopes to add to the default scopes\n  additionalScopes?: string[];\n}\n\nexport const SlackAuthButton: FunctionComponent<SlackAuthButtonProps> = ({\n  slackClientId,\n  redirectUrl,\n  onAuthenticationComplete,\n  scopes,\n  additionalScopes,\n}) => {\n  const { t } = useTranslations();\n  const knock = useKnockClient();\n\n  const {\n    setConnectionStatus,\n    connectionStatus,\n    setActionLabel,\n    actionLabel,\n    errorLabel,\n    tenantId,\n    knockSlackChannelId,\n    popupWindowRef,\n  } = useKnockSlackClient();\n\n  const useSlackAuthOptions = useMemo(\n    () => ({\n      scopes,\n      additionalScopes,\n    }),\n    [scopes, additionalScopes],\n  );\n\n  const { buildSlackAuthUrl, disconnectFromSlack } = useSlackAuth(\n    slackClientId,\n    redirectUrl,\n    useSlackAuthOptions,\n  );\n\n  useAuthPostMessageListener({\n    knockHost: knock.host,\n    popupWindowRef,\n    setConnectionStatus,\n    onAuthenticationComplete,\n  });\n\n  useAuthPolling({\n    popupWindowRef,\n    setConnectionStatus,\n    onAuthenticationComplete,\n    authCheckFn: useCallback(async () => {\n      return knock.slack.authCheck({\n        tenant: tenantId,\n        knockChannelId: knockSlackChannelId,\n      });\n    }, [knock.slack, tenantId, knockSlackChannelId]),\n  });\n\n  const disconnectLabel = t(\"slackDisconnect\") || null;\n  const reconnectLabel = t(\"slackReconnect\") || null;\n\n  // Loading states\n  if (\n    connectionStatus === \"connecting\" ||\n    connectionStatus === \"disconnecting\"\n  ) {\n    return (\n      <div className=\"rsk-connect__button rsk-connect__button--loading\">\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span>\n          {connectionStatus === \"connecting\"\n            ? t(\"slackConnecting\")\n            : t(\"slackDisconnecting\")}\n        </span>\n      </div>\n    );\n  }\n\n  // Error state\n  if (connectionStatus === \"error\") {\n    return (\n      <button\n        onClick={() => {\n          const popup = openPopupWindow(buildSlackAuthUrl());\n          popupWindowRef.current = popup;\n          setConnectionStatus(\"connecting\");\n        }}\n        className=\"rsk-connect__button rsk-connect__button--error\"\n        onMouseEnter={() => setActionLabel(reconnectLabel)}\n        onMouseLeave={() => setActionLabel(null)}\n      >\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span className=\"rsk-connect__button__text--error\">\n          {actionLabel || errorLabel || t(\"slackError\")}\n        </span>\n      </button>\n    );\n  }\n\n  // Disconnected state\n  if (connectionStatus === \"disconnected\") {\n    return (\n      <button\n        onClick={() => {\n          const popup = openPopupWindow(buildSlackAuthUrl());\n          popupWindowRef.current = popup;\n          setConnectionStatus(\"connecting\");\n        }}\n        className=\"rsk-connect__button rsk-connect__button--disconnected\"\n      >\n        <SlackIcon height=\"16px\" width=\"16px\" />\n        <span>{t(\"slackConnect\")}</span>\n      </button>\n    );\n  }\n\n  // Connected state\n  return (\n    <button\n      onClick={disconnectFromSlack}\n      className=\"rsk-connect__button rsk-connect__button--connected\"\n      onMouseEnter={() => setActionLabel(disconnectLabel)}\n      onMouseLeave={() => setActionLabel(null)}\n    >\n      <SlackIcon height=\"16px\" width=\"16px\" />\n      <span className=\"rsk-connect__button__text--connected\">\n        {actionLabel || t(\"slackConnected\")}\n      </span>\n    </button>\n  );\n};\n"],"names":["SlackAuthButton","slackClientId","redirectUrl","onAuthenticationComplete","scopes","additionalScopes","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","tenantId","knockSlackChannelId","popupWindowRef","useKnockSlackClient","useSlackAuthOptions","useMemo","buildSlackAuthUrl","disconnectFromSlack","useSlackAuth","useAuthPostMessageListener","knockHost","host","useAuthPolling","authCheckFn","useCallback","slack","authCheck","tenant","knockChannelId","disconnectLabel","reconnectLabel","React","SlackIcon","popup","openPopupWindow","current"],"mappings":";;;;;;AA0BO,MAAMA,IAA2DA,CAAC;AAAA,EACvEC,eAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,0BAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,kBAAAA;AACF,MAAM;AACE,QAAA;AAAA,IAAEC,GAAAA;AAAAA,MAAMC,EAAgB,GACxBC,IAAQC,EAAe,GAEvB;AAAA,IACJC,qBAAAA;AAAAA,IACAC,kBAAAA;AAAAA,IACAC,gBAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,qBAAAA;AAAAA,IACAC,gBAAAA;AAAAA,MACEC,EAAoB,GAElBC,IAAsBC,EAC1B,OAAO;AAAA,IACLhB,QAAAA;AAAAA,IACAC,kBAAAA;AAAAA,EAAAA,IAEF,CAACD,GAAQC,CAAgB,CAC3B,GAEM;AAAA,IAAEgB,mBAAAA;AAAAA,IAAmBC,qBAAAA;AAAAA,EAAwBC,IAAAA,EACjDtB,GACAC,GACAiB,CACF;AAE2B,EAAAK,EAAA;AAAA,IACzBC,WAAWjB,EAAMkB;AAAAA,IACjBT,gBAAAA;AAAAA,IACAP,qBAAAA;AAAAA,IACAP,0BAAAA;AAAAA,EAAAA,CACD,GAEcwB,EAAA;AAAA,IACbV,gBAAAA;AAAAA,IACAP,qBAAAA;AAAAA,IACAP,0BAAAA;AAAAA,IACAyB,aAAaC,EAAY,YAChBrB,EAAMsB,MAAMC,UAAU;AAAA,MAC3BC,QAAQjB;AAAAA,MACRkB,gBAAgBjB;AAAAA,IAAAA,CACjB,GACA,CAACR,EAAMsB,OAAOf,GAAUC,CAAmB,CAAC;AAAA,EAAA,CAChD;AAEKkB,QAAAA,IAAkB5B,EAAE,iBAAiB,KAAK,MAC1C6B,IAAiB7B,EAAE,gBAAgB,KAAK;AAI5CK,SAAAA,MAAqB,gBACrBA,MAAqB,kBAGnByB,gBAAAA,EAAA,cAAC,SAAI,WAAU,mDAAA,mCACZC,GAAU,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACpCD,gBAAAA,EAAA,cAAA,QAAA,MAEK9B,EADHK,MAAqB,eAChB,oBACA,oBADiB,CAEzB,CACF,IAKAA,MAAqB,UAErByB,gBAAAA,EAAA,cAAC,UACC,EAAA,SAAS,MAAM;AACPE,UAAAA,IAAQC,EAAgBlB,GAAmB;AACjDJ,IAAAA,EAAeuB,UAAUF,GACzB5B,EAAoB,YAAY;AAAA,EAAA,GAElC,WAAU,kDACV,cAAc,MAAME,EAAeuB,CAAc,GACjD,cAAc,MAAMvB,EAAe,IAAI,EAEvC,GAAAwB,gBAAAA,EAAA,cAACC,GAAU,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACpCD,gBAAAA,EAAA,cAAA,QAAA,EAAK,WAAU,mCAAA,GACbvB,KAAeC,KAAcR,EAAE,YAAY,CAC9C,CACF,IAKAK,MAAqB,iBAErByB,gBAAAA,EAAA,cAAC,UACC,EAAA,SAAS,MAAM;AACPE,UAAAA,IAAQC,EAAgBlB,GAAmB;AACjDJ,IAAAA,EAAeuB,UAAUF,GACzB5B,EAAoB,YAAY;AAAA,EAAA,GAElC,WAAU,wDAEV,GAAA0B,gBAAAA,EAAA,cAACC,KAAU,QAAO,QAAO,OAAM,QAAM,GACpCD,gBAAAA,EAAA,cAAA,QAAA,MAAM9B,EAAE,cAAc,CAAE,CAC3B,IAMD8B,gBAAAA,EAAA,cAAA,UAAA,EACC,SAASd,GACT,WAAU,sDACV,cAAc,MAAMV,EAAesB,CAAe,GAClD,cAAc,MAAMtB,EAAe,IAAI,KAEvCwB,gBAAAA,EAAA,cAACC,GAAU,EAAA,QAAO,QAAO,OAAM,OAAM,CAAA,GACrCD,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAU,uCACbvB,GAAAA,KAAeP,EAAE,gBAAgB,CACpC,CACF;AAEJ;"}

package/dist/types/modules/core/utils.d.ts

@@ -1,3 +1,3 @@
-export declare const openPopupWindow: (url: string) => void;
+export declare const openPopupWindow: (url: string) => Window | null;
 export declare const checkForWindow: () => (Window & typeof globalThis) | undefined;
 //# sourceMappingURL=utils.d.ts.map

package/dist/types/modules/core/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/modules/core/utils.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,GAAI,KAAK,MAAM,SAqB1C,CAAC;AAEF,eAAO,MAAM,cAAc,gDAI1B,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/modules/core/utils.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,GAAI,KAAK,MAAM,kBAqB1C,CAAC;AAEF,eAAO,MAAM,cAAc,gDAI1B,CAAC"}

package/dist/types/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MsTeamsAuthButton.d.ts","sourceRoot":"","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAGrD,OAAO,iBAAiB,CAAC;AAGzB,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,sBAAsB,GAAG;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB,CAAC,EAAE,CAAC,kBAAkB,EAAE,MAAM,KAAK,IAAI,CAAC;CACjE,GAAG,CACA;IACE;;;OAGG;IACH,gBAAgB,EAAE,MAAM,CAAC;CAC1B,GACD;IACE;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;CACtB,CACJ,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,CAqHvE,CAAC"}
+{"version":3,"file":"MsTeamsAuthButton.d.ts","sourceRoot":"","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAe,MAAM,OAAO,CAAC;AAGvD,OAAO,iBAAiB,CAAC;AAGzB,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,sBAAsB,GAAG;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB,CAAC,EAAE,CAAC,kBAAkB,EAAE,MAAM,KAAK,IAAI,CAAC;CACjE,GAAG,CACA;IACE;;;OAGG;IACH,gBAAgB,EAAE,MAAM,CAAC;CAC1B,GACD;IACE;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;CACtB,CACJ,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,CAsHvE,CAAC"}

package/dist/types/modules/slack/components/SlackAuthButton/SlackAuthButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SlackAuthButton.d.ts","sourceRoot":"","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAW,MAAM,OAAO,CAAC;AAInD,OAAO,iBAAiB,CAAC;AAGzB,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,oBAAoB;IACnC,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB,CAAC,EAAE,CAAC,kBAAkB,EAAE,MAAM,KAAK,IAAI,CAAC;IAEhE,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAElB,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;CAC7B;AAED,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,CA+HnE,CAAC"}
+{"version":3,"file":"SlackAuthButton.d.ts","sourceRoot":"","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAGhE,OAAO,iBAAiB,CAAC;AAGzB,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,oBAAoB;IACnC,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB,CAAC,EAAE,CAAC,kBAAkB,EAAE,MAAM,KAAK,IAAI,CAAC;IAEhE,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAElB,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;CAC7B;AAED,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,CA8HnE,CAAC"}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@knocklabs/react",
   "description": "A set of React components to build notification experiences powered by Knock",
   "author": "@knocklabs",
-  "version": "0.10.2",
+  "version": "0.10.4",
   "license": "MIT",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.mjs",
@@ -72,8 +72,8 @@
     }
   },
   "dependencies": {
-    "@knocklabs/client": "^0.20.2",
-    "@knocklabs/react-core": "^0.12.2",
+    "@knocklabs/client": "^0.20.3",
+    "@knocklabs/react-core": "^0.12.4",
     "@popperjs/core": "^2.11.8",
     "@radix-ui/react-dialog": "^1.1.15",
     "@telegraph/combobox": "^0.1.16",