@workos-inc/widgets 1.5.0 → 1.6.0

package/dist/cjs/workos-widgets.client.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/workos-widgets.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { Theme as RadixThemes } from \"@radix-ui/themes\";\nimport type { GetPropDefTypes, themePropDefs } from \"@radix-ui/themes/props\";\nimport {\n  QueryClient,\n  QueryClientProvider,\n  useQueryClient,\n} from \"@tanstack/react-query\";\nimport cx from \"clsx\";\nimport * as React from \"react\";\nimport { namespaceClassNames } from \"./lib/utils.js\";\nimport { DEFAULT_API_HOSTNAME } from \"./lib/api/config.js\";\nimport type { Elements } from \"./lib/elements.js\";\nimport { WidgetsContext } from \"./lib/widgets-context.js\";\n\nlet queryClientInternal: QueryClient | undefined;\n\nexport interface WorkOsWidgetsProps {\n  elements?: Elements;\n  theme?: Omit<GetPropDefTypes<typeof themePropDefs>, \"asChild\"> & {\n    fontFamily?: string;\n  };\n  style?: React.CSSProperties;\n  className?: string;\n  children: React.ReactNode;\n  apiHostname?: string;\n  port?: number | null;\n  https?: boolean;\n  /**\n   * Optional query client for users who are already using Tanstack Query. If\n   * not provided, a new query client will be created and mounted internally.\n   */\n  queryClient?: QueryClient;\n}\n\nexport const WorkOsWidgets: React.FC<WorkOsWidgetsProps> = ({\n  elements = {},\n  className,\n  theme: { fontFamily, ...radixThemesProps } = {},\n  style = {},\n  children,\n  apiHostname = DEFAULT_API_HOSTNAME,\n  port = null,\n  https = true,\n  queryClient,\n}) => {\n  const customStyle: React.CSSProperties = fontFamily\n    ? {\n        \"--default-font-family\": fontFamily,\n        ...style,\n      }\n    : style;\n\n  const apiBaseUrl = React.useMemo(() => {\n    try {\n      const url = new URL(\n        \"/\",\n        `${https ? \"https\" : \"http\"}://${apiHostname}${port ? `:${port}` : \"\"}`,\n      );\n      return url.toString().slice(0, -1);\n    } catch {\n      console.error(\n        \"Failed to validate the WorkOS API URL. Check to ensure that valid `apiHostname` and `port` props are passed to WorkOsWidgets\",\n      );\n      return `https://${DEFAULT_API_HOSTNAME}`;\n    }\n  }, [apiHostname, https, port]);\n\n  return (\n    <QueryClientProviderImpl client={queryClient}>\n      <RadixThemes\n        {...radixThemesProps}\n        style={customStyle}\n        className={cx(namespaceClassNames(\"root\"), className)}\n      >\n        <WidgetsContext.Provider value={{ elements, apiBaseUrl }}>\n          {children}\n        </WidgetsContext.Provider>\n      </RadixThemes>\n    </QueryClientProviderImpl>\n  );\n};\n\nconst QueryClientProviderImpl = ({\n  client: providedClient,\n  children,\n}: {\n  client: QueryClient | undefined;\n  children: React.ReactNode;\n}) => {\n  let queryClient: QueryClient;\n  if (providedClient) {\n    queryClient = providedClient;\n  } else if (queryClientInternal) {\n    queryClient = queryClientInternal;\n  } else {\n    queryClientInternal = new QueryClient();\n    queryClient = queryClientInternal;\n  }\n\n  const client = useQueryClient(queryClient);\n  if (Object.is(client, providedClient)) {\n    // No need for a new context provider if the user provided the client to\n    // their own provider, which has already mounted the client.\n    return <>{children}</>;\n  }\n\n  return <QueryClientProvider client={client}>{children}</QueryClientProvider>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4EQ;AA1ER,oBAAqC;AAErC,yBAIO;AACP,kBAAe;AACf,YAAuB;AACvB,mBAAoC;AACpC,oBAAqC;AAErC,6BAA+B;AAE/B,IAAI;AAoBG,MAAM,gBAA8C,CAAC;AAAA,EAC1D,WAAW,CAAC;AAAA,EACZ;AAAA,EACA,OAAO,EAAE,YAAY,GAAG,iBAAiB,IAAI,CAAC;AAAA,EAC9C,QAAQ,CAAC;AAAA,EACT;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA,EACR;AACF,MAAM;AACJ,QAAM,cAAmC,aACrC;AAAA,IACE,yBAAyB;AAAA,IACzB,GAAG;AAAA,EACL,IACA;AAEJ,QAAM,aAAa,MAAM,QAAQ,MAAM;AACrC,QAAI;AACF,YAAM,MAAM,IAAI;AAAA,QACd;AAAA,QACA,GAAG,QAAQ,UAAU,MAAM,MAAM,WAAW,GAAG,OAAO,IAAI,IAAI,KAAK,EAAE;AAAA,MACvE;AACA,aAAO,IAAI,SAAS,EAAE,MAAM,GAAG,EAAE;AAAA,IACnC,QAAQ;AACN,cAAQ;AAAA,QACN;AAAA,MACF;AACA,aAAO,WAAW,kCAAoB;AAAA,IACxC;AAAA,EACF,GAAG,CAAC,aAAa,OAAO,IAAI,CAAC;AAE7B,SACE,4CAAC,2BAAwB,QAAQ,aAC/B;AAAA,IAAC,cAAAA;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,OAAO;AAAA,MACP,eAAW,YAAAC,aAAG,kCAAoB,MAAM,GAAG,SAAS;AAAA,MAEpD,sDAAC,sCAAe,UAAf,EAAwB,OAAO,EAAE,UAAU,WAAW,GACpD,UACH;AAAA;AAAA,EACF,GACF;AAEJ;AAEA,MAAM,0BAA0B,CAAC;AAAA,EAC/B,QAAQ;AAAA,EACR;AACF,MAGM;AACJ,MAAI;AACJ,MAAI,gBAAgB;AAClB,kBAAc;AAAA,EAChB,WAAW,qBAAqB;AAC9B,kBAAc;AAAA,EAChB,OAAO;AACL,0BAAsB,IAAI,+BAAY;AACtC,kBAAc;AAAA,EAChB;AAEA,QAAM,aAAS,mCAAe,WAAW;AACzC,MAAI,OAAO,GAAG,QAAQ,cAAc,GAAG;AAGrC,WAAO,2EAAG,UAAS;AAAA,EACrB;AAEA,SAAO,4CAAC,0CAAoB,QAAiB,UAAS;AACxD;","names":["RadixThemes","cx"]}
+{"version":3,"sources":["../../src/workos-widgets.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { Theme as RadixThemes } from \"@radix-ui/themes\";\nimport type { GetPropDefTypes, themePropDefs } from \"@radix-ui/themes/props\";\nimport {\n  QueryClient,\n  QueryClientProvider,\n  useQueryClient,\n} from \"@tanstack/react-query\";\nimport cx from \"clsx\";\nimport * as React from \"react\";\nimport { namespaceClassNames } from \"./lib/utils.js\";\nimport { DEFAULT_API_HOSTNAME } from \"./lib/api/config.js\";\nimport type { Elements } from \"./lib/elements.js\";\nimport { WidgetsContext } from \"./lib/widgets-context.js\";\nimport { WIDGETS_DATA_ATTRIBUTE_NAMESPACE } from \"./lib/constants.js\";\n\nexport interface WorkOsWidgetsProps {\n  elements?: Elements;\n  theme?: Omit<GetPropDefTypes<typeof themePropDefs>, \"asChild\"> & {\n    fontFamily?: string;\n  };\n  style?: React.CSSProperties;\n  className?: string;\n  children: React.ReactNode;\n  apiHostname?: string;\n  port?: number | null;\n  https?: boolean;\n  /**\n   * Optional query client for users who are already using Tanstack Query. If\n   * not provided, a new query client will be created and mounted internally.\n   */\n  queryClient?: QueryClient;\n}\n\nexport const WorkOsWidgets: React.FC<WorkOsWidgetsProps> = ({\n  elements = {},\n  theme: { fontFamily, ...radixThemesProps } = {},\n  style = {},\n  children,\n  apiHostname = DEFAULT_API_HOSTNAME,\n  port = null,\n  https = true,\n  queryClient,\n  className,\n}) => {\n  const customStyle: React.CSSProperties = fontFamily\n    ? {\n        \"--default-font-family\": fontFamily,\n        ...style,\n      }\n    : style;\n\n  const apiBaseUrl = React.useMemo(() => {\n    try {\n      const url = new URL(\n        \"/\",\n        `${https ? \"https\" : \"http\"}://${apiHostname}${port ? `:${port}` : \"\"}`,\n      );\n      return url.toString().slice(0, -1);\n    } catch {\n      console.error(\n        \"Failed to validate the WorkOS API URL. Check to ensure that valid `apiHostname` and `port` props are passed to WorkOsWidgets\",\n      );\n      return `https://${DEFAULT_API_HOSTNAME}`;\n    }\n  }, [apiHostname, https, port]);\n\n  return (\n    <QueryClientProviderImpl client={queryClient}>\n      <RadixThemes\n        {...radixThemesProps}\n        {...{ [`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-root`]: true }}\n        style={customStyle}\n        className={cx(namespaceClassNames(\"root\"), className)}\n      >\n        <WidgetsContext.Provider value={{ elements, apiBaseUrl }}>\n          {children}\n        </WidgetsContext.Provider>\n      </RadixThemes>\n    </QueryClientProviderImpl>\n  );\n};\n\nconst QueryClientProviderImpl = ({\n  client: providedClient,\n  children,\n}: {\n  client: QueryClient | undefined;\n  children: React.ReactNode;\n}) => {\n  const [queryClient] = React.useState(\n    () => providedClient ?? new QueryClient(),\n  );\n\n  const client = useQueryClient(queryClient);\n  if (Object.is(client, providedClient)) {\n    // No need for a new context provider if the user provided the client to\n    // their own provider, which has already mounted the client.\n    return <>{children}</>;\n  }\n\n  return <QueryClientProvider client={client}>{children}</QueryClientProvider>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4EQ;AA1ER,oBAAqC;AAErC,yBAIO;AACP,kBAAe;AACf,YAAuB;AACvB,mBAAoC;AACpC,oBAAqC;AAErC,6BAA+B;AAC/B,uBAAiD;AAoB1C,MAAM,gBAA8C,CAAC;AAAA,EAC1D,WAAW,CAAC;AAAA,EACZ,OAAO,EAAE,YAAY,GAAG,iBAAiB,IAAI,CAAC;AAAA,EAC9C,QAAQ,CAAC;AAAA,EACT;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA,EACR;AAAA,EACA;AACF,MAAM;AACJ,QAAM,cAAmC,aACrC;AAAA,IACE,yBAAyB;AAAA,IACzB,GAAG;AAAA,EACL,IACA;AAEJ,QAAM,aAAa,MAAM,QAAQ,MAAM;AACrC,QAAI;AACF,YAAM,MAAM,IAAI;AAAA,QACd;AAAA,QACA,GAAG,QAAQ,UAAU,MAAM,MAAM,WAAW,GAAG,OAAO,IAAI,IAAI,KAAK,EAAE;AAAA,MACvE;AACA,aAAO,IAAI,SAAS,EAAE,MAAM,GAAG,EAAE;AAAA,IACnC,QAAQ;AACN,cAAQ;AAAA,QACN;AAAA,MACF;AACA,aAAO,WAAW,kCAAoB;AAAA,IACxC;AAAA,EACF,GAAG,CAAC,aAAa,OAAO,IAAI,CAAC;AAE7B,SACE,4CAAC,2BAAwB,QAAQ,aAC/B;AAAA,IAAC,cAAAA;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACH,GAAG,EAAE,CAAC,QAAQ,iDAAgC,OAAO,GAAG,KAAK;AAAA,MAC9D,OAAO;AAAA,MACP,eAAW,YAAAC,aAAG,kCAAoB,MAAM,GAAG,SAAS;AAAA,MAEpD,sDAAC,sCAAe,UAAf,EAAwB,OAAO,EAAE,UAAU,WAAW,GACpD,UACH;AAAA;AAAA,EACF,GACF;AAEJ;AAEA,MAAM,0BAA0B,CAAC;AAAA,EAC/B,QAAQ;AAAA,EACR;AACF,MAGM;AACJ,QAAM,CAAC,WAAW,IAAI,MAAM;AAAA,IAC1B,MAAM,kBAAkB,IAAI,+BAAY;AAAA,EAC1C;AAEA,QAAM,aAAS,mCAAe,WAAW;AACzC,MAAI,OAAO,GAAG,QAAQ,cAAc,GAAG;AAGrC,WAAO,2EAAG,UAAS;AAAA,EACrB;AAEA,SAAO,4CAAC,0CAAoB,QAAiB,UAAS;AACxD;","names":["RadixThemes","cx"]}

package/dist/css/lib/provider-icon.css

@@ -13,6 +13,7 @@
   --provider-icon-cas: url(https://cdn.workos.com/provider-icons/light/cas.svg);
   --provider-icon-cezanne-hr: url(https://cdn.workos.com/provider-icons/light/cezanne-hr.svg);
   --provider-icon-classlink: url(https://cdn.workos.com/provider-icons/light/classlink.svg);
+  --provider-icon-clever: url(https://cdn.workos.com/provider-icons/dark/clever.svg);
   --provider-icon-cloudflare: url(https://cdn.workos.com/provider-icons/light/cloudflare.svg);
   --provider-icon-cyberark: url(https://cdn.workos.com/provider-icons/light/cyberark.svg);
   --provider-icon-datadog: url(https://cdn.workos.com/provider-icons/light/datadog.svg);
@@ -29,7 +30,7 @@
   --provider-icon-google-cloud: url(https://cdn.workos.com/provider-icons/light/google-cloud.svg);
   --provider-icon-google-drive: url(https://images.workoscdn.com/images/55956988-24d8-4733-acb0-dc19949ebff7.svg);
   --provider-icon-google-mail: url(https://images.workoscdn.com/images/5735eb12-b0e4-4127-87be-f541a9b282fc.svg);
-  --provider-icon-google: url(https://cdn.workos.com/provider-icons/light/google.svg);
+  --provider-icon-google: url(https://images.workoscdn.com/images/b6d63052-83dc-4c75-beda-8121ea8bc483.svg);
   --provider-icon-hibob: url(https://cdn.workos.com/provider-icons/light/hibob.svg);
   --provider-icon-hubspot: url(https://images.workoscdn.com/images/ec2d62d0-64a7-4910-a437-782eaeeba7e5.svg);
   --provider-icon-intercom: url(https://images.workoscdn.com/images/0afe7826-72a8-4673-9c95-7122ab12d011.svg);
@@ -40,11 +41,11 @@
   --provider-icon-linear: url(https://images.workoscdn.com/images/ea736232-215d-4925-8bf3-c3d7a4b24078.svg);
   --provider-icon-linkedin: url(https://cdn.workos.com/provider-icons/light/linkedin.svg);
   --provider-icon-login-gov: url(https://cdn.workos.com/provider-icons/light/login-gov.svg);
-  --provider-icon-microsoft: url(https://cdn.workos.com/provider-icons/light/microsoft.svg);
+  --provider-icon-microsoft: url(https://images.workoscdn.com/images/03c465e5-a6d8-47e2-ab15-1b5f0081fd88.svg);
   --provider-icon-miniorange: url(https://cdn.workos.com/provider-icons/light/miniorange.svg);
   --provider-icon-net-iq: url(https://cdn.workos.com/provider-icons/light/net-iq.svg);
   --provider-icon-next-auth: url(https://cdn.workos.com/provider-icons/light/next-auth.svg);
-  --provider-icon-notion: url(https://cdn.workos.com/provider-icons/light/notion.svg);
+  --provider-icon-notion: url(https://images.workoscdn.com/images/755707ef-6562-4a0f-902d-9675b9a5bb8a.svg);
   --provider-icon-okta: url(https://cdn.workos.com/provider-icons/light/okta.svg);
   --provider-icon-onelogin: url(https://cdn.workos.com/provider-icons/light/onelogin.svg);
   --provider-icon-oracle: url(https://cdn.workos.com/provider-icons/light/oracle.svg);
@@ -52,11 +53,11 @@
   --provider-icon-ping-identity: url(https://cdn.workos.com/provider-icons/light/ping-identity.svg);
   --provider-icon-react-native-expo: url(https://cdn.workos.com/provider-icons/light/react-native-expo.svg);
   --provider-icon-rippling: url(https://cdn.workos.com/provider-icons/light/rippling.svg);
-  --provider-icon-salesforce: url(https://cdn.workos.com/provider-icons/light/salesforce.svg);
+  --provider-icon-salesforce: url(https://images.workoscdn.com/images/4f1247e1-982f-43d1-80f6-8a8ef0e26d08.svg);
   --provider-icon-segment: url(https://images.workoscdn.com/images/76d2470d-af92-4a56-96f2-5167c7ab4317.svg?auto=format&fit=clip&q=80);
   --provider-icon-shibboleth: url(https://cdn.workos.com/provider-icons/light/shibboleth.svg);
   --provider-icon-simple-saml-php: url(https://cdn.workos.com/provider-icons/light/simple-saml-php.svg);
-  --provider-icon-slack: url(https://cdn.workos.com/provider-icons/light/slack.svg);
+  --provider-icon-slack: url(https://images.workoscdn.com/images/4caca96c-9b83-49dc-9fd8-017a22725168.svg);
   --provider-icon-splunk: url(https://cdn.workos.com/provider-icons/light/splunk.svg);
   --provider-icon-stripe: url(https://images.workoscdn.com/images/44a8c194-4e70-4a6a-9bf5-72a055a4c967.svg);
   --provider-icon-supabase: url(https://cdn.workos.com/provider-icons/light/supabase.svg);
@@ -104,7 +105,7 @@
   --provider-icon-google-cloud: url(https://cdn.workos.com/provider-icons/dark/google-cloud.svg);
   --provider-icon-google-drive: url(https://images.workoscdn.com/images/d65df86d-d61d-414b-aafc-5dc7fd661fac.svg);
   --provider-icon-google-mail: url(https://images.workoscdn.com/images/5735eb12-b0e4-4127-87be-f541a9b282fc.svg);
-  --provider-icon-google: url(https://cdn.workos.com/provider-icons/dark/google.svg);
+  --provider-icon-google: url(https://images.workoscdn.com/images/ca224b0c-2732-4210-beb1-738a080b4358.svg);
   --provider-icon-hibob: url(https://cdn.workos.com/provider-icons/dark/hibob.svg);
   --provider-icon-hubspot: url(https://images.workoscdn.com/images/e002a40c-6971-42a5-ae6e-9b2c19018394.svg);
   --provider-icon-intercom: url(https://images.workoscdn.com/images/16d6f1eb-ac8f-41d4-99ea-af4b4613b38d.svg);
@@ -115,11 +116,11 @@
   --provider-icon-linear: url(https://images.workoscdn.com/images/4ffb242f-6ca9-4409-88b8-0249654ae6e4.svg);
   --provider-icon-linkedin: url(https://cdn.workos.com/provider-icons/dark/linkedin.svg);
   --provider-icon-login-gov: url(https://cdn.workos.com/provider-icons/dark/login-gov.svg);
-  --provider-icon-microsoft: url(https://cdn.workos.com/provider-icons/dark/microsoft.svg);
+  --provider-icon-microsoft: url(https://images.workoscdn.com/images/86c3df5e-bb56-4bf5-a39e-442c394af17b.svg);
   --provider-icon-miniorange: url(https://cdn.workos.com/provider-icons/dark/miniorange.svg);
   --provider-icon-net-iq: url(https://cdn.workos.com/provider-icons/dark/net-iq.svg);
   --provider-icon-next-auth: url(https://cdn.workos.com/provider-icons/dark/next-auth.svg);
-  --provider-icon-notion: url(https://images.workoscdn.com/images/31a154ab-920d-4260-98b9-e8d911fdba46.svg);
+  --provider-icon-notion: url(https://images.workoscdn.com/images/290aa0fc-0fd4-46a2-a428-97b16b111d7c.svg);
   --provider-icon-okta: url(https://cdn.workos.com/provider-icons/dark/okta.svg);
   --provider-icon-onelogin: url(https://cdn.workos.com/provider-icons/dark/onelogin.svg);
   --provider-icon-oracle: url(https://cdn.workos.com/provider-icons/dark/oracle.svg);
@@ -127,11 +128,11 @@
   --provider-icon-ping-identity: url(https://cdn.workos.com/provider-icons/dark/ping-identity.svg);
   --provider-icon-react-native-expo: url(https://cdn.workos.com/provider-icons/dark/react-native-expo.svg);
   --provider-icon-rippling: url(https://cdn.workos.com/provider-icons/dark/rippling.svg);
-  --provider-icon-salesforce: url(https://cdn.workos.com/provider-icons/dark/salesforce.svg);
+  --provider-icon-salesforce: url(https://images.workoscdn.com/images/d71af54e-3c97-48ce-9b26-c16430aba2ae.svg);
   --provider-icon-segment: url(https://images.workoscdn.com/images/ed5680a5-5b78-417b-96d4-e03ee8a39160.svg?auto=format&fit=clip&q=80);
   --provider-icon-shibboleth: url(https://cdn.workos.com/provider-icons/dark/shibboleth.svg);
   --provider-icon-simple-saml-php: url(https://cdn.workos.com/provider-icons/dark/simple-saml-php.svg);
-  --provider-icon-slack: url(https://cdn.workos.com/provider-icons/dark/slack.svg);
+  --provider-icon-slack: url(https://images.workoscdn.com/images/de6b0a48-f241-4b85-8cb4-c04650f8d3f4.svg);
   --provider-icon-splunk: url(https://cdn.workos.com/provider-icons/dark/splunk.svg);
   --provider-icon-stripe: url(https://images.workoscdn.com/images/eb696a2b-ed4e-497a-a1ce-3c6c08dfde09.svg);
   --provider-icon-supabase: url(https://cdn.workos.com/provider-icons/dark/supabase.svg);
@@ -222,6 +223,9 @@
 .woswidgets-provider-icon[data-provider="classlink"] {
   background-image: var(--provider-icon-classlink);
 }
+.woswidgets-provider-icon[data-provider="clever"] {
+  background-image: var(--provider-icon-clever);
+}
 .woswidgets-provider-icon[data-provider="clerk"] {
   background-image: var(--provider-icon-clerk);
 }
@@ -270,7 +274,8 @@
 .woswidgets-provider-icon[data-provider="google-drive"] {
   background-image: var(--provider-icon-google-drive);
 }
-.woswidgets-provider-icon[data-provider="google-mail"] {
+.woswidgets-provider-icon[data-provider="google-mail"],
+.woswidgets-provider-icon[data-provider="gmail"] {
   background-image: var(--provider-icon-google-mail);
 }
 .woswidgets-provider-icon[data-provider="google"] {

package/dist/esm/admin-portal-domain-verification.client.d.ts

@@ -1,12 +1,13 @@
 import * as React from 'react';
-export { AdminPortalDomainVerificationLoading } from './lib/admin-portal-domain-verification.js';
+export { AdminPortalDomainVerificationError, AdminPortalDomainVerificationErrorProps, AdminPortalDomainVerificationLoading, AdminPortalDomainVerificationLoadingProps } from './lib/admin-portal-domain-verification.js';
 import { AuthToken } from './api/api-provider.js';
+import { WidgetRootDomProps } from './lib/utils.js';
 import 'react/jsx-runtime';
 import './api/endpoint.js';
 import '@tanstack/react-query';
 import './api/widgets-api-client.js';
 
-interface AdminPortalDomainVerificationProps {
+interface AdminPortalDomainVerificationProps extends WidgetRootDomProps {
     authToken: AuthToken;
 }
 declare const AdminPortalDomainVerification: React.FC<AdminPortalDomainVerificationProps>;

package/dist/esm/admin-portal-domain-verification.client.js

@@ -5,8 +5,7 @@ import {
   AdminPortalDomainVerificationLoading,
   AdminPortalDomainVerification as AdminPortalDomainVerificationPresentational
 } from "./lib/admin-portal-domain-verification.js";
-import { useIsHydrated } from "./lib/use-is-hydrated.js";
-import { ApiProvider } from "./api/api-provider.js";
+import { ApiProvider, useApiReady } from "./api/api-provider.js";
 import {
   useGenerateAdminPortalLink,
   useListOrganizationDomains,
@@ -17,20 +16,26 @@ import {
 import { useWorkOsApiUrl } from "./lib/widgets-context.js";
 import { ErrorBoundary } from "./lib/error-boundary.js";
 import { useQueryClient } from "@tanstack/react-query";
-const AdminPortalDomainVerification = ({ authToken }) => {
+const AdminPortalDomainVerification = ({ authToken, ...domProps }) => {
   const baseUrl = useWorkOsApiUrl();
   return /* @__PURE__ */ jsx(
-    ApiProvider,
+    ErrorBoundary,
     {
-      widgetType: "admin-portal-domain-verification",
-      authToken,
-      baseUrl,
-      children: /* @__PURE__ */ jsx(AdminPortalDomainVerificationContent, {})
+      fallbackRender: ({ error }) => /* @__PURE__ */ jsx(AdminPortalDomainVerificationError, { error, ...domProps }),
+      children: /* @__PURE__ */ jsx(
+        ApiProvider,
+        {
+          widgetType: "admin-portal-domain-verification",
+          authToken,
+          baseUrl,
+          children: /* @__PURE__ */ jsx(AdminPortalDomainVerificationImpl, { ...domProps })
+        }
+      )
     }
   );
 };
-const AdminPortalDomainVerificationContent = () => {
-  const isHydrated = useIsHydrated();
+const AdminPortalDomainVerificationImpl = (props) => {
+  const isApiReady = useApiReady();
   const queryClient = useQueryClient();
   const {
     data: organizationDomains,
@@ -75,26 +80,34 @@ const AdminPortalDomainVerificationContent = () => {
   const handleReverifyDomain = (domainId) => {
     reverifyDomain({ domainId });
   };
-  if (!isHydrated || isLoading) {
-    return /* @__PURE__ */ jsx(AdminPortalDomainVerificationLoading, {});
+  if (!isApiReady || isLoading) {
+    return /* @__PURE__ */ jsx(AdminPortalDomainVerificationLoading, { ...props });
   }
   if (error) {
-    return /* @__PURE__ */ jsx(AdminPortalDomainVerificationError, { error });
+    return /* @__PURE__ */ jsx(AdminPortalDomainVerificationError, { error, ...props });
   }
   const domains = organizationDomains?.data || [];
-  return /* @__PURE__ */ jsx(ErrorBoundary, { FallbackComponent: AdminPortalDomainVerificationError, children: /* @__PURE__ */ jsx(
-    AdminPortalDomainVerificationPresentational,
+  return /* @__PURE__ */ jsx(
+    ErrorBoundary,
     {
-      organizationDomains: domains,
-      onAddDomain: handleAddDomain,
-      onDeleteDomain: handleDeleteDomain,
-      onReverifyDomain: handleReverifyDomain,
-      isPending
+      fallbackRender: ({ error: error2 }) => /* @__PURE__ */ jsx(AdminPortalDomainVerificationError, { error: error2, ...props }),
+      children: /* @__PURE__ */ jsx(
+        AdminPortalDomainVerificationPresentational,
+        {
+          organizationDomains: domains,
+          onAddDomain: handleAddDomain,
+          onDeleteDomain: handleDeleteDomain,
+          onReverifyDomain: handleReverifyDomain,
+          isPending,
+          ...props
+        }
+      )
     }
-  ) });
+  );
 };
 export {
   AdminPortalDomainVerification,
+  AdminPortalDomainVerificationError,
   AdminPortalDomainVerificationLoading
 };
 //# sourceMappingURL=admin-portal-domain-verification.client.js.map

package/dist/esm/admin-portal-domain-verification.client.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/admin-portal-domain-verification.client.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  AdminPortalDomainVerificationError,\n  AdminPortalDomainVerificationLoading,\n  AdminPortalDomainVerification as AdminPortalDomainVerificationPresentational,\n} from \"./lib/admin-portal-domain-verification.js\";\nimport { useIsHydrated } from \"./lib/use-is-hydrated.js\";\nimport { ApiProvider, AuthToken } from \"./api/api-provider.js\";\nimport {\n  useGenerateAdminPortalLink,\n  useListOrganizationDomains,\n  getListOrganizationDomainsQueryKey,\n  useDeleteOrganizationDomain,\n  useReverifyOrganizationDomain,\n} from \"./api/endpoint.js\";\nimport { useWorkOsApiUrl } from \"./lib/widgets-context.js\";\nimport { ErrorBoundary } from \"./lib/error-boundary.js\";\nimport { useQueryClient } from \"@tanstack/react-query\";\n\nexport interface AdminPortalDomainVerificationProps {\n  authToken: AuthToken;\n}\n\nexport const AdminPortalDomainVerification: React.FC<\n  AdminPortalDomainVerificationProps\n> = ({ authToken }) => {\n  const baseUrl = useWorkOsApiUrl();\n\n  return (\n    <ApiProvider\n      widgetType=\"admin-portal-domain-verification\"\n      authToken={authToken}\n      baseUrl={baseUrl}\n    >\n      <AdminPortalDomainVerificationContent />\n    </ApiProvider>\n  );\n};\n\nexport { AdminPortalDomainVerificationLoading };\n\nconst AdminPortalDomainVerificationContent = () => {\n  const isHydrated = useIsHydrated();\n  const queryClient = useQueryClient();\n  const {\n    data: organizationDomains,\n    isLoading,\n    error,\n  } = useListOrganizationDomains();\n\n  const { mutate: generateAdminPortalLink, isPending } =\n    useGenerateAdminPortalLink({\n      mutation: {\n        onSuccess: (data) => {\n          window.open(data.link, \"_blank\", \"noopener,noreferrer\");\n        },\n      },\n    });\n\n  const { mutate: deleteDomain } = useDeleteOrganizationDomain({\n    mutation: {\n      onSuccess: () => {\n        queryClient.invalidateQueries({\n          queryKey: getListOrganizationDomainsQueryKey(),\n        });\n      },\n    },\n  });\n\n  const { mutate: reverifyDomain } = useReverifyOrganizationDomain({\n    mutation: {\n      onSuccess: () => {\n        queryClient.invalidateQueries({\n          queryKey: getListOrganizationDomainsQueryKey(),\n        });\n      },\n    },\n  });\n\n  const handleAddDomain = () => {\n    generateAdminPortalLink({\n      params: {\n        intent: \"domain_verification\",\n      },\n    });\n  };\n\n  const handleDeleteDomain = (domainId: string) => {\n    deleteDomain({ domainId });\n  };\n\n  const handleReverifyDomain = (domainId: string) => {\n    reverifyDomain({ domainId });\n  };\n\n  if (!isHydrated || isLoading) {\n    return <AdminPortalDomainVerificationLoading />;\n  }\n\n  if (error) {\n    return <AdminPortalDomainVerificationError error={error} />;\n  }\n\n  const domains = organizationDomains?.data || [];\n\n  return (\n    <ErrorBoundary FallbackComponent={AdminPortalDomainVerificationError}>\n      <AdminPortalDomainVerificationPresentational\n        organizationDomains={domains}\n        onAddDomain={handleAddDomain}\n        onDeleteDomain={handleDeleteDomain}\n        onReverifyDomain={handleReverifyDomain}\n        isPending={isPending}\n      />\n    </ErrorBoundary>\n  );\n};\n"],"mappings":";AAoCM;AAjCN;AAAA,EACE;AAAA,EACA;AAAA,EACA,iCAAiC;AAAA,OAC5B;AACP,SAAS,qBAAqB;AAC9B,SAAS,mBAA8B;AACvC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AAC9B,SAAS,sBAAsB;AAMxB,MAAM,gCAET,CAAC,EAAE,UAAU,MAAM;AACrB,QAAM,UAAU,gBAAgB;AAEhC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YAAW;AAAA,MACX;AAAA,MACA;AAAA,MAEA,8BAAC,wCAAqC;AAAA;AAAA,EACxC;AAEJ;AAIA,MAAM,uCAAuC,MAAM;AACjD,QAAM,aAAa,cAAc;AACjC,QAAM,cAAc,eAAe;AACnC,QAAM;AAAA,IACJ,MAAM;AAAA,IACN;AAAA,IACA;AAAA,EACF,IAAI,2BAA2B;AAE/B,QAAM,EAAE,QAAQ,yBAAyB,UAAU,IACjD,2BAA2B;AAAA,IACzB,UAAU;AAAA,MACR,WAAW,CAAC,SAAS;AACnB,eAAO,KAAK,KAAK,MAAM,UAAU,qBAAqB;AAAA,MACxD;AAAA,IACF;AAAA,EACF,CAAC;AAEH,QAAM,EAAE,QAAQ,aAAa,IAAI,4BAA4B;AAAA,IAC3D,UAAU;AAAA,MACR,WAAW,MAAM;AACf,oBAAY,kBAAkB;AAAA,UAC5B,UAAU,mCAAmC;AAAA,QAC/C,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF,CAAC;AAED,QAAM,EAAE,QAAQ,eAAe,IAAI,8BAA8B;AAAA,IAC/D,UAAU;AAAA,MACR,WAAW,MAAM;AACf,oBAAY,kBAAkB;AAAA,UAC5B,UAAU,mCAAmC;AAAA,QAC/C,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF,CAAC;AAED,QAAM,kBAAkB,MAAM;AAC5B,4BAAwB;AAAA,MACtB,QAAQ;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF,CAAC;AAAA,EACH;AAEA,QAAM,qBAAqB,CAAC,aAAqB;AAC/C,iBAAa,EAAE,SAAS,CAAC;AAAA,EAC3B;AAEA,QAAM,uBAAuB,CAAC,aAAqB;AACjD,mBAAe,EAAE,SAAS,CAAC;AAAA,EAC7B;AAEA,MAAI,CAAC,cAAc,WAAW;AAC5B,WAAO,oBAAC,wCAAqC;AAAA,EAC/C;AAEA,MAAI,OAAO;AACT,WAAO,oBAAC,sCAAmC,OAAc;AAAA,EAC3D;AAEA,QAAM,UAAU,qBAAqB,QAAQ,CAAC;AAE9C,SACE,oBAAC,iBAAc,mBAAmB,oCAChC;AAAA,IAAC;AAAA;AAAA,MACC,qBAAqB;AAAA,MACrB,aAAa;AAAA,MACb,gBAAgB;AAAA,MAChB,kBAAkB;AAAA,MAClB;AAAA;AAAA,EACF,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/admin-portal-domain-verification.client.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  AdminPortalDomainVerificationError,\n  AdminPortalDomainVerificationLoading,\n  AdminPortalDomainVerification as AdminPortalDomainVerificationPresentational,\n} from \"./lib/admin-portal-domain-verification.js\";\nimport type {\n  AdminPortalDomainVerificationErrorProps,\n  AdminPortalDomainVerificationLoadingProps,\n} from \"./lib/admin-portal-domain-verification.js\";\nimport { ApiProvider, AuthToken, useApiReady } from \"./api/api-provider.js\";\nimport {\n  useGenerateAdminPortalLink,\n  useListOrganizationDomains,\n  getListOrganizationDomainsQueryKey,\n  useDeleteOrganizationDomain,\n  useReverifyOrganizationDomain,\n} from \"./api/endpoint.js\";\nimport { useWorkOsApiUrl } from \"./lib/widgets-context.js\";\nimport { ErrorBoundary } from \"./lib/error-boundary.js\";\nimport { useQueryClient } from \"@tanstack/react-query\";\nimport { WidgetRootDomProps } from \"./lib/utils.js\";\n\ninterface AdminPortalDomainVerificationProps extends WidgetRootDomProps {\n  authToken: AuthToken;\n}\n\nconst AdminPortalDomainVerification: React.FC<\n  AdminPortalDomainVerificationProps\n> = ({ authToken, ...domProps }) => {\n  const baseUrl = useWorkOsApiUrl();\n\n  return (\n    <ErrorBoundary\n      fallbackRender={({ error }) => (\n        <AdminPortalDomainVerificationError error={error} {...domProps} />\n      )}\n    >\n      <ApiProvider\n        widgetType=\"admin-portal-domain-verification\"\n        authToken={authToken}\n        baseUrl={baseUrl}\n      >\n        <AdminPortalDomainVerificationImpl {...domProps} />\n      </ApiProvider>\n    </ErrorBoundary>\n  );\n};\n\nconst AdminPortalDomainVerificationImpl = (\n  props: Omit<AdminPortalDomainVerificationProps, \"authToken\">,\n) => {\n  const isApiReady = useApiReady();\n  const queryClient = useQueryClient();\n  const {\n    data: organizationDomains,\n    isLoading,\n    error,\n  } = useListOrganizationDomains();\n\n  const { mutate: generateAdminPortalLink, isPending } =\n    useGenerateAdminPortalLink({\n      mutation: {\n        onSuccess: (data) => {\n          window.open(data.link, \"_blank\", \"noopener,noreferrer\");\n        },\n      },\n    });\n\n  const { mutate: deleteDomain } = useDeleteOrganizationDomain({\n    mutation: {\n      onSuccess: () => {\n        queryClient.invalidateQueries({\n          queryKey: getListOrganizationDomainsQueryKey(),\n        });\n      },\n    },\n  });\n\n  const { mutate: reverifyDomain } = useReverifyOrganizationDomain({\n    mutation: {\n      onSuccess: () => {\n        queryClient.invalidateQueries({\n          queryKey: getListOrganizationDomainsQueryKey(),\n        });\n      },\n    },\n  });\n\n  const handleAddDomain = () => {\n    generateAdminPortalLink({\n      params: {\n        intent: \"domain_verification\",\n      },\n    });\n  };\n\n  const handleDeleteDomain = (domainId: string) => {\n    deleteDomain({ domainId });\n  };\n\n  const handleReverifyDomain = (domainId: string) => {\n    reverifyDomain({ domainId });\n  };\n\n  if (!isApiReady || isLoading) {\n    return <AdminPortalDomainVerificationLoading {...props} />;\n  }\n\n  if (error) {\n    return <AdminPortalDomainVerificationError error={error} {...props} />;\n  }\n\n  const domains = organizationDomains?.data || [];\n\n  return (\n    <ErrorBoundary\n      fallbackRender={({ error }) => (\n        <AdminPortalDomainVerificationError error={error} {...props} />\n      )}\n    >\n      <AdminPortalDomainVerificationPresentational\n        organizationDomains={domains}\n        onAddDomain={handleAddDomain}\n        onDeleteDomain={handleDeleteDomain}\n        onReverifyDomain={handleReverifyDomain}\n        isPending={isPending}\n        {...props}\n      />\n    </ErrorBoundary>\n  );\n};\n\nexport type {\n  AdminPortalDomainVerificationProps,\n  AdminPortalDomainVerificationLoadingProps,\n  AdminPortalDomainVerificationErrorProps,\n};\nexport {\n  AdminPortalDomainVerification,\n  AdminPortalDomainVerificationLoading,\n  AdminPortalDomainVerificationError,\n};\n"],"mappings":";AAqCQ;AAlCR;AAAA,EACE;AAAA,EACA;AAAA,EACA,iCAAiC;AAAA,OAC5B;AAKP,SAAS,aAAwB,mBAAmB;AACpD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AAC9B,SAAS,sBAAsB;AAO/B,MAAM,gCAEF,CAAC,EAAE,WAAW,GAAG,SAAS,MAAM;AAClC,QAAM,UAAU,gBAAgB;AAEhC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB,CAAC,EAAE,MAAM,MACvB,oBAAC,sCAAmC,OAAe,GAAG,UAAU;AAAA,MAGlE;AAAA,QAAC;AAAA;AAAA,UACC,YAAW;AAAA,UACX;AAAA,UACA;AAAA,UAEA,8BAAC,qCAAmC,GAAG,UAAU;AAAA;AAAA,MACnD;AAAA;AAAA,EACF;AAEJ;AAEA,MAAM,oCAAoC,CACxC,UACG;AACH,QAAM,aAAa,YAAY;AAC/B,QAAM,cAAc,eAAe;AACnC,QAAM;AAAA,IACJ,MAAM;AAAA,IACN;AAAA,IACA;AAAA,EACF,IAAI,2BAA2B;AAE/B,QAAM,EAAE,QAAQ,yBAAyB,UAAU,IACjD,2BAA2B;AAAA,IACzB,UAAU;AAAA,MACR,WAAW,CAAC,SAAS;AACnB,eAAO,KAAK,KAAK,MAAM,UAAU,qBAAqB;AAAA,MACxD;AAAA,IACF;AAAA,EACF,CAAC;AAEH,QAAM,EAAE,QAAQ,aAAa,IAAI,4BAA4B;AAAA,IAC3D,UAAU;AAAA,MACR,WAAW,MAAM;AACf,oBAAY,kBAAkB;AAAA,UAC5B,UAAU,mCAAmC;AAAA,QAC/C,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF,CAAC;AAED,QAAM,EAAE,QAAQ,eAAe,IAAI,8BAA8B;AAAA,IAC/D,UAAU;AAAA,MACR,WAAW,MAAM;AACf,oBAAY,kBAAkB;AAAA,UAC5B,UAAU,mCAAmC;AAAA,QAC/C,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF,CAAC;AAED,QAAM,kBAAkB,MAAM;AAC5B,4BAAwB;AAAA,MACtB,QAAQ;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF,CAAC;AAAA,EACH;AAEA,QAAM,qBAAqB,CAAC,aAAqB;AAC/C,iBAAa,EAAE,SAAS,CAAC;AAAA,EAC3B;AAEA,QAAM,uBAAuB,CAAC,aAAqB;AACjD,mBAAe,EAAE,SAAS,CAAC;AAAA,EAC7B;AAEA,MAAI,CAAC,cAAc,WAAW;AAC5B,WAAO,oBAAC,wCAAsC,GAAG,OAAO;AAAA,EAC1D;AAEA,MAAI,OAAO;AACT,WAAO,oBAAC,sCAAmC,OAAe,GAAG,OAAO;AAAA,EACtE;AAEA,QAAM,UAAU,qBAAqB,QAAQ,CAAC;AAE9C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB,CAAC,EAAE,OAAAA,OAAM,MACvB,oBAAC,sCAAmC,OAAOA,QAAQ,GAAG,OAAO;AAAA,MAG/D;AAAA,QAAC;AAAA;AAAA,UACC,qBAAqB;AAAA,UACrB,aAAa;AAAA,UACb,gBAAgB;AAAA,UAChB,kBAAkB;AAAA,UAClB;AAAA,UACC,GAAG;AAAA;AAAA,MACN;AAAA;AAAA,EACF;AAEJ;","names":["error"]}

package/dist/esm/admin-portal-sso-connection.client.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+export { AdminPortalSsoConnectionError, AdminPortalSsoConnectionErrorProps, AdminPortalSsoConnectionLoading, AdminPortalSsoConnectionLoadingProps } from './lib/admin-portal-sso-connection.js';
+import { AuthToken } from './api/api-provider.js';
+import { WidgetRootDomProps } from './lib/utils.js';
+import 'react/jsx-runtime';
+import './lib/identity-providers.js';
+import './api/endpoint.js';
+import '@tanstack/react-query';
+import './api/widgets-api-client.js';
+
+interface AdminPortalSsoConnectionProps extends WidgetRootDomProps {
+    authToken: AuthToken;
+}
+declare const AdminPortalSsoConnection: React.FC<AdminPortalSsoConnectionProps>;
+
+export { AdminPortalSsoConnection, type AdminPortalSsoConnectionProps };

package/dist/esm/{admin-portal-sso-connection-client.js → admin-portal-sso-connection.client.js}

@@ -7,8 +7,7 @@ import {
   AdminPortalSsoConnectionLoading,
   AdminPortalSsoConnection as AdminPortalSsoConnectionPresentational
 } from "./lib/admin-portal-sso-connection.js";
-import { useIsHydrated } from "./lib/use-is-hydrated.js";
-import { ApiProvider } from "./api/api-provider.js";
+import { ApiProvider, useApiReady } from "./api/api-provider.js";
 import {
   useGenerateAdminPortalLink,
   useListSsoConnections
@@ -16,24 +15,33 @@ import {
 import { useWorkOsApiUrl } from "./lib/widgets-context.js";
 import { ErrorBoundary } from "./lib/error-boundary.js";
 import { unreachable } from "./lib/utils.js";
-const AdminPortalSsoConnection = ({ authToken }) => {
+const AdminPortalSsoConnection = ({
+  authToken,
+  ...domProps
+}) => {
   const baseUrl = useWorkOsApiUrl();
   return /* @__PURE__ */ jsx(
-    ApiProvider,
+    ErrorBoundary,
     {
-      widgetType: "admin-portal-sso-connection",
-      authToken,
-      baseUrl,
-      children: /* @__PURE__ */ jsx(SingleSignOnContent, {})
+      fallbackRender: ({ error }) => /* @__PURE__ */ jsx(AdminPortalSsoConnectionError, { error, ...domProps }),
+      children: /* @__PURE__ */ jsx(
+        ApiProvider,
+        {
+          widgetType: "admin-portal-sso-connection",
+          authToken,
+          baseUrl,
+          children: /* @__PURE__ */ jsx(AdminPortalSsoConnectionImpl, { ...domProps })
+        }
+      )
     }
   );
 };
-const SingleSignOnContent = () => {
-  const isHydrated = useIsHydrated();
+const AdminPortalSsoConnectionImpl = (props) => {
+  const isApiReady = useApiReady();
   const [currentDate, setCurrentDate] = React.useState(
-    () => isHydrated ? /* @__PURE__ */ new Date() : null
+    () => isApiReady ? /* @__PURE__ */ new Date() : null
   );
-  if (isHydrated && currentDate === null) {
+  if (isApiReady && currentDate === null) {
     setCurrentDate(/* @__PURE__ */ new Date());
   }
   const { mutate: generateAdminPortalLink, ...mutation } = useGenerateAdminPortalLink({
@@ -53,33 +61,40 @@ const SingleSignOnContent = () => {
     });
   };
   if (query.isLoading) {
-    return /* @__PURE__ */ jsx(AdminPortalSsoConnectionLoading, {});
+    return /* @__PURE__ */ jsx(AdminPortalSsoConnectionLoading, { ...props });
   }
   if (query.isError) {
-    return /* @__PURE__ */ jsx(AdminPortalSsoConnectionError, { error: query.error });
+    return /* @__PURE__ */ jsx(AdminPortalSsoConnectionError, { error: query.error, ...props });
   }
   if (query.data) {
     const connection = query.data[0];
     if (!connection) {
       return /* @__PURE__ */ jsx(
-        AdminPortalSsoConnectionPresentational,
+        ErrorBoundary,
         {
-          connectionStatus: "NotConfigured",
-          currentDate,
-          lastSession: null,
-          adminPortalOpenButton: /* @__PURE__ */ jsx(
-            AdminPortalOpenButton,
+          fallbackRender: ({ error }) => /* @__PURE__ */ jsx(AdminPortalSsoConnectionError, { error, ...props }),
+          children: /* @__PURE__ */ jsx(
+            AdminPortalSsoConnectionPresentational,
             {
-              isPending: mutation.isPending,
-              href: adminPortalLink,
-              initConfig
+              ...props,
+              connectionStatus: "NotConfigured",
+              currentDate,
+              lastSession: null,
+              adminPortalOpenButton: /* @__PURE__ */ jsx(
+                AdminPortalOpenButton,
+                {
+                  isPending: mutation.isPending,
+                  href: adminPortalLink,
+                  initConfig
+                }
+              )
             }
           )
         }
       );
     }
     const connectionState = getConnectionState(connection, currentDate);
-    const props = (() => {
+    const statusProps = (() => {
       const connectionStatus = connectionState.status;
       if (!connection || connectionStatus === "NotConfigured") {
         return {
@@ -110,22 +125,29 @@ const SingleSignOnContent = () => {
       }
     })();
     const lastSession = connection.lastSession ? new Date(connection.lastSession.createdAt) : null;
-    return /* @__PURE__ */ jsx(ErrorBoundary, { FallbackComponent: AdminPortalSsoConnectionError, children: /* @__PURE__ */ jsx(
-      AdminPortalSsoConnectionPresentational,
+    return /* @__PURE__ */ jsx(
+      ErrorBoundary,
       {
-        ...props,
-        currentDate,
-        lastSession,
-        adminPortalOpenButton: /* @__PURE__ */ jsx(
-          AdminPortalOpenButton,
+        fallbackRender: ({ error }) => /* @__PURE__ */ jsx(AdminPortalSsoConnectionError, { error, ...props }),
+        children: /* @__PURE__ */ jsx(
+          AdminPortalSsoConnectionPresentational,
           {
-            isPending: mutation.isPending,
-            href: adminPortalLink,
-            initConfig
+            ...props,
+            ...statusProps,
+            currentDate,
+            lastSession,
+            adminPortalOpenButton: /* @__PURE__ */ jsx(
+              AdminPortalOpenButton,
+              {
+                isPending: mutation.isPending,
+                href: adminPortalLink,
+                initConfig
+              }
+            )
           }
         )
       }
-    ) });
+    );
   }
 };
 function getConnectionState(connection, currentDate) {
@@ -231,12 +253,15 @@ function getIdentityProvider(connection) {
       return "generic-oidc";
     case "LoginGovOidc":
       return "login-gov";
+    case "CleverOidc":
+      return "clever";
     default:
       return unreachable(connection);
   }
 }
 export {
   AdminPortalSsoConnection,
+  AdminPortalSsoConnectionError,
   AdminPortalSsoConnectionLoading
 };
-//# sourceMappingURL=admin-portal-sso-connection-client.js.map
+//# sourceMappingURL=admin-portal-sso-connection.client.js.map

package/dist/esm/admin-portal-sso-connection.client.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/admin-portal-sso-connection.client.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  AdminPortalOpenButton,\n  AdminPortalSsoConnectionError,\n  AdminPortalSsoConnectionLoading,\n  AdminPortalSsoConnection as AdminPortalSsoConnectionPresentational,\n} from \"./lib/admin-portal-sso-connection.js\";\nimport type {\n  AdminPortalSsoConnectionErrorProps,\n  AdminPortalSsoConnectionLoadingProps,\n  AdminPortalSsoConnectionStatusProps,\n} from \"./lib/admin-portal-sso-connection.js\";\nimport { ApiProvider, AuthToken, useApiReady } from \"./api/api-provider.js\";\nimport {\n  type SsoConnection,\n  useGenerateAdminPortalLink,\n  useListSsoConnections,\n} from \"./api/endpoint.js\";\nimport { useWorkOsApiUrl } from \"./lib/widgets-context.js\";\nimport { ErrorBoundary } from \"./lib/error-boundary.js\";\nimport { unreachable, WidgetRootDomProps } from \"./lib/utils.js\";\nimport { IdentityProvider } from \"./lib/identity-providers.js\";\n\ninterface AdminPortalSsoConnectionProps extends WidgetRootDomProps {\n  authToken: AuthToken;\n}\n\nconst AdminPortalSsoConnection: React.FC<AdminPortalSsoConnectionProps> = ({\n  authToken,\n  ...domProps\n}) => {\n  const baseUrl = useWorkOsApiUrl();\n  return (\n    <ErrorBoundary\n      fallbackRender={({ error }) => (\n        <AdminPortalSsoConnectionError error={error} {...domProps} />\n      )}\n    >\n      <ApiProvider\n        widgetType=\"admin-portal-sso-connection\"\n        authToken={authToken}\n        baseUrl={baseUrl}\n      >\n        <AdminPortalSsoConnectionImpl {...domProps} />\n      </ApiProvider>\n    </ErrorBoundary>\n  );\n};\n\nconst AdminPortalSsoConnectionImpl = (props: WidgetRootDomProps) => {\n  const isApiReady = useApiReady();\n  const [currentDate, setCurrentDate] = React.useState<Date | null>(() =>\n    isApiReady ? new Date() : null,\n  );\n  if (isApiReady && currentDate === null) {\n    setCurrentDate(new Date());\n  }\n\n  const { mutate: generateAdminPortalLink, ...mutation } =\n    useGenerateAdminPortalLink({\n      mutation: {\n        onSuccess: (data) => {\n          window.open(data.link, \"_blank\", \"noopener,noreferrer\");\n        },\n      },\n    });\n\n  const adminPortalLink = mutation.data?.link ?? null;\n\n  const query = useListSsoConnections();\n\n  const initConfig = () => {\n    generateAdminPortalLink({\n      params: {\n        intent: \"sso\",\n      },\n    });\n  };\n\n  if (query.isLoading) {\n    return <AdminPortalSsoConnectionLoading {...props} />;\n  }\n\n  if (query.isError) {\n    return <AdminPortalSsoConnectionError error={query.error} {...props} />;\n  }\n\n  if (query.data) {\n    const connection = query.data[0];\n    if (!connection) {\n      return (\n        <ErrorBoundary\n          fallbackRender={({ error }) => (\n            <AdminPortalSsoConnectionError error={error} {...props} />\n          )}\n        >\n          <AdminPortalSsoConnectionPresentational\n            {...props}\n            connectionStatus=\"NotConfigured\"\n            currentDate={currentDate}\n            lastSession={null}\n            adminPortalOpenButton={\n              <AdminPortalOpenButton\n                isPending={mutation.isPending}\n                href={adminPortalLink}\n                initConfig={initConfig}\n              />\n            }\n          />\n        </ErrorBoundary>\n      );\n    }\n\n    const connectionState = getConnectionState(connection, currentDate);\n    const statusProps: AdminPortalSsoConnectionStatusProps = (() => {\n      const connectionStatus = connectionState.status;\n      if (!connection || connectionStatus === \"NotConfigured\") {\n        return {\n          connectionStatus: \"NotConfigured\",\n        } satisfies AdminPortalSsoConnectionStatusProps;\n      }\n\n      const identityProvider = getIdentityProvider(connection);\n      switch (connectionStatus) {\n        case \"Active\":\n          return {\n            connectionStatus,\n            identityProvider,\n          } satisfies AdminPortalSsoConnectionStatusProps;\n        case \"Inactive\":\n          return {\n            connectionStatus,\n            identityProvider,\n          } satisfies AdminPortalSsoConnectionStatusProps;\n        case \"Expired\":\n        case \"Expiring\":\n          return {\n            connectionStatus,\n            expiryDate: connectionState.expiryDate,\n            identityProvider,\n          } satisfies AdminPortalSsoConnectionStatusProps;\n        default:\n          return unreachable(connectionState);\n      }\n    })();\n\n    const lastSession = connection.lastSession\n      ? new Date(connection.lastSession.createdAt)\n      : null;\n\n    return (\n      <ErrorBoundary\n        fallbackRender={({ error }) => (\n          <AdminPortalSsoConnectionError error={error} {...props} />\n        )}\n      >\n        <AdminPortalSsoConnectionPresentational\n          {...props}\n          {...statusProps}\n          currentDate={currentDate}\n          lastSession={lastSession}\n          adminPortalOpenButton={\n            <AdminPortalOpenButton\n              isPending={mutation.isPending}\n              href={adminPortalLink}\n              initConfig={initConfig}\n            />\n          }\n        />\n      </ErrorBoundary>\n    );\n  }\n};\n\ntype ConnectionState =\n  | { status: \"NotConfigured\" }\n  | { status: \"Active\" }\n  | { status: \"Inactive\" }\n  | {\n      status: \"Expiring\";\n      daysUntilExpiry: number | null;\n      expiryDate: Date | null;\n    }\n  | { status: \"Expired\"; expiryDate: Date | null };\n\nfunction getConnectionState(\n  connection: SsoConnection,\n  currentDate: Date | null,\n): ConnectionState {\n  switch (connection.state) {\n    case \"Active\":\n    case \"Validating\":\n    case \"Deleting\": {\n      const activeStatus = { status: \"Active\" } satisfies ConnectionState;\n      if (connection.providerTag !== \"Saml\") {\n        return activeStatus;\n      }\n\n      if (connection.latestExpiredCertificate) {\n        return {\n          status: \"Expired\",\n          expiryDate: connection.latestExpiredCertificate.notAfter\n            ? new Date(connection.latestExpiredCertificate.notAfter)\n            : null,\n        };\n      }\n\n      const expiryTime = connection.latestExpiringCertificate?.notAfter;\n      if (currentDate == null || expiryTime == null) {\n        return activeStatus;\n      }\n\n      const expiryDate = new Date(expiryTime);\n      const daysUntilExpiry = (() => {\n        const diff = expiryDate.getTime() - currentDate.getTime();\n        if (diff < 0) {\n          return -1;\n        }\n\n        return diff / (1000 * 60 * 60 * 24);\n      })();\n\n      if (daysUntilExpiry !== -1 && daysUntilExpiry <= 30) {\n        return { status: \"Expiring\", daysUntilExpiry, expiryDate };\n      }\n\n      return activeStatus;\n    }\n    case \"Inactive\": {\n      return { status: \"Inactive\" };\n    }\n    default:\n      return unreachable(connection);\n  }\n}\n\nfunction getIdentityProvider(connection: SsoConnection): IdentityProvider {\n  switch (connection.type) {\n    case \"AdfsSaml\":\n    case \"EntraIdOidc\":\n      return \"microsoft\";\n    case \"Auth0Migration\":\n    case \"Auth0Saml\":\n      return \"auth0\";\n    case \"AzureSaml\":\n      return \"azure\";\n    case \"CasSaml\":\n      return \"cas\";\n    case \"ClassLinkSaml\":\n      return \"classlink\";\n    case \"CloudflareSaml\":\n      return \"cloudflare\";\n    case \"CyberArkSaml\":\n      return \"cyberark\";\n    case \"DuoSaml\":\n      return \"duo\";\n    case \"GenericSaml\":\n      return \"generic-saml\";\n    case \"GoogleSaml\":\n    case \"GoogleOidc\":\n      return \"google\";\n    case \"JumpCloudSaml\":\n      return \"jumpcloud\";\n    case \"KeycloakSaml\":\n      return \"keycloak\";\n    case \"LastPassSaml\":\n      return \"lastpass\";\n    case \"MiniOrangeSaml\":\n      return \"miniorange\";\n    case \"NetIqSaml\":\n      return \"net-iq\";\n    case \"OktaOidc\":\n    case \"OktaSaml\":\n      return \"okta\";\n    case \"OneLoginSaml\":\n      return \"onelogin\";\n    case \"OracleSaml\":\n      return \"oracle\";\n    case \"PingFederateSaml\":\n    case \"PingOneSaml\":\n      return \"ping-identity\";\n    case \"RipplingSaml\":\n      return \"rippling\";\n    case \"SalesforceSaml\":\n      return \"salesforce\";\n    case \"ShibbolethGenericSaml\":\n    case \"ShibbolethSaml\":\n      return \"shibboleth\";\n    case \"SimpleSamlPhpSaml\":\n      return \"simple-saml-php\";\n    case \"TestIdp\":\n      return \"test-idp\";\n    case \"VmWareSaml\":\n      return \"vmware\";\n    case \"AdpOidc\":\n      return \"adp\";\n    case \"GenericOidc\":\n      return \"generic-oidc\";\n    case \"LoginGovOidc\":\n      return \"login-gov\";\n    case \"CleverOidc\":\n      return \"clever\";\n    default:\n      return unreachable(connection);\n  }\n}\n\nexport type {\n  AdminPortalSsoConnectionProps,\n  AdminPortalSsoConnectionLoadingProps,\n  AdminPortalSsoConnectionErrorProps,\n};\nexport {\n  AdminPortalSsoConnection,\n  AdminPortalSsoConnectionLoading,\n  AdminPortalSsoConnectionError,\n};\n"],"mappings":"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","names":[]}

package/dist/esm/api/api-provider.d.ts

@@ -1,15 +1,15 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 
-type WidgetType = "admin-portal-domain-verification" | "user-management" | "organization-switcher" | "user-sessions" | "user-security" | "user-profile" | "admin-portal-sso-connection" | "api-keys";
+type WidgetType = "admin-portal-domain-verification" | "user-management" | "organization-switcher" | "user-sessions" | "user-security" | "user-profile" | "admin-portal-sso-connection" | "api-keys" | "pipes";
 type AuthToken = string | (() => Promise<string>);
 interface ElevatedAccess {
     token: string;
     expiresAt: string;
 }
 interface ApiConfig {
-    authToken: Promise<string> | string;
-    authTokenQueryKey: string;
+    authToken: string | undefined;
+    permissions: string[] | undefined;
     baseUrl: string;
     widgetType: WidgetType;
     elevatedAccess?: ElevatedAccess;
@@ -27,5 +27,6 @@ declare const useElevatedAccessToken: () => {
     elevatedAccess: ElevatedAccess | undefined;
     setElevatedAccess: (elevatedAccess?: ElevatedAccess) => void;
 };
+declare const useApiReady: () => boolean;
 
-export { ApiProvider, type AuthToken, type WidgetType, useApi, useElevatedAccessToken };
+export { ApiProvider, type AuthToken, type WidgetType, useApi, useApiReady, useElevatedAccessToken };

package/dist/esm/api/api-provider.js

@@ -1,5 +1,8 @@
 import { jsx } from "react/jsx-runtime";
+import { useQuery } from "@tanstack/react-query";
 import * as React from "react";
+import { useIsHydrated } from "../lib/use-is-hydrated.js";
+import { getClaims } from "./utils.js";
 const ApiContext = React.createContext(void 0);
 const ApiProvider = ({
   authToken,
@@ -7,7 +10,20 @@ const ApiProvider = ({
   children,
   widgetType
 }) => {
-  const authTokenPromiseOrString = typeof authToken === "string" ? authToken : authToken();
+  const authTokenQuery = useQuery({
+    initialData: typeof authToken === "string" ? {
+      authToken,
+      permissions: getClaims(authToken).permissions
+    } : void 0,
+    queryFn: async () => {
+      const resolvedToken = typeof authToken === "string" ? authToken : await authToken();
+      return {
+        authToken: resolvedToken,
+        permissions: getClaims(resolvedToken).permissions
+      };
+    },
+    queryKey: ["authToken", widgetType]
+  });
   const [elevatedAccess, setElevatedAccess] = React.useState();
   const elevatedAccessTimeout = React.useRef(void 0);
   React.useEffect(() => {
@@ -31,15 +47,15 @@ const ApiProvider = ({
   }, [elevatedAccess]);
   const value = React.useMemo(
     () => ({
-      authToken: authTokenPromiseOrString,
-      authTokenQueryKey: getAuthTokenQueryKey(authTokenPromiseOrString),
+      authToken: authTokenQuery.data?.authToken,
+      permissions: authTokenQuery.data?.permissions,
       baseUrl,
       elevatedAccess,
       setElevatedAccess,
       widgetType
     }),
     [
-      authTokenPromiseOrString,
+      authTokenQuery.data,
       baseUrl,
       elevatedAccess,
       setElevatedAccess,
@@ -59,24 +75,15 @@ const useElevatedAccessToken = () => {
   const { elevatedAccess, setElevatedAccess } = useApi();
   return { elevatedAccess, setElevatedAccess };
 };
-const PromiseKey = /* @__PURE__ */ new WeakMap();
-function getAuthTokenQueryKey(authTokenPromiseOrString) {
-  if (typeof authTokenPromiseOrString === "string") {
-    return authTokenPromiseOrString;
-  }
-  const authTokenPromise = authTokenPromiseOrString;
-  const promiseKey = PromiseKey.get(authTokenPromise);
-  if (!promiseKey) {
-    const newPromiseKey = `${Math.random()}`;
-    PromiseKey.set(authTokenPromise, newPromiseKey);
-    return newPromiseKey;
-  } else {
-    return promiseKey;
-  }
-}
+const useApiReady = () => {
+  const { authToken } = useApi();
+  const isHydrated = useIsHydrated();
+  return isHydrated && authToken !== void 0;
+};
 export {
   ApiProvider,
   useApi,
+  useApiReady,
   useElevatedAccessToken
 };
 //# sourceMappingURL=api-provider.js.map

package/dist/esm/api/api-provider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/api/api-provider.tsx"],"sourcesContent":["import * as React from \"react\";\n\nexport type WidgetType =\n  | \"admin-portal-domain-verification\"\n  | \"user-management\"\n  | \"organization-switcher\"\n  | \"user-sessions\"\n  | \"user-security\"\n  | \"user-profile\"\n  | \"admin-portal-sso-connection\"\n  | \"api-keys\";\n\nexport type AuthToken = string | (() => Promise<string>);\n\ninterface ElevatedAccess {\n  token: string;\n  expiresAt: string;\n}\n\ninterface ApiConfig {\n  authToken: Promise<string> | string;\n  authTokenQueryKey: string;\n  baseUrl: string;\n  widgetType: WidgetType;\n  elevatedAccess?: ElevatedAccess;\n  setElevatedAccess: (elevatedAccess?: ElevatedAccess) => void;\n}\n\nconst ApiContext = React.createContext<ApiConfig | undefined>(undefined);\n\ninterface ApiProviderProps {\n  authToken: AuthToken;\n  baseUrl: string;\n  children: React.ReactNode;\n  widgetType: WidgetType;\n}\n\nexport const ApiProvider = ({\n  authToken,\n  baseUrl,\n  children,\n  widgetType,\n}: ApiProviderProps) => {\n  const authTokenPromiseOrString =\n    typeof authToken === \"string\" ? authToken : authToken();\n  const [elevatedAccess, setElevatedAccess] = React.useState<ElevatedAccess>();\n  const elevatedAccessTimeout = React.useRef<number | undefined>(undefined);\n\n  // This effect manages the expiration of elevated access tokens\n  // When an elevated access token is present, it checks every 30 seconds if the token has expired\n  // If the token has expired (current time > expiration time), it clears the elevated access\n  React.useEffect(() => {\n    if (elevatedAccessTimeout.current) {\n      window.clearInterval(elevatedAccessTimeout.current);\n    }\n\n    if (elevatedAccess) {\n      elevatedAccessTimeout.current = window.setInterval(() => {\n        const now = new Date();\n        const expiresAtDate = new Date(elevatedAccess.expiresAt);\n\n        //  Reset the elevated access if it has expired\n        if (now > expiresAtDate) {\n          setElevatedAccess(undefined);\n        }\n      }, 30_000); // every 30 seconds\n    }\n\n    return () => {\n      if (elevatedAccessTimeout.current) {\n        window.clearInterval(elevatedAccessTimeout.current);\n      }\n    };\n  }, [elevatedAccess]);\n\n  const value = React.useMemo(\n    () => ({\n      authToken: authTokenPromiseOrString,\n      authTokenQueryKey: getAuthTokenQueryKey(authTokenPromiseOrString),\n      baseUrl,\n      elevatedAccess,\n      setElevatedAccess,\n      widgetType,\n    }),\n    [\n      authTokenPromiseOrString,\n      baseUrl,\n      elevatedAccess,\n      setElevatedAccess,\n      widgetType,\n    ],\n  );\n\n  return <ApiContext.Provider value={value}>{children}</ApiContext.Provider>;\n};\n\nexport const useApi = () => {\n  const context = React.useContext(ApiContext);\n\n  if (context === undefined) {\n    throw new Error(\"useApi must be used within an ApiProvider\");\n  }\n\n  return context;\n};\n\nexport const useElevatedAccessToken = () => {\n  const { elevatedAccess, setElevatedAccess } = useApi();\n\n  return { elevatedAccess, setElevatedAccess };\n};\n\n// Map promises to a UUID that they can be identified by\nconst PromiseKey = new WeakMap<Promise<string>, string>();\n/*\n *\n * @param getAccessToken - Async function that returns a promise that resolves to a string\n * @returns a resolved string or null from the access token promise\n */\nfunction getAuthTokenQueryKey(\n  authTokenPromiseOrString: Promise<string> | string,\n): string {\n  // Need to go by equality of the promise to avoid scenarios where\n  // 1. The promise is the same, but the function changes\n  // 2. The function is the same, but the promise is different ⚠️\n  //\n  // This does have the unfortunate side effect where if the function result\n  // isn't memoized somehow, then it will invalidate the query on every render.\n  // This doesn't occur with the current use case of getAccessToken from\n  // useAuth, but could in a custom implementation.\n  //\n  // Other things I explored:\n  // 1. Removing promise api, and force user to resolve the promise\n  //    themselves. The user can already do this with the string API, so\n  //    it's not necessary, and they could run into issues 1, or 2 if\n  //    implemented wrong.\n  // 2. Memoizing the function - this results in issue 2, where the function\n  //    is static, but the promise changes. I believe this actually is the\n  //    case with useAuth since it only sets the client once on initialization,\n  //    and binds the function to the client after that promise resolves.\n\n  if (typeof authTokenPromiseOrString === \"string\") {\n    return authTokenPromiseOrString;\n  }\n\n  const authTokenPromise = authTokenPromiseOrString;\n\n  // Cannot memoize on the function because it could remain the same while\n  // returning a different promise (and useAuth behaves this way).\n\n  const promiseKey = PromiseKey.get(authTokenPromise);\n\n  // Side effect, but we we're using a weak map, so it should be pretty safe\n  if (!promiseKey) {\n    const newPromiseKey = `${Math.random()}`;\n    PromiseKey.set(authTokenPromise, newPromiseKey);\n    return newPromiseKey;\n  } else {\n    return promiseKey;\n  }\n}\n"],"mappings":"AA6FS;AA7FT,YAAY,WAAW;AA4BvB,MAAM,aAAa,MAAM,cAAqC,MAAS;AAShE,MAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAwB;AACtB,QAAM,2BACJ,OAAO,cAAc,WAAW,YAAY,UAAU;AACxD,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,MAAM,SAAyB;AAC3E,QAAM,wBAAwB,MAAM,OAA2B,MAAS;AAKxE,QAAM,UAAU,MAAM;AACpB,QAAI,sBAAsB,SAAS;AACjC,aAAO,cAAc,sBAAsB,OAAO;AAAA,IACpD;AAEA,QAAI,gBAAgB;AAClB,4BAAsB,UAAU,OAAO,YAAY,MAAM;AACvD,cAAM,MAAM,oBAAI,KAAK;AACrB,cAAM,gBAAgB,IAAI,KAAK,eAAe,SAAS;AAGvD,YAAI,MAAM,eAAe;AACvB,4BAAkB,MAAS;AAAA,QAC7B;AAAA,MACF,GAAG,GAAM;AAAA,IACX;AAEA,WAAO,MAAM;AACX,UAAI,sBAAsB,SAAS;AACjC,eAAO,cAAc,sBAAsB,OAAO;AAAA,MACpD;AAAA,IACF;AAAA,EACF,GAAG,CAAC,cAAc,CAAC;AAEnB,QAAM,QAAQ,MAAM;AAAA,IAClB,OAAO;AAAA,MACL,WAAW;AAAA,MACX,mBAAmB,qBAAqB,wBAAwB;AAAA,MAChE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO,oBAAC,WAAW,UAAX,EAAoB,OAAe,UAAS;AACtD;AAEO,MAAM,SAAS,MAAM;AAC1B,QAAM,UAAU,MAAM,WAAW,UAAU;AAE3C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI,MAAM,2CAA2C;AAAA,EAC7D;AAEA,SAAO;AACT;AAEO,MAAM,yBAAyB,MAAM;AAC1C,QAAM,EAAE,gBAAgB,kBAAkB,IAAI,OAAO;AAErD,SAAO,EAAE,gBAAgB,kBAAkB;AAC7C;AAGA,MAAM,aAAa,oBAAI,QAAiC;AAMxD,SAAS,qBACP,0BACQ;AAoBR,MAAI,OAAO,6BAA6B,UAAU;AAChD,WAAO;AAAA,EACT;AAEA,QAAM,mBAAmB;AAKzB,QAAM,aAAa,WAAW,IAAI,gBAAgB;AAGlD,MAAI,CAAC,YAAY;AACf,UAAM,gBAAgB,GAAG,KAAK,OAAO,CAAC;AACtC,eAAW,IAAI,kBAAkB,aAAa;AAC9C,WAAO;AAAA,EACT,OAAO;AACL,WAAO;AAAA,EACT;AACF;","names":[]}
+{"version":3,"sources":["../../../src/api/api-provider.tsx"],"sourcesContent":["import { useQuery } from \"@tanstack/react-query\";\nimport * as React from \"react\";\nimport { useIsHydrated } from \"../lib/use-is-hydrated.js\";\nimport { getClaims } from \"./utils.js\";\n\nexport type WidgetType =\n  | \"admin-portal-domain-verification\"\n  | \"user-management\"\n  | \"organization-switcher\"\n  | \"user-sessions\"\n  | \"user-security\"\n  | \"user-profile\"\n  | \"admin-portal-sso-connection\"\n  | \"api-keys\"\n  | \"pipes\";\n\nexport type AuthToken = string | (() => Promise<string>);\n\ninterface ElevatedAccess {\n  token: string;\n  expiresAt: string;\n}\n\ninterface ApiConfig {\n  authToken: string | undefined;\n  permissions: string[] | undefined;\n  baseUrl: string;\n  widgetType: WidgetType;\n  elevatedAccess?: ElevatedAccess;\n  setElevatedAccess: (elevatedAccess?: ElevatedAccess) => void;\n}\n\nconst ApiContext = React.createContext<ApiConfig | undefined>(undefined);\n\ninterface ApiProviderProps {\n  authToken: AuthToken;\n  baseUrl: string;\n  children: React.ReactNode;\n  widgetType: WidgetType;\n}\n\nexport const ApiProvider = ({\n  authToken,\n  baseUrl,\n  children,\n  widgetType,\n}: ApiProviderProps) => {\n  const authTokenQuery = useQuery({\n    initialData:\n      typeof authToken === \"string\"\n        ? {\n            authToken,\n            permissions: getClaims(authToken).permissions,\n          }\n        : undefined,\n    queryFn: async () => {\n      const resolvedToken =\n        typeof authToken === \"string\" ? authToken : await authToken();\n\n      return {\n        authToken: resolvedToken,\n        permissions: getClaims(resolvedToken).permissions,\n      };\n    },\n    queryKey: [\"authToken\", widgetType],\n  });\n\n  const [elevatedAccess, setElevatedAccess] = React.useState<ElevatedAccess>();\n  const elevatedAccessTimeout = React.useRef<number | undefined>(undefined);\n\n  // This effect manages the expiration of elevated access tokens\n  // When an elevated access token is present, it checks every 30 seconds if the token has expired\n  // If the token has expired (current time > expiration time), it clears the elevated access\n  React.useEffect(() => {\n    if (elevatedAccessTimeout.current) {\n      window.clearInterval(elevatedAccessTimeout.current);\n    }\n\n    if (elevatedAccess) {\n      elevatedAccessTimeout.current = window.setInterval(() => {\n        const now = new Date();\n        const expiresAtDate = new Date(elevatedAccess.expiresAt);\n\n        //  Reset the elevated access if it has expired\n        if (now > expiresAtDate) {\n          setElevatedAccess(undefined);\n        }\n      }, 30_000); // every 30 seconds\n    }\n\n    return () => {\n      if (elevatedAccessTimeout.current) {\n        window.clearInterval(elevatedAccessTimeout.current);\n      }\n    };\n  }, [elevatedAccess]);\n\n  const value = React.useMemo(\n    () => ({\n      authToken: authTokenQuery.data?.authToken,\n      permissions: authTokenQuery.data?.permissions,\n      baseUrl,\n      elevatedAccess,\n      setElevatedAccess,\n      widgetType,\n    }),\n    [\n      authTokenQuery.data,\n      baseUrl,\n      elevatedAccess,\n      setElevatedAccess,\n      widgetType,\n    ],\n  );\n\n  return <ApiContext.Provider value={value}>{children}</ApiContext.Provider>;\n};\n\nexport const useApi = () => {\n  const context = React.useContext(ApiContext);\n\n  if (context === undefined) {\n    throw new Error(\"useApi must be used within an ApiProvider\");\n  }\n\n  return context;\n};\n\nexport const useElevatedAccessToken = () => {\n  const { elevatedAccess, setElevatedAccess } = useApi();\n\n  return { elevatedAccess, setElevatedAccess };\n};\n\nexport const useApiReady = () => {\n  const { authToken } = useApi();\n  const isHydrated = useIsHydrated();\n\n  return isHydrated && authToken !== undefined;\n};\n"],"mappings":"AAmHS;AAnHT,SAAS,gBAAgB;AACzB,YAAY,WAAW;AACvB,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AA6B1B,MAAM,aAAa,MAAM,cAAqC,MAAS;AAShE,MAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAwB;AACtB,QAAM,iBAAiB,SAAS;AAAA,IAC9B,aACE,OAAO,cAAc,WACjB;AAAA,MACE;AAAA,MACA,aAAa,UAAU,SAAS,EAAE;AAAA,IACpC,IACA;AAAA,IACN,SAAS,YAAY;AACnB,YAAM,gBACJ,OAAO,cAAc,WAAW,YAAY,MAAM,UAAU;AAE9D,aAAO;AAAA,QACL,WAAW;AAAA,QACX,aAAa,UAAU,aAAa,EAAE;AAAA,MACxC;AAAA,IACF;AAAA,IACA,UAAU,CAAC,aAAa,UAAU;AAAA,EACpC,CAAC;AAED,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,MAAM,SAAyB;AAC3E,QAAM,wBAAwB,MAAM,OAA2B,MAAS;AAKxE,QAAM,UAAU,MAAM;AACpB,QAAI,sBAAsB,SAAS;AACjC,aAAO,cAAc,sBAAsB,OAAO;AAAA,IACpD;AAEA,QAAI,gBAAgB;AAClB,4BAAsB,UAAU,OAAO,YAAY,MAAM;AACvD,cAAM,MAAM,oBAAI,KAAK;AACrB,cAAM,gBAAgB,IAAI,KAAK,eAAe,SAAS;AAGvD,YAAI,MAAM,eAAe;AACvB,4BAAkB,MAAS;AAAA,QAC7B;AAAA,MACF,GAAG,GAAM;AAAA,IACX;AAEA,WAAO,MAAM;AACX,UAAI,sBAAsB,SAAS;AACjC,eAAO,cAAc,sBAAsB,OAAO;AAAA,MACpD;AAAA,IACF;AAAA,EACF,GAAG,CAAC,cAAc,CAAC;AAEnB,QAAM,QAAQ,MAAM;AAAA,IAClB,OAAO;AAAA,MACL,WAAW,eAAe,MAAM;AAAA,MAChC,aAAa,eAAe,MAAM;AAAA,MAClC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO,oBAAC,WAAW,UAAX,EAAoB,OAAe,UAAS;AACtD;AAEO,MAAM,SAAS,MAAM;AAC1B,QAAM,UAAU,MAAM,WAAW,UAAU;AAE3C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI,MAAM,2CAA2C;AAAA,EAC7D;AAEA,SAAO;AACT;AAEO,MAAM,yBAAyB,MAAM;AAC1C,QAAM,EAAE,gBAAgB,kBAAkB,IAAI,OAAO;AAErD,SAAO,EAAE,gBAAgB,kBAAkB;AAC7C;AAEO,MAAM,cAAc,MAAM;AAC/B,QAAM,EAAE,UAAU,IAAI,OAAO;AAC7B,QAAM,aAAa,cAAc;AAEjC,SAAO,cAAc,cAAc;AACrC;","names":[]}