@knocklabs/react 0.11.14 → 0.11.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +17 -0
- package/dist/cjs/modules/slack/components/SlackAuthButton/SlackAuthButton.js +1 -1
- package/dist/cjs/modules/slack/components/SlackAuthButton/SlackAuthButton.js.map +1 -1
- package/dist/esm/modules/slack/components/SlackAuthButton/SlackAuthButton.mjs +45 -44
- package/dist/esm/modules/slack/components/SlackAuthButton/SlackAuthButton.mjs.map +1 -1
- package/dist/types/modules/slack/components/SlackAuthButton/SlackAuthButton.d.ts.map +1 -1
- package/package.json +17 -17
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 0.11.16
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 5d54e48: Update `@telegraph/*` dependencies to use `>=current_version` ranges instead of `^` (caret) ranges. This ensures that any version of a `@telegraph/*` package installed by a downstream project will satisfy `@knocklabs/react`'s dependency range, preventing Yarn from installing duplicate copies of Telegraph packages.
|
|
8
|
+
- Updated dependencies [e4fe593]
|
|
9
|
+
- @knocklabs/client@0.21.9
|
|
10
|
+
- @knocklabs/react-core@0.13.10
|
|
11
|
+
|
|
12
|
+
## 0.11.15
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- 4863fe5: [Slack] Add support for nonce verification in slack auth
|
|
17
|
+
- Updated dependencies [4863fe5]
|
|
18
|
+
- @knocklabs/react-core@0.13.9
|
|
19
|
+
|
|
3
20
|
## 0.11.14
|
|
4
21
|
|
|
5
22
|
### Patch Changes
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react"),c=require("@knocklabs/react-core"),g=require("../../../core/utils.js");;/* empty css */const r=require("../SlackIcon/SlackIcon.js");;/* empty css */const w=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=w(d),A=({slackClientId:t,redirectUrl:S,onAuthenticationComplete:p,scopes:_,additionalScopes:h})=>{const{t:n}=c.useTranslations(),a=c.useKnockClient(),{setConnectionStatus:l,connectionStatus:o,setActionLabel:s,actionLabel:b,errorLabel:C,tenantId:f,knockSlackChannelId:i,popupWindowRef:u}=c.useKnockSlackClient(),E=d.useMemo(()=>({scopes:_,additionalScopes:h}),[_,h]),{buildSlackAuthUrl:m,disconnectFromSlack:x}=c.useSlackAuth(t,S,E);c.useAuthPostMessageListener({knockHost:a.host,popupWindowRef:u,setConnectionStatus:l,onAuthenticationComplete:p,nonceStorageKey:c.getSlackNonceStorageKey(i,a.userId)}),c.useAuthPolling({popupWindowRef:u,setConnectionStatus:l,onAuthenticationComplete:p,authCheckFn:d.useCallback(async()=>a.slack.authCheck({tenant:f,knockChannelId:i}),[a.slack,f,i])});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(r.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n(o==="connecting"?"slackConnecting":"slackDisconnecting"))):o==="error"?e.default.createElement("button",{onClick:()=>{const k=g.openPopupWindow(m());u.current=k,l("connecting")},className:"rsk-connect__button rsk-connect__button--error",onMouseEnter:()=>s(L),onMouseLeave:()=>s(null)},e.default.createElement(r.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rsk-connect__button__text--error"},b||C||n("slackError"))):o==="disconnected"?e.default.createElement("button",{onClick:()=>{const k=g.openPopupWindow(m());u.current=k,l("connecting")},className:"rsk-connect__button rsk-connect__button--disconnected"},e.default.createElement(r.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:()=>s(I),onMouseLeave:()=>s(null)},e.default.createElement(r.SlackIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rsk-connect__button__text--connected"},b||n("slackConnected")))};exports.SlackAuthButton=A;
|
|
2
2
|
//# sourceMappingURL=SlackAuthButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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":"
|
|
1
|
+
{"version":3,"file":"SlackAuthButton.js","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"sourcesContent":["import {\n getSlackNonceStorageKey,\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 nonceStorageKey: getSlackNonceStorageKey(\n knockSlackChannelId,\n knock.userId!,\n ),\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","nonceStorageKey","getSlackNonceStorageKey","userId","useAuthPolling","authCheckFn","useCallback","slack","authCheck","tenant","knockChannelId","disconnectLabel","reconnectLabel","React","SlackIcon","popup","openPopupWindow","current"],"mappings":"2VA2BaA,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,EACAwB,gBAAiBC,EAAAA,wBACfZ,EACAR,EAAMqB,MACR,CAAA,CACD,EAEcC,iBAAA,CACbb,eAAAA,EACAP,oBAAAA,EACAP,yBAAAA,EACA4B,YAAaC,cAAY,SAChBxB,EAAMyB,MAAMC,UAAU,CAC3BC,OAAQpB,EACRqB,eAAgBpB,CAAAA,CACjB,EACA,CAACR,EAAMyB,MAAOlB,EAAUC,CAAmB,CAAC,CAAA,CAChD,EAEKqB,MAAAA,EAAkB/B,EAAE,iBAAiB,GAAK,KAC1CgC,EAAiBhC,EAAE,gBAAgB,GAAK,KAI5CK,OAAAA,IAAqB,cACrBA,IAAqB,gBAGnB4B,EAAA,QAAA,cAAC,OAAI,UAAU,kDAAA,0BACZC,EAAU,UAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACpCD,EAAAA,QAAA,cAAA,OAAA,KAEKjC,EADHK,IAAqB,aAChB,kBACA,oBADiB,CAEzB,CACF,EAKAA,IAAqB,QAErB4B,EAAA,QAAA,cAAC,SACC,CAAA,QAAS,IAAM,CACPE,MAAAA,EAAQC,kBAAgBrB,GAAmB,EACjDJ,EAAe0B,QAAUF,EACzB/B,EAAoB,YAAY,CAAA,EAElC,UAAU,iDACV,aAAc,IAAME,EAAe0B,CAAc,EACjD,aAAc,IAAM1B,EAAe,IAAI,CAEvC,EAAA2B,EAAA,QAAA,cAACC,EAAU,UAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACpCD,EAAAA,QAAA,cAAA,OAAA,CAAK,UAAU,kCAAA,EACb1B,GAAeC,GAAcR,EAAE,YAAY,CAC9C,CACF,EAKAK,IAAqB,eAErB4B,EAAA,QAAA,cAAC,SACC,CAAA,QAAS,IAAM,CACPE,MAAAA,EAAQC,kBAAgBrB,GAAmB,EACjDJ,EAAe0B,QAAUF,EACzB/B,EAAoB,YAAY,CAAA,EAElC,UAAU,uDAEV,EAAA6B,EAAA,QAAA,cAACC,aAAU,OAAO,OAAO,MAAM,OAAM,EACpCD,EAAA,QAAA,cAAA,OAAA,KAAMjC,EAAE,cAAc,CAAE,CAC3B,EAMDiC,EAAAA,QAAA,cAAA,SAAA,CACC,QAASjB,EACT,UAAU,qDACV,aAAc,IAAMV,EAAeyB,CAAe,EAClD,aAAc,IAAMzB,EAAe,IAAI,GAEvC2B,EAAAA,QAAA,cAACC,EAAAA,UAAU,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACrCD,EAAA,QAAA,cAAC,OAAK,CAAA,UAAU,sCACb1B,EAAAA,GAAeP,EAAE,gBAAgB,CACpC,CACF,CAEJ"}
|
|
@@ -1,58 +1,59 @@
|
|
|
1
|
-
import n, { useMemo as L, useCallback as
|
|
2
|
-
import { useTranslations as
|
|
1
|
+
import n, { useMemo as L, useCallback as N } from "react";
|
|
2
|
+
import { useTranslations as w, useKnockClient as A, useKnockSlackClient as M, useSlackAuth as I, useAuthPostMessageListener as K, getSlackNonceStorageKey as v, useAuthPolling as y } from "@knocklabs/react-core";
|
|
3
3
|
import { openPopupWindow as d } from "../../../core/utils.mjs";
|
|
4
4
|
/* empty css */
|
|
5
|
-
import { SlackIcon as
|
|
5
|
+
import { SlackIcon as a } from "../SlackIcon/SlackIcon.mjs";
|
|
6
6
|
/* empty css */
|
|
7
|
-
const
|
|
7
|
+
const H = ({
|
|
8
8
|
slackClientId: b,
|
|
9
|
-
redirectUrl:
|
|
10
|
-
onAuthenticationComplete:
|
|
11
|
-
scopes:
|
|
12
|
-
additionalScopes:
|
|
9
|
+
redirectUrl: g,
|
|
10
|
+
onAuthenticationComplete: i,
|
|
11
|
+
scopes: k,
|
|
12
|
+
additionalScopes: m
|
|
13
13
|
}) => {
|
|
14
14
|
const {
|
|
15
15
|
t: e
|
|
16
|
-
} =
|
|
17
|
-
setConnectionStatus:
|
|
16
|
+
} = w(), c = A(), {
|
|
17
|
+
setConnectionStatus: o,
|
|
18
18
|
connectionStatus: t,
|
|
19
|
-
setActionLabel:
|
|
20
|
-
actionLabel:
|
|
21
|
-
errorLabel:
|
|
22
|
-
tenantId:
|
|
23
|
-
knockSlackChannelId:
|
|
24
|
-
popupWindowRef:
|
|
25
|
-
} =
|
|
26
|
-
scopes:
|
|
27
|
-
additionalScopes:
|
|
28
|
-
}), [
|
|
19
|
+
setActionLabel: s,
|
|
20
|
+
actionLabel: p,
|
|
21
|
+
errorLabel: E,
|
|
22
|
+
tenantId: _,
|
|
23
|
+
knockSlackChannelId: l,
|
|
24
|
+
popupWindowRef: r
|
|
25
|
+
} = M(), C = L(() => ({
|
|
26
|
+
scopes: k,
|
|
27
|
+
additionalScopes: m
|
|
28
|
+
}), [k, m]), {
|
|
29
29
|
buildSlackAuthUrl: h,
|
|
30
|
-
disconnectFromSlack:
|
|
31
|
-
} = I(b,
|
|
32
|
-
|
|
33
|
-
knockHost:
|
|
34
|
-
popupWindowRef:
|
|
35
|
-
setConnectionStatus:
|
|
36
|
-
onAuthenticationComplete:
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
30
|
+
disconnectFromSlack: S
|
|
31
|
+
} = I(b, g, C);
|
|
32
|
+
K({
|
|
33
|
+
knockHost: c.host,
|
|
34
|
+
popupWindowRef: r,
|
|
35
|
+
setConnectionStatus: o,
|
|
36
|
+
onAuthenticationComplete: i,
|
|
37
|
+
nonceStorageKey: v(l, c.userId)
|
|
38
|
+
}), y({
|
|
39
|
+
popupWindowRef: r,
|
|
40
|
+
setConnectionStatus: o,
|
|
41
|
+
onAuthenticationComplete: i,
|
|
42
|
+
authCheckFn: N(async () => c.slack.authCheck({
|
|
43
|
+
tenant: _,
|
|
44
|
+
knockChannelId: l
|
|
45
|
+
}), [c.slack, _, l])
|
|
45
46
|
});
|
|
46
|
-
const
|
|
47
|
-
return t === "connecting" || t === "disconnecting" ? /* @__PURE__ */ n.createElement("div", { className: "rsk-connect__button rsk-connect__button--loading" }, /* @__PURE__ */ n.createElement(
|
|
48
|
-
const
|
|
49
|
-
|
|
50
|
-
}, className: "rsk-connect__button rsk-connect__button--error", onMouseEnter: () =>
|
|
51
|
-
const
|
|
52
|
-
|
|
53
|
-
}, className: "rsk-connect__button rsk-connect__button--disconnected" }, /* @__PURE__ */ n.createElement(
|
|
47
|
+
const x = e("slackDisconnect") || null, f = e("slackReconnect") || null;
|
|
48
|
+
return t === "connecting" || t === "disconnecting" ? /* @__PURE__ */ n.createElement("div", { className: "rsk-connect__button rsk-connect__button--loading" }, /* @__PURE__ */ n.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ n.createElement("span", null, e(t === "connecting" ? "slackConnecting" : "slackDisconnecting"))) : t === "error" ? /* @__PURE__ */ n.createElement("button", { onClick: () => {
|
|
49
|
+
const u = d(h());
|
|
50
|
+
r.current = u, o("connecting");
|
|
51
|
+
}, className: "rsk-connect__button rsk-connect__button--error", onMouseEnter: () => s(f), onMouseLeave: () => s(null) }, /* @__PURE__ */ n.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ n.createElement("span", { className: "rsk-connect__button__text--error" }, p || E || e("slackError"))) : t === "disconnected" ? /* @__PURE__ */ n.createElement("button", { onClick: () => {
|
|
52
|
+
const u = d(h());
|
|
53
|
+
r.current = u, o("connecting");
|
|
54
|
+
}, className: "rsk-connect__button rsk-connect__button--disconnected" }, /* @__PURE__ */ n.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ n.createElement("span", null, e("slackConnect"))) : /* @__PURE__ */ n.createElement("button", { onClick: S, className: "rsk-connect__button rsk-connect__button--connected", onMouseEnter: () => s(x), onMouseLeave: () => s(null) }, /* @__PURE__ */ n.createElement(a, { height: "16px", width: "16px" }), /* @__PURE__ */ n.createElement("span", { className: "rsk-connect__button__text--connected" }, p || e("slackConnected")));
|
|
54
55
|
};
|
|
55
56
|
export {
|
|
56
|
-
|
|
57
|
+
H as SlackAuthButton
|
|
57
58
|
};
|
|
58
59
|
//# sourceMappingURL=SlackAuthButton.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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":";;;;;;
|
|
1
|
+
{"version":3,"file":"SlackAuthButton.mjs","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"sourcesContent":["import {\n getSlackNonceStorageKey,\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 nonceStorageKey: getSlackNonceStorageKey(\n knockSlackChannelId,\n knock.userId!,\n ),\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","nonceStorageKey","getSlackNonceStorageKey","userId","useAuthPolling","authCheckFn","useCallback","slack","authCheck","tenant","knockChannelId","disconnectLabel","reconnectLabel","React","SlackIcon","popup","openPopupWindow","current"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SlackAuthButton.d.ts","sourceRoot":"","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SlackAuthButton.d.ts","sourceRoot":"","sources":["../../../../../../src/modules/slack/components/SlackAuthButton/SlackAuthButton.tsx"],"names":[],"mappings":"AASA,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,CAkInE,CAAC"}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@knocklabs/react",
|
|
3
3
|
"description": "A set of React components to build notification experiences powered by Knock",
|
|
4
4
|
"author": "@knocklabs",
|
|
5
|
-
"version": "0.11.
|
|
5
|
+
"version": "0.11.16",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"main": "dist/cjs/index.js",
|
|
8
8
|
"module": "dist/esm/index.mjs",
|
|
@@ -72,22 +72,22 @@
|
|
|
72
72
|
}
|
|
73
73
|
},
|
|
74
74
|
"dependencies": {
|
|
75
|
-
"@knocklabs/client": "^0.21.
|
|
76
|
-
"@knocklabs/react-core": "^0.13.
|
|
75
|
+
"@knocklabs/client": "^0.21.9",
|
|
76
|
+
"@knocklabs/react-core": "^0.13.10",
|
|
77
77
|
"@popperjs/core": "^2.11.8",
|
|
78
78
|
"@radix-ui/react-dialog": "^1.1.15",
|
|
79
79
|
"@radix-ui/react-hover-card": "^1.1.15",
|
|
80
|
-
"@telegraph/button": "
|
|
81
|
-
"@telegraph/combobox": "
|
|
82
|
-
"@telegraph/icon": "
|
|
83
|
-
"@telegraph/layout": "
|
|
84
|
-
"@telegraph/segmented-control": "
|
|
85
|
-
"@telegraph/select": "
|
|
86
|
-
"@telegraph/tag": "
|
|
87
|
-
"@telegraph/toggle": "
|
|
88
|
-
"@telegraph/tokens": "
|
|
89
|
-
"@telegraph/tooltip": "
|
|
90
|
-
"@telegraph/typography": "
|
|
80
|
+
"@telegraph/button": ">=0.6.0",
|
|
81
|
+
"@telegraph/combobox": ">=0.2.5",
|
|
82
|
+
"@telegraph/icon": ">=0.5.0",
|
|
83
|
+
"@telegraph/layout": ">=0.5.0",
|
|
84
|
+
"@telegraph/segmented-control": ">=0.2.3",
|
|
85
|
+
"@telegraph/select": ">=0.0.88",
|
|
86
|
+
"@telegraph/tag": ">=0.2.0",
|
|
87
|
+
"@telegraph/toggle": ">=0.1.3",
|
|
88
|
+
"@telegraph/tokens": ">=0.2.0",
|
|
89
|
+
"@telegraph/tooltip": ">=0.2.1",
|
|
90
|
+
"@telegraph/typography": ">=0.4.0",
|
|
91
91
|
"clsx": "^2.1.1",
|
|
92
92
|
"lodash.debounce": "^4.0.8",
|
|
93
93
|
"lucide-react": "^0.544.0"
|
|
@@ -100,7 +100,7 @@
|
|
|
100
100
|
"@testing-library/react": "^16.3.2",
|
|
101
101
|
"@types/eslint-plugin-jsx-a11y": "^6",
|
|
102
102
|
"@types/lodash.debounce": "^4.0.9",
|
|
103
|
-
"@types/react": "^19.
|
|
103
|
+
"@types/react": "^19.2.14",
|
|
104
104
|
"@types/react-dom": "^19.1.6",
|
|
105
105
|
"@typescript-eslint/eslint-plugin": "^8.32.0",
|
|
106
106
|
"@typescript-eslint/parser": "^8.58.0",
|
|
@@ -112,8 +112,8 @@
|
|
|
112
112
|
"eslint-plugin-react-refresh": "^0.5.2",
|
|
113
113
|
"jsdom": "^27.1.0",
|
|
114
114
|
"next": "15.3.6",
|
|
115
|
-
"react": "^19.
|
|
116
|
-
"react-dom": "^19.
|
|
115
|
+
"react": "^19.2.5",
|
|
116
|
+
"react-dom": "^19.2.5",
|
|
117
117
|
"rimraf": "^6.0.1",
|
|
118
118
|
"rollup-plugin-execute": "^1.1.1",
|
|
119
119
|
"rollup-preserve-directives": "^1.1.3",
|