@workos-inc/widgets 1.5.0 → 1.6.0

package/dist/esm/lib/elevated-access.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/elevated-access.tsx"],"sourcesContent":["import * as Form from \"@radix-ui/react-form\";\nimport { AlertDialog, Callout, Dialog, Flex, Text } from \"@radix-ui/themes\";\nimport { useMe, useSendVerification, useVerify } from \"../api/endpoint.js\";\nimport { useElevatedAccessToken } from \"../api/api-provider.js\";\nimport { PropsWithChildren, useEffect, useRef, useState } from \"react\";\nimport { PrimaryButton, SecondaryButton } from \"./elements.js\";\nimport * as Otp from \"./otp-input.js\";\n\ninterface ElevatedAccessProps extends PropsWithChildren {\n  onVerified?: () => Promise<unknown>;\n  type?: \"dialog\" | \"alert\";\n}\n\nexport function ElevatedAccess({\n  type = \"dialog\",\n  children,\n  onVerified,\n}: ElevatedAccessProps) {\n  const { elevatedAccess } = useElevatedAccessToken();\n  const [authenticationChallengeId, setAuthenticationChallengeId] =\n    useState<string>();\n\n  const prevAccessToken = useRef(elevatedAccess);\n\n  useEffect(() => {\n    prevAccessToken.current = elevatedAccess;\n  }, [elevatedAccess]);\n\n  if (elevatedAccess) {\n    return <>{children}</>;\n  }\n\n  if (!authenticationChallengeId) {\n    const hasTokenExpired = !!prevAccessToken.current;\n\n    return (\n      <SendVerificationEmailForm\n        type={type}\n        hasTokenExpired={hasTokenExpired}\n        onSuccess={(challengeId) => {\n          setAuthenticationChallengeId(challengeId);\n        }}\n      />\n    );\n  }\n\n  if (authenticationChallengeId) {\n    return (\n      <VerificationIdentityForm\n        type={type}\n        authenticationChallengeId={authenticationChallengeId}\n        onSuccess={() => {\n          // Reset the challenge id\n          setAuthenticationChallengeId(undefined);\n\n          return onVerified?.();\n        }}\n      />\n    );\n  }\n\n  return null;\n}\n\ninterface SendVerificationEmailFormProps {\n  onSuccess: (challengeId: string) => unknown | Promise<unknown>;\n  type: \"dialog\" | \"alert\";\n  hasTokenExpired: boolean;\n}\n\nfunction SendVerificationEmailForm({\n  onSuccess,\n  type,\n  hasTokenExpired,\n}: SendVerificationEmailFormProps) {\n  const { data: me } = useMe();\n  const sendVerification = useSendVerification({\n    mutation: { onSuccess: (data) => onSuccess(data.authenticationChallenge) },\n  });\n\n  const Title = type === \"dialog\" ? Dialog.Title : AlertDialog.Title;\n  const Description =\n    type === \"dialog\" ? Dialog.Description : AlertDialog.Description;\n  const Close = type === \"dialog\" ? Dialog.Close : AlertDialog.Cancel;\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    sendVerification.mutate();\n  };\n\n  return (\n    <form onSubmit={handleSubmit}>\n      <Title>\n        {hasTokenExpired\n          ? \"Your verification token has expired\"\n          : \"Verify your identity\"}\n      </Title>\n\n      <Description color=\"gray\" mb=\"5\">\n        To continue, we need to confirm your identity. We'll send a temporary\n        verification code to{\" \"}\n        <Text weight=\"bold\" highContrast>\n          {me?.email}\n        </Text>\n        .\n      </Description>\n\n      {sendVerification.error && (\n        <Callout.Root color=\"red\" mt=\"-2\" mb=\"0\">\n          <Callout.Text>\n            {getMutationErrorMessage(sendVerification.error)}\n          </Callout.Text>\n        </Callout.Root>\n      )}\n\n      <Flex justify=\"end\" align=\"center\" gap=\"3\" mt=\"5\">\n        <Close>\n          <SecondaryButton type=\"button\" disabled={sendVerification.isPending}>\n            Cancel\n          </SecondaryButton>\n        </Close>\n        <PrimaryButton type=\"submit\" loading={sendVerification.isPending}>\n          Send verification code\n        </PrimaryButton>\n      </Flex>\n    </form>\n  );\n}\n\ninterface VerificationIdentityFormProps {\n  onSuccess?: () => unknown | Promise<unknown>;\n  authenticationChallengeId: string;\n  type: \"dialog\" | \"alert\";\n}\n\nfunction VerificationIdentityForm({\n  onSuccess,\n  authenticationChallengeId,\n  type,\n}: VerificationIdentityFormProps) {\n  const { data: me } = useMe();\n  const { setElevatedAccess } = useElevatedAccessToken();\n  const verifyIdentity = useVerify();\n  const [isSubmitting, setIsSubmitting] = useState(false);\n\n  const Title = type === \"dialog\" ? Dialog.Title : AlertDialog.Title;\n  const Description =\n    type === \"dialog\" ? Dialog.Description : AlertDialog.Description;\n  const Close = type === \"dialog\" ? Dialog.Close : AlertDialog.Cancel;\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const formData = new FormData(event.currentTarget);\n    const code = formData.get(\"otp-code\")?.toString() ?? \"\";\n\n    setIsSubmitting(true);\n\n    try {\n      // Mutate async so we can wait for the onSuccess callback as well\n      const newAuthState = await verifyIdentity.mutateAsync({\n        data: {\n          code,\n          authenticationChallengeId,\n        },\n      });\n\n      const in10Seconds = new Date(Date.now() + 5 * 1000);\n\n      setElevatedAccess({\n        token: newAuthState.elevatedAccessToken,\n        // expiresAt: newAuthState.expiresAt,\n        expiresAt: in10Seconds.toISOString(),\n      });\n\n      if (onSuccess) {\n        await new Promise((resolve) => setTimeout(resolve, 200));\n        await onSuccess();\n      }\n    } catch (error) {\n      console.error(error);\n    }\n\n    setIsSubmitting(false);\n  };\n\n  return (\n    <Form.Root onSubmit={handleSubmit}>\n      <Title>Verify your identity</Title>\n\n      <Description color=\"gray\">\n        A verification code was sent to{\" \"}\n        <Text weight=\"bold\" highContrast>\n          {me?.email}\n        </Text>\n        . Please enter it below.\n      </Description>\n\n      <Flex direction=\"column\" gap=\"2\" mt=\"5\" mx=\"auto\" width=\"fit-content\">\n        <Otp.Root\n          autoSubmit\n          gap=\"2\"\n          justify=\"center\"\n          columns=\"repeat(6, 48px)\"\n          width=\"fit-content\"\n          rows=\"48px\"\n          name=\"otp-code\"\n          readOnly={isSubmitting}\n        >\n          <Otp.Input required autoFocus autoComplete=\"off\" />\n          <Otp.Input required />\n          <Otp.Input required />\n          <Otp.Input required />\n          <Otp.Input required />\n          <Otp.Input required />\n        </Otp.Root>\n\n        {verifyIdentity.error && (\n          <Text color=\"red\" size=\"2\" as=\"p\">\n            {getMutationErrorMessage(verifyIdentity.error)}\n          </Text>\n        )}\n      </Flex>\n\n      <Flex justify=\"end\" align=\"center\" gap=\"3\" mt=\"5\">\n        <Close>\n          <SecondaryButton type=\"button\">Cancel</SecondaryButton>\n        </Close>\n\n        <PrimaryButton type=\"submit\" loading={isSubmitting}>\n          Confirm\n        </PrimaryButton>\n      </Flex>\n    </Form.Root>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  let message = typeof error === \"string\" ? error : \"\";\n\n  if (error instanceof Error) {\n    message = error.message;\n  } else if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    message = error.message;\n  }\n\n  if (!message || message === \"Bad Request\") {\n    message = \"Invalid code, please try again.\";\n  }\n\n  return message;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/elevated-access.tsx"],"sourcesContent":["import * as Form from \"@radix-ui/react-form\";\nimport { AlertDialog, Callout, Dialog, Flex, Text } from \"@radix-ui/themes\";\nimport { useMe, useSendVerification, useVerify } from \"../api/endpoint.js\";\nimport { useElevatedAccessToken } from \"../api/api-provider.js\";\nimport { PropsWithChildren, useEffect, useRef, useState } from \"react\";\nimport { PrimaryButton, SecondaryButton } from \"./elements.js\";\nimport * as Otp from \"./otp-input.js\";\n\ninterface ElevatedAccessProps extends PropsWithChildren {\n  onVerified?: () => Promise<unknown>;\n  type?: \"dialog\" | \"alert\";\n}\n\nexport function ElevatedAccess({\n  type = \"dialog\",\n  children,\n  onVerified,\n}: ElevatedAccessProps) {\n  const { elevatedAccess } = useElevatedAccessToken();\n  const [authenticationChallengeId, setAuthenticationChallengeId] =\n    useState<string>();\n\n  const prevAccessToken = useRef(elevatedAccess);\n\n  useEffect(() => {\n    prevAccessToken.current = elevatedAccess;\n  }, [elevatedAccess]);\n\n  if (elevatedAccess) {\n    return <>{children}</>;\n  }\n\n  if (!authenticationChallengeId) {\n    // FIXME: This should be refactored\n    // eslint-disable-next-line react-hooks/refs\n    const hasTokenExpired = !!prevAccessToken.current;\n\n    return (\n      <SendVerificationEmailForm\n        type={type}\n        hasTokenExpired={hasTokenExpired}\n        onSuccess={(challengeId) => {\n          setAuthenticationChallengeId(challengeId);\n        }}\n      />\n    );\n  }\n\n  if (authenticationChallengeId) {\n    return (\n      <VerificationIdentityForm\n        type={type}\n        authenticationChallengeId={authenticationChallengeId}\n        onSuccess={() => {\n          // Reset the challenge id\n          setAuthenticationChallengeId(undefined);\n\n          return onVerified?.();\n        }}\n      />\n    );\n  }\n\n  return null;\n}\n\ninterface SendVerificationEmailFormProps {\n  onSuccess: (challengeId: string) => unknown | Promise<unknown>;\n  type: \"dialog\" | \"alert\";\n  hasTokenExpired: boolean;\n}\n\nfunction SendVerificationEmailForm({\n  onSuccess,\n  type,\n  hasTokenExpired,\n}: SendVerificationEmailFormProps) {\n  const { data: me } = useMe();\n  const sendVerification = useSendVerification({\n    mutation: { onSuccess: (data) => onSuccess(data.authenticationChallenge) },\n  });\n\n  const Title = type === \"dialog\" ? Dialog.Title : AlertDialog.Title;\n  const Description =\n    type === \"dialog\" ? Dialog.Description : AlertDialog.Description;\n  const Close = type === \"dialog\" ? Dialog.Close : AlertDialog.Cancel;\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    sendVerification.mutate();\n  };\n\n  return (\n    <form onSubmit={handleSubmit}>\n      <Title>\n        {hasTokenExpired\n          ? \"Your verification token has expired\"\n          : \"Verify your identity\"}\n      </Title>\n\n      <Description color=\"gray\" mb=\"5\">\n        To continue, we need to confirm your identity. We'll send a temporary\n        verification code to{\" \"}\n        <Text weight=\"bold\" highContrast>\n          {me?.email}\n        </Text>\n        .\n      </Description>\n\n      {sendVerification.error && (\n        <Callout.Root color=\"red\" mt=\"-2\" mb=\"0\">\n          <Callout.Text>\n            {getMutationErrorMessage(sendVerification.error)}\n          </Callout.Text>\n        </Callout.Root>\n      )}\n\n      <Flex justify=\"end\" align=\"center\" gap=\"3\" mt=\"5\">\n        <Close>\n          <SecondaryButton type=\"button\" disabled={sendVerification.isPending}>\n            Cancel\n          </SecondaryButton>\n        </Close>\n        <PrimaryButton type=\"submit\" loading={sendVerification.isPending}>\n          Send verification code\n        </PrimaryButton>\n      </Flex>\n    </form>\n  );\n}\n\ninterface VerificationIdentityFormProps {\n  onSuccess?: () => unknown | Promise<unknown>;\n  authenticationChallengeId: string;\n  type: \"dialog\" | \"alert\";\n}\n\nfunction VerificationIdentityForm({\n  onSuccess,\n  authenticationChallengeId,\n  type,\n}: VerificationIdentityFormProps) {\n  const { data: me } = useMe();\n  const { setElevatedAccess } = useElevatedAccessToken();\n  const verifyIdentity = useVerify();\n  const [isSubmitting, setIsSubmitting] = useState(false);\n\n  const Title = type === \"dialog\" ? Dialog.Title : AlertDialog.Title;\n  const Description =\n    type === \"dialog\" ? Dialog.Description : AlertDialog.Description;\n  const Close = type === \"dialog\" ? Dialog.Close : AlertDialog.Cancel;\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const formData = new FormData(event.currentTarget);\n    const code = formData.get(\"otp-code\")?.toString() ?? \"\";\n\n    setIsSubmitting(true);\n\n    try {\n      // Mutate async so we can wait for the onSuccess callback as well\n      const newAuthState = await verifyIdentity.mutateAsync({\n        data: {\n          code,\n          authenticationChallengeId,\n        },\n      });\n\n      const in10Seconds = new Date(Date.now() + 5 * 1000);\n\n      setElevatedAccess({\n        token: newAuthState.elevatedAccessToken,\n        // expiresAt: newAuthState.expiresAt,\n        expiresAt: in10Seconds.toISOString(),\n      });\n\n      if (onSuccess) {\n        await new Promise((resolve) => setTimeout(resolve, 200));\n        await onSuccess();\n      }\n    } catch (error) {\n      console.error(error);\n    }\n\n    setIsSubmitting(false);\n  };\n\n  return (\n    <Form.Root onSubmit={handleSubmit}>\n      <Title>Verify your identity</Title>\n\n      <Description color=\"gray\">\n        A verification code was sent to{\" \"}\n        <Text weight=\"bold\" highContrast>\n          {me?.email}\n        </Text>\n        . Please enter it below.\n      </Description>\n\n      <Flex direction=\"column\" gap=\"2\" mt=\"5\" mx=\"auto\" width=\"fit-content\">\n        <Otp.Root\n          autoSubmit\n          gap=\"2\"\n          justify=\"center\"\n          columns=\"repeat(6, 48px)\"\n          width=\"fit-content\"\n          rows=\"48px\"\n          name=\"otp-code\"\n          readOnly={isSubmitting}\n        >\n          <Otp.Input required autoFocus autoComplete=\"off\" />\n          <Otp.Input required />\n          <Otp.Input required />\n          <Otp.Input required />\n          <Otp.Input required />\n          <Otp.Input required />\n        </Otp.Root>\n\n        {verifyIdentity.error && (\n          <Text color=\"red\" size=\"2\" as=\"p\">\n            {getMutationErrorMessage(verifyIdentity.error)}\n          </Text>\n        )}\n      </Flex>\n\n      <Flex justify=\"end\" align=\"center\" gap=\"3\" mt=\"5\">\n        <Close>\n          <SecondaryButton type=\"button\">Cancel</SecondaryButton>\n        </Close>\n\n        <PrimaryButton type=\"submit\" loading={isSubmitting}>\n          Confirm\n        </PrimaryButton>\n      </Flex>\n    </Form.Root>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  let message = typeof error === \"string\" ? error : \"\";\n\n  if (error instanceof Error) {\n    message = error.message;\n  } else if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    message = error.message;\n  }\n\n  if (!message || message === \"Bad Request\") {\n    message = \"Invalid code, please try again.\";\n  }\n\n  return message;\n}\n"],"mappings":"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","names":[]}

