@knocklabs/react 0.5.0 → 0.6.0-rc.0
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 +16 -0
- package/README.md +3 -3
- package/dist/cjs/index.css +1 -1
- package/dist/cjs/modules/core/components/Button/Button.js.map +1 -1
- package/dist/cjs/modules/core/components/Icons/Bell.js.map +1 -1
- package/dist/cjs/modules/core/hooks/useComponentVisible.js.map +1 -1
- package/dist/cjs/modules/core/hooks/useOnBottomScroll.js.map +1 -1
- package/dist/cjs/modules/feed/components/EmptyFeed/EmptyFeed.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationCell/ArchiveButton.js +1 -1
- package/dist/cjs/modules/feed/components/NotificationCell/ArchiveButton.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationCell/Avatar.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationCell/NotificationCell.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationFeed/Dropdown.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationFeed/MarkAsRead.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationFeed/NotificationFeed.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationFeed/NotificationFeedHeader.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.js +1 -1
- package/dist/cjs/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.js.map +1 -1
- package/dist/cjs/modules/feed/components/NotificationIconButton/NotificationIconButton.js.map +1 -1
- package/dist/cjs/modules/feed/components/UnseenBadge/UnseenBadge.js.map +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.js.map +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsAuthContainer/MsTeamsAuthContainer.js.map +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelCombobox.js.map +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelInTeamCombobox.js +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelInTeamCombobox.js.map +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsConnectionError.js.map +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsErrorMessage.js.map +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsTeamCombobox.js +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsTeamCombobox.js.map +1 -1
- package/dist/cjs/modules/ms-teams/components/MsTeamsIcon/MsTeamsIcon.js.map +1 -1
- package/dist/cjs/modules/slack/components/SlackAddChannelInput/SlackAddChannelInput.js.map +1 -1
- package/dist/cjs/modules/slack/components/SlackAuthButton/SlackAuthButton.js.map +1 -1
- package/dist/cjs/modules/slack/components/SlackAuthContainer/SlackAuthContainer.js.map +1 -1
- package/dist/cjs/modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.js +1 -1
- package/dist/cjs/modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.js.map +1 -1
- package/dist/cjs/modules/slack/components/SlackChannelCombobox/SlackConnectionError.js.map +1 -1
- package/dist/cjs/modules/slack/components/SlackChannelCombobox/SlackErrorMessage.js.map +1 -1
- package/dist/cjs/modules/slack/components/SlackIcon/SlackIcon.js.map +1 -1
- package/dist/esm/modules/core/components/Button/Button.mjs.map +1 -1
- package/dist/esm/modules/core/components/Icons/Bell.mjs.map +1 -1
- package/dist/esm/modules/core/hooks/useComponentVisible.mjs.map +1 -1
- package/dist/esm/modules/core/hooks/useOnBottomScroll.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationCell/ArchiveButton.mjs +30 -24
- package/dist/esm/modules/feed/components/NotificationCell/ArchiveButton.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationCell/Avatar.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationCell/NotificationCell.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationFeed/Dropdown.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationFeed/MarkAsRead.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationFeed/NotificationFeed.mjs +5 -5
- package/dist/esm/modules/feed/components/NotificationFeed/NotificationFeed.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationFeed/NotificationFeedHeader.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.mjs +40 -37
- package/dist/esm/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.mjs.map +1 -1
- package/dist/esm/modules/feed/components/NotificationIconButton/NotificationIconButton.mjs.map +1 -1
- package/dist/esm/modules/feed/components/UnseenBadge/UnseenBadge.mjs.map +1 -1
- package/dist/esm/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.mjs.map +1 -1
- package/dist/esm/modules/ms-teams/components/MsTeamsAuthContainer/MsTeamsAuthContainer.mjs.map +1 -1
- package/dist/esm/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelCombobox.mjs.map +1 -1
- package/dist/esm/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelInTeamCombobox.mjs +11 -8
- package/dist/esm/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelInTeamCombobox.mjs.map +1 -1
- package/dist/esm/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsTeamCombobox.mjs +14 -11
- package/dist/esm/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsTeamCombobox.mjs.map +1 -1
- package/dist/esm/modules/ms-teams/components/MsTeamsIcon/MsTeamsIcon.mjs.map +1 -1
- package/dist/esm/modules/slack/components/SlackAddChannelInput/SlackAddChannelInput.mjs.map +1 -1
- package/dist/esm/modules/slack/components/SlackAuthButton/SlackAuthButton.mjs.map +1 -1
- package/dist/esm/modules/slack/components/SlackAuthContainer/SlackAuthContainer.mjs.map +1 -1
- package/dist/esm/modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.mjs +13 -10
- package/dist/esm/modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.mjs.map +1 -1
- package/dist/esm/modules/slack/components/SlackIcon/SlackIcon.mjs.map +1 -1
- package/dist/index.css +1 -1
- package/dist/types/modules/feed/components/NotificationCell/ArchiveButton.d.ts +0 -1
- package/dist/types/modules/feed/components/NotificationCell/ArchiveButton.d.ts.map +1 -1
- package/dist/types/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.d.ts.map +1 -1
- package/dist/types/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelInTeamCombobox.d.ts.map +1 -1
- package/dist/types/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsTeamCombobox.d.ts.map +1 -1
- package/dist/types/modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.d.ts.map +1 -1
- package/package.json +12 -13
@@ -1 +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 interface MsTeamsAuthButtonProps {\n msTeamsBotId: string;\n redirectUrl?: string;\n onAuthenticationComplete?: (authenticationResp: string) => void;\n}\n\nexport const MsTeamsAuthButton: FunctionComponent<MsTeamsAuthButtonProps> = ({\n msTeamsBotId,\n redirectUrl,\n onAuthenticationComplete,\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 msTeamsBotId,\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","msTeamsBotId","redirectUrl","onAuthenticationComplete","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":"+VAoBaA,EAA+DA,CAAC,CAC3EC,aAAAA,EACAC,YAAAA,EACAC,yBAAAA,CACF,IAAM,CACE,KAAA,CAAEC,EAAAA,GAAMC,
|
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 interface MsTeamsAuthButtonProps {\n msTeamsBotId: string;\n redirectUrl?: string;\n onAuthenticationComplete?: (authenticationResp: string) => void;\n}\n\nexport const MsTeamsAuthButton: FunctionComponent<MsTeamsAuthButtonProps> = ({\n msTeamsBotId,\n redirectUrl,\n onAuthenticationComplete,\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 msTeamsBotId,\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","msTeamsBotId","redirectUrl","onAuthenticationComplete","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":"+VAoBaA,EAA+DA,CAAC,CAC3EC,aAAAA,EACAC,YAAAA,EACAC,yBAAAA,CACF,IAAM,CACE,KAAA,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,EACrDf,eAAAA,EACAC,CACF,EAEAe,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,EAG7BL,GAAAA,MAAAA,EAA2BgB,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,KAAMlB,EAA0BK,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"}
|
package/dist/cjs/modules/ms-teams/components/MsTeamsAuthContainer/MsTeamsAuthContainer.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MsTeamsAuthContainer.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsAuthContainer/MsTeamsAuthContainer.tsx"],"sourcesContent":["import { useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport \"../../theme.css\";\nimport { MsTeamsIcon } from \"../MsTeamsIcon\";\n\nimport \"./styles.css\";\n\nexport interface MsTeamsAuthContainerProps {\n actionButton: React.ReactElement;\n}\n\nexport const MsTeamsAuthContainer: FunctionComponent<\n MsTeamsAuthContainerProps\n> = ({ actionButton }) => {\n const { t } = useTranslations();\n\n return (\n <div className=\"rtk-auth\">\n <div className=\"rtk-auth__header\">\n <MsTeamsIcon height=\"32px\" width=\"32px\" />\n <div>{actionButton}</div>\n </div>\n <div className=\"rtk-auth__title\">Microsoft Teams</div>\n <div className=\"rtk-auth__description\">\n {t(\"msTeamsConnectContainerDescription\")}\n </div>\n </div>\n );\n};\n"],"names":["MsTeamsAuthContainer","actionButton","t","useTranslations","React","MsTeamsIcon"],"mappings":"2TAYaA,EAETA,CAAC,CAAEC,aAAAA,CAAa,IAAM,CAClB,KAAA,CAAEC,EAAAA,GAAMC,
|
1
|
+
{"version":3,"file":"MsTeamsAuthContainer.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsAuthContainer/MsTeamsAuthContainer.tsx"],"sourcesContent":["import { useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport \"../../theme.css\";\nimport { MsTeamsIcon } from \"../MsTeamsIcon\";\n\nimport \"./styles.css\";\n\nexport interface MsTeamsAuthContainerProps {\n actionButton: React.ReactElement;\n}\n\nexport const MsTeamsAuthContainer: FunctionComponent<\n MsTeamsAuthContainerProps\n> = ({ actionButton }) => {\n const { t } = useTranslations();\n\n return (\n <div className=\"rtk-auth\">\n <div className=\"rtk-auth__header\">\n <MsTeamsIcon height=\"32px\" width=\"32px\" />\n <div>{actionButton}</div>\n </div>\n <div className=\"rtk-auth__title\">Microsoft Teams</div>\n <div className=\"rtk-auth__description\">\n {t(\"msTeamsConnectContainerDescription\")}\n </div>\n </div>\n );\n};\n"],"names":["MsTeamsAuthContainer","actionButton","t","useTranslations","React","MsTeamsIcon"],"mappings":"2TAYaA,EAETA,CAAC,CAAEC,aAAAA,CAAa,IAAM,CAClB,KAAA,CAAEC,EAAAA,GAAMC,kBAAgB,EAE9B,OACGC,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,oCACZ,MAAI,CAAA,UAAU,kBACb,EAAAA,UAAA,cAACC,EAAY,YAAA,CAAA,OAAO,OAAO,MAAM,OAAM,EACvCD,EAAAA,QAAA,cAAC,MAAKH,KAAAA,CAAa,CACrB,EACCG,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,iBAAkB,EAAA,iBAAe,EAChDA,EAAAA,QAAA,cAAC,OAAI,UAAU,yBACZF,EAAE,oCAAoC,CACzC,CACF,CAEJ"}
|
package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelCombobox.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MsTeamsChannelCombobox.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelCombobox.tsx"],"sourcesContent":["import { MsTeamsTeam } from \"@knocklabs/client\";\nimport {\n MsTeamsChannelQueryOptions,\n MsTeamsTeamQueryOptions,\n RecipientObject,\n useConnectedMsTeamsChannels,\n} from \"@knocklabs/react-core\";\nimport { Icon, Lucide } from \"@telegraph/icon\";\nimport { Stack } from \"@telegraph/layout\";\nimport { Text } from \"@telegraph/typography\";\nimport { FunctionComponent, useCallback, useState } from \"react\";\n\nimport \"../../theme.css\";\n\nimport { MsTeamsChannelInTeamCombobox } from \"./MsTeamsChannelInTeamCombobox\";\nimport MsTeamsConnectionError from \"./MsTeamsConnectionError\";\nimport { MsTeamsTeamCombobox } from \"./MsTeamsTeamCombobox\";\nimport \"./styles.css\";\n\ninterface Props {\n msTeamsChannelsRecipientObject: RecipientObject;\n teamQueryOptions?: MsTeamsTeamQueryOptions;\n channelQueryOptions?: MsTeamsChannelQueryOptions;\n}\n\nconst MsTeamsChannelCombobox: FunctionComponent<Props> = ({\n msTeamsChannelsRecipientObject,\n teamQueryOptions,\n channelQueryOptions,\n}) => {\n const [selectedTeam, setSelectedTeam] = useState<MsTeamsTeam | null>(null);\n\n const { data: currentConnections } = useConnectedMsTeamsChannels({\n msTeamsChannelsRecipientObject,\n });\n\n const getChannelCount = useCallback(\n (teamId: string) =>\n currentConnections?.filter(\n (connection) =>\n connection.ms_teams_team_id === teamId &&\n !!connection.ms_teams_channel_id,\n ).length ?? 0,\n [currentConnections],\n );\n\n return (\n <Stack className=\"tgph rtk-combobox__grid\" gap=\"3\">\n <Text color=\"gray\" size=\"2\" as=\"div\">\n Team\n </Text>\n <MsTeamsTeamCombobox\n team={selectedTeam}\n onTeamChange={setSelectedTeam}\n getChannelCount={getChannelCount}\n queryOptions={teamQueryOptions}\n />\n <Stack\n alignItems=\"center\"\n gap=\"3\"\n minHeight=\"8\"\n style={{ alignSelf: \"start\" }}\n >\n <Icon color=\"gray\" size=\"1\" icon={Lucide.CornerDownRight} aria-hidden />\n <Text color=\"gray\" size=\"2\" as=\"div\">\n Channels\n </Text>\n </Stack>\n <MsTeamsChannelInTeamCombobox\n teamId={selectedTeam?.id}\n msTeamsChannelsRecipientObject={msTeamsChannelsRecipientObject}\n queryOptions={channelQueryOptions}\n />\n <MsTeamsConnectionError />\n </Stack>\n );\n};\n\nexport default MsTeamsChannelCombobox;\n"],"names":["MsTeamsChannelCombobox","msTeamsChannelsRecipientObject","teamQueryOptions","channelQueryOptions","selectedTeam","setSelectedTeam","useState","data","currentConnections","useConnectedMsTeamsChannels","getChannelCount","useCallback","teamId","filter","connection","ms_teams_team_id","ms_teams_channel_id","length","React","Stack","Text","MsTeamsTeamCombobox","alignSelf","Icon","Lucide","CornerDownRight","MsTeamsChannelInTeamCombobox","id","MsTeamsConnectionError"],"mappings":"0aAyBMA,EAAmDA,CAAC,CACxDC,+BAAAA,EACAC,iBAAAA,EACAC,oBAAAA,CACF,IAAM,CACJ,KAAM,CAACC,EAAcC,CAAe,EAAIC,
|
1
|
+
{"version":3,"file":"MsTeamsChannelCombobox.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelCombobox.tsx"],"sourcesContent":["import { MsTeamsTeam } from \"@knocklabs/client\";\nimport {\n MsTeamsChannelQueryOptions,\n MsTeamsTeamQueryOptions,\n RecipientObject,\n useConnectedMsTeamsChannels,\n} from \"@knocklabs/react-core\";\nimport { Icon, Lucide } from \"@telegraph/icon\";\nimport { Stack } from \"@telegraph/layout\";\nimport { Text } from \"@telegraph/typography\";\nimport { FunctionComponent, useCallback, useState } from \"react\";\n\nimport \"../../theme.css\";\n\nimport { MsTeamsChannelInTeamCombobox } from \"./MsTeamsChannelInTeamCombobox\";\nimport MsTeamsConnectionError from \"./MsTeamsConnectionError\";\nimport { MsTeamsTeamCombobox } from \"./MsTeamsTeamCombobox\";\nimport \"./styles.css\";\n\ninterface Props {\n msTeamsChannelsRecipientObject: RecipientObject;\n teamQueryOptions?: MsTeamsTeamQueryOptions;\n channelQueryOptions?: MsTeamsChannelQueryOptions;\n}\n\nconst MsTeamsChannelCombobox: FunctionComponent<Props> = ({\n msTeamsChannelsRecipientObject,\n teamQueryOptions,\n channelQueryOptions,\n}) => {\n const [selectedTeam, setSelectedTeam] = useState<MsTeamsTeam | null>(null);\n\n const { data: currentConnections } = useConnectedMsTeamsChannels({\n msTeamsChannelsRecipientObject,\n });\n\n const getChannelCount = useCallback(\n (teamId: string) =>\n currentConnections?.filter(\n (connection) =>\n connection.ms_teams_team_id === teamId &&\n !!connection.ms_teams_channel_id,\n ).length ?? 0,\n [currentConnections],\n );\n\n return (\n <Stack className=\"tgph rtk-combobox__grid\" gap=\"3\">\n <Text color=\"gray\" size=\"2\" as=\"div\">\n Team\n </Text>\n <MsTeamsTeamCombobox\n team={selectedTeam}\n onTeamChange={setSelectedTeam}\n getChannelCount={getChannelCount}\n queryOptions={teamQueryOptions}\n />\n <Stack\n alignItems=\"center\"\n gap=\"3\"\n minHeight=\"8\"\n style={{ alignSelf: \"start\" }}\n >\n <Icon color=\"gray\" size=\"1\" icon={Lucide.CornerDownRight} aria-hidden />\n <Text color=\"gray\" size=\"2\" as=\"div\">\n Channels\n </Text>\n </Stack>\n <MsTeamsChannelInTeamCombobox\n teamId={selectedTeam?.id}\n msTeamsChannelsRecipientObject={msTeamsChannelsRecipientObject}\n queryOptions={channelQueryOptions}\n />\n <MsTeamsConnectionError />\n </Stack>\n );\n};\n\nexport default MsTeamsChannelCombobox;\n"],"names":["MsTeamsChannelCombobox","msTeamsChannelsRecipientObject","teamQueryOptions","channelQueryOptions","selectedTeam","setSelectedTeam","useState","data","currentConnections","useConnectedMsTeamsChannels","getChannelCount","useCallback","teamId","filter","connection","ms_teams_team_id","ms_teams_channel_id","length","React","Stack","Text","MsTeamsTeamCombobox","alignSelf","Icon","Lucide","CornerDownRight","MsTeamsChannelInTeamCombobox","id","MsTeamsConnectionError"],"mappings":"0aAyBMA,EAAmDA,CAAC,CACxDC,+BAAAA,EACAC,iBAAAA,EACAC,oBAAAA,CACF,IAAM,CACJ,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAAAA,SAA6B,IAAI,EAEnE,CAAEC,KAAMC,GAAuBC,8BAA4B,CAC/DR,+BAAAA,CAAAA,CACD,EAEKS,EAAkBC,EAAAA,YACrBC,IACCJ,GAAAA,YAAAA,EAAoBK,UAEhBC,EAAWC,mBAAqBH,GAChC,CAAC,CAACE,EAAWE,qBACfC,SAAU,EACd,CAACT,CAAkB,CACrB,EAEA,OACGU,EAAA,QAAA,cAAAC,QAAA,CAAM,UAAU,0BAA0B,IAAI,GAC7C,EAAAD,EAAA,QAAA,cAACE,OAAK,CAAA,MAAM,OAAO,KAAK,IAAI,GAAG,OAAK,MAEpC,EACAF,EAAAA,QAAA,cAACG,EACC,oBAAA,CAAA,KAAMjB,EACN,aAAcC,EACd,gBAAAK,EACA,aAAcR,EAAiB,EAEhCgB,EAAA,QAAA,cAAAC,EAAAA,MAAA,CACC,WAAW,SACX,IAAI,IACJ,UAAU,IACV,MAAO,CAAEG,UAAW,OAAA,GAEpBJ,EAAAA,QAAA,cAACK,EAAK,KAAA,CAAA,MAAM,OAAO,KAAK,IAAI,KAAMC,EAAAA,OAAOC,gBAAiB,cAAW,EAAA,CAAA,EACrEP,EAAAA,QAAA,cAACE,QAAK,MAAM,OAAO,KAAK,IAAI,GAAG,KAAK,EAAA,UAEpC,CACF,0BACCM,EACC,6BAAA,CAAA,OAAQtB,GAAAA,YAAAA,EAAcuB,GACtB,+BAAA1B,EACA,aAAcE,CAAoB,CAAA,EAEpCe,EAAAA,QAAA,cAACU,MAAsB,CACzB,CAEJ"}
|
package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelInTeamCombobox.js
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),i=require("@knocklabs/react-core"),o=require("@telegraph/combobox"),E=require("@telegraph/layout"),g=require("../../utils.js"),M=require("./MsTeamsErrorMessage.js"),y=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},t=y(l),S=({teamId:a,msTeamsChannelsRecipientObject:b,queryOptions:h})=>{const{connectionStatus:s}=i.useKnockMsTeamsClient(),{data:
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),i=require("@knocklabs/react-core"),o=require("@telegraph/combobox"),E=require("@telegraph/layout"),g=require("../../utils.js"),M=require("./MsTeamsErrorMessage.js"),y=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},t=y(l),S=({teamId:a,msTeamsChannelsRecipientObject:b,queryOptions:h})=>{const{connectionStatus:s}=i.useKnockMsTeamsClient(),{data:m=[]}=i.useMsTeamsChannels({teamId:a,queryOptions:h}),C=l.useMemo(()=>g.sortByDisplayName(m),[m]),{data:n,updateConnectedChannels:_,error:c}=i.useConnectedMsTeamsChannels({msTeamsChannelsRecipientObject:b}),f=l.useMemo(()=>s==="disconnected"||s==="error"||!!c,[s,c]),p=l.useMemo(()=>s==="connecting"||s==="disconnecting",[s]),d=l.useCallback(e=>m.some(u=>u.id===e),[m]),T=l.useMemo(()=>n==null?void 0:n.filter(e=>e.ms_teams_channel_id&&d(e.ms_teams_channel_id)).map(e=>e.ms_teams_channel_id),[n,d]);return t.default.createElement(t.default.Fragment,null,t.default.createElement(E.Box,{w:"full",minW:"0"},t.default.createElement(o.Combobox.Root,{value:T,onValueChange:e=>{const u=e.map(r=>({ms_teams_team_id:a,ms_teams_channel_id:r})),x=[...(n==null?void 0:n.filter(r=>!r.ms_teams_channel_id||!d(r.ms_teams_channel_id)))??[],...u];_(x).catch(console.error)},placeholder:"Select channels",disabled:a===void 0||f||p||m.length===0,closeOnSelect:!1,layout:"wrap",modal:!1},t.default.createElement(o.Combobox.Trigger,null),t.default.createElement(o.Combobox.Content,null,t.default.createElement(o.Combobox.Search,{className:"rtk-combobox__search"}),t.default.createElement(o.Combobox.Options,{maxHeight:"36"},C.map(e=>t.default.createElement(o.Combobox.Option,{key:e.id,value:e.id},e.displayName))),t.default.createElement(o.Combobox.Empty,null)))),!!c&&t.default.createElement(M,{message:c}))};exports.MsTeamsChannelInTeamCombobox=S;
|
2
2
|
//# sourceMappingURL=MsTeamsChannelInTeamCombobox.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MsTeamsChannelInTeamCombobox.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelInTeamCombobox.tsx"],"sourcesContent":["import { MsTeamsChannelConnection } from \"@knocklabs/client\";\nimport {\n MsTeamsChannelQueryOptions,\n RecipientObject,\n useConnectedMsTeamsChannels,\n useKnockMsTeamsClient,\n useMsTeamsChannels,\n} from \"@knocklabs/react-core\";\nimport { Combobox } from \"@telegraph/combobox\";\nimport { Box } from \"@telegraph/layout\";\nimport { FunctionComponent, useCallback, useMemo } from \"react\";\n\nimport { sortByDisplayName } from \"../../utils\";\n\nimport MsTeamsErrorMessage from \"./MsTeamsErrorMessage\";\n\ninterface MsTeamsChannelInTeamComboboxProps {\n teamId?: string;\n msTeamsChannelsRecipientObject: RecipientObject;\n queryOptions?: MsTeamsChannelQueryOptions;\n}\n\nexport const MsTeamsChannelInTeamCombobox: FunctionComponent<\n MsTeamsChannelInTeamComboboxProps\n> = ({ teamId, msTeamsChannelsRecipientObject, queryOptions }) => {\n const { connectionStatus } = useKnockMsTeamsClient();\n\n const { data: availableChannels = [] } = useMsTeamsChannels({\n teamId,\n queryOptions,\n });\n\n const sortedChannels = useMemo(\n () => sortByDisplayName(availableChannels),\n [availableChannels],\n );\n\n const {\n data: currentConnections,\n updateConnectedChannels,\n error: connectedChannelsError,\n } = useConnectedMsTeamsChannels({ msTeamsChannelsRecipientObject });\n\n const inErrorState = useMemo(\n () =>\n connectionStatus === \"disconnected\" ||\n connectionStatus === \"error\" ||\n !!connectedChannelsError,\n [connectionStatus, connectedChannelsError],\n );\n\n const inLoadingState = useMemo(\n () =>\n connectionStatus === \"connecting\" || connectionStatus === \"disconnecting\",\n [connectionStatus],\n );\n\n const isChannelInThisTeam = useCallback(\n (channelId: string) =>\n availableChannels.some((channel) => channel.id === channelId),\n [availableChannels],\n );\n\n const comboboxValue = useMemo(\n () =>\n currentConnections\n ?.filter(\n (connection) =>\n connection.ms_teams_channel_id &&\n isChannelInThisTeam(connection.ms_teams_channel_id),\n )\n .map((connection) => connection.ms_teams_channel_id),\n [currentConnections, isChannelInThisTeam],\n );\n\n return (\n <>\n <Box w=\"full\" minW=\"0\">\n <Combobox.Root\n value={comboboxValue}\n onValueChange={(channelIds) => {\n const connectedChannelsInThisTeam =\n channelIds.map<MsTeamsChannelConnection>((channelId) => ({\n ms_teams_team_id: teamId,\n ms_teams_channel_id: channelId,\n }));\n const connectedChannelsInOtherTeams =\n currentConnections?.filter(\n (connection) =>\n !connection.ms_teams_channel_id ||\n !isChannelInThisTeam(connection.ms_teams_channel_id),\n ) ?? [];\n\n const updatedConnections = [\n ...connectedChannelsInOtherTeams,\n ...connectedChannelsInThisTeam,\n ];\n\n updateConnectedChannels(updatedConnections).catch(console.error);\n }}\n placeholder=\"Select channels\"\n disabled={\n teamId === undefined ||\n inErrorState ||\n inLoadingState ||\n availableChannels.length === 0\n }\n closeOnSelect={false}\n layout=\"wrap\"\n >\n <Combobox.Trigger />\n <Combobox.Content>\n <Combobox.Search className=\"rtk-combobox__search\" />\n <Combobox.Options maxHeight=\"36\">\n {sortedChannels.map((channel) => (\n <Combobox.Option key={channel.id} value={channel.id}>\n {channel.displayName}\n </Combobox.Option>\n ))}\n </Combobox.Options>\n <Combobox.Empty />\n </Combobox.Content>\n </Combobox.Root>\n </Box>\n {!!connectedChannelsError && (\n <MsTeamsErrorMessage message={connectedChannelsError} />\n )}\n </>\n );\n};\n"],"names":["MsTeamsChannelInTeamCombobox","teamId","msTeamsChannelsRecipientObject","queryOptions","connectionStatus","useKnockMsTeamsClient","data","availableChannels","useMsTeamsChannels","sortedChannels","useMemo","sortByDisplayName","currentConnections","updateConnectedChannels","error","connectedChannelsError","useConnectedMsTeamsChannels","inErrorState","inLoadingState","isChannelInThisTeam","useCallback","channelId","some","channel","id","comboboxValue","filter","connection","ms_teams_channel_id","map","React","Box","Combobox","channelIds","connectedChannelsInThisTeam","ms_teams_team_id","updatedConnections","catch","console","undefined","length","displayName","MsTeamsErrorMessage"],"mappings":"6UAsBaA,EAETA,CAAC,CAAEC,OAAAA,EAAQC,+BAAAA,EAAgCC,aAAAA,CAAa,IAAM,CAC1D,KAAA,CAAEC,iBAAAA,GAAqBC,
|
1
|
+
{"version":3,"file":"MsTeamsChannelInTeamCombobox.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsChannelInTeamCombobox.tsx"],"sourcesContent":["import { MsTeamsChannelConnection } from \"@knocklabs/client\";\nimport {\n MsTeamsChannelQueryOptions,\n RecipientObject,\n useConnectedMsTeamsChannels,\n useKnockMsTeamsClient,\n useMsTeamsChannels,\n} from \"@knocklabs/react-core\";\nimport { Combobox } from \"@telegraph/combobox\";\nimport { Box } from \"@telegraph/layout\";\nimport { FunctionComponent, useCallback, useMemo } from \"react\";\n\nimport { sortByDisplayName } from \"../../utils\";\n\nimport MsTeamsErrorMessage from \"./MsTeamsErrorMessage\";\n\ninterface MsTeamsChannelInTeamComboboxProps {\n teamId?: string;\n msTeamsChannelsRecipientObject: RecipientObject;\n queryOptions?: MsTeamsChannelQueryOptions;\n}\n\nexport const MsTeamsChannelInTeamCombobox: FunctionComponent<\n MsTeamsChannelInTeamComboboxProps\n> = ({ teamId, msTeamsChannelsRecipientObject, queryOptions }) => {\n const { connectionStatus } = useKnockMsTeamsClient();\n\n const { data: availableChannels = [] } = useMsTeamsChannels({\n teamId,\n queryOptions,\n });\n\n const sortedChannels = useMemo(\n () => sortByDisplayName(availableChannels),\n [availableChannels],\n );\n\n const {\n data: currentConnections,\n updateConnectedChannels,\n error: connectedChannelsError,\n } = useConnectedMsTeamsChannels({ msTeamsChannelsRecipientObject });\n\n const inErrorState = useMemo(\n () =>\n connectionStatus === \"disconnected\" ||\n connectionStatus === \"error\" ||\n !!connectedChannelsError,\n [connectionStatus, connectedChannelsError],\n );\n\n const inLoadingState = useMemo(\n () =>\n connectionStatus === \"connecting\" || connectionStatus === \"disconnecting\",\n [connectionStatus],\n );\n\n const isChannelInThisTeam = useCallback(\n (channelId: string) =>\n availableChannels.some((channel) => channel.id === channelId),\n [availableChannels],\n );\n\n const comboboxValue = useMemo(\n () =>\n currentConnections\n ?.filter(\n (connection) =>\n connection.ms_teams_channel_id &&\n isChannelInThisTeam(connection.ms_teams_channel_id),\n )\n .map((connection) => connection.ms_teams_channel_id),\n [currentConnections, isChannelInThisTeam],\n );\n\n return (\n <>\n <Box w=\"full\" minW=\"0\">\n <Combobox.Root\n value={comboboxValue}\n onValueChange={(channelIds) => {\n const connectedChannelsInThisTeam =\n channelIds.map<MsTeamsChannelConnection>((channelId) => ({\n ms_teams_team_id: teamId,\n ms_teams_channel_id: channelId,\n }));\n const connectedChannelsInOtherTeams =\n currentConnections?.filter(\n (connection) =>\n !connection.ms_teams_channel_id ||\n !isChannelInThisTeam(connection.ms_teams_channel_id),\n ) ?? [];\n\n const updatedConnections = [\n ...connectedChannelsInOtherTeams,\n ...connectedChannelsInThisTeam,\n ];\n\n updateConnectedChannels(updatedConnections).catch(console.error);\n }}\n placeholder=\"Select channels\"\n disabled={\n teamId === undefined ||\n inErrorState ||\n inLoadingState ||\n availableChannels.length === 0\n }\n closeOnSelect={false}\n layout=\"wrap\"\n modal={\n // Modal comboboxes cause page layout to shift when body has padding. See KNO-7854.\n false\n }\n >\n <Combobox.Trigger />\n <Combobox.Content>\n <Combobox.Search className=\"rtk-combobox__search\" />\n <Combobox.Options maxHeight=\"36\">\n {sortedChannels.map((channel) => (\n <Combobox.Option key={channel.id} value={channel.id}>\n {channel.displayName}\n </Combobox.Option>\n ))}\n </Combobox.Options>\n <Combobox.Empty />\n </Combobox.Content>\n </Combobox.Root>\n </Box>\n {!!connectedChannelsError && (\n <MsTeamsErrorMessage message={connectedChannelsError} />\n )}\n </>\n );\n};\n"],"names":["MsTeamsChannelInTeamCombobox","teamId","msTeamsChannelsRecipientObject","queryOptions","connectionStatus","useKnockMsTeamsClient","data","availableChannels","useMsTeamsChannels","sortedChannels","useMemo","sortByDisplayName","currentConnections","updateConnectedChannels","error","connectedChannelsError","useConnectedMsTeamsChannels","inErrorState","inLoadingState","isChannelInThisTeam","useCallback","channelId","some","channel","id","comboboxValue","filter","connection","ms_teams_channel_id","map","React","Box","Combobox","channelIds","connectedChannelsInThisTeam","ms_teams_team_id","updatedConnections","catch","console","undefined","length","displayName","MsTeamsErrorMessage"],"mappings":"6UAsBaA,EAETA,CAAC,CAAEC,OAAAA,EAAQC,+BAAAA,EAAgCC,aAAAA,CAAa,IAAM,CAC1D,KAAA,CAAEC,iBAAAA,GAAqBC,wBAAsB,EAE7C,CAAEC,KAAMC,EAAoB,CAAA,GAAOC,qBAAmB,CAC1DP,OAAAA,EACAE,aAAAA,CAAAA,CACD,EAEKM,EAAiBC,EAAAA,QACrB,IAAMC,EAAAA,kBAAkBJ,CAAiB,EACzC,CAACA,CAAiB,CACpB,EAEM,CACJD,KAAMM,EACNC,wBAAAA,EACAC,MAAOC,GACLC,8BAA4B,CAAEd,+BAAAA,CAAAA,CAAgC,EAE5De,EAAeP,EAAAA,QACnB,IACEN,IAAqB,gBACrBA,IAAqB,SACrB,CAAC,CAACW,EACJ,CAACX,EAAkBW,CAAsB,CAC3C,EAEMG,EAAiBR,UACrB,IACEN,IAAqB,cAAgBA,IAAqB,gBAC5D,CAACA,CAAgB,CACnB,EAEMe,EAAsBC,EAAAA,YACzBC,GACCd,EAAkBe,KAAkBC,GAAAA,EAAQC,KAAOH,CAAS,EAC9D,CAACd,CAAiB,CACpB,EAEMkB,EAAgBf,UACpB,IACEE,GAAAA,YAAAA,EACIc,OAEEC,GAAAA,EAAWC,qBACXT,EAAoBQ,EAAWC,mBAAmB,GAErDC,IAAoBF,GAAAA,EAAWC,qBACpC,CAAChB,EAAoBO,CAAmB,CAC1C,EAEA,OAEIW,UAAA,cAAAA,EAAA,QAAA,SAAA,KAAAA,EAAA,QAAA,cAACC,EAAAA,IAAI,CAAA,EAAE,OAAO,KAAK,KAChBD,EAAAA,QAAA,cAAAE,WAAS,KAAT,CACC,MAAOP,EACP,cAA+BQ,GAAA,CACvBC,MAAAA,EACJD,EAAWJ,IAA8CR,IAAA,CACvDc,iBAAkBlC,EAClB2B,oBAAqBP,CAAAA,EACrB,EAQEe,EAAqB,CACzB,IAPAxB,GAAAA,YAAAA,EAAoBc,OACjBC,GACC,CAACA,EAAWC,qBACZ,CAACT,EAAoBQ,EAAWC,mBAAmB,KAClD,CAAE,EAIP,GAAGM,CAA2B,EAGhCrB,EAAwBuB,CAAkB,EAAEC,MAAMC,QAAQxB,KAAK,CAAA,EAEjE,YAAY,kBACZ,SACEb,IAAWsC,QACXtB,GACAC,GACAX,EAAkBiC,SAAW,EAE/B,cAAe,GACf,OAAO,OACP,MAEE,EAGF,EAAAV,EAAAA,QAAA,cAACE,EAAAA,SAAS,QAAT,IAAgB,0BAChBA,EAAAA,SAAS,QAAT,KACCF,EAAAA,QAAA,cAACE,EAAAA,SAAS,OAAT,CAAgB,UAAU,sBAAsB,CAAA,EACjDF,EAAAA,QAAA,cAACE,EAAAA,SAAS,QAAT,CAAiB,UAAU,IACzBvB,EAAAA,EAAeoB,IAAKN,GAClBO,UAAA,cAAAE,EAAAA,SAAS,OAAT,CAAgB,IAAKT,EAAQC,GAAI,MAAOD,EAAQC,EAC9CD,EAAAA,EAAQkB,WACX,CACD,CACH,EACCX,EAAAA,QAAA,cAAAE,EAAA,SAAS,MAAT,IAAc,CACjB,CACF,CACF,EACC,CAAC,CAACjB,GACAe,EAAA,QAAA,cAAAY,EAAA,CAAoB,QAAS3B,CAC/B,CAAA,CACH,CAEJ"}
|
package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsConnectionError.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MsTeamsConnectionError.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsConnectionError.tsx"],"sourcesContent":["import { useKnockMsTeamsClient, useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport MsTeamsErrorMessage from \"./MsTeamsErrorMessage\";\n\nconst MsTeamsConnectionError: FunctionComponent = () => {\n const { t } = useTranslations();\n const { connectionStatus } = useKnockMsTeamsClient();\n\n if (connectionStatus === \"disconnected\" || connectionStatus === \"error\") {\n return (\n <MsTeamsErrorMessage\n message={\n connectionStatus === \"disconnected\"\n ? t(\"msTeamsConnectionErrorOccurred\")\n : t(\"msTeamsConnectionErrorExists\")\n }\n />\n );\n }\n\n return null;\n};\n\nexport default MsTeamsConnectionError;\n"],"names":["MsTeamsConnectionError","t","useTranslations","connectionStatus","useKnockMsTeamsClient","React","MsTeamsErrorMessage"],"mappings":"8KAKMA,EAA4CA,IAAM,CAChD,KAAA,CAAEC,EAAAA,GAAMC,
|
1
|
+
{"version":3,"file":"MsTeamsConnectionError.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsConnectionError.tsx"],"sourcesContent":["import { useKnockMsTeamsClient, useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport MsTeamsErrorMessage from \"./MsTeamsErrorMessage\";\n\nconst MsTeamsConnectionError: FunctionComponent = () => {\n const { t } = useTranslations();\n const { connectionStatus } = useKnockMsTeamsClient();\n\n if (connectionStatus === \"disconnected\" || connectionStatus === \"error\") {\n return (\n <MsTeamsErrorMessage\n message={\n connectionStatus === \"disconnected\"\n ? t(\"msTeamsConnectionErrorOccurred\")\n : t(\"msTeamsConnectionErrorExists\")\n }\n />\n );\n }\n\n return null;\n};\n\nexport default MsTeamsConnectionError;\n"],"names":["MsTeamsConnectionError","t","useTranslations","connectionStatus","useKnockMsTeamsClient","React","MsTeamsErrorMessage"],"mappings":"8KAKMA,EAA4CA,IAAM,CAChD,KAAA,CAAEC,EAAAA,GAAMC,kBAAgB,EACxB,CAAEC,iBAAAA,GAAqBC,wBAAsB,EAE/CD,OAAAA,IAAqB,gBAAkBA,IAAqB,QAE5DE,EAAA,QAAA,cAACC,EACC,CAAA,QAEML,EADJE,IAAqB,eACf,iCACA,8BADgC,CAGxC,CAAA,EAIC,IACT"}
|
package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsErrorMessage.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MsTeamsErrorMessage.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsErrorMessage.tsx"],"sourcesContent":["import { Icon, Lucide } from \"@telegraph/icon\";\nimport { Text } from \"@telegraph/typography\";\nimport { FunctionComponent } from \"react\";\n\ninterface Props {\n message?: string;\n}\n\nconst MsTeamsErrorMessage: FunctionComponent<Props> = ({ message }) => {\n return (\n <div className=\"rtk-combobox__error\">\n <span>\n <Icon icon={Lucide.Info} color=\"black\" size=\"1\" aria-hidden />\n </span>\n <Text as=\"div\" color=\"black\" size=\"1\">\n {message}\n </Text>\n </div>\n );\n};\n\nexport default MsTeamsErrorMessage;\n"],"names":["MsTeamsErrorMessage","message","React","Icon","Lucide","Info","Text"],"mappings":"qKAQMA,EAAgDA,CAAC,CAAEC,QAAAA,CAAQ,IAE5DC,EAAAA,QAAA,cAAA,MAAA,CAAI,UAAU,qBAAA,EACZA,
|
1
|
+
{"version":3,"file":"MsTeamsErrorMessage.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsErrorMessage.tsx"],"sourcesContent":["import { Icon, Lucide } from \"@telegraph/icon\";\nimport { Text } from \"@telegraph/typography\";\nimport { FunctionComponent } from \"react\";\n\ninterface Props {\n message?: string;\n}\n\nconst MsTeamsErrorMessage: FunctionComponent<Props> = ({ message }) => {\n return (\n <div className=\"rtk-combobox__error\">\n <span>\n <Icon icon={Lucide.Info} color=\"black\" size=\"1\" aria-hidden />\n </span>\n <Text as=\"div\" color=\"black\" size=\"1\">\n {message}\n </Text>\n </div>\n );\n};\n\nexport default MsTeamsErrorMessage;\n"],"names":["MsTeamsErrorMessage","message","React","Icon","Lucide","Info","Text"],"mappings":"qKAQMA,EAAgDA,CAAC,CAAEC,QAAAA,CAAQ,IAE5DC,EAAAA,QAAA,cAAA,MAAA,CAAI,UAAU,qBAAA,EACZA,UAAA,cAAA,OAAA,KACEA,EAAAA,QAAA,cAAAC,EAAA,KAAA,CAAK,KAAMC,EAAAA,OAAOC,KAAM,MAAM,QAAQ,KAAK,IAAI,cAAW,EAAA,CAAA,CAC7D,EACAH,EAAA,QAAA,cAACI,EAAAA,KAAK,CAAA,GAAG,MAAM,MAAM,QAAQ,KAAK,GAC/BL,EAAAA,CACH,CACF"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),u=require("@knocklabs/react-core"),n=require("@telegraph/combobox"),g=require("@telegraph/layout"),p=require("../../utils.js"),T=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=T(l),y=({team:e,onTeamChange:m,getChannelCount:d,queryOptions:b})=>{const{connectionStatus:a}=u.useKnockMsTeamsClient(),{data:r,isLoading:i}=u.useMsTeamsTeams({queryOptions:b}),c=l.useMemo(()=>p.sortByDisplayName(r),[r]),f=l.useMemo(()=>a==="disconnected"||a==="error",[a]),C=l.useMemo(()=>a==="connecting"||a==="disconnecting"||i,[a,i]);return o.default.createElement(g.Box,{w:"full",minW:"0"},o.default.createElement(n.Combobox.Root,{value:e==null?void 0:e.id,onValueChange:t=>{const s=c.find(x=>x.id===t);s&&m(s)},placeholder:"Select team",disabled:f||C||c.length===0},o.default.createElement(n.Combobox.Trigger,null),o.default.createElement(n.Combobox.Content,null,o.default.createElement(n.Combobox.Search,{className:"rtk-combobox__search"}),o.default.createElement(n.Combobox.Options,{maxHeight:"36"},c.map(t=>{const s=d(t.id);return o.default.createElement(n.Combobox.Option,{key:t.id,value:t.id},s>0?`${t.displayName} (${s})`:t.displayName)})),o.default.createElement(n.Combobox.Empty,null))))};exports.MsTeamsTeamCombobox=y;
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),u=require("@knocklabs/react-core"),n=require("@telegraph/combobox"),g=require("@telegraph/layout"),p=require("../../utils.js"),T=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=T(l),y=({team:e,onTeamChange:m,getChannelCount:d,queryOptions:b})=>{const{connectionStatus:a}=u.useKnockMsTeamsClient(),{data:r,isLoading:i}=u.useMsTeamsTeams({queryOptions:b}),c=l.useMemo(()=>p.sortByDisplayName(r),[r]),f=l.useMemo(()=>a==="disconnected"||a==="error",[a]),C=l.useMemo(()=>a==="connecting"||a==="disconnecting"||i,[a,i]);return o.default.createElement(g.Box,{w:"full",minW:"0"},o.default.createElement(n.Combobox.Root,{value:e==null?void 0:e.id,onValueChange:t=>{const s=c.find(x=>x.id===t);s&&m(s)},placeholder:"Select team",disabled:f||C||c.length===0,modal:!1},o.default.createElement(n.Combobox.Trigger,null),o.default.createElement(n.Combobox.Content,null,o.default.createElement(n.Combobox.Search,{className:"rtk-combobox__search"}),o.default.createElement(n.Combobox.Options,{maxHeight:"36"},c.map(t=>{const s=d(t.id);return o.default.createElement(n.Combobox.Option,{key:t.id,value:t.id},s>0?`${t.displayName} (${s})`:t.displayName)})),o.default.createElement(n.Combobox.Empty,null))))};exports.MsTeamsTeamCombobox=y;
|
2
2
|
//# sourceMappingURL=MsTeamsTeamCombobox.js.map
|
package/dist/cjs/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsTeamCombobox.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MsTeamsTeamCombobox.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsTeamCombobox.tsx"],"sourcesContent":["import { MsTeamsTeam } from \"@knocklabs/client\";\nimport {\n MsTeamsTeamQueryOptions,\n useKnockMsTeamsClient,\n useMsTeamsTeams,\n} from \"@knocklabs/react-core\";\nimport { Combobox } from \"@telegraph/combobox\";\nimport { Box } from \"@telegraph/layout\";\nimport { FunctionComponent, useMemo } from \"react\";\n\nimport { sortByDisplayName } from \"../../utils\";\n\ninterface MsTeamsTeamComboboxProps {\n team: MsTeamsTeam | null;\n onTeamChange: (team: MsTeamsTeam) => void;\n getChannelCount: (teamId: string) => number;\n queryOptions?: MsTeamsTeamQueryOptions;\n}\n\nexport const MsTeamsTeamCombobox: FunctionComponent<\n MsTeamsTeamComboboxProps\n> = ({ team, onTeamChange, getChannelCount, queryOptions }) => {\n const { connectionStatus } = useKnockMsTeamsClient();\n\n const { data: teams, isLoading: isLoadingTeams } = useMsTeamsTeams({\n queryOptions,\n });\n\n const sortedTeams = useMemo(() => sortByDisplayName(teams), [teams]);\n\n const inErrorState = useMemo(\n () => connectionStatus === \"disconnected\" || connectionStatus === \"error\",\n [connectionStatus],\n );\n\n const inLoadingState = useMemo(\n () =>\n connectionStatus === \"connecting\" ||\n connectionStatus === \"disconnecting\" ||\n isLoadingTeams,\n [connectionStatus, isLoadingTeams],\n );\n\n return (\n <Box w=\"full\" minW=\"0\">\n <Combobox.Root\n value={team?.id}\n onValueChange={(teamId) => {\n const selectedTeam = sortedTeams.find((team) => team.id === teamId);\n if (selectedTeam) {\n onTeamChange(selectedTeam);\n }\n }}\n placeholder=\"Select team\"\n disabled={inErrorState || inLoadingState || sortedTeams.length === 0}\n >\n <Combobox.Trigger />\n <Combobox.Content>\n <Combobox.Search className=\"rtk-combobox__search\" />\n <Combobox.Options maxHeight=\"36\">\n {sortedTeams.map((team) => {\n const channelCount = getChannelCount(team.id);\n return (\n <Combobox.Option key={team.id} value={team.id}>\n {channelCount > 0\n ? `${team.displayName} (${channelCount})`\n : team.displayName}\n </Combobox.Option>\n );\n })}\n </Combobox.Options>\n <Combobox.Empty />\n </Combobox.Content>\n </Combobox.Root>\n </Box>\n );\n};\n"],"names":["MsTeamsTeamCombobox","team","onTeamChange","getChannelCount","queryOptions","connectionStatus","useKnockMsTeamsClient","data","teams","isLoading","isLoadingTeams","useMsTeamsTeams","sortedTeams","useMemo","sortByDisplayName","inErrorState","inLoadingState","React","Box","Combobox","id","teamId","selectedTeam","find","length","map","channelCount","displayName"],"mappings":"uSAmBaA,EAETA,CAAC,CAAEC,KAAAA,EAAMC,aAAAA,EAAcC,gBAAAA,EAAiBC,aAAAA,CAAa,IAAM,CACvD,KAAA,CAAEC,iBAAAA,GAAqBC,
|
1
|
+
{"version":3,"file":"MsTeamsTeamCombobox.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsChannelCombobox/MsTeamsTeamCombobox.tsx"],"sourcesContent":["import { MsTeamsTeam } from \"@knocklabs/client\";\nimport {\n MsTeamsTeamQueryOptions,\n useKnockMsTeamsClient,\n useMsTeamsTeams,\n} from \"@knocklabs/react-core\";\nimport { Combobox } from \"@telegraph/combobox\";\nimport { Box } from \"@telegraph/layout\";\nimport { FunctionComponent, useMemo } from \"react\";\n\nimport { sortByDisplayName } from \"../../utils\";\n\ninterface MsTeamsTeamComboboxProps {\n team: MsTeamsTeam | null;\n onTeamChange: (team: MsTeamsTeam) => void;\n getChannelCount: (teamId: string) => number;\n queryOptions?: MsTeamsTeamQueryOptions;\n}\n\nexport const MsTeamsTeamCombobox: FunctionComponent<\n MsTeamsTeamComboboxProps\n> = ({ team, onTeamChange, getChannelCount, queryOptions }) => {\n const { connectionStatus } = useKnockMsTeamsClient();\n\n const { data: teams, isLoading: isLoadingTeams } = useMsTeamsTeams({\n queryOptions,\n });\n\n const sortedTeams = useMemo(() => sortByDisplayName(teams), [teams]);\n\n const inErrorState = useMemo(\n () => connectionStatus === \"disconnected\" || connectionStatus === \"error\",\n [connectionStatus],\n );\n\n const inLoadingState = useMemo(\n () =>\n connectionStatus === \"connecting\" ||\n connectionStatus === \"disconnecting\" ||\n isLoadingTeams,\n [connectionStatus, isLoadingTeams],\n );\n\n return (\n <Box w=\"full\" minW=\"0\">\n <Combobox.Root\n value={team?.id}\n onValueChange={(teamId) => {\n const selectedTeam = sortedTeams.find((team) => team.id === teamId);\n if (selectedTeam) {\n onTeamChange(selectedTeam);\n }\n }}\n placeholder=\"Select team\"\n disabled={inErrorState || inLoadingState || sortedTeams.length === 0}\n modal={\n // Modal comboboxes cause page layout to shift when body has padding. See KNO-7854.\n false\n }\n >\n <Combobox.Trigger />\n <Combobox.Content>\n <Combobox.Search className=\"rtk-combobox__search\" />\n <Combobox.Options maxHeight=\"36\">\n {sortedTeams.map((team) => {\n const channelCount = getChannelCount(team.id);\n return (\n <Combobox.Option key={team.id} value={team.id}>\n {channelCount > 0\n ? `${team.displayName} (${channelCount})`\n : team.displayName}\n </Combobox.Option>\n );\n })}\n </Combobox.Options>\n <Combobox.Empty />\n </Combobox.Content>\n </Combobox.Root>\n </Box>\n );\n};\n"],"names":["MsTeamsTeamCombobox","team","onTeamChange","getChannelCount","queryOptions","connectionStatus","useKnockMsTeamsClient","data","teams","isLoading","isLoadingTeams","useMsTeamsTeams","sortedTeams","useMemo","sortByDisplayName","inErrorState","inLoadingState","React","Box","Combobox","id","teamId","selectedTeam","find","length","map","channelCount","displayName"],"mappings":"uSAmBaA,EAETA,CAAC,CAAEC,KAAAA,EAAMC,aAAAA,EAAcC,gBAAAA,EAAiBC,aAAAA,CAAa,IAAM,CACvD,KAAA,CAAEC,iBAAAA,GAAqBC,wBAAsB,EAE7C,CAAEC,KAAMC,EAAOC,UAAWC,GAAmBC,kBAAgB,CACjEP,aAAAA,CAAAA,CACD,EAEKQ,EAAcC,EAAAA,QAAQ,IAAMC,EAAAA,kBAAkBN,CAAK,EAAG,CAACA,CAAK,CAAC,EAE7DO,EAAeF,UACnB,IAAMR,IAAqB,gBAAkBA,IAAqB,QAClE,CAACA,CAAgB,CACnB,EAEMW,EAAiBH,EAAAA,QACrB,IACER,IAAqB,cACrBA,IAAqB,iBACrBK,EACF,CAACL,EAAkBK,CAAc,CACnC,EAEA,OACGO,EAAA,QAAA,cAAAC,MAAA,CAAI,EAAE,OAAO,KAAK,KACjBD,EAAAA,QAAA,cAACE,EAAS,SAAA,KAAT,CACC,MAAOlB,GAAAA,YAAAA,EAAMmB,GACb,cAA2BC,GAAA,CACzB,MAAMC,EAAeV,EAAYW,KAAMtB,GAASA,EAAKmB,KAAOC,CAAM,EAC9DC,GACFpB,EAAaoB,CAAY,CAC3B,EAEF,YAAY,cACZ,SAAUP,GAAgBC,GAAkBJ,EAAYY,SAAW,EACnE,MAEE,EAGF,EAAAP,EAAAA,QAAA,cAACE,EAAAA,SAAS,QAAT,IAAgB,0BAChBA,EAAS,SAAA,QAAT,KACCF,EAAA,QAAA,cAACE,EAAS,SAAA,OAAT,CAAgB,UAAU,sBAAA,CAAsB,EACjDF,EAAA,QAAA,cAACE,EAAS,SAAA,QAAT,CAAiB,UAAU,IACzBP,EAAAA,EAAYa,IAAKxB,GAAS,CACnByB,MAAAA,EAAevB,EAAgBF,EAAKmB,EAAE,EAC5C,+BACGD,EAAAA,SAAS,OAAT,CAAgB,IAAKlB,EAAKmB,GAAI,MAAOnB,EAAKmB,IACxCM,EAAe,EACZ,GAAGzB,EAAK0B,WAAW,KAAKD,CAAY,IACpCzB,EAAK0B,WACX,CAAA,CAEH,CACH,EACAV,EAAAA,QAAA,cAACE,WAAS,MAAT,IAAc,CACjB,CACF,CACF,CAEJ"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MsTeamsIcon.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsIcon/MsTeamsIcon.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\nexport interface MsTeamsIconProps {\n height: string;\n width: string;\n}\n\nexport const MsTeamsIcon: FunctionComponent<MsTeamsIconProps> = ({\n height,\n width,\n}) => {\n return (\n // Source: https://commons.wikimedia.org/wiki/File:Microsoft_Office_Teams_(2018%E2%80%93present).svg\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n style={{ height, width }}\n viewBox=\"0 0 2228.833 2073.333\"\n >\n <path\n fill=\"#5059C9\"\n d=\"M1554.637,777.5h575.713c54.391,0,98.483,44.092,98.483,98.483c0,0,0,0,0,0v524.398 c0,199.901-162.051,361.952-361.952,361.952h0h-1.711c-199.901,0.028-361.975-162-362.004-361.901c0-0.017,0-0.034,0-0.052V828.971 C1503.167,800.544,1526.211,777.5,1554.637,777.5L1554.637,777.5z\"\n />\n <circle fill=\"#5059C9\" cx=\"1943.75\" cy=\"440.583\" r=\"233.25\" />\n <circle fill=\"#7B83EB\" cx=\"1218.083\" cy=\"336.917\" r=\"336.917\" />\n <path\n fill=\"#7B83EB\"\n d=\"M1667.323,777.5H717.01c-53.743,1.33-96.257,45.931-95.01,99.676v598.105 c-7.505,322.519,247.657,590.16,570.167,598.053c322.51-7.893,577.671-275.534,570.167-598.053V877.176 C1763.579,823.431,1721.066,778.83,1667.323,777.5z\"\n />\n <path\n opacity=\".1\"\n d=\"M1244,777.5v838.145c-0.258,38.435-23.549,72.964-59.09,87.598 c-11.316,4.787-23.478,7.254-35.765,7.257H667.613c-6.738-17.105-12.958-34.21-18.142-51.833 c-18.144-59.477-27.402-121.307-27.472-183.49V877.02c-1.246-53.659,41.198-98.19,94.855-99.52H1244z\"\n />\n <path\n opacity=\".2\"\n d=\"M1192.167,777.5v889.978c-0.002,12.287-2.47,24.449-7.257,35.765 c-14.634,35.541-49.163,58.833-87.598,59.09H691.975c-8.812-17.105-17.105-34.21-24.362-51.833 c-7.257-17.623-12.958-34.21-18.142-51.833c-18.144-59.476-27.402-121.307-27.472-183.49V877.02 c-1.246-53.659,41.198-98.19,94.855-99.52H1192.167z\"\n />\n <path\n opacity=\".2\"\n d=\"M1192.167,777.5v786.312c-0.395,52.223-42.632,94.46-94.855,94.855h-447.84 c-18.144-59.476-27.402-121.307-27.472-183.49V877.02c-1.246-53.659,41.198-98.19,94.855-99.52H1192.167z\"\n />\n <path\n opacity=\".2\"\n d=\"M1140.333,777.5v786.312c-0.395,52.223-42.632,94.46-94.855,94.855H649.472 c-18.144-59.476-27.402-121.307-27.472-183.49V877.02c-1.246-53.659,41.198-98.19,94.855-99.52H1140.333z\"\n />\n <path\n opacity=\".1\"\n d=\"M1244,509.522v163.275c-8.812,0.518-17.105,1.037-25.917,1.037 c-8.812,0-17.105-0.518-25.917-1.037c-17.496-1.161-34.848-3.937-51.833-8.293c-104.963-24.857-191.679-98.469-233.25-198.003 c-7.153-16.715-12.706-34.071-16.587-51.833h258.648C1201.449,414.866,1243.801,457.217,1244,509.522z\"\n />\n <path\n opacity=\".2\"\n d=\"M1192.167,561.355v111.442c-17.496-1.161-34.848-3.937-51.833-8.293 c-104.963-24.857-191.679-98.469-233.25-198.003h190.228C1149.616,466.699,1191.968,509.051,1192.167,561.355z\"\n />\n <path\n opacity=\".2\"\n d=\"M1192.167,561.355v111.442c-17.496-1.161-34.848-3.937-51.833-8.293 c-104.963-24.857-191.679-98.469-233.25-198.003h190.228C1149.616,466.699,1191.968,509.051,1192.167,561.355z\"\n />\n <path\n opacity=\".2\"\n d=\"M1140.333,561.355v103.148c-104.963-24.857-191.679-98.469-233.25-198.003 h138.395C1097.783,466.699,1140.134,509.051,1140.333,561.355z\"\n />\n <linearGradient\n id=\"a\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"198.099\"\n y1=\"1683.0726\"\n x2=\"942.2344\"\n y2=\"394.2607\"\n gradientTransform=\"matrix(1 0 0 -1 0 2075.3333)\"\n >\n <stop offset=\"0\" stopColor=\"#5a62c3\" />\n <stop offset=\".5\" stopColor=\"#4d55bd\" />\n <stop offset=\"1\" stopColor=\"#3940ab\" />\n </linearGradient>\n <path\n fill=\"url(#a)\"\n d=\"M95.01,466.5h950.312c52.473,0,95.01,42.538,95.01,95.01v950.312c0,52.473-42.538,95.01-95.01,95.01 H95.01c-52.473,0-95.01-42.538-95.01-95.01V561.51C0,509.038,42.538,466.5,95.01,466.5z\"\n />\n <path\n fill=\"#FFF\"\n d=\"M820.211,828.193H630.241v517.297H509.211V828.193H320.123V727.844h500.088V828.193z\"\n />\n </svg>\n );\n};\n"],"names":["MsTeamsIcon","height","width","React"],"mappings":"wKAOaA,EAAmDA,CAAC,CAC/DC,OAAAA,EACAC,MAAAA,CACF,IAGKC,EAAA,QAAA,cAAA,MAAA,CACC,MAAM,6BACN,MAAO,CAAEF,OAAAA,EAAQC,MAAAA,CAAAA,EACjB,QAAQ,uBAER,EAAAC,EAAA,QAAA,cAAC,QACC,KAAK,UACL,EAAE,iRAAA,CAAiR,EAErRA,EAAAA,QAAA,cAAC,SAAO,CAAA,KAAK,UAAU,GAAG,UAAU,GAAG,UAAU,EAAE,QAAA,CAAQ,EAC3DA,EAAAA,QAAA,cAAC,UAAO,KAAK,UAAU,GAAG,WAAW,GAAG,UAAU,EAAE,SAAS,CAAA,0BAC5D,OACC,CAAA,KAAK,UACL,EAAE,+NAA8N,EAEjOA,UAAA,cAAA,OAAA,CACC,QAAQ,KACR,EAAE,2PAA0P,0BAE7P,OACC,CAAA,QAAQ,KACR,EAAE,4SAA4S,CAAA,EAEhTA,EAAA,QAAA,cAAC,OACC,CAAA,QAAQ,KACR,EAAE,gLAAgL,CAAA,0BAEnL,OACC,CAAA,QAAQ,KACR,EAAE,iLAAgL,EAEpLA,EAAAA,QAAA,cAAC,OACC,CAAA,QAAQ,KACR,EAAE,2RAAA,CAA2R,EAE/RA,UAAA,cAAC,OACC,CAAA,QAAQ,KACR,EAAE
|
1
|
+
{"version":3,"file":"MsTeamsIcon.js","sources":["../../../../../../src/modules/ms-teams/components/MsTeamsIcon/MsTeamsIcon.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\nexport interface MsTeamsIconProps {\n height: string;\n width: string;\n}\n\nexport const MsTeamsIcon: FunctionComponent<MsTeamsIconProps> = ({\n height,\n width,\n}) => {\n return (\n // Source: https://commons.wikimedia.org/wiki/File:Microsoft_Office_Teams_(2018%E2%80%93present).svg\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n style={{ height, width }}\n viewBox=\"0 0 2228.833 2073.333\"\n >\n <path\n fill=\"#5059C9\"\n d=\"M1554.637,777.5h575.713c54.391,0,98.483,44.092,98.483,98.483c0,0,0,0,0,0v524.398 c0,199.901-162.051,361.952-361.952,361.952h0h-1.711c-199.901,0.028-361.975-162-362.004-361.901c0-0.017,0-0.034,0-0.052V828.971 C1503.167,800.544,1526.211,777.5,1554.637,777.5L1554.637,777.5z\"\n />\n <circle fill=\"#5059C9\" cx=\"1943.75\" cy=\"440.583\" r=\"233.25\" />\n <circle fill=\"#7B83EB\" cx=\"1218.083\" cy=\"336.917\" r=\"336.917\" />\n <path\n fill=\"#7B83EB\"\n d=\"M1667.323,777.5H717.01c-53.743,1.33-96.257,45.931-95.01,99.676v598.105 c-7.505,322.519,247.657,590.16,570.167,598.053c322.51-7.893,577.671-275.534,570.167-598.053V877.176 C1763.579,823.431,1721.066,778.83,1667.323,777.5z\"\n />\n <path\n opacity=\".1\"\n d=\"M1244,777.5v838.145c-0.258,38.435-23.549,72.964-59.09,87.598 c-11.316,4.787-23.478,7.254-35.765,7.257H667.613c-6.738-17.105-12.958-34.21-18.142-51.833 c-18.144-59.477-27.402-121.307-27.472-183.49V877.02c-1.246-53.659,41.198-98.19,94.855-99.52H1244z\"\n />\n <path\n opacity=\".2\"\n d=\"M1192.167,777.5v889.978c-0.002,12.287-2.47,24.449-7.257,35.765 c-14.634,35.541-49.163,58.833-87.598,59.09H691.975c-8.812-17.105-17.105-34.21-24.362-51.833 c-7.257-17.623-12.958-34.21-18.142-51.833c-18.144-59.476-27.402-121.307-27.472-183.49V877.02 c-1.246-53.659,41.198-98.19,94.855-99.52H1192.167z\"\n />\n <path\n opacity=\".2\"\n d=\"M1192.167,777.5v786.312c-0.395,52.223-42.632,94.46-94.855,94.855h-447.84 c-18.144-59.476-27.402-121.307-27.472-183.49V877.02c-1.246-53.659,41.198-98.19,94.855-99.52H1192.167z\"\n />\n <path\n opacity=\".2\"\n d=\"M1140.333,777.5v786.312c-0.395,52.223-42.632,94.46-94.855,94.855H649.472 c-18.144-59.476-27.402-121.307-27.472-183.49V877.02c-1.246-53.659,41.198-98.19,94.855-99.52H1140.333z\"\n />\n <path\n opacity=\".1\"\n d=\"M1244,509.522v163.275c-8.812,0.518-17.105,1.037-25.917,1.037 c-8.812,0-17.105-0.518-25.917-1.037c-17.496-1.161-34.848-3.937-51.833-8.293c-104.963-24.857-191.679-98.469-233.25-198.003 c-7.153-16.715-12.706-34.071-16.587-51.833h258.648C1201.449,414.866,1243.801,457.217,1244,509.522z\"\n />\n <path\n opacity=\".2\"\n d=\"M1192.167,561.355v111.442c-17.496-1.161-34.848-3.937-51.833-8.293 c-104.963-24.857-191.679-98.469-233.25-198.003h190.228C1149.616,466.699,1191.968,509.051,1192.167,561.355z\"\n />\n <path\n opacity=\".2\"\n d=\"M1192.167,561.355v111.442c-17.496-1.161-34.848-3.937-51.833-8.293 c-104.963-24.857-191.679-98.469-233.25-198.003h190.228C1149.616,466.699,1191.968,509.051,1192.167,561.355z\"\n />\n <path\n opacity=\".2\"\n d=\"M1140.333,561.355v103.148c-104.963-24.857-191.679-98.469-233.25-198.003 h138.395C1097.783,466.699,1140.134,509.051,1140.333,561.355z\"\n />\n <linearGradient\n id=\"a\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"198.099\"\n y1=\"1683.0726\"\n x2=\"942.2344\"\n y2=\"394.2607\"\n gradientTransform=\"matrix(1 0 0 -1 0 2075.3333)\"\n >\n <stop offset=\"0\" stopColor=\"#5a62c3\" />\n <stop offset=\".5\" stopColor=\"#4d55bd\" />\n <stop offset=\"1\" stopColor=\"#3940ab\" />\n </linearGradient>\n <path\n fill=\"url(#a)\"\n d=\"M95.01,466.5h950.312c52.473,0,95.01,42.538,95.01,95.01v950.312c0,52.473-42.538,95.01-95.01,95.01 H95.01c-52.473,0-95.01-42.538-95.01-95.01V561.51C0,509.038,42.538,466.5,95.01,466.5z\"\n />\n <path\n fill=\"#FFF\"\n d=\"M820.211,828.193H630.241v517.297H509.211V828.193H320.123V727.844h500.088V828.193z\"\n />\n </svg>\n );\n};\n"],"names":["MsTeamsIcon","height","width","React"],"mappings":"wKAOaA,EAAmDA,CAAC,CAC/DC,OAAAA,EACAC,MAAAA,CACF,IAGKC,EAAA,QAAA,cAAA,MAAA,CACC,MAAM,6BACN,MAAO,CAAEF,OAAAA,EAAQC,MAAAA,CAAAA,EACjB,QAAQ,uBAER,EAAAC,EAAA,QAAA,cAAC,QACC,KAAK,UACL,EAAE,iRAAA,CAAiR,EAErRA,EAAAA,QAAA,cAAC,SAAO,CAAA,KAAK,UAAU,GAAG,UAAU,GAAG,UAAU,EAAE,QAAA,CAAQ,EAC3DA,EAAAA,QAAA,cAAC,UAAO,KAAK,UAAU,GAAG,WAAW,GAAG,UAAU,EAAE,SAAS,CAAA,0BAC5D,OACC,CAAA,KAAK,UACL,EAAE,+NAA8N,EAEjOA,UAAA,cAAA,OAAA,CACC,QAAQ,KACR,EAAE,2PAA0P,0BAE7P,OACC,CAAA,QAAQ,KACR,EAAE,4SAA4S,CAAA,EAEhTA,EAAA,QAAA,cAAC,OACC,CAAA,QAAQ,KACR,EAAE,gLAAgL,CAAA,0BAEnL,OACC,CAAA,QAAQ,KACR,EAAE,iLAAgL,EAEpLA,EAAAA,QAAA,cAAC,OACC,CAAA,QAAQ,KACR,EAAE,2RAAA,CAA2R,EAE/RA,UAAA,cAAC,OACC,CAAA,QAAQ,KACR,EAAE,8KAA8K,CAAA,EAElLA,EAAA,QAAA,cAAC,OACC,CAAA,QAAQ,KACR,EAAE,8KAA8K,CAAA,0BAEjL,OACC,CAAA,QAAQ,KACR,EAAE,sIAAsI,CAAA,EAEzIA,EAAAA,QAAA,cAAA,iBAAA,CACC,GAAG,IACH,cAAc,iBACd,GAAG,UACH,GAAG,YACH,GAAG,WACH,GAAG,WACH,kBAAkB,8BAElB,EAAAA,UAAA,cAAC,OAAK,CAAA,OAAO,IAAI,UAAU,UAAS,EACpCA,UAAA,cAAC,OAAK,CAAA,OAAO,KAAK,UAAU,SAAS,CAAA,EACrCA,EAAA,QAAA,cAAC,QAAK,OAAO,IAAI,UAAU,SAAS,CAAA,CACtC,EACCA,EAAAA,QAAA,cAAA,OAAA,CACC,KAAK,UACL,EAAE,wLAAuL,0BAE1L,OACC,CAAA,KAAK,OACL,EAAE,oFAAmF,CAEzF"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SlackAddChannelInput.js","sources":["../../../../../../src/modules/slack/components/SlackAddChannelInput/SlackAddChannelInput.tsx"],"sourcesContent":["import { SlackChannelConnection } from \"@knocklabs/client\";\nimport { useTranslations } from \"@knocklabs/react-core\";\nimport { useState } from \"react\";\nimport { FunctionComponent } from \"react\";\n\nimport { Spinner } from \"../../../core\";\nimport \"../../theme.css\";\nimport ConnectionErrorInfoBoxes from \"../SlackChannelCombobox/SlackConnectionError\";\nimport { SlackIcon } from \"../SlackIcon\";\n\nimport \"./styles.css\";\n\nexport interface SlackAddChannelInputProps {\n inErrorState: boolean;\n connectedChannels: SlackChannelConnection[];\n updateConnectedChannels: (channels: SlackChannelConnection[]) => void;\n connectedChannelsError: string | null;\n connectedChannelsUpdating: boolean;\n}\n\nconst SlackAddChannelInput: FunctionComponent<SlackAddChannelInputProps> = ({\n inErrorState,\n connectedChannels = [],\n updateConnectedChannels,\n connectedChannelsError,\n connectedChannelsUpdating,\n}) => {\n const { t } = useTranslations();\n const [value, setValue] = useState<string | null>(null);\n const [localError, setLocalError] = useState<string | null>(null);\n\n const submitChannel = () => {\n if (!value) {\n return;\n }\n\n if (localError) {\n setLocalError(null);\n }\n\n const alreadyConnected = connectedChannels.find(\n (channel) => channel.channel_id === value,\n );\n\n if (alreadyConnected) {\n setValue(\"\");\n return setLocalError(t(\"slackChannelAlreadyConnected\") || \"\");\n }\n\n const channelsToSendToKnock = [...connectedChannels, { channel_id: value }];\n updateConnectedChannels(channelsToSendToKnock);\n setValue(\"\");\n };\n\n return (\n <div className=\"rsk-connect-channel\">\n <input\n className={`rsk-connect-channel__input ${(inErrorState || !!localError) && !value && \"rsk-connect-channel__input--error\"}`}\n tabIndex={-1}\n id=\"slack-channel-search\"\n type=\"text\"\n placeholder={\n localError || connectedChannelsError || t(\"slackChannelId\")\n }\n onChange={(e) => setValue(e.target.value)}\n value={value || \"\"}\n />\n <button className=\"rsk-connect-channel__button\" onClick={submitChannel}>\n {connectedChannelsUpdating ? (\n <Spinner size=\"15px\" thickness={3} />\n ) : (\n <SlackIcon height=\"16px\" width=\"16px\" />\n )}\n {t(\"slackConnectChannel\")}\n </button>\n <ConnectionErrorInfoBoxes />\n </div>\n );\n};\n\nexport default SlackAddChannelInput;\n"],"names":["SlackAddChannelInput","inErrorState","connectedChannels","updateConnectedChannels","connectedChannelsError","connectedChannelsUpdating","t","useTranslations","value","setValue","useState","localError","setLocalError","submitChannel","find","channel","channel_id","channelsToSendToKnock","React","e","target","Spinner","SlackIcon","ConnectionErrorInfoBoxes"],"mappings":"8bAoBMA,EAAqEA,CAAC,CAC1EC,aAAAA,EACAC,kBAAAA,EAAoB,CAAE,EACtBC,wBAAAA,EACAC,uBAAAA,EACAC,0BAAAA,CACF,IAAM,CACE,KAAA,CAAEC,EAAAA,GAAMC,
|
1
|
+
{"version":3,"file":"SlackAddChannelInput.js","sources":["../../../../../../src/modules/slack/components/SlackAddChannelInput/SlackAddChannelInput.tsx"],"sourcesContent":["import { SlackChannelConnection } from \"@knocklabs/client\";\nimport { useTranslations } from \"@knocklabs/react-core\";\nimport { useState } from \"react\";\nimport { FunctionComponent } from \"react\";\n\nimport { Spinner } from \"../../../core\";\nimport \"../../theme.css\";\nimport ConnectionErrorInfoBoxes from \"../SlackChannelCombobox/SlackConnectionError\";\nimport { SlackIcon } from \"../SlackIcon\";\n\nimport \"./styles.css\";\n\nexport interface SlackAddChannelInputProps {\n inErrorState: boolean;\n connectedChannels: SlackChannelConnection[];\n updateConnectedChannels: (channels: SlackChannelConnection[]) => void;\n connectedChannelsError: string | null;\n connectedChannelsUpdating: boolean;\n}\n\nconst SlackAddChannelInput: FunctionComponent<SlackAddChannelInputProps> = ({\n inErrorState,\n connectedChannels = [],\n updateConnectedChannels,\n connectedChannelsError,\n connectedChannelsUpdating,\n}) => {\n const { t } = useTranslations();\n const [value, setValue] = useState<string | null>(null);\n const [localError, setLocalError] = useState<string | null>(null);\n\n const submitChannel = () => {\n if (!value) {\n return;\n }\n\n if (localError) {\n setLocalError(null);\n }\n\n const alreadyConnected = connectedChannels.find(\n (channel) => channel.channel_id === value,\n );\n\n if (alreadyConnected) {\n setValue(\"\");\n return setLocalError(t(\"slackChannelAlreadyConnected\") || \"\");\n }\n\n const channelsToSendToKnock = [...connectedChannels, { channel_id: value }];\n updateConnectedChannels(channelsToSendToKnock);\n setValue(\"\");\n };\n\n return (\n <div className=\"rsk-connect-channel\">\n <input\n className={`rsk-connect-channel__input ${(inErrorState || !!localError) && !value && \"rsk-connect-channel__input--error\"}`}\n tabIndex={-1}\n id=\"slack-channel-search\"\n type=\"text\"\n placeholder={\n localError || connectedChannelsError || t(\"slackChannelId\")\n }\n onChange={(e) => setValue(e.target.value)}\n value={value || \"\"}\n />\n <button className=\"rsk-connect-channel__button\" onClick={submitChannel}>\n {connectedChannelsUpdating ? (\n <Spinner size=\"15px\" thickness={3} />\n ) : (\n <SlackIcon height=\"16px\" width=\"16px\" />\n )}\n {t(\"slackConnectChannel\")}\n </button>\n <ConnectionErrorInfoBoxes />\n </div>\n );\n};\n\nexport default SlackAddChannelInput;\n"],"names":["SlackAddChannelInput","inErrorState","connectedChannels","updateConnectedChannels","connectedChannelsError","connectedChannelsUpdating","t","useTranslations","value","setValue","useState","localError","setLocalError","submitChannel","find","channel","channel_id","channelsToSendToKnock","React","e","target","Spinner","SlackIcon","ConnectionErrorInfoBoxes"],"mappings":"8bAoBMA,EAAqEA,CAAC,CAC1EC,aAAAA,EACAC,kBAAAA,EAAoB,CAAE,EACtBC,wBAAAA,EACAC,uBAAAA,EACAC,0BAAAA,CACF,IAAM,CACE,KAAA,CAAEC,EAAAA,GAAMC,kBAAgB,EACxB,CAACC,EAAOC,CAAQ,EAAIC,EAAAA,SAAwB,IAAI,EAChD,CAACC,EAAYC,CAAa,EAAIF,EAAAA,SAAwB,IAAI,EAE1DG,EAAgBA,IAAM,CAC1B,GAAI,CAACL,EACH,OAWF,GARIG,GACFC,EAAc,IAAI,EAGKV,EAAkBY,KAC5BC,GAAAA,EAAQC,aAAeR,CACtC,EAGEC,OAAAA,EAAS,EAAE,EACJG,EAAcN,EAAE,8BAA8B,GAAK,EAAE,EAGxDW,MAAAA,EAAwB,CAAC,GAAGf,EAAmB,CAAEc,WAAYR,CAAAA,CAAO,EAC1EL,EAAwBc,CAAqB,EAC7CR,EAAS,EAAE,CACb,EAEA,OACGS,EAAAA,QAAA,cAAA,MAAA,CAAI,UAAU,qBAAA,EACZA,EAAAA,QAAA,cAAA,QAAA,CACC,UAAW,+BAA+BjB,GAAgB,CAAC,CAACU,IAAe,CAACH,GAAS,mCAAmC,GACxH,SAAU,GACV,GAAG,uBACH,KAAK,OACL,YACEG,GAAcP,GAA0BE,EAAE,gBAAgB,EAE5D,SAAWa,GAAMV,EAASU,EAAEC,OAAOZ,KAAK,EACxC,MAAOA,GAAS,GAAG,EAEpBU,EAAA,QAAA,cAAA,SAAA,CAAO,UAAU,8BAA8B,QAASL,CAAAA,EACtDR,EACCa,EAAAA,QAAA,cAACG,WAAQ,KAAK,OAAO,UAAW,CAAA,CAAK,EAErCH,UAAA,cAACI,EAAAA,UAAU,CAAA,OAAO,OAAO,MAAM,MAAA,CAChC,EACAhB,EAAE,qBAAqB,CAC1B,EACAY,EAAA,QAAA,cAACK,MAAwB,CAC3B,CAEJ"}
|
@@ -1 +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 } 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 additionalScopes?: string[];\n}\n\nexport const SlackAuthButton: FunctionComponent<SlackAuthButtonProps> = ({\n slackClientId,\n redirectUrl,\n onAuthenticationComplete,\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 { buildSlackAuthUrl, disconnectFromSlack } = useSlackAuth(\n slackClientId,\n redirectUrl,\n additionalScopes,\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","additionalScopes","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","useKnockSlackClient","buildSlackAuthUrl","disconnectFromSlack","useSlackAuth","useEffect","receiveMessage","event","origin","host","data","addEventListener","removeEventListener","disconnectLabel","reconnectLabel","React","SlackIcon","openPopupWindow"],"mappings":"2VAsBaA,EAA2DA,CAAC,CACvEC,cAAAA,EACAC,YAAAA,EACAC,yBAAAA,EACAC,iBAAAA,CACF,IAAM,CACE,KAAA,CAAEC,EAAAA,GAAMC,
|
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 } 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 additionalScopes?: string[];\n}\n\nexport const SlackAuthButton: FunctionComponent<SlackAuthButtonProps> = ({\n slackClientId,\n redirectUrl,\n onAuthenticationComplete,\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 { buildSlackAuthUrl, disconnectFromSlack } = useSlackAuth(\n slackClientId,\n redirectUrl,\n additionalScopes,\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","additionalScopes","t","useTranslations","knock","useKnockClient","setConnectionStatus","connectionStatus","setActionLabel","actionLabel","errorLabel","useKnockSlackClient","buildSlackAuthUrl","disconnectFromSlack","useSlackAuth","useEffect","receiveMessage","event","origin","host","data","addEventListener","removeEventListener","disconnectLabel","reconnectLabel","React","SlackIcon","openPopupWindow"],"mappings":"2VAsBaA,EAA2DA,CAAC,CACvEC,cAAAA,EACAC,YAAAA,EACAC,yBAAAA,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,EAElB,CAAEC,kBAAAA,EAAmBC,oBAAAA,CAAwBC,EAAAA,eACjDhB,EACAC,EACAE,CACF,EAEAc,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,EAGzBN,GACFA,EAAyBiB,EAAMG,IAAI,OAEtB,CACfd,EAAoB,OAAO,CAAA,CAE/B,EAEOe,cAAAA,iBAAiB,UAAWL,EAAgB,EAAK,EAGjD,IAAM,CACJM,OAAAA,oBAAoB,UAAWN,CAAc,CACtD,GACC,CAACZ,EAAMe,KAAMnB,EAA0BM,CAAmB,CAAC,EAExDiB,MAAAA,EAAkBrB,EAAE,iBAAiB,GAAK,KAC1CsB,EAAiBtB,EAAE,gBAAgB,GAAK,KAI5CK,OAAAA,IAAqB,cACrBA,IAAqB,gBAGnBkB,EAAA,QAAA,cAAC,OAAI,UAAU,kDAAA,0BACZC,EAAU,UAAA,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACpCD,EAAAA,QAAA,cAAA,OAAA,KAEKvB,EADHK,IAAqB,aAChB,kBACA,oBADiB,CAEzB,CACF,EAKAA,IAAqB,gCAEpB,SACC,CAAA,QAAS,IAAMoB,EAAAA,gBAAgBf,GAAmB,EAClD,UAAU,iDACV,aAAc,IAAMJ,EAAegB,CAAc,EACjD,aAAc,IAAMhB,EAAe,IAAI,CAAA,0BAEtCkB,EAAAA,UAAU,CAAA,OAAO,OAAO,MAAM,OAAM,EACrCD,UAAA,cAAC,OAAK,CAAA,UAAU,oCACbhB,GAAeC,GAAcR,EAAE,YAAY,CAC9C,CACF,EAKAK,IAAqB,eAErBkB,EAAA,QAAA,cAAC,UACC,QAAS,IAAME,EAAAA,gBAAgBf,EAAkB,CAAC,EAClD,UAAU,uDAEV,EAAAa,EAAA,QAAA,cAACC,aAAU,OAAO,OAAO,MAAM,MAAM,CAAA,0BACpC,OAAMxB,KAAAA,EAAE,cAAc,CAAE,CAC3B,EAMDuB,EAAAA,QAAA,cAAA,SAAA,CACC,QAASZ,EACT,UAAU,qDACV,aAAc,IAAML,EAAee,CAAe,EAClD,aAAc,IAAMf,EAAe,IAAI,GAEvCiB,EAAAA,QAAA,cAACC,EAAAA,UAAU,CAAA,OAAO,OAAO,MAAM,MAAM,CAAA,EACrCD,EAAA,QAAA,cAAC,OAAK,CAAA,UAAU,sCACbhB,EAAAA,GAAeP,EAAE,gBAAgB,CACpC,CACF,CAEJ"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SlackAuthContainer.js","sources":["../../../../../../src/modules/slack/components/SlackAuthContainer/SlackAuthContainer.tsx"],"sourcesContent":["import { useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport \"../../theme.css\";\nimport { SlackIcon } from \"../SlackIcon\";\n\nimport \"./styles.css\";\n\nexport interface SlackAuthContainerProps {\n actionButton: React.ReactElement;\n}\n\nexport const SlackAuthContainer: FunctionComponent<SlackAuthContainerProps> = ({\n actionButton,\n}) => {\n const { t } = useTranslations();\n\n return (\n <div className=\"rsk-auth\">\n <div className=\"rsk-auth__header\">\n <SlackIcon height=\"32px\" width=\"32px\" />\n <div>{actionButton}</div>\n </div>\n <div className=\"rsk-auth__title\">Slack</div>\n <div className=\"rsk-auth__description\">\n {t(\"slackConnectContainerDescription\")}\n </div>\n </div>\n );\n};\n"],"names":["SlackAuthContainer","actionButton","t","useTranslations","React","SlackIcon"],"mappings":"uTAYaA,EAAiEA,CAAC,CAC7EC,aAAAA,CACF,IAAM,CACE,KAAA,CAAEC,EAAAA,GAAMC,
|
1
|
+
{"version":3,"file":"SlackAuthContainer.js","sources":["../../../../../../src/modules/slack/components/SlackAuthContainer/SlackAuthContainer.tsx"],"sourcesContent":["import { useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport \"../../theme.css\";\nimport { SlackIcon } from \"../SlackIcon\";\n\nimport \"./styles.css\";\n\nexport interface SlackAuthContainerProps {\n actionButton: React.ReactElement;\n}\n\nexport const SlackAuthContainer: FunctionComponent<SlackAuthContainerProps> = ({\n actionButton,\n}) => {\n const { t } = useTranslations();\n\n return (\n <div className=\"rsk-auth\">\n <div className=\"rsk-auth__header\">\n <SlackIcon height=\"32px\" width=\"32px\" />\n <div>{actionButton}</div>\n </div>\n <div className=\"rsk-auth__title\">Slack</div>\n <div className=\"rsk-auth__description\">\n {t(\"slackConnectContainerDescription\")}\n </div>\n </div>\n );\n};\n"],"names":["SlackAuthContainer","actionButton","t","useTranslations","React","SlackIcon"],"mappings":"uTAYaA,EAAiEA,CAAC,CAC7EC,aAAAA,CACF,IAAM,CACE,KAAA,CAAEC,EAAAA,GAAMC,kBAAgB,EAE9B,OACGC,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,oCACZ,MAAI,CAAA,UAAU,kBACb,EAAAA,UAAA,cAACC,EAAU,UAAA,CAAA,OAAO,OAAO,MAAM,OAAM,EACrCD,EAAAA,QAAA,cAAC,MAAKH,KAAAA,CAAa,CACrB,EACCG,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,iBAAkB,EAAA,OAAK,EACtCA,EAAAA,QAAA,cAAC,OAAI,UAAU,yBACZF,EAAE,kCAAkC,CACvC,CACF,CAEJ"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),h=require("@knocklabs/react-core"),d=require("@telegraph/combobox"),b=require("@telegraph/icon"),x=require("@telegraph/layout"),p=require("@telegraph/typography");;/* empty css */const A=require("../../utils.js"),T=require("../SlackAddChannelInput/SlackAddChannelInput.js"),v=require("./SlackConnectionError.js"),F=require("./SlackErrorMessage.js");;/* empty css */const O=c=>c&&typeof c=="object"&&"default"in c?c:{default:c},n=O(u),D=1e3,H=({slackChannelsRecipientObject:c,queryOptions:q,inputMessages:o})=>{const{t:i}=h.useTranslations(),{connectionStatus:
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),h=require("@knocklabs/react-core"),d=require("@telegraph/combobox"),b=require("@telegraph/icon"),x=require("@telegraph/layout"),p=require("@telegraph/typography");;/* empty css */const A=require("../../utils.js"),T=require("../SlackAddChannelInput/SlackAddChannelInput.js"),v=require("./SlackConnectionError.js"),F=require("./SlackErrorMessage.js");;/* empty css */const O=c=>c&&typeof c=="object"&&"default"in c?c:{default:c},n=O(u),D=1e3,H=({slackChannelsRecipientObject:c,queryOptions:q,inputMessages:o})=>{const{t:i}=h.useTranslations(),{connectionStatus:a,errorLabel:S}=h.useKnockSlackClient(),{data:k,isLoading:f}=h.useSlackChannels({queryOptions:q}),l=u.useMemo(()=>A.sortSlackChannelsAlphabetically(k),[k]),{data:m,updateConnectedChannels:E,error:s,updating:L}=h.useConnectedSlackChannels({slackChannelsRecipientObject:c}),t=u.useMemo(()=>{const e=new Map(l.map(r=>[r.id,r]));return(m==null?void 0:m.filter(r=>e.has(r.channel_id||"")))||[]},[m,l]),C=u.useMemo(()=>a==="disconnected"||a==="error"||!!s,[s,a]),_=u.useMemo(()=>a==="connecting"||a==="disconnecting"||f,[a,f]),y=u.useMemo(()=>{const e={disconnected:i("slackSearchbarDisconnected"),noChannelsConnected:i("slackSearchbarNoChannelsConnected"),noSlackChannelsFound:i("slackSearchbarNoChannelsFound"),channelsError:i("slackSearchbarChannelsError")};if(a==="disconnected")return(o==null?void 0:o.disconnected)||e.disconnected;if(a==="error")return(o==null?void 0:o.error)||S;if(!_&&l.length===0)return(o==null?void 0:o.noSlackChannelsFound)||e.noSlackChannelsFound;const r=(t==null?void 0:t.length)||0;return t&&r===0?(o==null?void 0:o.noChannelsConnected)||e.noChannelsConnected:""},[a,_,l,t,o,S,i]),N=u.useMemo(()=>t.map(e=>e.channel_id),[t]);return l.length>D?n.default.createElement(T,{inErrorState:C,connectedChannels:t||[],updateConnectedChannels:E,connectedChannelsError:s,connectedChannelsUpdating:L}):n.default.createElement(x.Stack,{className:"tgph rsk-combobox__grid",gap:"3"},n.default.createElement(p.Text,{color:"gray",size:"2",as:"div",minHeight:"8",className:"rsk-combobox__label"},"Channels"),n.default.createElement(d.Combobox.Root,{value:N,onValueChange:e=>{const r=e.map(g=>({channel_id:g}));E(r).catch(console.error)},placeholder:y??"",disabled:C||l.length===0,errored:C,closeOnSelect:!1,layout:"wrap",modal:!1},n.default.createElement(d.Combobox.Trigger,null),n.default.createElement(d.Combobox.Content,null,n.default.createElement(d.Combobox.Search,{label:i("slackSearchChannels"),className:"rsk-combobox__search"}),n.default.createElement(d.Combobox.Options,{maxHeight:"36"},l.map(e=>n.default.createElement(d.Combobox.Option,{key:e.id,value:e.id},n.default.createElement(x.Stack,{align:"center",gap:"1"},n.default.createElement(b.Icon,{icon:e.is_private?b.Lucide.Lock:b.Lucide.Hash,size:"0","aria-hidden":!0}),e.name)))),n.default.createElement(d.Combobox.Empty,null))),n.default.createElement(v,null),!!s&&n.default.createElement(F,{message:s}))};exports.SlackChannelCombobox=H;
|
2
2
|
//# sourceMappingURL=SlackChannelCombobox.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SlackChannelCombobox.js","sources":["../../../../../../src/modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.tsx"],"sourcesContent":["import { SlackChannelConnection } from \"@knocklabs/client\";\nimport {\n RecipientObject,\n SlackChannelQueryOptions,\n useConnectedSlackChannels,\n useKnockSlackClient,\n useSlackChannels,\n useTranslations,\n} from \"@knocklabs/react-core\";\nimport { Combobox } from \"@telegraph/combobox\";\nimport { Icon, Lucide } from \"@telegraph/icon\";\nimport { Stack } from \"@telegraph/layout\";\nimport { Text } from \"@telegraph/typography\";\nimport { useMemo } from \"react\";\nimport { FunctionComponent } from \"react\";\n\nimport \"../../theme.css\";\nimport { sortSlackChannelsAlphabetically } from \"../../utils\";\nimport SlackAddChannelInput from \"../SlackAddChannelInput/SlackAddChannelInput\";\n\nimport SlackConnectionError from \"./SlackConnectionError\";\nimport SlackErrorMessage from \"./SlackErrorMessage\";\nimport \"./styles.css\";\n\nconst MAX_ALLOWED_CHANNELS = 1000;\n\nexport type SlackChannelComboboxInputMessages = {\n disconnected: string;\n error: string;\n noChannelsConnected: string;\n noSlackChannelsFound: string;\n};\n\nexport interface SlackChannelComboboxProps {\n slackChannelsRecipientObject: RecipientObject;\n queryOptions?: SlackChannelQueryOptions;\n inputMessages?: SlackChannelComboboxInputMessages;\n}\n\nexport const SlackChannelCombobox: FunctionComponent<\n SlackChannelComboboxProps\n> = ({ slackChannelsRecipientObject, queryOptions, inputMessages }) => {\n const { t } = useTranslations();\n\n // Gather API data\n const { connectionStatus, errorLabel: connectionErrorLabel } =\n useKnockSlackClient();\n\n const { data: unsortedSlackChannels, isLoading: slackChannelsLoading } =\n useSlackChannels({ queryOptions });\n\n const slackChannels = useMemo(\n () => sortSlackChannelsAlphabetically(unsortedSlackChannels),\n [unsortedSlackChannels],\n );\n\n const {\n data: connectedChannels,\n updateConnectedChannels,\n error: connectedChannelsError,\n updating: connectedChannelsUpdating,\n } = useConnectedSlackChannels({ slackChannelsRecipientObject });\n\n const currentConnectedChannels = useMemo<SlackChannelConnection[]>(() => {\n // Used to make sure we're only showing currently available channels to select from.\n // There are cases where a channel is \"connected\" in Knock, but it wouldn't be\n // posting to it if the channel is private and the Slackbot doesn't belong to it,\n // so the channel won't show up here and it won't be posted to.\n const slackChannelsMap = new Map(\n slackChannels.map((channel) => [channel.id, channel]),\n );\n\n return (\n connectedChannels?.filter((connectedChannel) => {\n return slackChannelsMap.has(connectedChannel.channel_id || \"\");\n }) || []\n );\n }, [connectedChannels, slackChannels]);\n\n const inErrorState = useMemo(\n () =>\n connectionStatus === \"disconnected\" ||\n connectionStatus === \"error\" ||\n !!connectedChannelsError,\n [connectedChannelsError, connectionStatus],\n );\n\n const inLoadingState = useMemo(\n () =>\n connectionStatus === \"connecting\" ||\n connectionStatus === \"disconnecting\" ||\n slackChannelsLoading,\n\n [connectionStatus, slackChannelsLoading],\n );\n\n // Construct placeholder text\n const searchPlaceholder = useMemo(() => {\n const DEFAULT_INPUT_MESSAGES = {\n disconnected: t(\"slackSearchbarDisconnected\"),\n noChannelsConnected: t(\"slackSearchbarNoChannelsConnected\"),\n noSlackChannelsFound: t(\"slackSearchbarNoChannelsFound\"),\n channelsError: t(\"slackSearchbarChannelsError\"),\n };\n\n // Connection status message\n if (connectionStatus === \"disconnected\") {\n return inputMessages?.disconnected || DEFAULT_INPUT_MESSAGES.disconnected;\n }\n\n if (connectionStatus === \"error\") {\n return inputMessages?.error || connectionErrorLabel;\n }\n\n // Channels status messages\n if (!inLoadingState && slackChannels.length === 0) {\n return (\n inputMessages?.noSlackChannelsFound ||\n DEFAULT_INPUT_MESSAGES.noSlackChannelsFound\n );\n }\n\n const numberConnectedChannels = currentConnectedChannels?.length || 0;\n\n if (currentConnectedChannels && numberConnectedChannels === 0) {\n return (\n inputMessages?.noChannelsConnected ||\n DEFAULT_INPUT_MESSAGES.noChannelsConnected\n );\n }\n\n return \"\";\n }, [\n connectionStatus,\n inLoadingState,\n slackChannels,\n currentConnectedChannels,\n inputMessages,\n connectionErrorLabel,\n t,\n ]);\n\n const comboboxValue = useMemo(\n () => currentConnectedChannels.map((connection) => connection.channel_id),\n [currentConnectedChannels],\n );\n\n if (slackChannels.length > MAX_ALLOWED_CHANNELS) {\n return (\n <SlackAddChannelInput\n inErrorState={inErrorState}\n connectedChannels={currentConnectedChannels || []}\n updateConnectedChannels={updateConnectedChannels}\n connectedChannelsError={connectedChannelsError}\n connectedChannelsUpdating={connectedChannelsUpdating}\n />\n );\n }\n\n return (\n <Stack className=\"tgph rsk-combobox__grid\" gap=\"3\">\n <Text\n color=\"gray\"\n size=\"2\"\n as=\"div\"\n minHeight=\"8\"\n className=\"rsk-combobox__label\"\n >\n Channels\n </Text>\n <Combobox.Root\n value={comboboxValue}\n onValueChange={(channelIds) => {\n const updatedConnections = channelIds.map<SlackChannelConnection>(\n (channelId) => ({\n channel_id: channelId,\n }),\n );\n\n updateConnectedChannels(updatedConnections).catch(console.error);\n }}\n placeholder={searchPlaceholder ?? \"\"}\n disabled={inErrorState || slackChannels.length === 0}\n errored={inErrorState}\n closeOnSelect={false}\n layout=\"wrap\"\n >\n <Combobox.Trigger />\n <Combobox.Content>\n <Combobox.Search\n label={t(\"slackSearchChannels\")}\n className=\"rsk-combobox__search\"\n />\n <Combobox.Options maxHeight=\"36\">\n {slackChannels.map((channel) => (\n <Combobox.Option key={channel.id} value={channel.id}>\n <Stack align=\"center\" gap=\"1\">\n <Icon\n icon={channel.is_private ? Lucide.Lock : Lucide.Hash}\n size=\"0\"\n aria-hidden\n />\n {channel.name}\n </Stack>\n </Combobox.Option>\n ))}\n </Combobox.Options>\n <Combobox.Empty />\n </Combobox.Content>\n </Combobox.Root>\n <SlackConnectionError />\n {!!connectedChannelsError && (\n <SlackErrorMessage message={connectedChannelsError} />\n )}\n </Stack>\n );\n};\n"],"names":["MAX_ALLOWED_CHANNELS","SlackChannelCombobox","slackChannelsRecipientObject","queryOptions","inputMessages","t","useTranslations","connectionStatus","errorLabel","connectionErrorLabel","useKnockSlackClient","data","unsortedSlackChannels","isLoading","slackChannelsLoading","useSlackChannels","slackChannels","useMemo","sortSlackChannelsAlphabetically","connectedChannels","updateConnectedChannels","error","connectedChannelsError","updating","connectedChannelsUpdating","useConnectedSlackChannels","currentConnectedChannels","slackChannelsMap","Map","map","channel","id","filter","connectedChannel","has","channel_id","inErrorState","inLoadingState","searchPlaceholder","DEFAULT_INPUT_MESSAGES","disconnected","noChannelsConnected","noSlackChannelsFound","channelsError","length","numberConnectedChannels","comboboxValue","connection","React","SlackAddChannelInput","Stack","Text","Combobox","channelIds","updatedConnections","channelId","catch","console","Icon","is_private","Lucide","Lock","Hash","name","SlackConnectionError","SlackErrorMessage"],"mappings":"ojBAwBMA,EAAuB,IAehBC,EAETA,CAAC,CAAEC,6BAAAA,EAA8BC,aAAAA,EAAcC,cAAAA,CAAc,IAAM,CAC/D,KAAA,CAAEC,EAAAA,GAAMC,EAAgB,gBAAA,EAGxB,CAAEC,iBAAAA,EAAkBC,WAAYC,GACpCC,EAAoB,oBAAA,EAEhB,CAAEC,KAAMC,EAAuBC,UAAWC,GAC9CC,mBAAiB,CAAEZ,aAAAA,CAAAA,CAAc,EAE7Ba,EAAgBC,EAAAA,QACpB,IAAMC,EAAAA,gCAAgCN,CAAqB,EAC3D,CAACA,CAAqB,CACxB,EAEM,CACJD,KAAMQ,EACNC,wBAAAA,EACAC,MAAOC,EACPC,SAAUC,GACRC,4BAA0B,CAAEvB,6BAAAA,CAAAA,CAA8B,EAExDwB,EAA2BT,EAAAA,QAAkC,IAAM,CAKjEU,MAAAA,EAAmB,IAAIC,IAC3BZ,EAAca,IAAiBC,GAAA,CAACA,EAAQC,GAAID,CAAO,CAAC,CACtD,EAGEX,OAAAA,GAAAA,YAAAA,EAAmBa,OAA6BC,GACvCN,EAAiBO,IAAID,EAAiBE,YAAc,EAAE,KACzD,CAAA,CAAE,EAET,CAAChB,EAAmBH,CAAa,CAAC,EAE/BoB,EAAenB,EAAAA,QACnB,IACEV,IAAqB,gBACrBA,IAAqB,SACrB,CAAC,CAACe,EACJ,CAACA,EAAwBf,CAAgB,CAC3C,EAEM8B,EAAiBpB,EAAAA,QACrB,IACEV,IAAqB,cACrBA,IAAqB,iBACrBO,EAEF,CAACP,EAAkBO,CAAoB,CACzC,EAGMwB,EAAoBrB,EAAAA,QAAQ,IAAM,CACtC,MAAMsB,EAAyB,CAC7BC,aAAcnC,EAAE,4BAA4B,EAC5CoC,oBAAqBpC,EAAE,mCAAmC,EAC1DqC,qBAAsBrC,EAAE,+BAA+B,EACvDsC,cAAetC,EAAE,6BAA6B,CAAA,EAIhD,GAAIE,IAAqB,eAChBH,OAAAA,GAAAA,YAAAA,EAAeoC,eAAgBD,EAAuBC,aAG/D,GAAIjC,IAAqB,QACvB,OAAOH,GAAAA,YAAAA,EAAeiB,QAASZ,EAIjC,GAAI,CAAC4B,GAAkBrB,EAAc4B,SAAW,EAE5CxC,OAAAA,GAAAA,YAAAA,EAAesC,uBACfH,EAAuBG,qBAIrBG,MAAAA,GAA0BnB,GAAAA,YAAAA,EAA0BkB,SAAU,EAEhElB,OAAAA,GAA4BmB,IAA4B,GAExDzC,GAAAA,YAAAA,EAAeqC,sBACfF,EAAuBE,oBAIpB,EAAA,EACN,CACDlC,EACA8B,EACArB,EACAU,EACAtB,EACAK,EACAJ,CAAC,CACF,EAEKyC,EAAgB7B,EAAAA,QACpB,IAAMS,EAAyBG,IAAoBkB,GAAAA,EAAWZ,UAAU,EACxE,CAACT,CAAwB,CAC3B,EAEIV,OAAAA,EAAc4B,OAAS5C,EAEvBgD,UAAA,cAACC,GACC,aAAAb,EACA,kBAAmBV,GAA4B,GAC/C,wBAAAN,EACA,uBAAAE,EACA,0BAAAE,CACA,CAAA,EAKJwB,EAAAA,QAAA,cAACE,EAAAA,MAAM,CAAA,UAAU,0BAA0B,IAAI,GAC7C,EAAAF,EAAA,QAAA,cAACG,EACC,KAAA,CAAA,MAAM,OACN,KAAK,IACL,GAAG,MACH,UAAU,IACV,UAAU,qBAAqB,EAAA,UAGjC,EACAH,EAAAA,QAAA,cAACI,EAAAA,SAAS,KAAT,CACC,MAAON,EACP,cAA+BO,GAAA,CACvBC,MAAAA,EAAqBD,EAAWxB,IACpB0B,IAAA,CACdpB,WAAYoB,CAEhB,EAAA,EAEAnC,EAAwBkC,CAAkB,EAAEE,MAAMC,QAAQpC,KAAK,CACjE,EACA,YAAaiB,GAAqB,GAClC,SAAUF,GAAgBpB,EAAc4B,SAAW,EACnD,QAASR,EACT,cAAe,GACf,OAAO,MAEP,EAAAY,UAAA,cAACI,EAAAA,SAAS,QAAT,IAAgB,EACjBJ,EAAAA,QAAA,cAACI,EAAS,SAAA,QAAT,KACEJ,UAAA,cAAAI,EAAA,SAAS,OAAT,CACC,MAAO/C,EAAE,qBAAqB,EAC9B,UAAU,sBAAsB,CAAA,0BAEjC+C,EAAAA,SAAS,QAAT,CAAiB,UAAU,IAAA,EACzBpC,EAAca,IAAKC,GACjBkB,EAAA,QAAA,cAAAI,WAAS,OAAT,CAAgB,IAAKtB,EAAQC,GAAI,MAAOD,EAAQC,EAAAA,0BAC9CmB,EAAAA,MAAM,CAAA,MAAM,SAAS,IAAI,GAAA,0BACvBQ,EAAAA,KACC,CAAA,KAAM5B,EAAQ6B,WAAaC,EAAAA,OAAOC,KAAOD,EAAOE,OAAAA,KAChD,KAAK,IACL,cAAW,EAAA,CAAA,EAEZhC,EAAQiC,IACX,CACF,CACD,CACH,EACCf,UAAA,cAAAI,EAAAA,SAAS,MAAT,IAAc,CACjB,CACF,EACCJ,EAAAA,QAAA,cAAAgB,EAAA,IAAoB,EACpB,CAAC,CAAC1C,GACA0B,EAAAA,QAAA,cAAAiB,EAAA,CAAkB,QAAS3C,CAAAA,CAC7B,CACH,CAEJ"}
|
1
|
+
{"version":3,"file":"SlackChannelCombobox.js","sources":["../../../../../../src/modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.tsx"],"sourcesContent":["import { SlackChannelConnection } from \"@knocklabs/client\";\nimport {\n RecipientObject,\n SlackChannelQueryOptions,\n useConnectedSlackChannels,\n useKnockSlackClient,\n useSlackChannels,\n useTranslations,\n} from \"@knocklabs/react-core\";\nimport { Combobox } from \"@telegraph/combobox\";\nimport { Icon, Lucide } from \"@telegraph/icon\";\nimport { Stack } from \"@telegraph/layout\";\nimport { Text } from \"@telegraph/typography\";\nimport { useMemo } from \"react\";\nimport { FunctionComponent } from \"react\";\n\nimport \"../../theme.css\";\nimport { sortSlackChannelsAlphabetically } from \"../../utils\";\nimport SlackAddChannelInput from \"../SlackAddChannelInput/SlackAddChannelInput\";\n\nimport SlackConnectionError from \"./SlackConnectionError\";\nimport SlackErrorMessage from \"./SlackErrorMessage\";\nimport \"./styles.css\";\n\nconst MAX_ALLOWED_CHANNELS = 1000;\n\nexport type SlackChannelComboboxInputMessages = {\n disconnected: string;\n error: string;\n noChannelsConnected: string;\n noSlackChannelsFound: string;\n};\n\nexport interface SlackChannelComboboxProps {\n slackChannelsRecipientObject: RecipientObject;\n queryOptions?: SlackChannelQueryOptions;\n inputMessages?: SlackChannelComboboxInputMessages;\n}\n\nexport const SlackChannelCombobox: FunctionComponent<\n SlackChannelComboboxProps\n> = ({ slackChannelsRecipientObject, queryOptions, inputMessages }) => {\n const { t } = useTranslations();\n\n // Gather API data\n const { connectionStatus, errorLabel: connectionErrorLabel } =\n useKnockSlackClient();\n\n const { data: unsortedSlackChannels, isLoading: slackChannelsLoading } =\n useSlackChannels({ queryOptions });\n\n const slackChannels = useMemo(\n () => sortSlackChannelsAlphabetically(unsortedSlackChannels),\n [unsortedSlackChannels],\n );\n\n const {\n data: connectedChannels,\n updateConnectedChannels,\n error: connectedChannelsError,\n updating: connectedChannelsUpdating,\n } = useConnectedSlackChannels({ slackChannelsRecipientObject });\n\n const currentConnectedChannels = useMemo<SlackChannelConnection[]>(() => {\n // Used to make sure we're only showing currently available channels to select from.\n // There are cases where a channel is \"connected\" in Knock, but it wouldn't be\n // posting to it if the channel is private and the Slackbot doesn't belong to it,\n // so the channel won't show up here and it won't be posted to.\n const slackChannelsMap = new Map(\n slackChannels.map((channel) => [channel.id, channel]),\n );\n\n return (\n connectedChannels?.filter((connectedChannel) => {\n return slackChannelsMap.has(connectedChannel.channel_id || \"\");\n }) || []\n );\n }, [connectedChannels, slackChannels]);\n\n const inErrorState = useMemo(\n () =>\n connectionStatus === \"disconnected\" ||\n connectionStatus === \"error\" ||\n !!connectedChannelsError,\n [connectedChannelsError, connectionStatus],\n );\n\n const inLoadingState = useMemo(\n () =>\n connectionStatus === \"connecting\" ||\n connectionStatus === \"disconnecting\" ||\n slackChannelsLoading,\n\n [connectionStatus, slackChannelsLoading],\n );\n\n // Construct placeholder text\n const searchPlaceholder = useMemo(() => {\n const DEFAULT_INPUT_MESSAGES = {\n disconnected: t(\"slackSearchbarDisconnected\"),\n noChannelsConnected: t(\"slackSearchbarNoChannelsConnected\"),\n noSlackChannelsFound: t(\"slackSearchbarNoChannelsFound\"),\n channelsError: t(\"slackSearchbarChannelsError\"),\n };\n\n // Connection status message\n if (connectionStatus === \"disconnected\") {\n return inputMessages?.disconnected || DEFAULT_INPUT_MESSAGES.disconnected;\n }\n\n if (connectionStatus === \"error\") {\n return inputMessages?.error || connectionErrorLabel;\n }\n\n // Channels status messages\n if (!inLoadingState && slackChannels.length === 0) {\n return (\n inputMessages?.noSlackChannelsFound ||\n DEFAULT_INPUT_MESSAGES.noSlackChannelsFound\n );\n }\n\n const numberConnectedChannels = currentConnectedChannels?.length || 0;\n\n if (currentConnectedChannels && numberConnectedChannels === 0) {\n return (\n inputMessages?.noChannelsConnected ||\n DEFAULT_INPUT_MESSAGES.noChannelsConnected\n );\n }\n\n return \"\";\n }, [\n connectionStatus,\n inLoadingState,\n slackChannels,\n currentConnectedChannels,\n inputMessages,\n connectionErrorLabel,\n t,\n ]);\n\n const comboboxValue = useMemo(\n () => currentConnectedChannels.map((connection) => connection.channel_id),\n [currentConnectedChannels],\n );\n\n if (slackChannels.length > MAX_ALLOWED_CHANNELS) {\n return (\n <SlackAddChannelInput\n inErrorState={inErrorState}\n connectedChannels={currentConnectedChannels || []}\n updateConnectedChannels={updateConnectedChannels}\n connectedChannelsError={connectedChannelsError}\n connectedChannelsUpdating={connectedChannelsUpdating}\n />\n );\n }\n\n return (\n <Stack className=\"tgph rsk-combobox__grid\" gap=\"3\">\n <Text\n color=\"gray\"\n size=\"2\"\n as=\"div\"\n minHeight=\"8\"\n className=\"rsk-combobox__label\"\n >\n Channels\n </Text>\n <Combobox.Root\n value={comboboxValue}\n onValueChange={(channelIds) => {\n const updatedConnections = channelIds.map<SlackChannelConnection>(\n (channelId) => ({\n channel_id: channelId,\n }),\n );\n\n updateConnectedChannels(updatedConnections).catch(console.error);\n }}\n placeholder={searchPlaceholder ?? \"\"}\n disabled={inErrorState || slackChannels.length === 0}\n errored={inErrorState}\n closeOnSelect={false}\n layout=\"wrap\"\n modal={\n // Modal comboboxes cause page layout to shift when body has padding. See KNO-7854.\n false\n }\n >\n <Combobox.Trigger />\n <Combobox.Content>\n <Combobox.Search\n label={t(\"slackSearchChannels\")}\n className=\"rsk-combobox__search\"\n />\n <Combobox.Options maxHeight=\"36\">\n {slackChannels.map((channel) => (\n <Combobox.Option key={channel.id} value={channel.id}>\n <Stack align=\"center\" gap=\"1\">\n <Icon\n icon={channel.is_private ? Lucide.Lock : Lucide.Hash}\n size=\"0\"\n aria-hidden\n />\n {channel.name}\n </Stack>\n </Combobox.Option>\n ))}\n </Combobox.Options>\n <Combobox.Empty />\n </Combobox.Content>\n </Combobox.Root>\n <SlackConnectionError />\n {!!connectedChannelsError && (\n <SlackErrorMessage message={connectedChannelsError} />\n )}\n </Stack>\n );\n};\n"],"names":["MAX_ALLOWED_CHANNELS","SlackChannelCombobox","slackChannelsRecipientObject","queryOptions","inputMessages","t","useTranslations","connectionStatus","errorLabel","connectionErrorLabel","useKnockSlackClient","data","unsortedSlackChannels","isLoading","slackChannelsLoading","useSlackChannels","slackChannels","useMemo","sortSlackChannelsAlphabetically","connectedChannels","updateConnectedChannels","error","connectedChannelsError","updating","connectedChannelsUpdating","useConnectedSlackChannels","currentConnectedChannels","slackChannelsMap","Map","map","channel","id","filter","connectedChannel","has","channel_id","inErrorState","inLoadingState","searchPlaceholder","DEFAULT_INPUT_MESSAGES","disconnected","noChannelsConnected","noSlackChannelsFound","channelsError","length","numberConnectedChannels","comboboxValue","connection","React","SlackAddChannelInput","Stack","Text","Combobox","channelIds","updatedConnections","channelId","catch","console","Icon","is_private","Lucide","Lock","Hash","name","SlackConnectionError","SlackErrorMessage"],"mappings":"ojBAwBMA,EAAuB,IAehBC,EAETA,CAAC,CAAEC,6BAAAA,EAA8BC,aAAAA,EAAcC,cAAAA,CAAc,IAAM,CAC/D,KAAA,CAAEC,EAAAA,GAAMC,kBAAgB,EAGxB,CAAEC,iBAAAA,EAAkBC,WAAYC,GACpCC,sBAAoB,EAEhB,CAAEC,KAAMC,EAAuBC,UAAWC,GAC9CC,mBAAiB,CAAEZ,aAAAA,CAAAA,CAAc,EAE7Ba,EAAgBC,EAAAA,QACpB,IAAMC,EAAAA,gCAAgCN,CAAqB,EAC3D,CAACA,CAAqB,CACxB,EAEM,CACJD,KAAMQ,EACNC,wBAAAA,EACAC,MAAOC,EACPC,SAAUC,GACRC,4BAA0B,CAAEvB,6BAAAA,CAAAA,CAA8B,EAExDwB,EAA2BT,EAAAA,QAAkC,IAAM,CAKjEU,MAAAA,EAAmB,IAAIC,IAC3BZ,EAAca,IAAiBC,GAAA,CAACA,EAAQC,GAAID,CAAO,CAAC,CACtD,EAGEX,OAAAA,GAAAA,YAAAA,EAAmBa,OAA6BC,GACvCN,EAAiBO,IAAID,EAAiBE,YAAc,EAAE,KACzD,CAAE,CAAA,EAET,CAAChB,EAAmBH,CAAa,CAAC,EAE/BoB,EAAenB,EAAAA,QACnB,IACEV,IAAqB,gBACrBA,IAAqB,SACrB,CAAC,CAACe,EACJ,CAACA,EAAwBf,CAAgB,CAC3C,EAEM8B,EAAiBpB,EAAAA,QACrB,IACEV,IAAqB,cACrBA,IAAqB,iBACrBO,EAEF,CAACP,EAAkBO,CAAoB,CACzC,EAGMwB,EAAoBrB,EAAAA,QAAQ,IAAM,CACtC,MAAMsB,EAAyB,CAC7BC,aAAcnC,EAAE,4BAA4B,EAC5CoC,oBAAqBpC,EAAE,mCAAmC,EAC1DqC,qBAAsBrC,EAAE,+BAA+B,EACvDsC,cAAetC,EAAE,6BAA6B,CAChD,EAGA,GAAIE,IAAqB,eAChBH,OAAAA,GAAAA,YAAAA,EAAeoC,eAAgBD,EAAuBC,aAG/D,GAAIjC,IAAqB,QACvB,OAAOH,GAAAA,YAAAA,EAAeiB,QAASZ,EAIjC,GAAI,CAAC4B,GAAkBrB,EAAc4B,SAAW,EAE5CxC,OAAAA,GAAAA,YAAAA,EAAesC,uBACfH,EAAuBG,qBAIrBG,MAAAA,GAA0BnB,GAAAA,YAAAA,EAA0BkB,SAAU,EAEhElB,OAAAA,GAA4BmB,IAA4B,GAExDzC,GAAAA,YAAAA,EAAeqC,sBACfF,EAAuBE,oBAIpB,EAAA,EACN,CACDlC,EACA8B,EACArB,EACAU,EACAtB,EACAK,EACAJ,CAAC,CACF,EAEKyC,EAAgB7B,EAAAA,QACpB,IAAMS,EAAyBG,IAAoBkB,GAAAA,EAAWZ,UAAU,EACxE,CAACT,CAAwB,CAC3B,EAEIV,OAAAA,EAAc4B,OAAS5C,EAEvBgD,UAAA,cAACC,GACC,aAAAb,EACA,kBAAmBV,GAA4B,GAC/C,wBAAAN,EACA,uBAAAE,EACA,0BAAAE,CACA,CAAA,EAKJwB,EAAAA,QAAA,cAACE,EAAAA,MAAM,CAAA,UAAU,0BAA0B,IAAI,GAC7C,EAAAF,EAAA,QAAA,cAACG,EACC,KAAA,CAAA,MAAM,OACN,KAAK,IACL,GAAG,MACH,UAAU,IACV,UAAU,qBAAqB,EAAA,UAGjC,EACAH,EAAAA,QAAA,cAACI,EAAAA,SAAS,KAAT,CACC,MAAON,EACP,cAA+BO,GAAA,CACvBC,MAAAA,EAAqBD,EAAWxB,IACpB0B,IAAA,CACdpB,WAAYoB,CAAAA,EAEhB,EAEAnC,EAAwBkC,CAAkB,EAAEE,MAAMC,QAAQpC,KAAK,CAAA,EAEjE,YAAaiB,GAAqB,GAClC,SAAUF,GAAgBpB,EAAc4B,SAAW,EACnD,QAASR,EACT,cAAe,GACf,OAAO,OACP,MAEE,4BAGDgB,WAAS,QAAT,IAAgB,0BAChBA,EAAAA,SAAS,QAAT,KACCJ,UAAA,cAACI,WAAS,OAAT,CACC,MAAO/C,EAAE,qBAAqB,EAC9B,UAAU,sBAAsB,CAAA,EAElC2C,EAAAA,QAAA,cAACI,WAAS,QAAT,CAAiB,UAAU,IACzBpC,EAAAA,EAAca,IACbC,GAAAkB,EAAAA,QAAA,cAACI,EAAS,SAAA,OAAT,CAAgB,IAAKtB,EAAQC,GAAI,MAAOD,EAAQC,IAC9CiB,EAAA,QAAA,cAAAE,QAAA,CAAM,MAAM,SAAS,IAAI,GACxB,EAAAF,UAAA,cAACU,EACC,KAAA,CAAA,KAAM5B,EAAQ6B,WAAaC,EAAAA,OAAOC,KAAOD,SAAOE,KAChD,KAAK,IACL,cAAW,EAAA,CAAA,EAEZhC,EAAQiC,IACX,CACF,CACD,CACH,EACCf,EAAAA,QAAA,cAAAI,WAAS,MAAT,IAAc,CACjB,CACF,EACAJ,UAAA,cAACgB,EAAoB,IAAA,EACpB,CAAC,CAAC1C,2BACA2C,EAAkB,CAAA,QAAS3C,EAC7B,CACH,CAEJ"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SlackConnectionError.js","sources":["../../../../../../src/modules/slack/components/SlackChannelCombobox/SlackConnectionError.tsx"],"sourcesContent":["import { useKnockSlackClient, useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport SlackErrorMessage from \"./SlackErrorMessage\";\n\nconst SlackConnectionError: FunctionComponent = () => {\n const { t } = useTranslations();\n const { connectionStatus } = useKnockSlackClient();\n\n if (connectionStatus === \"disconnected\" || connectionStatus === \"error\") {\n return (\n <SlackErrorMessage\n message={\n connectionStatus === \"disconnected\"\n ? t(\"slackConnectionErrorOccurred\")\n : t(\"slackConnectionErrorExists\")\n }\n />\n );\n }\n\n return null;\n};\n\nexport default SlackConnectionError;\n"],"names":["SlackConnectionError","t","useTranslations","connectionStatus","useKnockSlackClient","React","SlackErrorMessage"],"mappings":"4KAKMA,EAA0CA,IAAM,CAC9C,KAAA,CAAEC,EAAAA,GAAMC,
|
1
|
+
{"version":3,"file":"SlackConnectionError.js","sources":["../../../../../../src/modules/slack/components/SlackChannelCombobox/SlackConnectionError.tsx"],"sourcesContent":["import { useKnockSlackClient, useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport SlackErrorMessage from \"./SlackErrorMessage\";\n\nconst SlackConnectionError: FunctionComponent = () => {\n const { t } = useTranslations();\n const { connectionStatus } = useKnockSlackClient();\n\n if (connectionStatus === \"disconnected\" || connectionStatus === \"error\") {\n return (\n <SlackErrorMessage\n message={\n connectionStatus === \"disconnected\"\n ? t(\"slackConnectionErrorOccurred\")\n : t(\"slackConnectionErrorExists\")\n }\n />\n );\n }\n\n return null;\n};\n\nexport default SlackConnectionError;\n"],"names":["SlackConnectionError","t","useTranslations","connectionStatus","useKnockSlackClient","React","SlackErrorMessage"],"mappings":"4KAKMA,EAA0CA,IAAM,CAC9C,KAAA,CAAEC,EAAAA,GAAMC,kBAAgB,EACxB,CAAEC,iBAAAA,GAAqBC,sBAAoB,EAE7CD,OAAAA,IAAqB,gBAAkBA,IAAqB,QAE5DE,EAAA,QAAA,cAACC,EACC,CAAA,QAEML,EADJE,IAAqB,eACf,+BACA,4BAD8B,CAGtC,CAAA,EAIC,IACT"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SlackErrorMessage.js","sources":["../../../../../../src/modules/slack/components/SlackChannelCombobox/SlackErrorMessage.tsx"],"sourcesContent":["import { Icon, Lucide } from \"@telegraph/icon\";\nimport { Text } from \"@telegraph/typography\";\nimport { FunctionComponent } from \"react\";\n\ninterface Props {\n message?: string;\n}\n\nconst SlackErrorMessage: FunctionComponent<Props> = ({ message }) => {\n return (\n <div className=\"rsk-combobox__error\">\n <span>\n <Icon icon={Lucide.Info} color=\"black\" size=\"1\" aria-hidden />\n </span>\n <Text as=\"div\" color=\"black\" size=\"1\">\n {message}\n </Text>\n </div>\n );\n};\n\nexport default SlackErrorMessage;\n"],"names":["SlackErrorMessage","message","React","Icon","Lucide","Info","Text"],"mappings":"qKAQMA,EAA8CA,CAAC,CAAEC,QAAAA,CAAQ,IAE1DC,EAAAA,QAAA,cAAA,MAAA,CAAI,UAAU,qBAAA,EACZA,
|
1
|
+
{"version":3,"file":"SlackErrorMessage.js","sources":["../../../../../../src/modules/slack/components/SlackChannelCombobox/SlackErrorMessage.tsx"],"sourcesContent":["import { Icon, Lucide } from \"@telegraph/icon\";\nimport { Text } from \"@telegraph/typography\";\nimport { FunctionComponent } from \"react\";\n\ninterface Props {\n message?: string;\n}\n\nconst SlackErrorMessage: FunctionComponent<Props> = ({ message }) => {\n return (\n <div className=\"rsk-combobox__error\">\n <span>\n <Icon icon={Lucide.Info} color=\"black\" size=\"1\" aria-hidden />\n </span>\n <Text as=\"div\" color=\"black\" size=\"1\">\n {message}\n </Text>\n </div>\n );\n};\n\nexport default SlackErrorMessage;\n"],"names":["SlackErrorMessage","message","React","Icon","Lucide","Info","Text"],"mappings":"qKAQMA,EAA8CA,CAAC,CAAEC,QAAAA,CAAQ,IAE1DC,EAAAA,QAAA,cAAA,MAAA,CAAI,UAAU,qBAAA,EACZA,UAAA,cAAA,OAAA,KACEA,EAAAA,QAAA,cAAAC,EAAA,KAAA,CAAK,KAAMC,EAAAA,OAAOC,KAAM,MAAM,QAAQ,KAAK,IAAI,cAAW,EAAA,CAAA,CAC7D,EACAH,EAAA,QAAA,cAACI,EAAAA,KAAK,CAAA,GAAG,MAAM,MAAM,QAAQ,KAAK,GAC/BL,EAAAA,CACH,CACF"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SlackIcon.js","sources":["../../../../../../src/modules/slack/components/SlackIcon/SlackIcon.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\nexport interface SlackIconProps {\n height: string;\n width: string;\n}\n\nexport const SlackIcon: FunctionComponent<SlackIconProps> = ({\n height,\n width,\n}) => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n style={{ height, width }}\n viewBox=\"0 0 122.8 122.8\"\n >\n <path\n d=\"M25.8 77.6c0 7.1-5.8 12.9-12.9 12.9S0 84.7 0 77.6s5.8-12.9 12.9-12.9h12.9v12.9zm6.5 0c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9v32.3c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V77.6z\"\n fill=\"#e01e5a\"\n ></path>\n <path\n d=\"M45.2 25.8c-7.1 0-12.9-5.8-12.9-12.9S38.1 0 45.2 0s12.9 5.8 12.9 12.9v12.9H45.2zm0 6.5c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H12.9C5.8 58.1 0 52.3 0 45.2s5.8-12.9 12.9-12.9h32.3z\"\n fill=\"#36c5f0\"\n ></path>\n <path\n d=\"M97 45.2c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9-5.8 12.9-12.9 12.9H97V45.2zm-6.5 0c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V12.9C64.7 5.8 70.5 0 77.6 0s12.9 5.8 12.9 12.9v32.3z\"\n fill=\"#2eb67d\"\n ></path>\n <path\n d=\"M77.6 97c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9-12.9-5.8-12.9-12.9V97h12.9zm0-6.5c-7.1 0-12.9-5.8-12.9-12.9s5.8-12.9 12.9-12.9h32.3c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H77.6z\"\n fill=\"#ecb22e\"\n ></path>\n </svg>\n );\n};\n"],"names":["SlackIcon","height","width","React"],"mappings":"wKAOaA,EAA+CA,CAAC,CAC3DC,OAAAA,EACAC,MAAAA,CACF,IAEKC,EAAAA,QAAA,cAAA,MAAA,CACC,MAAM,6BACN,MAAO,CAAEF,OAAAA,EAAQC,MAAAA,CAAAA,EACjB,QAAQ,mBAERC,EAAAA,QAAA,cAAC,OACC,CAAA,EAAE,4LACF,KAAK,SACN,CAAA,EACAA,
|
1
|
+
{"version":3,"file":"SlackIcon.js","sources":["../../../../../../src/modules/slack/components/SlackIcon/SlackIcon.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\nexport interface SlackIconProps {\n height: string;\n width: string;\n}\n\nexport const SlackIcon: FunctionComponent<SlackIconProps> = ({\n height,\n width,\n}) => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n style={{ height, width }}\n viewBox=\"0 0 122.8 122.8\"\n >\n <path\n d=\"M25.8 77.6c0 7.1-5.8 12.9-12.9 12.9S0 84.7 0 77.6s5.8-12.9 12.9-12.9h12.9v12.9zm6.5 0c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9v32.3c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V77.6z\"\n fill=\"#e01e5a\"\n ></path>\n <path\n d=\"M45.2 25.8c-7.1 0-12.9-5.8-12.9-12.9S38.1 0 45.2 0s12.9 5.8 12.9 12.9v12.9H45.2zm0 6.5c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H12.9C5.8 58.1 0 52.3 0 45.2s5.8-12.9 12.9-12.9h32.3z\"\n fill=\"#36c5f0\"\n ></path>\n <path\n d=\"M97 45.2c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9-5.8 12.9-12.9 12.9H97V45.2zm-6.5 0c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V12.9C64.7 5.8 70.5 0 77.6 0s12.9 5.8 12.9 12.9v32.3z\"\n fill=\"#2eb67d\"\n ></path>\n <path\n d=\"M77.6 97c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9-12.9-5.8-12.9-12.9V97h12.9zm0-6.5c-7.1 0-12.9-5.8-12.9-12.9s5.8-12.9 12.9-12.9h32.3c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H77.6z\"\n fill=\"#ecb22e\"\n ></path>\n </svg>\n );\n};\n"],"names":["SlackIcon","height","width","React"],"mappings":"wKAOaA,EAA+CA,CAAC,CAC3DC,OAAAA,EACAC,MAAAA,CACF,IAEKC,EAAAA,QAAA,cAAA,MAAA,CACC,MAAM,6BACN,MAAO,CAAEF,OAAAA,EAAQC,MAAAA,CAAAA,EACjB,QAAQ,mBAERC,EAAAA,QAAA,cAAC,OACC,CAAA,EAAE,4LACF,KAAK,SACN,CAAA,EACAA,UAAA,cAAA,OAAA,CACC,EAAE,2LACF,KAAK,SACN,CAAA,EACAA,EAAA,QAAA,cAAA,OAAA,CACC,EAAE,4LACF,KAAK,SAAA,CACN,EACDA,UAAA,cAAC,OACC,CAAA,EAAE,+LACF,KAAK,UACN,CACH"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Button.mjs","sources":["../../../../../../src/modules/core/components/Button/Button.tsx"],"sourcesContent":["import { useKnockFeed } from \"@knocklabs/react-core\";\nimport React, { PropsWithChildren } from \"react\";\nimport { FunctionComponent } from \"react\";\n\nimport { ButtonSpinner } from \"./ButtonSpinner\";\nimport \"./styles.css\";\n\nexport type ButtonProps = {\n variant: \"primary\" | \"secondary\";\n loadingText?: string;\n isLoading?: boolean;\n isDisabled?: boolean;\n isFullWidth?: boolean;\n onClick: (e: React.MouseEvent) => void;\n};\n\nexport const Button: FunctionComponent<PropsWithChildren<ButtonProps>> = ({\n variant = \"primary\",\n loadingText,\n isLoading = false,\n isDisabled = false,\n isFullWidth = false,\n onClick,\n children,\n}) => {\n const { colorMode } = useKnockFeed();\n\n const classNames = [\n \"rnf-button\",\n `rnf-button--${variant}`,\n isFullWidth ? \"rnf-button--full-width\" : \"\",\n isLoading ? \"rnf-button--is-loading\" : \"\",\n `rnf-button--${colorMode}`,\n ].join(\" \");\n\n // In this case when there's no loading text, we still want to display the original\n // content of the button, but make it hidden. That allows us to keep the button width\n // consistent and show the spinner in the middle, meaning no layout shift.\n const textToShowWhileLoading = loadingText || (\n <span className=\"rnf-button__button-text-hidden\">{children}</span>\n );\n\n return (\n <button\n onClick={onClick}\n className={classNames}\n disabled={isLoading || isDisabled}\n type=\"button\"\n >\n {isLoading && <ButtonSpinner hasLabel={!!loadingText} />}\n {isLoading ? textToShowWhileLoading : children}\n </button>\n );\n};\n"],"names":["Button","variant","loadingText","isLoading","isDisabled","isFullWidth","onClick","children","colorMode","useKnockFeed","classNames","join","textToShowWhileLoading","React","ButtonSpinner"],"mappings":";;;;AAgBO,MAAMA,IAA4DA,CAAC;AAAA,EACxEC,SAAAA,IAAU;AAAA,EACVC,aAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,YAAAA,IAAa;AAAA,EACbC,aAAAA,IAAc;AAAA,EACdC,SAAAA;AAAAA,EACAC,UAAAA;AACF,MAAM;AACE,QAAA;AAAA,IAAEC,WAAAA;AAAAA,MAAcC,EAAa,GAE7BC,IAAa,CACjB,cACA,eAAeT,CAAO,IACtBI,IAAc,2BAA2B,IACzCF,IAAY,2BAA2B,IACvC,eAAeK,CAAS,EAAE,EAC1BG,KAAK,GAAG,GAKJC,IAAyBV,KAC7BW,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAU,oCAAkCN,CAAS;AAI3D,SAAAM,gBAAAA,EAAA,cAAC,YACC,SAAAP,GACA,WAAWI,GACX,UAAUP,KAAaC,GACvB,MAAK,
|
1
|
+
{"version":3,"file":"Button.mjs","sources":["../../../../../../src/modules/core/components/Button/Button.tsx"],"sourcesContent":["import { useKnockFeed } from \"@knocklabs/react-core\";\nimport React, { PropsWithChildren } from \"react\";\nimport { FunctionComponent } from \"react\";\n\nimport { ButtonSpinner } from \"./ButtonSpinner\";\nimport \"./styles.css\";\n\nexport type ButtonProps = {\n variant: \"primary\" | \"secondary\";\n loadingText?: string;\n isLoading?: boolean;\n isDisabled?: boolean;\n isFullWidth?: boolean;\n onClick: (e: React.MouseEvent) => void;\n};\n\nexport const Button: FunctionComponent<PropsWithChildren<ButtonProps>> = ({\n variant = \"primary\",\n loadingText,\n isLoading = false,\n isDisabled = false,\n isFullWidth = false,\n onClick,\n children,\n}) => {\n const { colorMode } = useKnockFeed();\n\n const classNames = [\n \"rnf-button\",\n `rnf-button--${variant}`,\n isFullWidth ? \"rnf-button--full-width\" : \"\",\n isLoading ? \"rnf-button--is-loading\" : \"\",\n `rnf-button--${colorMode}`,\n ].join(\" \");\n\n // In this case when there's no loading text, we still want to display the original\n // content of the button, but make it hidden. That allows us to keep the button width\n // consistent and show the spinner in the middle, meaning no layout shift.\n const textToShowWhileLoading = loadingText || (\n <span className=\"rnf-button__button-text-hidden\">{children}</span>\n );\n\n return (\n <button\n onClick={onClick}\n className={classNames}\n disabled={isLoading || isDisabled}\n type=\"button\"\n >\n {isLoading && <ButtonSpinner hasLabel={!!loadingText} />}\n {isLoading ? textToShowWhileLoading : children}\n </button>\n );\n};\n"],"names":["Button","variant","loadingText","isLoading","isDisabled","isFullWidth","onClick","children","colorMode","useKnockFeed","classNames","join","textToShowWhileLoading","React","ButtonSpinner"],"mappings":";;;;AAgBO,MAAMA,IAA4DA,CAAC;AAAA,EACxEC,SAAAA,IAAU;AAAA,EACVC,aAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,YAAAA,IAAa;AAAA,EACbC,aAAAA,IAAc;AAAA,EACdC,SAAAA;AAAAA,EACAC,UAAAA;AACF,MAAM;AACE,QAAA;AAAA,IAAEC,WAAAA;AAAAA,MAAcC,EAAa,GAE7BC,IAAa,CACjB,cACA,eAAeT,CAAO,IACtBI,IAAc,2BAA2B,IACzCF,IAAY,2BAA2B,IACvC,eAAeK,CAAS,EAAE,EAC1BG,KAAK,GAAG,GAKJC,IAAyBV,KAC7BW,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAU,oCAAkCN,CAAS;AAI3D,SAAAM,gBAAAA,EAAA,cAAC,YACC,SAAAP,GACA,WAAWI,GACX,UAAUP,KAAaC,GACvB,MAAK,YAEJD,KAAcU,gBAAAA,EAAA,cAAAC,GAAA,EAAc,UAAU,CAAC,CAACZ,GAAe,GACvDC,IAAYS,IAAyBL,CACxC;AAEJ;"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Bell.mjs","sources":["../../../../../../src/modules/core/components/Icons/Bell.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\ntype BellIconProps = {\n width?: number;\n height?: number;\n \"aria-hidden\"?: boolean;\n};\n\nconst BellIcon: FunctionComponent<BellIconProps> = ({\n width = 24,\n height = 24,\n \"aria-hidden\": ariaHidden,\n}) => {\n return (\n <svg\n width={width}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n height={height}\n aria-hidden={ariaHidden}\n >\n <path\n d=\"M20.0474 16.4728C18.8436 14.9996 17.9938 14.2496 17.9938 10.1879C17.9938 6.46832 16.0944 5.14317 14.5311 4.49957C14.3235 4.41426 14.128 4.21832 14.0647 4.00504C13.7905 3.07176 13.0217 2.24957 11.9999 2.24957C10.978 2.24957 10.2088 3.07223 9.93736 4.00598C9.87408 4.2216 9.67861 4.41426 9.47096 4.49957C7.9058 5.1441 6.0083 6.46457 6.0083 10.1879C6.00596 14.2496 5.15611 14.9996 3.95237 16.4728C3.45362 17.0832 3.89049 17.9996 4.76283 17.9996H19.2416C20.1092 17.9996 20.5433 17.0803 20.0474 16.4728Z\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n d=\"M14.9999 17.9988V18.7488C14.9999 19.5445 14.6838 20.3075 14.1212 20.8701C13.5586 21.4327 12.7955 21.7488 11.9999 21.7488C11.2042 21.7488 10.4412 21.4327 9.87856 20.8701C9.31595 20.3075 8.99988 19.5445 8.99988 18.7488V17.9988\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n};\n\nexport { BellIcon };\n"],"names":["BellIcon","width","height","ariaHidden","React"],"mappings":";AAQA,MAAMA,IAA6CA,CAAC;AAAA,EAClDC,OAAAA,IAAQ;AAAA,EACRC,QAAAA,IAAS;AAAA,EACT,eAAeC;AACjB,MAEKC,gBAAAA,EAAA,cAAA,OAAA,EACC,OAAAH,GACA,SAAQ,aACR,MAAK,QACL,QAAAC,GACA,eAAaC,KAEZC,gBAAAA,EAAA,cAAA,QAAA,EACC,GAAE,sfACF,QAAO,gBACP,aAAY,OACZ,eAAc,SACd,gBAAe,
|
1
|
+
{"version":3,"file":"Bell.mjs","sources":["../../../../../../src/modules/core/components/Icons/Bell.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\ntype BellIconProps = {\n width?: number;\n height?: number;\n \"aria-hidden\"?: boolean;\n};\n\nconst BellIcon: FunctionComponent<BellIconProps> = ({\n width = 24,\n height = 24,\n \"aria-hidden\": ariaHidden,\n}) => {\n return (\n <svg\n width={width}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n height={height}\n aria-hidden={ariaHidden}\n >\n <path\n d=\"M20.0474 16.4728C18.8436 14.9996 17.9938 14.2496 17.9938 10.1879C17.9938 6.46832 16.0944 5.14317 14.5311 4.49957C14.3235 4.41426 14.128 4.21832 14.0647 4.00504C13.7905 3.07176 13.0217 2.24957 11.9999 2.24957C10.978 2.24957 10.2088 3.07223 9.93736 4.00598C9.87408 4.2216 9.67861 4.41426 9.47096 4.49957C7.9058 5.1441 6.0083 6.46457 6.0083 10.1879C6.00596 14.2496 5.15611 14.9996 3.95237 16.4728C3.45362 17.0832 3.89049 17.9996 4.76283 17.9996H19.2416C20.1092 17.9996 20.5433 17.0803 20.0474 16.4728Z\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n <path\n d=\"M14.9999 17.9988V18.7488C14.9999 19.5445 14.6838 20.3075 14.1212 20.8701C13.5586 21.4327 12.7955 21.7488 11.9999 21.7488C11.2042 21.7488 10.4412 21.4327 9.87856 20.8701C9.31595 20.3075 8.99988 19.5445 8.99988 18.7488V17.9988\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n};\n\nexport { BellIcon };\n"],"names":["BellIcon","width","height","ariaHidden","React"],"mappings":";AAQA,MAAMA,IAA6CA,CAAC;AAAA,EAClDC,OAAAA,IAAQ;AAAA,EACRC,QAAAA,IAAS;AAAA,EACT,eAAeC;AACjB,MAEKC,gBAAAA,EAAA,cAAA,OAAA,EACC,OAAAH,GACA,SAAQ,aACR,MAAK,QACL,QAAAC,GACA,eAAaC,KAEZC,gBAAAA,EAAA,cAAA,QAAA,EACC,GAAE,sfACF,QAAO,gBACP,aAAY,OACZ,eAAc,SACd,gBAAe,QAAO,CAAA,GAExBA,gBAAAA,EAAA,cAAC,UACC,GAAE,oOACF,QAAO,gBACP,aAAY,OACZ,eAAc,SACd,gBAAe,SAAO,CAE1B;"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useComponentVisible.mjs","sources":["../../../../../src/modules/core/hooks/useComponentVisible.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\nfunction contains(parent: HTMLElement | null, child: HTMLElement) {\n if (!parent) return false;\n return parent === child || parent.contains(child);\n}\n\ntype Options = {\n closeOnClickOutside: boolean;\n};\n\nexport default function useComponentVisible(\n isVisible: boolean,\n onClose: (event: Event) => void,\n options: Options,\n) {\n const ref = useRef<HTMLDivElement>(null);\n\n const handleKeydown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onClose(event);\n }\n };\n\n const handleClickOutside = (event: Event) => {\n if (\n options.closeOnClickOutside &&\n !contains(ref.current, event.target as HTMLElement)\n ) {\n onClose(event);\n }\n };\n\n useEffect(() => {\n if (isVisible) {\n document.addEventListener(\"keydown\", handleKeydown, true);\n document.addEventListener(\"click\", handleClickOutside, true);\n }\n\n return () => {\n document.removeEventListener(\"keydown\", handleKeydown, true);\n document.removeEventListener(\"click\", handleClickOutside, true);\n };\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible]);\n\n return { ref };\n}\n"],"names":["contains","parent","child","useComponentVisible","isVisible","onClose","options","ref","useRef","handleKeydown","event","key","handleClickOutside","closeOnClickOutside","current","target","useEffect","addEventListener","removeEventListener"],"mappings":";AAEA,SAASA,EAASC,GAA4BC,GAAoB;AAC5D,SAACD,IACEA,MAAWC,KAASD,EAAOD,SAASE,CAAK,IAD5B;AAEtB;AAMwBC,SAAAA,EACtBC,GACAC,GACAC,GACA;AACMC,QAAAA,IAAMC,EAAuB,IAAI,GAEjCC,IAAgBA,CAACC,MAAyB;AAC1CA,IAAAA,EAAMC,QAAQ,YAChBN,EAAQK,CAAK;AAAA,
|
1
|
+
{"version":3,"file":"useComponentVisible.mjs","sources":["../../../../../src/modules/core/hooks/useComponentVisible.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\nfunction contains(parent: HTMLElement | null, child: HTMLElement) {\n if (!parent) return false;\n return parent === child || parent.contains(child);\n}\n\ntype Options = {\n closeOnClickOutside: boolean;\n};\n\nexport default function useComponentVisible(\n isVisible: boolean,\n onClose: (event: Event) => void,\n options: Options,\n) {\n const ref = useRef<HTMLDivElement>(null);\n\n const handleKeydown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onClose(event);\n }\n };\n\n const handleClickOutside = (event: Event) => {\n if (\n options.closeOnClickOutside &&\n !contains(ref.current, event.target as HTMLElement)\n ) {\n onClose(event);\n }\n };\n\n useEffect(() => {\n if (isVisible) {\n document.addEventListener(\"keydown\", handleKeydown, true);\n document.addEventListener(\"click\", handleClickOutside, true);\n }\n\n return () => {\n document.removeEventListener(\"keydown\", handleKeydown, true);\n document.removeEventListener(\"click\", handleClickOutside, true);\n };\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible]);\n\n return { ref };\n}\n"],"names":["contains","parent","child","useComponentVisible","isVisible","onClose","options","ref","useRef","handleKeydown","event","key","handleClickOutside","closeOnClickOutside","current","target","useEffect","addEventListener","removeEventListener"],"mappings":";AAEA,SAASA,EAASC,GAA4BC,GAAoB;AAC5D,SAACD,IACEA,MAAWC,KAASD,EAAOD,SAASE,CAAK,IAD5B;AAEtB;AAMwBC,SAAAA,EACtBC,GACAC,GACAC,GACA;AACMC,QAAAA,IAAMC,EAAuB,IAAI,GAEjCC,IAAgBA,CAACC,MAAyB;AAC1CA,IAAAA,EAAMC,QAAQ,YAChBN,EAAQK,CAAK;AAAA,EAEjB,GAEME,IAAqBA,CAACF,MAAiB;AAEzCJ,IAAAA,EAAQO,uBACR,CAACb,EAASO,EAAIO,SAASJ,EAAMK,MAAqB,KAElDV,EAAQK,CAAK;AAAA,EAEjB;AAEAM,SAAAA,EAAU,OACJZ,MACOa,SAAAA,iBAAiB,WAAWR,GAAe,EAAI,GAC/CQ,SAAAA,iBAAiB,SAASL,GAAoB,EAAI,IAGtD,MAAM;AACFM,aAAAA,oBAAoB,WAAWT,GAAe,EAAI,GAClDS,SAAAA,oBAAoB,SAASN,GAAoB,EAAI;AAAA,EAChE,IAGC,CAACR,CAAS,CAAC,GAEP;AAAA,IAAEG,KAAAA;AAAAA,EAAI;AACf;"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useOnBottomScroll.mjs","sources":["../../../../../src/modules/core/hooks/useOnBottomScroll.ts"],"sourcesContent":["import debounce from \"lodash.debounce\";\nimport { RefObject, useCallback, useEffect, useMemo } from \"react\";\n\ntype OnBottomScrollOptions = {\n ref: RefObject<HTMLDivElement | undefined>;\n callback: () => void;\n offset?: number;\n};\n\nconst noop = () => {};\n\nfunction useOnBottomScroll(options: OnBottomScrollOptions) {\n const callback = options.callback ?? noop;\n const ref = options.ref;\n const offset = options.offset ?? 0;\n\n const debouncedCallback = useMemo(() => debounce(callback, 200), [callback]);\n\n const handleOnScroll = useCallback(() => {\n if (ref.current) {\n const scrollNode = ref.current;\n const scrollContainerBottomPosition = Math.round(\n scrollNode.scrollTop + scrollNode.clientHeight,\n );\n const scrollPosition = Math.round(scrollNode.scrollHeight - offset);\n\n if (scrollPosition <= scrollContainerBottomPosition) {\n debouncedCallback();\n }\n }\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedCallback]);\n\n useEffect(() => {\n let element: HTMLElement | undefined;\n if (ref.current) {\n element = ref.current;\n ref.current.addEventListener(\"scroll\", handleOnScroll);\n }\n\n return () => {\n if (element) {\n element.removeEventListener(\"scroll\", handleOnScroll);\n }\n };\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [handleOnScroll]);\n}\n\nexport default useOnBottomScroll;\n"],"names":["noop","useOnBottomScroll","options","callback","ref","offset","debouncedCallback","useMemo","debounce","handleOnScroll","useCallback","current","scrollNode","scrollContainerBottomPosition","Math","round","scrollTop","clientHeight","scrollHeight","useEffect","element","addEventListener","removeEventListener"],"mappings":";;AASA,MAAMA,IAAOA,MAAM;AAAC;AAEpB,SAASC,EAAkBC,GAAgC;AACnDC,QAAAA,IAAWD,EAAQC,YAAYH,GAC/BI,IAAMF,EAAQE,KACdC,IAASH,EAAQG,UAAU,GAE3BC,IAAoBC,EAAQ,MAAMC,EAASL,GAAU,GAAG,GAAG,CAACA,CAAQ,CAAC,GAErEM,IAAiBC,EAAY,MAAM;AACvC,QAAIN,EAAIO,SAAS;AACf,YAAMC,IAAaR,EAAIO,SACjBE,IAAgCC,KAAKC,MACzCH,EAAWI,YAAYJ,EAAWK,YACpC;AAGA,MAFuBH,KAAKC,MAAMH,EAAWM,eAAeb,CAAM,KAE5CQ,KACFP;
|
1
|
+
{"version":3,"file":"useOnBottomScroll.mjs","sources":["../../../../../src/modules/core/hooks/useOnBottomScroll.ts"],"sourcesContent":["import debounce from \"lodash.debounce\";\nimport { RefObject, useCallback, useEffect, useMemo } from \"react\";\n\ntype OnBottomScrollOptions = {\n ref: RefObject<HTMLDivElement | undefined>;\n callback: () => void;\n offset?: number;\n};\n\nconst noop = () => {};\n\nfunction useOnBottomScroll(options: OnBottomScrollOptions) {\n const callback = options.callback ?? noop;\n const ref = options.ref;\n const offset = options.offset ?? 0;\n\n const debouncedCallback = useMemo(() => debounce(callback, 200), [callback]);\n\n const handleOnScroll = useCallback(() => {\n if (ref.current) {\n const scrollNode = ref.current;\n const scrollContainerBottomPosition = Math.round(\n scrollNode.scrollTop + scrollNode.clientHeight,\n );\n const scrollPosition = Math.round(scrollNode.scrollHeight - offset);\n\n if (scrollPosition <= scrollContainerBottomPosition) {\n debouncedCallback();\n }\n }\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedCallback]);\n\n useEffect(() => {\n let element: HTMLElement | undefined;\n if (ref.current) {\n element = ref.current;\n ref.current.addEventListener(\"scroll\", handleOnScroll);\n }\n\n return () => {\n if (element) {\n element.removeEventListener(\"scroll\", handleOnScroll);\n }\n };\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [handleOnScroll]);\n}\n\nexport default useOnBottomScroll;\n"],"names":["noop","useOnBottomScroll","options","callback","ref","offset","debouncedCallback","useMemo","debounce","handleOnScroll","useCallback","current","scrollNode","scrollContainerBottomPosition","Math","round","scrollTop","clientHeight","scrollHeight","useEffect","element","addEventListener","removeEventListener"],"mappings":";;AASA,MAAMA,IAAOA,MAAM;AAAC;AAEpB,SAASC,EAAkBC,GAAgC;AACnDC,QAAAA,IAAWD,EAAQC,YAAYH,GAC/BI,IAAMF,EAAQE,KACdC,IAASH,EAAQG,UAAU,GAE3BC,IAAoBC,EAAQ,MAAMC,EAASL,GAAU,GAAG,GAAG,CAACA,CAAQ,CAAC,GAErEM,IAAiBC,EAAY,MAAM;AACvC,QAAIN,EAAIO,SAAS;AACf,YAAMC,IAAaR,EAAIO,SACjBE,IAAgCC,KAAKC,MACzCH,EAAWI,YAAYJ,EAAWK,YACpC;AAGA,MAFuBH,KAAKC,MAAMH,EAAWM,eAAeb,CAAM,KAE5CQ,KACFP,EAAA;AAAA,IACpB;AAAA,EACF,GAGC,CAACA,CAAiB,CAAC;AAEtBa,EAAAA,EAAU,MAAM;AACVC,QAAAA;AACJ,WAAIhB,EAAIO,YACNS,IAAUhB,EAAIO,SACVA,EAAAA,QAAQU,iBAAiB,UAAUZ,CAAc,IAGhD,MAAM;AACX,MAAIW,KACME,EAAAA,oBAAoB,UAAUb,CAAc;AAAA,IAExD;AAAA,EAAA,GAGC,CAACA,CAAc,CAAC;AACrB;"}
|
@@ -1,33 +1,39 @@
|
|
1
|
-
import {
|
2
|
-
import
|
3
|
-
import {
|
4
|
-
import { CloseCircle as
|
1
|
+
import n, { useState as p, useRef as f, useCallback as m, useEffect as d } from "react";
|
2
|
+
import { useKnockFeed as v, useTranslations as b } from "@knocklabs/react-core";
|
3
|
+
import { createPopper as h } from "@popperjs/core";
|
4
|
+
import { CloseCircle as C } from "../../../core/components/Icons/CloseCircle.mjs";
|
5
5
|
const g = ({
|
6
|
-
item:
|
6
|
+
item: i
|
7
7
|
}) => {
|
8
8
|
const {
|
9
|
-
colorMode:
|
10
|
-
feedClient:
|
11
|
-
} =
|
12
|
-
t:
|
13
|
-
} =
|
14
|
-
(
|
15
|
-
|
9
|
+
colorMode: a,
|
10
|
+
feedClient: l
|
11
|
+
} = v(), {
|
12
|
+
t: c
|
13
|
+
} = b(), [t, s] = p(!1), o = f(null), r = f(null), u = m(
|
14
|
+
(e) => {
|
15
|
+
e.preventDefault(), e.stopPropagation(), l.markAsArchived(i);
|
16
16
|
},
|
17
17
|
// TODO: Check if we can remove this disable
|
18
18
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
19
|
-
[
|
20
|
-
)
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
19
|
+
[i]
|
20
|
+
);
|
21
|
+
return d(() => {
|
22
|
+
if (o.current && r.current && t) {
|
23
|
+
const e = h(o.current, r.current, {
|
24
|
+
placement: "top-end",
|
25
|
+
modifiers: [{
|
26
|
+
name: "offset",
|
27
|
+
options: {
|
28
|
+
offset: [0, 8]
|
29
|
+
}
|
30
|
+
}]
|
31
|
+
});
|
32
|
+
return () => {
|
33
|
+
e.destroy();
|
34
|
+
};
|
35
|
+
}
|
36
|
+
}, [t]), /* @__PURE__ */ n.createElement("button", { ref: o, onClick: u, onMouseEnter: () => s(!0), onMouseLeave: () => s(!1), type: "button", "aria-label": c("archiveNotification"), className: `rnf-archive-notification-btn rnf-archive-notification-btn--${a}` }, /* @__PURE__ */ n.createElement(C, { "aria-hidden": !0 }), t && /* @__PURE__ */ n.createElement("div", { ref: r, className: `rnf-tooltip rnf-tooltip--${a}` }, c("archiveNotification")));
|
31
37
|
};
|
32
38
|
export {
|
33
39
|
g as ArchiveButton
|