package/dist/esm/lib/empty-state.d.ts

@@ -1,10 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { WidgetRootDomProps } from './utils.js';
+import '../api/endpoint.js';
+import '@tanstack/react-query';
+import '../api/widgets-api-client.js';
 
-interface EmptyStateProps {
+interface EmptyStateProps extends WidgetRootDomProps {
     heading: string;
     message: string;
     action?: React.ReactNode;
 }
-declare function EmptyState({ heading, message, action }: EmptyStateProps): react_jsx_runtime.JSX.Element;
+declare function EmptyState({ heading, message, action, ...domProps }: EmptyStateProps): react_jsx_runtime.JSX.Element;
 
 export { EmptyState };

package/dist/esm/lib/empty-state.js

@@ -1,13 +1,29 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Flex, Heading, Text } from "@radix-ui/themes";
-function EmptyState({ heading, message, action }) {
-  return /* @__PURE__ */ jsxs(Flex, { p: "6", gap: "4", justify: "center", align: "center", direction: "column", children: [
-    /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", maxWidth: "420px", children: [
-      /* @__PURE__ */ jsx(Heading, { size: "5", align: "center", mb: "1", wrap: "balance", as: "h3", children: heading }),
-      /* @__PURE__ */ jsx(Text, { as: "p", align: "center", wrap: "balance", color: "gray", children: message })
-    ] }),
-    action
-  ] });
+function EmptyState({
+  heading,
+  message,
+  action,
+  ...domProps
+}) {
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      p: "6",
+      gap: "4",
+      justify: "center",
+      align: "center",
+      direction: "column",
+      ...domProps,
+      children: [
+        /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", maxWidth: "420px", children: [
+          /* @__PURE__ */ jsx(Heading, { size: "5", align: "center", mb: "1", wrap: "balance", as: "h3", children: heading }),
+          /* @__PURE__ */ jsx(Text, { as: "p", align: "center", wrap: "balance", color: "gray", children: message })
+        ] }),
+        action
+      ]
+    }
+  );
 }
 export {
   EmptyState

package/dist/esm/lib/empty-state.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/empty-state.tsx"],"sourcesContent":["import { Flex, Heading, Text } from \"@radix-ui/themes\";\n\ninterface EmptyStateProps {\n  heading: string;\n  message: string;\n  action?: React.ReactNode;\n}\n\nexport function EmptyState({ heading, message, action }: EmptyStateProps) {\n  return (\n    <Flex p=\"6\" gap=\"4\" justify=\"center\" align=\"center\" direction=\"column\">\n      <Flex direction=\"column\" gap=\"1\" maxWidth=\"420px\">\n        <Heading size=\"5\" align=\"center\" mb=\"1\" wrap=\"balance\" as=\"h3\">\n          {heading}\n        </Heading>\n\n        <Text as=\"p\" align=\"center\" wrap=\"balance\" color=\"gray\">\n          {message}\n        </Text>\n      </Flex>\n\n      {action}\n    </Flex>\n  );\n}\n"],"mappings":"AAWM,SACE,KADF;AAXN,SAAS,MAAM,SAAS,YAAY;AAQ7B,SAAS,WAAW,EAAE,SAAS,SAAS,OAAO,GAAoB;AACxE,SACE,qBAAC,QAAK,GAAE,KAAI,KAAI,KAAI,SAAQ,UAAS,OAAM,UAAS,WAAU,UAC5D;AAAA,yBAAC,QAAK,WAAU,UAAS,KAAI,KAAI,UAAS,SACxC;AAAA,0BAAC,WAAQ,MAAK,KAAI,OAAM,UAAS,IAAG,KAAI,MAAK,WAAU,IAAG,MACvD,mBACH;AAAA,MAEA,oBAAC,QAAK,IAAG,KAAI,OAAM,UAAS,MAAK,WAAU,OAAM,QAC9C,mBACH;AAAA,OACF;AAAA,IAEC;AAAA,KACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/lib/empty-state.tsx"],"sourcesContent":["import { Flex, Heading, Text } from \"@radix-ui/themes\";\nimport { WidgetRootDomProps } from \"./utils.js\";\n\ninterface EmptyStateProps extends WidgetRootDomProps {\n  heading: string;\n  message: string;\n  action?: React.ReactNode;\n}\n\nexport function EmptyState({\n  heading,\n  message,\n  action,\n  ...domProps\n}: EmptyStateProps) {\n  return (\n    <Flex\n      p=\"6\"\n      gap=\"4\"\n      justify=\"center\"\n      align=\"center\"\n      direction=\"column\"\n      {...domProps}\n    >\n      <Flex direction=\"column\" gap=\"1\" maxWidth=\"420px\">\n        <Heading size=\"5\" align=\"center\" mb=\"1\" wrap=\"balance\" as=\"h3\">\n          {heading}\n        </Heading>\n\n        <Text as=\"p\" align=\"center\" wrap=\"balance\" color=\"gray\">\n          {message}\n        </Text>\n      </Flex>\n\n      {action}\n    </Flex>\n  );\n}\n"],"mappings":"AAwBM,SACE,KADF;AAxBN,SAAS,MAAM,SAAS,YAAY;AAS7B,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAoB;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,KAAI;AAAA,MACJ,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,WAAU;AAAA,MACT,GAAG;AAAA,MAEJ;AAAA,6BAAC,QAAK,WAAU,UAAS,KAAI,KAAI,UAAS,SACxC;AAAA,8BAAC,WAAQ,MAAK,KAAI,OAAM,UAAS,IAAG,KAAI,MAAK,WAAU,IAAG,MACvD,mBACH;AAAA,UAEA,oBAAC,QAAK,IAAG,KAAI,OAAM,UAAS,MAAK,WAAU,OAAM,QAC9C,mBACH;AAAA,WACF;AAAA,QAEC;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/esm/lib/errors.js

@@ -26,7 +26,7 @@ class NoAuthTokenError extends Error {
 class IncorrectPermissionsError extends Error {
   constructor(args) {
     super("Incorrect permissions");
-    this.name = "NoPermissionError";
+    this.name = "IncorrectPermissionsError";
     this.context = args?.context;
   }
 }

package/dist/esm/lib/errors.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/errors.ts"],"sourcesContent":["type QueryType = \"query\" | \"mutation\";\ntype RecordType = \"users\" | \"roles\";\n\nexport class FetchError extends Error {\n  queryType: QueryType;\n  recordType: RecordType;\n  context: unknown;\n  constructor(args: {\n    message: string;\n    queryType: QueryType;\n    recordType: RecordType;\n    context?: unknown;\n  }) {\n    super(args.message);\n    this.name = \"FetchError\";\n    this.queryType = args.queryType;\n    this.recordType = args.recordType;\n    this.context = args.context;\n  }\n}\n\nexport class ApiError extends Error {\n  status: number;\n  queryType: QueryType;\n  recordType: RecordType;\n  context: unknown;\n  constructor(args: {\n    message: string;\n    queryType: QueryType;\n    recordType: RecordType;\n    status: number;\n    context?: unknown;\n  }) {\n    super(args.message);\n    this.name = \"ApiError\";\n    this.status = args.status;\n    this.queryType = args.queryType;\n    this.recordType = args.recordType;\n  }\n}\n\nexport class NoAuthTokenError extends Error {\n  context: unknown;\n  constructor(args?: { context?: unknown }) {\n    super(\"No auth token provided\");\n    this.name = \"NoAuthTokenError\";\n    this.context = args?.context;\n  }\n}\n\nexport class IncorrectPermissionsError extends Error {\n  context: unknown;\n  constructor(args?: { context?: unknown }) {\n    super(\"Incorrect permissions\");\n    this.name = \"NoPermissionError\";\n    this.context = args?.context;\n  }\n}\n"],"mappings":"AAGO,MAAM,mBAAmB,MAAM;AAAA,EAIpC,YAAY,MAKT;AACD,UAAM,KAAK,OAAO;AAClB,SAAK,OAAO;AACZ,SAAK,YAAY,KAAK;AACtB,SAAK,aAAa,KAAK;AACvB,SAAK,UAAU,KAAK;AAAA,EACtB;AACF;AAEO,MAAM,iBAAiB,MAAM;AAAA,EAKlC,YAAY,MAMT;AACD,UAAM,KAAK,OAAO;AAClB,SAAK,OAAO;AACZ,SAAK,SAAS,KAAK;AACnB,SAAK,YAAY,KAAK;AACtB,SAAK,aAAa,KAAK;AAAA,EACzB;AACF;AAEO,MAAM,yBAAyB,MAAM;AAAA,EAE1C,YAAY,MAA8B;AACxC,UAAM,wBAAwB;AAC9B,SAAK,OAAO;AACZ,SAAK,UAAU,MAAM;AAAA,EACvB;AACF;AAEO,MAAM,kCAAkC,MAAM;AAAA,EAEnD,YAAY,MAA8B;AACxC,UAAM,uBAAuB;AAC7B,SAAK,OAAO;AACZ,SAAK,UAAU,MAAM;AAAA,EACvB;AACF;","names":[]}
+{"version":3,"sources":["../../../src/lib/errors.ts"],"sourcesContent":["type QueryType = \"query\" | \"mutation\";\ntype RecordType = \"users\" | \"roles\";\n\nexport class FetchError extends Error {\n  queryType: QueryType;\n  recordType: RecordType;\n  context: unknown;\n  constructor(args: {\n    message: string;\n    queryType: QueryType;\n    recordType: RecordType;\n    context?: unknown;\n  }) {\n    super(args.message);\n    this.name = \"FetchError\";\n    this.queryType = args.queryType;\n    this.recordType = args.recordType;\n    this.context = args.context;\n  }\n}\n\nexport class ApiError extends Error {\n  status: number;\n  queryType: QueryType;\n  recordType: RecordType;\n  context: unknown;\n  constructor(args: {\n    message: string;\n    queryType: QueryType;\n    recordType: RecordType;\n    status: number;\n    context?: unknown;\n  }) {\n    super(args.message);\n    this.name = \"ApiError\";\n    this.status = args.status;\n    this.queryType = args.queryType;\n    this.recordType = args.recordType;\n  }\n}\n\nexport class NoAuthTokenError extends Error {\n  context: unknown;\n  constructor(args?: { context?: unknown }) {\n    super(\"No auth token provided\");\n    this.name = \"NoAuthTokenError\";\n    this.context = args?.context;\n  }\n}\n\nexport class IncorrectPermissionsError extends Error {\n  context: unknown;\n  constructor(args?: { context?: unknown }) {\n    super(\"Incorrect permissions\");\n    this.name = \"IncorrectPermissionsError\";\n    this.context = args?.context;\n  }\n}\n"],"mappings":"AAGO,MAAM,mBAAmB,MAAM;AAAA,EAIpC,YAAY,MAKT;AACD,UAAM,KAAK,OAAO;AAClB,SAAK,OAAO;AACZ,SAAK,YAAY,KAAK;AACtB,SAAK,aAAa,KAAK;AACvB,SAAK,UAAU,KAAK;AAAA,EACtB;AACF;AAEO,MAAM,iBAAiB,MAAM;AAAA,EAKlC,YAAY,MAMT;AACD,UAAM,KAAK,OAAO;AAClB,SAAK,OAAO;AACZ,SAAK,SAAS,KAAK;AACnB,SAAK,YAAY,KAAK;AACtB,SAAK,aAAa,KAAK;AAAA,EACzB;AACF;AAEO,MAAM,yBAAyB,MAAM;AAAA,EAE1C,YAAY,MAA8B;AACxC,UAAM,wBAAwB;AAC9B,SAAK,OAAO;AACZ,SAAK,UAAU,MAAM;AAAA,EACvB;AACF;AAEO,MAAM,kCAAkC,MAAM;AAAA,EAEnD,YAAY,MAA8B;AACxC,UAAM,uBAAuB;AAC7B,SAAK,OAAO;AACZ,SAAK,UAAU,MAAM;AAAA,EACvB;AACF;","names":[]}

package/dist/esm/lib/generic-error.d.ts

@@ -1,7 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { Flex } from '@radix-ui/themes';
 
-declare function GenericError({ error }: {
+type GenericErrorProps = React.ComponentProps<typeof Flex> & {
     error: unknown;
-}): react_jsx_runtime.JSX.Element;
+};
+declare function GenericError({ error, ...domProps }: GenericErrorProps): react_jsx_runtime.JSX.Element;
+declare function getErrorMessage(error: unknown): {
+    heading: string;
+    message: string;
+};
 
-export { GenericError };
+export { GenericError, getErrorMessage };

package/dist/esm/lib/generic-error.js

@@ -1,80 +1,76 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { Flex, Heading, Link, Text } from "@radix-ui/themes";
+import { Flex, Heading, Text } from "@radix-ui/themes";
 import {
-  ApiError,
   FetchError,
   IncorrectPermissionsError,
   NoAuthTokenError
 } from "./errors.js";
 import { Cross2Icon } from "@radix-ui/react-icons";
-function GenericError({ error }) {
+function GenericError({ error, ...domProps }) {
   React.useEffect(() => {
     console.error(error);
   }, [error]);
-  const render = (heading, message) => /* @__PURE__ */ jsxs(Flex, { p: "6", justify: "center", align: "center", direction: "column", children: [
-    /* @__PURE__ */ jsx(
-      Flex,
-      {
-        align: "center",
-        justify: "center",
-        width: "32px",
-        height: "32px",
-        mb: "2",
-        style: {
-          borderRadius: "9999px",
-          backgroundColor: "var(--red-a4)",
-          color: "var(--red-a11)"
-        },
-        children: /* @__PURE__ */ jsx(Cross2Icon, { width: "24px", height: "24px" })
-      }
-    ),
-    /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", maxWidth: "420px", children: [
-      /* @__PURE__ */ jsx(Heading, { size: "5", align: "center", mb: "1", wrap: "balance", as: "h3", children: heading }),
-      /* @__PURE__ */ jsx(Text, { as: "p", align: "center", wrap: "balance", color: "gray", children: message })
-    ] })
-  ] });
+  const { heading, message } = getErrorMessage(error);
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      p: "6",
+      justify: "center",
+      align: "center",
+      direction: "column",
+      ...domProps,
+      children: [
+        /* @__PURE__ */ jsx(
+          Flex,
+          {
+            align: "center",
+            justify: "center",
+            width: "32px",
+            height: "32px",
+            mb: "2",
+            style: {
+              borderRadius: "9999px",
+              backgroundColor: "var(--red-a4)",
+              color: "var(--red-a11)"
+            },
+            children: /* @__PURE__ */ jsx(Cross2Icon, { width: "24px", height: "24px" })
+          }
+        ),
+        /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", maxWidth: "420px", children: [
+          /* @__PURE__ */ jsx(Heading, { size: "5", align: "center", mb: "1", wrap: "balance", as: "h3", children: heading }),
+          /* @__PURE__ */ jsx(Text, { as: "p", align: "center", wrap: "balance", color: "gray", children: message })
+        ] })
+      ]
+    }
+  );
+}
+function getErrorMessage(error) {
   if (error instanceof FetchError) {
-    return render(
-      "Error fetching data",
-      "An error occurred. You may need to configure CORS in the WorkOS Dashboard. Contact your organization admin for support."
-    );
+    return {
+      heading: "Error fetching data",
+      message: "An error occurred. You may need to configure CORS in the WorkOS Dashboard."
+    };
   }
   if (error instanceof NoAuthTokenError) {
-    return render(
-      "Error fetching data",
-      "Authorization error. You likely forgot to provide an authorization token to the Users Management Widget."
-    );
-  }
-  if (error instanceof ApiError && error.status === 404) {
-    return render(
-      "Error fetching data",
-      "Authorization error. Contact your organization admin for support."
-    );
+    return {
+      heading: "Authorization error",
+      message: "You likely forgot to provide an authorization token to the widget."
+    };
   }
   if (error instanceof IncorrectPermissionsError) {
-    return render(
-      "Error fetching data",
-      /* @__PURE__ */ jsxs(Fragment, { children: [
-        "Incorrect permissions.",
-        " ",
-        /* @__PURE__ */ jsx(
-          Link,
-          {
-            href: "https://workos.com/docs/user-management/widgets/user-management",
-            target: "_blank",
-            children: "Check that the correct permissions have been assigned."
-          }
-        )
-      ] })
-    );
+    return {
+      heading: "Incorrect permissions",
+      message: "Check that the correct permissions have been assigned."
+    };
   }
-  return render(
-    "Error fetching data",
-    "An unknown error occurred. If the problem continues, contact the site owner."
-  );
+  return {
+    heading: "Error fetching data",
+    message: "An unexpected error occurred. Check your network connection or try refreshing the page."
+  };
 }
 export {
-  GenericError
+  GenericError,
+  getErrorMessage
 };
 //# sourceMappingURL=generic-error.js.map

package/dist/esm/lib/generic-error.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/generic-error.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Flex, Heading, Link, Text } from \"@radix-ui/themes\";\nimport {\n  ApiError,\n  FetchError,\n  IncorrectPermissionsError,\n  NoAuthTokenError,\n} from \"./errors.js\";\nimport { Cross2Icon } from \"@radix-ui/react-icons\";\n\nexport function GenericError({ error }: { error: unknown }) {\n  React.useEffect(() => {\n    console.error(error);\n  }, [error]);\n\n  const render = (heading: string, message: React.ReactNode) => (\n    <Flex p=\"6\" justify=\"center\" align=\"center\" direction=\"column\">\n      <Flex\n        align=\"center\"\n        justify=\"center\"\n        width=\"32px\"\n        height=\"32px\"\n        mb=\"2\"\n        style={{\n          borderRadius: \"9999px\",\n          backgroundColor: \"var(--red-a4)\",\n          color: \"var(--red-a11)\",\n        }}\n      >\n        <Cross2Icon width=\"24px\" height=\"24px\" />\n      </Flex>\n\n      <Flex direction=\"column\" gap=\"1\" maxWidth=\"420px\">\n        <Heading size=\"5\" align=\"center\" mb=\"1\" wrap=\"balance\" as=\"h3\">\n          {heading}\n        </Heading>\n\n        <Text as=\"p\" align=\"center\" wrap=\"balance\" color=\"gray\">\n          {message}\n        </Text>\n      </Flex>\n    </Flex>\n  );\n\n  if (error instanceof FetchError) {\n    return render(\n      \"Error fetching data\",\n      \"An error occurred. You may need to configure CORS in the WorkOS Dashboard. \" +\n        \"Contact your organization admin for support.\",\n    );\n  }\n\n  if (error instanceof NoAuthTokenError) {\n    return render(\n      \"Error fetching data\",\n      \"Authorization error. You likely forgot to provide an authorization \" +\n        \"token to the Users Management Widget.\",\n    );\n  }\n\n  if (error instanceof ApiError && error.status === 404) {\n    // The widgets API treats all authorization errors as 404s. If there is a\n    // legitimate 404, it's a bug on our end but there's currently no way to\n    // distinguish between the two.\n    return render(\n      \"Error fetching data\",\n      \"Authorization error. Contact your organization admin for support.\",\n    );\n  }\n\n  if (error instanceof IncorrectPermissionsError) {\n    return render(\n      \"Error fetching data\",\n      <>\n        Incorrect permissions.{\" \"}\n        <Link\n          href=\"https://workos.com/docs/user-management/widgets/user-management\"\n          target=\"_blank\"\n        >\n          Check that the correct permissions have been assigned.\n        </Link>\n      </>,\n    );\n  }\n\n  return render(\n    \"Error fetching data\",\n    \"An unknown error occurred. If the problem continues, contact the site owner.\",\n  );\n}\n"],"mappings":"AA6BQ,SA4CF,UA5CE,KAGF,YAHE;AA7BR,YAAY,WAAW;AACvB,SAAS,MAAM,SAAS,MAAM,YAAY;AAC1C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAEpB,SAAS,aAAa,EAAE,MAAM,GAAuB;AAC1D,QAAM,UAAU,MAAM;AACpB,YAAQ,MAAM,KAAK;AAAA,EACrB,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,SAAS,CAAC,SAAiB,YAC/B,qBAAC,QAAK,GAAE,KAAI,SAAQ,UAAS,OAAM,UAAS,WAAU,UACpD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,QAAO;AAAA,QACP,IAAG;AAAA,QACH,OAAO;AAAA,UACL,cAAc;AAAA,UACd,iBAAiB;AAAA,UACjB,OAAO;AAAA,QACT;AAAA,QAEA,8BAAC,cAAW,OAAM,QAAO,QAAO,QAAO;AAAA;AAAA,IACzC;AAAA,IAEA,qBAAC,QAAK,WAAU,UAAS,KAAI,KAAI,UAAS,SACxC;AAAA,0BAAC,WAAQ,MAAK,KAAI,OAAM,UAAS,IAAG,KAAI,MAAK,WAAU,IAAG,MACvD,mBACH;AAAA,MAEA,oBAAC,QAAK,IAAG,KAAI,OAAM,UAAS,MAAK,WAAU,OAAM,QAC9C,mBACH;AAAA,OACF;AAAA,KACF;AAGF,MAAI,iBAAiB,YAAY;AAC/B,WAAO;AAAA,MACL;AAAA,MACA;AAAA,IAEF;AAAA,EACF;AAEA,MAAI,iBAAiB,kBAAkB;AACrC,WAAO;AAAA,MACL;AAAA,MACA;AAAA,IAEF;AAAA,EACF;AAEA,MAAI,iBAAiB,YAAY,MAAM,WAAW,KAAK;AAIrD,WAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,MAAI,iBAAiB,2BAA2B;AAC9C,WAAO;AAAA,MACL;AAAA,MACA,iCAAE;AAAA;AAAA,QACuB;AAAA,QACvB;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,QAAO;AAAA,YACR;AAAA;AAAA,QAED;AAAA,SACF;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../../src/lib/generic-error.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Flex, Heading, Text } from \"@radix-ui/themes\";\nimport {\n  FetchError,\n  IncorrectPermissionsError,\n  NoAuthTokenError,\n} from \"./errors.js\";\nimport { Cross2Icon } from \"@radix-ui/react-icons\";\n\ntype GenericErrorProps = React.ComponentProps<typeof Flex> & {\n  error: unknown;\n};\n\nexport function GenericError({ error, ...domProps }: GenericErrorProps) {\n  React.useEffect(() => {\n    console.error(error);\n  }, [error]);\n\n  const { heading, message } = getErrorMessage(error);\n  return (\n    <Flex\n      p=\"6\"\n      justify=\"center\"\n      align=\"center\"\n      direction=\"column\"\n      {...domProps}\n    >\n      <Flex\n        align=\"center\"\n        justify=\"center\"\n        width=\"32px\"\n        height=\"32px\"\n        mb=\"2\"\n        style={{\n          borderRadius: \"9999px\",\n          backgroundColor: \"var(--red-a4)\",\n          color: \"var(--red-a11)\",\n        }}\n      >\n        <Cross2Icon width=\"24px\" height=\"24px\" />\n      </Flex>\n\n      <Flex direction=\"column\" gap=\"1\" maxWidth=\"420px\">\n        <Heading size=\"5\" align=\"center\" mb=\"1\" wrap=\"balance\" as=\"h3\">\n          {heading}\n        </Heading>\n        <Text as=\"p\" align=\"center\" wrap=\"balance\" color=\"gray\">\n          {message}\n        </Text>\n      </Flex>\n    </Flex>\n  );\n}\n\nexport function getErrorMessage(error: unknown) {\n  if (error instanceof FetchError) {\n    return {\n      heading: \"Error fetching data\",\n      message:\n        \"An error occurred. You may need to configure CORS in the WorkOS Dashboard.\",\n    };\n  }\n\n  if (error instanceof NoAuthTokenError) {\n    return {\n      heading: \"Authorization error\",\n      message:\n        \"You likely forgot to provide an authorization token to the widget.\",\n    };\n  }\n\n  if (error instanceof IncorrectPermissionsError) {\n    return {\n      heading: \"Incorrect permissions\",\n      message: \"Check that the correct permissions have been assigned.\",\n    };\n  }\n\n  return {\n    heading: \"Error fetching data\",\n    message:\n      \"An unexpected error occurred. Check your network connection or try refreshing the page.\",\n  };\n}\n"],"mappings":"AAuCQ,cAGF,YAHE;AAvCR,YAAY,WAAW;AACvB,SAAS,MAAM,SAAS,YAAY;AACpC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAMpB,SAAS,aAAa,EAAE,OAAO,GAAG,SAAS,GAAsB;AACtE,QAAM,UAAU,MAAM;AACpB,YAAQ,MAAM,KAAK;AAAA,EACrB,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,EAAE,SAAS,QAAQ,IAAI,gBAAgB,KAAK;AAClD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,WAAU;AAAA,MACT,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,SAAQ;AAAA,YACR,OAAM;AAAA,YACN,QAAO;AAAA,YACP,IAAG;AAAA,YACH,OAAO;AAAA,cACL,cAAc;AAAA,cACd,iBAAiB;AAAA,cACjB,OAAO;AAAA,YACT;AAAA,YAEA,8BAAC,cAAW,OAAM,QAAO,QAAO,QAAO;AAAA;AAAA,QACzC;AAAA,QAEA,qBAAC,QAAK,WAAU,UAAS,KAAI,KAAI,UAAS,SACxC;AAAA,8BAAC,WAAQ,MAAK,KAAI,OAAM,UAAS,IAAG,KAAI,MAAK,WAAU,IAAG,MACvD,mBACH;AAAA,UACA,oBAAC,QAAK,IAAG,KAAI,OAAM,UAAS,MAAK,WAAU,OAAM,QAC9C,mBACH;AAAA,WACF;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,gBAAgB,OAAgB;AAC9C,MAAI,iBAAiB,YAAY;AAC/B,WAAO;AAAA,MACL,SAAS;AAAA,MACT,SACE;AAAA,IACJ;AAAA,EACF;AAEA,MAAI,iBAAiB,kBAAkB;AACrC,WAAO;AAAA,MACL,SAAS;AAAA,MACT,SACE;AAAA,IACJ;AAAA,EACF;AAEA,MAAI,iBAAiB,2BAA2B;AAC9C,WAAO;AAAA,MACL,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,EACF;AAEA,SAAO;AAAA,IACL,SAAS;AAAA,IACT,SACE;AAAA,EACJ;AACF;","names":[]}

package/dist/esm/lib/identity-providers.d.ts

@@ -1,7 +1,7 @@
-declare const IDENTITY_PROVIDER_DICT: Map<"asana" | "box" | "dropbox" | "github" | "gitlab" | "google" | "google-calendar" | "google-drive" | "hubspot" | "intercom" | "linear" | "microsoft" | "notion" | "salesforce" | "slack" | "stripe" | "zendesk" | "azure" | "access-people-hr" | "adp" | "apple" | "auth0" | "aws" | "bamboohr" | "bamboo-hr" | "bitbucket" | "breathe-hr" | "bubble" | "cas" | "cezanne-hr" | "classlink" | "clerk" | "cloudflare" | "cyberark" | "datadog" | "duo" | "firebase" | "fourth" | "generic-saml" | "generic-oidc" | "godaddy" | "google-analytics" | "google-mail" | "google-cloud" | "hibob" | "intuit" | "jumpcloud" | "keycloak" | "lastpass" | "linkedin" | "login-gov" | "miniorange" | "net-iq" | "next-auth" | "okta" | "onelogin" | "oracle" | "personio" | "ping-identity" | "react-native-expo" | "rippling" | "segment" | "shibboleth" | "simple-saml-php" | "splunk" | "supabase" | "vercel" | "vmware" | "workday" | "workos" | "xero" | "test-idp" | "discord", "GoDaddy" | "Access People HR" | "ADP" | "Apple" | "Asana" | "Auth0" | "Azure" | "AWS" | "BambooHR" | "Bitbucket" | "Box" | "BreatheHR" | "Bubble" | "CAS" | "Cezanne HR" | "Classlink" | "Clerk" | "Cloudflare" | "CyberArk" | "Datadog" | "Dropbox" | "Duo" | "Firebase" | "Fourth" | "Generic SAML" | "Generic OIDC" | "GitHub" | "GitLab" | "Google" | "Google Analytics" | "Google Calendar" | "Google Drive" | "Google Mail" | "Google Cloud" | "Hibob" | "Hubspot" | "Intercom" | "Intuit" | "JumpCloud" | "Keycloak" | "LastPass" | "Linear" | "LinkedIn" | "Login.gov" | "Microsoft" | "Miniorange" | "NetIQ" | "NextAuth" | "Notion" | "Okta" | "OneLogin" | "Oracle" | "Personio" | "Ping Identity" | "React Native Expo" | "Rippling" | "Salesforce" | "Segment" | "Shibboleth" | "Simple SAML PHP" | "Slack" | "Splunk" | "Stripe" | "Supabase" | "Vercel" | "VMware" | "Workday" | "WorkOS" | "Xero" | "Zendesk" | "Test IDP" | "Discord">;
+declare const IDENTITY_PROVIDER_DICT: Map<"asana" | "box" | "dropbox" | "github" | "gitlab" | "google" | "google-calendar" | "google-drive" | "hubspot" | "intercom" | "linear" | "microsoft" | "notion" | "salesforce" | "slack" | "stripe" | "zendesk" | "azure" | "access-people-hr" | "adp" | "apple" | "auth0" | "aws" | "bamboohr" | "bamboo-hr" | "bitbucket" | "breathe-hr" | "bubble" | "cas" | "cezanne-hr" | "classlink" | "clerk" | "cloudflare" | "cyberark" | "datadog" | "duo" | "firebase" | "fourth" | "generic-saml" | "generic-oidc" | "godaddy" | "google-analytics" | "google-mail" | "google-cloud" | "hibob" | "intuit" | "jumpcloud" | "keycloak" | "lastpass" | "linkedin" | "login-gov" | "miniorange" | "net-iq" | "next-auth" | "okta" | "onelogin" | "oracle" | "personio" | "ping-identity" | "react-native-expo" | "rippling" | "segment" | "shibboleth" | "simple-saml-php" | "splunk" | "supabase" | "vercel" | "vmware" | "workday" | "workos" | "xero" | "test-idp" | "discord" | "clever", "GoDaddy" | "Access People HR" | "ADP" | "Apple" | "Asana" | "Auth0" | "Azure" | "AWS" | "BambooHR" | "Bitbucket" | "Box" | "BreatheHR" | "Bubble" | "CAS" | "Cezanne HR" | "Classlink" | "Clerk" | "Cloudflare" | "CyberArk" | "Datadog" | "Dropbox" | "Duo" | "Firebase" | "Fourth" | "Generic SAML" | "Generic OIDC" | "GitHub" | "GitLab" | "Google" | "Google Analytics" | "Google Calendar" | "Google Drive" | "Google Mail" | "Google Cloud" | "Hibob" | "Hubspot" | "Intercom" | "Intuit" | "JumpCloud" | "Keycloak" | "LastPass" | "Linear" | "LinkedIn" | "Login.gov" | "Microsoft" | "Miniorange" | "NetIQ" | "NextAuth" | "Notion" | "Okta" | "OneLogin" | "Oracle" | "Personio" | "Ping Identity" | "React Native Expo" | "Rippling" | "Salesforce" | "Segment" | "Shibboleth" | "Simple SAML PHP" | "Slack" | "Splunk" | "Stripe" | "Supabase" | "Vercel" | "VMware" | "Workday" | "WorkOS" | "Xero" | "Zendesk" | "Test IDP" | "Discord" | "Clever">;
 type MapKey<T extends Map<unknown, unknown>> = T extends Map<infer K, unknown> ? K : never;
 type IdentityProvider = MapKey<typeof IDENTITY_PROVIDER_DICT>;
-declare function getIdentityProviderName(provider: IdentityProvider): "GoDaddy" | "Access People HR" | "ADP" | "Apple" | "Asana" | "Auth0" | "Azure" | "AWS" | "BambooHR" | "Bitbucket" | "Box" | "BreatheHR" | "Bubble" | "CAS" | "Cezanne HR" | "Classlink" | "Clerk" | "Cloudflare" | "CyberArk" | "Datadog" | "Dropbox" | "Duo" | "Firebase" | "Fourth" | "Generic SAML" | "Generic OIDC" | "GitHub" | "GitLab" | "Google" | "Google Analytics" | "Google Calendar" | "Google Drive" | "Google Mail" | "Google Cloud" | "Hibob" | "Hubspot" | "Intercom" | "Intuit" | "JumpCloud" | "Keycloak" | "LastPass" | "Linear" | "LinkedIn" | "Login.gov" | "Microsoft" | "Miniorange" | "NetIQ" | "NextAuth" | "Notion" | "Okta" | "OneLogin" | "Oracle" | "Personio" | "Ping Identity" | "React Native Expo" | "Rippling" | "Salesforce" | "Segment" | "Shibboleth" | "Simple SAML PHP" | "Slack" | "Splunk" | "Stripe" | "Supabase" | "Vercel" | "VMware" | "Workday" | "WorkOS" | "Xero" | "Zendesk" | "Test IDP" | "Discord" | undefined;
+declare function getIdentityProviderName(provider: IdentityProvider): "GoDaddy" | "Access People HR" | "ADP" | "Apple" | "Asana" | "Auth0" | "Azure" | "AWS" | "BambooHR" | "Bitbucket" | "Box" | "BreatheHR" | "Bubble" | "CAS" | "Cezanne HR" | "Classlink" | "Clerk" | "Cloudflare" | "CyberArk" | "Datadog" | "Dropbox" | "Duo" | "Firebase" | "Fourth" | "Generic SAML" | "Generic OIDC" | "GitHub" | "GitLab" | "Google" | "Google Analytics" | "Google Calendar" | "Google Drive" | "Google Mail" | "Google Cloud" | "Hibob" | "Hubspot" | "Intercom" | "Intuit" | "JumpCloud" | "Keycloak" | "LastPass" | "Linear" | "LinkedIn" | "Login.gov" | "Microsoft" | "Miniorange" | "NetIQ" | "NextAuth" | "Notion" | "Okta" | "OneLogin" | "Oracle" | "Personio" | "Ping Identity" | "React Native Expo" | "Rippling" | "Salesforce" | "Segment" | "Shibboleth" | "Simple SAML PHP" | "Slack" | "Splunk" | "Stripe" | "Supabase" | "Vercel" | "VMware" | "Workday" | "WorkOS" | "Xero" | "Zendesk" | "Test IDP" | "Discord" | "Clever" | undefined;
 declare function isIdentityProvider(provider: unknown): boolean;
 
 export { type IdentityProvider, getIdentityProviderName, isIdentityProvider };

package/dist/esm/lib/identity-providers.js

@@ -71,7 +71,8 @@ const IDENTITY_PROVIDER_DICT = /* @__PURE__ */ new Map([
   ["xero", "Xero"],
   ["zendesk", "Zendesk"],
   ["test-idp", "Test IDP"],
-  ["discord", "Discord"]
+  ["discord", "Discord"],
+  ["clever", "Clever"]
 ]);
 function getIdentityProviderName(provider) {
   return IDENTITY_PROVIDER_DICT.get(provider);

package/dist/esm/lib/identity-providers.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/identity-providers.ts"],"sourcesContent":["const IDENTITY_PROVIDER_DICT = new Map([\n  [\"access-people-hr\", \"Access People HR\"],\n  [\"adp\", \"ADP\"],\n  [\"apple\", \"Apple\"],\n  [\"asana\", \"Asana\"],\n  [\"auth0\", \"Auth0\"],\n  [\"azure\", \"Azure\"],\n  [\"aws\", \"AWS\"],\n  [\"bamboohr\", \"BambooHR\"],\n  [\"bamboo-hr\", \"BambooHR\"],\n  [\"bitbucket\", \"Bitbucket\"],\n  [\"box\", \"Box\"],\n  [\"breathe-hr\", \"BreatheHR\"],\n  [\"bubble\", \"Bubble\"],\n  [\"cas\", \"CAS\"],\n  [\"cezanne-hr\", \"Cezanne HR\"],\n  [\"classlink\", \"Classlink\"],\n  [\"clerk\", \"Clerk\"],\n  [\"cloudflare\", \"Cloudflare\"],\n  [\"cyberark\", \"CyberArk\"],\n  [\"datadog\", \"Datadog\"],\n  [\"dropbox\", \"Dropbox\"],\n  [\"duo\", \"Duo\"],\n  [\"firebase\", \"Firebase\"],\n  [\"fourth\", \"Fourth\"],\n  [\"generic-saml\", \"Generic SAML\"],\n  [\"generic-oidc\", \"Generic OIDC\"],\n  [\"github\", \"GitHub\"],\n  [\"gitlab\", \"GitLab\"],\n  [\"godaddy\", \"GoDaddy\"],\n  [\"google\", \"Google\"],\n  [\"google-analytics\", \"Google Analytics\"],\n  [\"google-calendar\", \"Google Calendar\"],\n  [\"google-drive\", \"Google Drive\"],\n  [\"google-mail\", \"Google Mail\"],\n  [\"google-cloud\", \"Google Cloud\"],\n  [\"hibob\", \"Hibob\"],\n  [\"hubspot\", \"Hubspot\"],\n  [\"intercom\", \"Intercom\"],\n  [\"intuit\", \"Intuit\"],\n  [\"jumpcloud\", \"JumpCloud\"],\n  [\"keycloak\", \"Keycloak\"],\n  [\"lastpass\", \"LastPass\"],\n  [\"linear\", \"Linear\"],\n  [\"linkedin\", \"LinkedIn\"],\n  [\"login-gov\", \"Login.gov\"],\n  [\"microsoft\", \"Microsoft\"],\n  [\"miniorange\", \"Miniorange\"],\n  [\"net-iq\", \"NetIQ\"],\n  [\"next-auth\", \"NextAuth\"],\n  [\"notion\", \"Notion\"],\n  [\"okta\", \"Okta\"],\n  [\"onelogin\", \"OneLogin\"],\n  [\"oracle\", \"Oracle\"],\n  [\"personio\", \"Personio\"],\n  [\"ping-identity\", \"Ping Identity\"],\n  [\"react-native-expo\", \"React Native Expo\"],\n  [\"rippling\", \"Rippling\"],\n  [\"salesforce\", \"Salesforce\"],\n  [\"segment\", \"Segment\"],\n  [\"shibboleth\", \"Shibboleth\"],\n  [\"simple-saml-php\", \"Simple SAML PHP\"],\n  [\"slack\", \"Slack\"],\n  [\"splunk\", \"Splunk\"],\n  [\"stripe\", \"Stripe\"],\n  [\"supabase\", \"Supabase\"],\n  [\"vercel\", \"Vercel\"],\n  [\"vmware\", \"VMware\"],\n  [\"workday\", \"Workday\"],\n  [\"workos\", \"WorkOS\"],\n  [\"xero\", \"Xero\"],\n  [\"zendesk\", \"Zendesk\"],\n  [\"test-idp\", \"Test IDP\"],\n  [\"discord\", \"Discord\"],\n] as const);\n\ntype MapKey<T extends Map<unknown, unknown>> =\n  T extends Map<infer K, unknown> ? K : never;\n\nexport type IdentityProvider = MapKey<typeof IDENTITY_PROVIDER_DICT>;\n\nexport function getIdentityProviderName(provider: IdentityProvider) {\n  return IDENTITY_PROVIDER_DICT.get(provider);\n}\n\nexport function isIdentityProvider(provider: unknown) {\n  return (\n    typeof provider === \"string\" &&\n    IDENTITY_PROVIDER_DICT.has(provider as IdentityProvider)\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/identity-providers.ts"],"sourcesContent":["const IDENTITY_PROVIDER_DICT = new Map([\n  [\"access-people-hr\", \"Access People HR\"],\n  [\"adp\", \"ADP\"],\n  [\"apple\", \"Apple\"],\n  [\"asana\", \"Asana\"],\n  [\"auth0\", \"Auth0\"],\n  [\"azure\", \"Azure\"],\n  [\"aws\", \"AWS\"],\n  [\"bamboohr\", \"BambooHR\"],\n  [\"bamboo-hr\", \"BambooHR\"],\n  [\"bitbucket\", \"Bitbucket\"],\n  [\"box\", \"Box\"],\n  [\"breathe-hr\", \"BreatheHR\"],\n  [\"bubble\", \"Bubble\"],\n  [\"cas\", \"CAS\"],\n  [\"cezanne-hr\", \"Cezanne HR\"],\n  [\"classlink\", \"Classlink\"],\n  [\"clerk\", \"Clerk\"],\n  [\"cloudflare\", \"Cloudflare\"],\n  [\"cyberark\", \"CyberArk\"],\n  [\"datadog\", \"Datadog\"],\n  [\"dropbox\", \"Dropbox\"],\n  [\"duo\", \"Duo\"],\n  [\"firebase\", \"Firebase\"],\n  [\"fourth\", \"Fourth\"],\n  [\"generic-saml\", \"Generic SAML\"],\n  [\"generic-oidc\", \"Generic OIDC\"],\n  [\"github\", \"GitHub\"],\n  [\"gitlab\", \"GitLab\"],\n  [\"godaddy\", \"GoDaddy\"],\n  [\"google\", \"Google\"],\n  [\"google-analytics\", \"Google Analytics\"],\n  [\"google-calendar\", \"Google Calendar\"],\n  [\"google-drive\", \"Google Drive\"],\n  [\"google-mail\", \"Google Mail\"],\n  [\"google-cloud\", \"Google Cloud\"],\n  [\"hibob\", \"Hibob\"],\n  [\"hubspot\", \"Hubspot\"],\n  [\"intercom\", \"Intercom\"],\n  [\"intuit\", \"Intuit\"],\n  [\"jumpcloud\", \"JumpCloud\"],\n  [\"keycloak\", \"Keycloak\"],\n  [\"lastpass\", \"LastPass\"],\n  [\"linear\", \"Linear\"],\n  [\"linkedin\", \"LinkedIn\"],\n  [\"login-gov\", \"Login.gov\"],\n  [\"microsoft\", \"Microsoft\"],\n  [\"miniorange\", \"Miniorange\"],\n  [\"net-iq\", \"NetIQ\"],\n  [\"next-auth\", \"NextAuth\"],\n  [\"notion\", \"Notion\"],\n  [\"okta\", \"Okta\"],\n  [\"onelogin\", \"OneLogin\"],\n  [\"oracle\", \"Oracle\"],\n  [\"personio\", \"Personio\"],\n  [\"ping-identity\", \"Ping Identity\"],\n  [\"react-native-expo\", \"React Native Expo\"],\n  [\"rippling\", \"Rippling\"],\n  [\"salesforce\", \"Salesforce\"],\n  [\"segment\", \"Segment\"],\n  [\"shibboleth\", \"Shibboleth\"],\n  [\"simple-saml-php\", \"Simple SAML PHP\"],\n  [\"slack\", \"Slack\"],\n  [\"splunk\", \"Splunk\"],\n  [\"stripe\", \"Stripe\"],\n  [\"supabase\", \"Supabase\"],\n  [\"vercel\", \"Vercel\"],\n  [\"vmware\", \"VMware\"],\n  [\"workday\", \"Workday\"],\n  [\"workos\", \"WorkOS\"],\n  [\"xero\", \"Xero\"],\n  [\"zendesk\", \"Zendesk\"],\n  [\"test-idp\", \"Test IDP\"],\n  [\"discord\", \"Discord\"],\n  [\"clever\", \"Clever\"],\n] as const);\n\ntype MapKey<T extends Map<unknown, unknown>> =\n  T extends Map<infer K, unknown> ? K : never;\n\nexport type IdentityProvider = MapKey<typeof IDENTITY_PROVIDER_DICT>;\n\nexport function getIdentityProviderName(provider: IdentityProvider) {\n  return IDENTITY_PROVIDER_DICT.get(provider);\n}\n\nexport function isIdentityProvider(provider: unknown) {\n  return (\n    typeof provider === \"string\" &&\n    IDENTITY_PROVIDER_DICT.has(provider as IdentityProvider)\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/esm/lib/oauth-icons.d.ts

@@ -1,6 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 
-declare const getOAuthIcon: (account: string) => React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
-declare const getOAuthName: (account: string) => "Apple" | "GitHub" | "Google" | "Microsoft";
+type OAuthAccount = "GithubOAuth" | "GoogleOAuth" | "MicrosoftOAuth" | "AppleOAuth";
+declare const OAuthIcon: ({ account, ...props }: React.ComponentPropsWithoutRef<"svg"> & {
+    account: OAuthAccount;
+}) => react_jsx_runtime.JSX.Element;
+declare const getOAuthName: (account: OAuthAccount) => "Apple" | "GitHub" | "Google" | "Microsoft";
 
-export { getOAuthIcon, getOAuthName };
+export { type OAuthAccount, OAuthIcon, getOAuthName };

package/dist/esm/lib/oauth-icons.js

@@ -105,17 +105,21 @@ const Apple = React.forwardRef(({ style, ...props }, forwardedRef) => /* @__PURE
   }
 ));
 Apple.displayName = "Apple";
-const getOAuthIcon = (account) => {
+const OAuthIcon = ({
+  account,
+  ...props
+}) => {
   switch (account) {
     case "GithubOAuth":
-      return GitHub;
+      return /* @__PURE__ */ jsx(GitHub, { ...props });
     case "GoogleOAuth":
-      return Google;
+      return /* @__PURE__ */ jsx(Google, { ...props });
     case "MicrosoftOAuth":
-      return Microsoft;
+      return /* @__PURE__ */ jsx(Microsoft, { ...props });
     case "AppleOAuth":
-      return Apple;
+      return /* @__PURE__ */ jsx(Apple, { ...props });
     default:
+      account;
       throw new Error(`Unknown OAuth account type: ${account}`);
   }
 };
@@ -130,11 +134,12 @@ const getOAuthName = (account) => {
     case "AppleOAuth":
       return "Apple";
     default:
+      account;
       throw new Error(`Unknown OAuth account type: ${account}`);
   }
 };
 export {
-  getOAuthIcon,
+  OAuthIcon,
   getOAuthName
 };
 //# sourceMappingURL=oauth-icons.js.map

package/dist/esm/lib/oauth-icons.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/oauth-icons.tsx"],"sourcesContent":["import * as React from \"react\";\n\nconst GitHub = React.forwardRef<\n  SVGSVGElement,\n  React.ComponentPropsWithoutRef<\"svg\">\n>((props, forwardedRef) => (\n  <svg\n    ref={forwardedRef}\n    fill=\"none\"\n    height=\"16\"\n    viewBox=\"0 0 15 15\"\n    width=\"16\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <path\n      clipRule=\"evenodd\"\n      d=\"M7.49933 0.25C3.49635 0.25 0.25 3.49593 0.25 7.50024C0.25 10.703 2.32715 13.4206 5.2081 14.3797C5.57084 14.446 5.70302 14.2222 5.70302 14.0299C5.70302 13.8576 5.69679 13.4019 5.69323 12.797C3.67661 13.235 3.25112 11.825 3.25112 11.825C2.92132 10.9874 2.44599 10.7644 2.44599 10.7644C1.78773 10.3149 2.49584 10.3238 2.49584 10.3238C3.22353 10.375 3.60629 11.0711 3.60629 11.0711C4.25298 12.1788 5.30335 11.8588 5.71638 11.6732C5.78225 11.205 5.96962 10.8854 6.17658 10.7043C4.56675 10.5209 2.87415 9.89918 2.87415 7.12104C2.87415 6.32925 3.15677 5.68257 3.62053 5.17563C3.54576 4.99226 3.29697 4.25521 3.69174 3.25691C3.69174 3.25691 4.30015 3.06196 5.68522 3.99973C6.26337 3.83906 6.8838 3.75895 7.50022 3.75583C8.1162 3.75895 8.73619 3.83906 9.31523 3.99973C10.6994 3.06196 11.3069 3.25691 11.3069 3.25691C11.7026 4.25521 11.4538 4.99226 11.3795 5.17563C11.8441 5.68257 12.1245 6.32925 12.1245 7.12104C12.1245 9.9063 10.4292 10.5192 8.81452 10.6985C9.07444 10.9224 9.30633 11.3648 9.30633 12.0413C9.30633 13.0102 9.29742 13.7922 9.29742 14.0299C9.29742 14.2239 9.42828 14.4496 9.79591 14.3788C12.6746 13.4179 14.75 10.7025 14.75 7.50024C14.75 3.49593 11.5036 0.25 7.49933 0.25Z\"\n      fill=\"currentColor\"\n      fillRule=\"evenodd\"\n    ></path>\n  </svg>\n));\n\nGitHub.displayName = \"GitHub\";\n\nconst Google = React.forwardRef<\n  SVGSVGElement,\n  React.ComponentPropsWithoutRef<\"svg\">\n>((props, forwardedRef) => (\n  <svg\n    ref={forwardedRef}\n    fill=\"none\"\n    height=\"15\"\n    viewBox=\"0 0 16 16\"\n    width=\"15\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <g>\n      <path\n        d=\"M15.83 8.18C15.83 7.65333 15.7833 7.15333 15.7033 6.66667H8.17V9.67333H12.4833C12.29 10.66 11.7233 11.4933 10.8833 12.06V14.06H13.4567C14.9633 12.6667 15.83 10.6133 15.83 8.18Z\"\n        fill=\"#4285F4\"\n      />\n      <path\n        d=\"M8.17 16C10.33 16 12.1367 15.28 13.4567 14.06L10.8833 12.06C10.1633 12.54 9.25 12.8333 8.17 12.8333C6.08334 12.8333 4.31667 11.4267 3.68334 9.52667H1.03V11.5867C2.34334 14.2 5.04334 16 8.17 16Z\"\n        fill=\"#34A853\"\n      />\n      <path\n        d=\"M3.68334 9.52667C3.51667 9.04667 3.43 8.53333 3.43 8C3.43 7.46667 3.52334 6.95334 3.68334 6.47334V4.41334H1.03C0.483335 5.49334 0.170002 6.70667 0.170002 8C0.170002 9.29333 0.483335 10.5067 1.03 11.5867L3.68334 9.52667Z\"\n        fill=\"#FBBC05\"\n      />\n      <path\n        d=\"M8.17 3.16667C9.35 3.16667 10.4033 3.57334 11.2367 4.36667L13.5167 2.08667C12.1367 0.793334 10.33 0 8.17 0C5.04334 0 2.34334 1.8 1.03 4.41334L3.68334 6.47334C4.31667 4.57334 6.08334 3.16667 8.17 3.16667Z\"\n        fill=\"#EA4335\"\n      />\n    </g>\n  </svg>\n));\n\nGoogle.displayName = \"Google\";\n\nconst Microsoft = React.forwardRef<\n  SVGSVGElement,\n  React.ComponentPropsWithoutRef<\"svg\">\n>((props, forwardedRef) => (\n  <svg\n    ref={forwardedRef}\n    fill=\"none\"\n    height=\"15\"\n    viewBox=\"0 0 15 15\"\n    width=\"15\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <g>\n      <path d=\"M0 0H7L7 7H-4.76837e-07L0 0Z\" fill=\"#F35325\" />\n      <path d=\"M8 0H15V7H8L8 0Z\" fill=\"#81BC06\" />\n      <path d=\"M0 8H7V15H0V8Z\" fill=\"#05A6F0\" />\n      <path d=\"M8 8L15 8V15L8 15V8Z\" fill=\"#FFBA08\" />\n    </g>\n  </svg>\n));\n\nMicrosoft.displayName = \"Microsoft\";\n\nconst Apple = React.forwardRef<\n  SVGSVGElement,\n  React.ComponentPropsWithoutRef<\"svg\">\n>(({ style, ...props }, forwardedRef) => (\n  <svg\n    ref={forwardedRef}\n    fill=\"none\"\n    height=\"15\"\n    style={{ overflow: \"visible\", ...style }}\n    viewBox=\"0 0 15 15\"\n    width=\"15\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <path\n      d=\"M14.219 3.33667C14.1169 3.41674 12.3137 4.44312 12.3137 6.72534C12.3137 9.3651 14.6082 10.299 14.6769 10.3221C14.6663 10.379 14.3124 11.601 13.4671 12.8462C12.7134 13.942 11.9263 15.0359 10.7288 15.0359C9.53134 15.0359 9.22317 14.3333 7.84081 14.3333C6.49366 14.3333 6.01469 15.0591 4.91935 15.0591C3.82401 15.0591 3.05978 14.0451 2.18104 12.8C1.1632 11.3378 0.34082 9.06625 0.34082 6.91034C0.34082 3.45232 2.56668 1.61835 4.75732 1.61835C5.92133 1.61835 6.89164 2.39036 7.62246 2.39036C8.31802 2.39036 9.40277 1.5721 10.7271 1.5721C11.2289 1.5721 13.0321 1.61835 14.219 3.33667ZM10.0984 0.108136C10.646 -0.548247 11.0334 -1.459 11.0334 -2.36975C11.0334 -2.49605 11.0229 -2.62412 11 -2.72729C10.1089 -2.6935 9.04883 -2.12783 8.40959 -1.37895C7.90772 -0.802617 7.43931 0.108136 7.43931 1.03134C7.43931 1.1701 7.46218 1.30883 7.47277 1.35331C7.52909 1.36398 7.62067 1.37643 7.71224 1.37643C8.51172 1.37643 9.51724 0.835672 10.0984 0.108136Z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n));\n\nApple.displayName = \"Apple\";\n\nexport const getOAuthIcon = (account: string) => {\n  switch (account) {\n    case \"GithubOAuth\":\n      return GitHub;\n    case \"GoogleOAuth\":\n      return Google;\n    case \"MicrosoftOAuth\":\n      return Microsoft;\n    case \"AppleOAuth\":\n      return Apple;\n    default:\n      throw new Error(`Unknown OAuth account type: ${account}`);\n  }\n};\n\nexport const getOAuthName = (account: string) => {\n  switch (account) {\n    case \"GithubOAuth\":\n      return \"GitHub\";\n    case \"GoogleOAuth\":\n      return \"Google\";\n    case \"MicrosoftOAuth\":\n      return \"Microsoft\";\n    case \"AppleOAuth\":\n      return \"Apple\";\n    default:\n      throw new Error(`Unknown OAuth account type: ${account}`);\n  }\n};\n"],"mappings":"AAeI,cAwBA,YAxBA;AAfJ,YAAY,WAAW;AAEvB,MAAM,SAAS,MAAM,WAGnB,CAAC,OAAO,iBACR;AAAA,EAAC;AAAA;AAAA,IACC,KAAK;AAAA,IACL,MAAK;AAAA,IACL,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,OAAM;AAAA,IACL,GAAG;AAAA,IAEJ;AAAA,MAAC;AAAA;AAAA,QACC,UAAS;AAAA,QACT,GAAE;AAAA,QACF,MAAK;AAAA,QACL,UAAS;AAAA;AAAA,IACV;AAAA;AACH,CACD;AAED,OAAO,cAAc;AAErB,MAAM,SAAS,MAAM,WAGnB,CAAC,OAAO,iBACR;AAAA,EAAC;AAAA;AAAA,IACC,KAAK;AAAA,IACL,MAAK;AAAA,IACL,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,OAAM;AAAA,IACL,GAAG;AAAA,IAEJ,+BAAC,OACC;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA,OACF;AAAA;AACF,CACD;AAED,OAAO,cAAc;AAErB,MAAM,YAAY,MAAM,WAGtB,CAAC,OAAO,iBACR;AAAA,EAAC;AAAA;AAAA,IACC,KAAK;AAAA,IACL,MAAK;AAAA,IACL,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,OAAM;AAAA,IACL,GAAG;AAAA,IAEJ,+BAAC,OACC;AAAA,0BAAC,UAAK,GAAE,gCAA+B,MAAK,WAAU;AAAA,MACtD,oBAAC,UAAK,GAAE,oBAAmB,MAAK,WAAU;AAAA,MAC1C,oBAAC,UAAK,GAAE,kBAAiB,MAAK,WAAU;AAAA,MACxC,oBAAC,UAAK,GAAE,wBAAuB,MAAK,WAAU;AAAA,OAChD;AAAA;AACF,CACD;AAED,UAAU,cAAc;AAExB,MAAM,QAAQ,MAAM,WAGlB,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,iBACtB;AAAA,EAAC;AAAA;AAAA,IACC,KAAK;AAAA,IACL,MAAK;AAAA,IACL,QAAO;AAAA,IACP,OAAO,EAAE,UAAU,WAAW,GAAG,MAAM;AAAA,IACvC,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,OAAM;AAAA,IACL,GAAG;AAAA,IAEJ;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA;AACF,CACD;AAED,MAAM,cAAc;AAEb,MAAM,eAAe,CAAC,YAAoB;AAC/C,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,YAAM,IAAI,MAAM,+BAA+B,OAAO,EAAE;AAAA,EAC5D;AACF;AAEO,MAAM,eAAe,CAAC,YAAoB;AAC/C,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,YAAM,IAAI,MAAM,+BAA+B,OAAO,EAAE;AAAA,EAC5D;AACF;","names":[]}
+{"version":3,"sources":["../../../src/lib/oauth-icons.tsx"],"sourcesContent":["import * as React from \"react\";\n\nexport type OAuthAccount =\n  | \"GithubOAuth\"\n  | \"GoogleOAuth\"\n  | \"MicrosoftOAuth\"\n  | \"AppleOAuth\";\n\nconst GitHub = React.forwardRef<\n  SVGSVGElement,\n  React.ComponentPropsWithoutRef<\"svg\">\n>((props, forwardedRef) => (\n  <svg\n    ref={forwardedRef}\n    fill=\"none\"\n    height=\"16\"\n    viewBox=\"0 0 15 15\"\n    width=\"16\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <path\n      clipRule=\"evenodd\"\n      d=\"M7.49933 0.25C3.49635 0.25 0.25 3.49593 0.25 7.50024C0.25 10.703 2.32715 13.4206 5.2081 14.3797C5.57084 14.446 5.70302 14.2222 5.70302 14.0299C5.70302 13.8576 5.69679 13.4019 5.69323 12.797C3.67661 13.235 3.25112 11.825 3.25112 11.825C2.92132 10.9874 2.44599 10.7644 2.44599 10.7644C1.78773 10.3149 2.49584 10.3238 2.49584 10.3238C3.22353 10.375 3.60629 11.0711 3.60629 11.0711C4.25298 12.1788 5.30335 11.8588 5.71638 11.6732C5.78225 11.205 5.96962 10.8854 6.17658 10.7043C4.56675 10.5209 2.87415 9.89918 2.87415 7.12104C2.87415 6.32925 3.15677 5.68257 3.62053 5.17563C3.54576 4.99226 3.29697 4.25521 3.69174 3.25691C3.69174 3.25691 4.30015 3.06196 5.68522 3.99973C6.26337 3.83906 6.8838 3.75895 7.50022 3.75583C8.1162 3.75895 8.73619 3.83906 9.31523 3.99973C10.6994 3.06196 11.3069 3.25691 11.3069 3.25691C11.7026 4.25521 11.4538 4.99226 11.3795 5.17563C11.8441 5.68257 12.1245 6.32925 12.1245 7.12104C12.1245 9.9063 10.4292 10.5192 8.81452 10.6985C9.07444 10.9224 9.30633 11.3648 9.30633 12.0413C9.30633 13.0102 9.29742 13.7922 9.29742 14.0299C9.29742 14.2239 9.42828 14.4496 9.79591 14.3788C12.6746 13.4179 14.75 10.7025 14.75 7.50024C14.75 3.49593 11.5036 0.25 7.49933 0.25Z\"\n      fill=\"currentColor\"\n      fillRule=\"evenodd\"\n    ></path>\n  </svg>\n));\n\nGitHub.displayName = \"GitHub\";\n\nconst Google = React.forwardRef<\n  SVGSVGElement,\n  React.ComponentPropsWithoutRef<\"svg\">\n>((props, forwardedRef) => (\n  <svg\n    ref={forwardedRef}\n    fill=\"none\"\n    height=\"15\"\n    viewBox=\"0 0 16 16\"\n    width=\"15\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <g>\n      <path\n        d=\"M15.83 8.18C15.83 7.65333 15.7833 7.15333 15.7033 6.66667H8.17V9.67333H12.4833C12.29 10.66 11.7233 11.4933 10.8833 12.06V14.06H13.4567C14.9633 12.6667 15.83 10.6133 15.83 8.18Z\"\n        fill=\"#4285F4\"\n      />\n      <path\n        d=\"M8.17 16C10.33 16 12.1367 15.28 13.4567 14.06L10.8833 12.06C10.1633 12.54 9.25 12.8333 8.17 12.8333C6.08334 12.8333 4.31667 11.4267 3.68334 9.52667H1.03V11.5867C2.34334 14.2 5.04334 16 8.17 16Z\"\n        fill=\"#34A853\"\n      />\n      <path\n        d=\"M3.68334 9.52667C3.51667 9.04667 3.43 8.53333 3.43 8C3.43 7.46667 3.52334 6.95334 3.68334 6.47334V4.41334H1.03C0.483335 5.49334 0.170002 6.70667 0.170002 8C0.170002 9.29333 0.483335 10.5067 1.03 11.5867L3.68334 9.52667Z\"\n        fill=\"#FBBC05\"\n      />\n      <path\n        d=\"M8.17 3.16667C9.35 3.16667 10.4033 3.57334 11.2367 4.36667L13.5167 2.08667C12.1367 0.793334 10.33 0 8.17 0C5.04334 0 2.34334 1.8 1.03 4.41334L3.68334 6.47334C4.31667 4.57334 6.08334 3.16667 8.17 3.16667Z\"\n        fill=\"#EA4335\"\n      />\n    </g>\n  </svg>\n));\n\nGoogle.displayName = \"Google\";\n\nconst Microsoft = React.forwardRef<\n  SVGSVGElement,\n  React.ComponentPropsWithoutRef<\"svg\">\n>((props, forwardedRef) => (\n  <svg\n    ref={forwardedRef}\n    fill=\"none\"\n    height=\"15\"\n    viewBox=\"0 0 15 15\"\n    width=\"15\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <g>\n      <path d=\"M0 0H7L7 7H-4.76837e-07L0 0Z\" fill=\"#F35325\" />\n      <path d=\"M8 0H15V7H8L8 0Z\" fill=\"#81BC06\" />\n      <path d=\"M0 8H7V15H0V8Z\" fill=\"#05A6F0\" />\n      <path d=\"M8 8L15 8V15L8 15V8Z\" fill=\"#FFBA08\" />\n    </g>\n  </svg>\n));\n\nMicrosoft.displayName = \"Microsoft\";\n\nconst Apple = React.forwardRef<\n  SVGSVGElement,\n  React.ComponentPropsWithoutRef<\"svg\">\n>(({ style, ...props }, forwardedRef) => (\n  <svg\n    ref={forwardedRef}\n    fill=\"none\"\n    height=\"15\"\n    style={{ overflow: \"visible\", ...style }}\n    viewBox=\"0 0 15 15\"\n    width=\"15\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    {...props}\n  >\n    <path\n      d=\"M14.219 3.33667C14.1169 3.41674 12.3137 4.44312 12.3137 6.72534C12.3137 9.3651 14.6082 10.299 14.6769 10.3221C14.6663 10.379 14.3124 11.601 13.4671 12.8462C12.7134 13.942 11.9263 15.0359 10.7288 15.0359C9.53134 15.0359 9.22317 14.3333 7.84081 14.3333C6.49366 14.3333 6.01469 15.0591 4.91935 15.0591C3.82401 15.0591 3.05978 14.0451 2.18104 12.8C1.1632 11.3378 0.34082 9.06625 0.34082 6.91034C0.34082 3.45232 2.56668 1.61835 4.75732 1.61835C5.92133 1.61835 6.89164 2.39036 7.62246 2.39036C8.31802 2.39036 9.40277 1.5721 10.7271 1.5721C11.2289 1.5721 13.0321 1.61835 14.219 3.33667ZM10.0984 0.108136C10.646 -0.548247 11.0334 -1.459 11.0334 -2.36975C11.0334 -2.49605 11.0229 -2.62412 11 -2.72729C10.1089 -2.6935 9.04883 -2.12783 8.40959 -1.37895C7.90772 -0.802617 7.43931 0.108136 7.43931 1.03134C7.43931 1.1701 7.46218 1.30883 7.47277 1.35331C7.52909 1.36398 7.62067 1.37643 7.71224 1.37643C8.51172 1.37643 9.51724 0.835672 10.0984 0.108136Z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n));\n\nApple.displayName = \"Apple\";\n\nexport const OAuthIcon = ({\n  account,\n  ...props\n}: React.ComponentPropsWithoutRef<\"svg\"> & { account: OAuthAccount }) => {\n  switch (account) {\n    case \"GithubOAuth\":\n      return <GitHub {...props} />;\n    case \"GoogleOAuth\":\n      return <Google {...props} />;\n    case \"MicrosoftOAuth\":\n      return <Microsoft {...props} />;\n    case \"AppleOAuth\":\n      return <Apple {...props} />;\n    default:\n      account satisfies never;\n      throw new Error(`Unknown OAuth account type: ${account}`);\n  }\n};\n\nexport const getOAuthName = (account: OAuthAccount) => {\n  switch (account) {\n    case \"GithubOAuth\":\n      return \"GitHub\";\n    case \"GoogleOAuth\":\n      return \"Google\";\n    case \"MicrosoftOAuth\":\n      return \"Microsoft\";\n    case \"AppleOAuth\":\n      return \"Apple\";\n    default:\n      account satisfies never;\n      throw new Error(`Unknown OAuth account type: ${account}`);\n  }\n};\n"],"mappings":"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","names":[]}

package/dist/esm/lib/organization-switcher.d.ts

@@ -1,10 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { OrganizationInfo, Organizations403, Organizations404 } from '../api/endpoint.js';
+import { OrganizationInfo } from '../api/endpoint.js';
+import { WidgetRootDomProps } from './utils.js';
 import '@tanstack/react-query';
 import '../api/widgets-api-client.js';
 
 type OrganizationSwitcherVariant = "ghost" | "outline";
-type OrganizationSwitcherPassthroughProps = {
+interface OrganizationSwitcherPassthroughProps extends WidgetRootDomProps {
     switchToOrganization: ({ organizationId, }: {
         organizationId: string;
     }) => void;
@@ -20,15 +21,17 @@ type OrganizationSwitcherPassthroughProps = {
      *  words whole
      */
     truncateBehavior?: "right" | "middle";
-};
+}
 interface OrganizationSwitcherProps extends OrganizationSwitcherPassthroughProps {
     organizations: OrganizationInfo[];
 }
-declare const OrganizationSwitcher: ({ organizations, switchToOrganization, variant, organizationLabel, truncateBehavior, children, }: OrganizationSwitcherProps) => react_jsx_runtime.JSX.Element | null;
-declare const OrganizationSwitcherLoading: React.FC;
-interface OrganizationSwitcherErrorProps {
-    error: Organizations403 | Organizations404;
+declare const OrganizationSwitcher: React.FC<OrganizationSwitcherProps>;
+interface OrganizationSwitcherLoadingProps extends WidgetRootDomProps {
+}
+declare const OrganizationSwitcherLoading: React.FC<OrganizationSwitcherLoadingProps>;
+interface OrganizationSwitcherErrorProps extends WidgetRootDomProps {
+    error: unknown;
 }
-declare function OrganizationSwitcherError(_: OrganizationSwitcherErrorProps): null;
+declare function OrganizationSwitcherError({ error, ...domProps }: OrganizationSwitcherErrorProps): react_jsx_runtime.JSX.Element;
 
-export { OrganizationSwitcher, OrganizationSwitcherError, OrganizationSwitcherLoading, type OrganizationSwitcherPassthroughProps, type OrganizationSwitcherProps };
+export { OrganizationSwitcher, OrganizationSwitcherError, type OrganizationSwitcherErrorProps, OrganizationSwitcherLoading, type OrganizationSwitcherLoadingProps, type OrganizationSwitcherPassthroughProps, type OrganizationSwitcherProps };