@stackframe/stack 2.7.6 → 2.7.7

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @stackframe/stack
 
+## 2.7.7
+
+### Patch Changes
+
+- Various changes
+- Updated dependencies
+  - @stackframe/stack-shared@2.7.7
+  - @stackframe/stack-ui@2.7.7
+  - @stackframe/stack-sc@2.7.7
+
 ## 2.7.6
 
 ### Patch Changes

package/dist/components-page/auth-page.js

@@ -72,7 +72,9 @@ function Inner(props) {
   if (props.type === "sign-up" && !project.config.signUpEnabled) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_predefined_message_card.PredefinedMessageCard, { type: "signUpDisabled", fullPage: props.fullPage });
   }
-  const enableSeparator = (project.config.credentialEnabled || project.config.magicLinkEnabled) && project.config.oauthProviders.length > 0;
+  const hasOAuthProviders = project.config.oauthProviders.length > 0;
+  const hasPasskey = project.config.passkeyEnabled === true && props.type === "sign-in";
+  const enableSeparator = (project.config.credentialEnabled || project.config.magicLinkEnabled) && (hasOAuthProviders || hasPasskey);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_maybe_full_page.MaybeFullPage, { fullPage: !!props.fullPage, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "stack-scope flex flex-col items-stretch", style: { maxWidth: "380px", flexBasis: "380px", padding: props.fullPage ? "1rem" : 0 }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-center mb-6", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stack_ui.Typography, { type: "h2", children: props.type === "sign-in" ? t("Sign in to your account") : t("Create a new account") }),
@@ -92,9 +94,9 @@ function Inner(props) {
         }, children: t("Sign in") })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gap-4 flex flex-col items-stretch stack-scope", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_oauth_button_group.OAuthButtonGroup, { type: props.type, mockProject: props.mockProject }),
-      project.config.passkeyEnabled && props.type === "sign-in" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_passkey_button.PasskeyButton, { type: props.type })
+    (hasOAuthProviders || hasPasskey) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gap-4 flex flex-col items-stretch stack-scope", children: [
+      hasOAuthProviders && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_oauth_button_group.OAuthButtonGroup, { type: props.type, mockProject: props.mockProject }),
+      hasPasskey && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_passkey_button.PasskeyButton, { type: props.type })
     ] }),
     enableSeparator && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_separator_with_text.SeparatorWithText, { text: t("Or continue with") }),
     project.config.credentialEnabled && project.config.magicLinkEnabled ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_stack_ui.Tabs, { defaultValue: props.firstTab || "magic-link", children: [
@@ -106,8 +108,11 @@ function Inner(props) {
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stack_ui.TabsContent, { value: "magic-link", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_magic_link_sign_in.MagicLinkSignIn, {}) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stack_ui.TabsContent, { value: "password", children: props.type === "sign-up" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_credential_sign_up.CredentialSignUp, { noPasswordRepeat: props.noPasswordRepeat }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_credential_sign_in.CredentialSignIn, {}) })
-    ] }) : project.config.credentialEnabled ? props.type === "sign-up" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_credential_sign_up.CredentialSignUp, { noPasswordRepeat: props.noPasswordRepeat }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_credential_sign_in.CredentialSignIn, {}) : project.config.magicLinkEnabled ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_magic_link_sign_in.MagicLinkSignIn, {}) : project.config.oauthProviders.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stack_ui.Typography, { variant: "destructive", className: "text-center", children: t("No authentication method enabled.") }) : null,
-    props.extraInfo && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col items-center text-center text-sm text-gray-500 mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: props.extraInfo }) })
+    ] }) : project.config.credentialEnabled ? props.type === "sign-up" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_credential_sign_up.CredentialSignUp, { noPasswordRepeat: props.noPasswordRepeat }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_credential_sign_in.CredentialSignIn, {}) : project.config.magicLinkEnabled ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_magic_link_sign_in.MagicLinkSignIn, {}) : !(hasOAuthProviders || hasPasskey) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stack_ui.Typography, { variant: "destructive", className: "text-center", children: t("No authentication method enabled.") }) : null,
+    props.extraInfo && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_stack_ui.cn)("flex flex-col items-center text-center text-sm text-gray-500", {
+      "mt-2": project.config.credentialEnabled || project.config.magicLinkEnabled,
+      "mt-6": !(project.config.credentialEnabled || project.config.magicLinkEnabled)
+    }), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: props.extraInfo }) })
   ] }) });
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/components-page/auth-page.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components-page/auth-page.tsx"],"sourcesContent":["'use client';\n\nimport { runAsynchronously } from '@stackframe/stack-shared/dist/utils/promises';\nimport { Skeleton, StyledLink, Tabs, TabsContent, TabsList, TabsTrigger, Typography, cn } from '@stackframe/stack-ui';\nimport { Suspense, useEffect } from 'react';\nimport { useStackApp, useUser } from '..';\nimport { CredentialSignIn } from '../components/credential-sign-in';\nimport { CredentialSignUp } from '../components/credential-sign-up';\nimport { MaybeFullPage } from '../components/elements/maybe-full-page';\nimport { SeparatorWithText } from '../components/elements/separator-with-text';\nimport { MagicLinkSignIn } from '../components/magic-link-sign-in';\nimport { PredefinedMessageCard } from '../components/message-cards/predefined-message-card';\nimport { OAuthButtonGroup } from '../components/oauth-button-group';\nimport { PasskeyButton } from '../components/passkey-button';\nimport { useTranslation } from '../lib/translations';\n\ntype Props = {\n  noPasswordRepeat?: boolean,\n  firstTab?: 'magic-link' | 'password',\n  fullPage?: boolean,\n  type: 'sign-in' | 'sign-up',\n  automaticRedirect?: boolean,\n  extraInfo?: React.ReactNode,\n  mockProject?: {\n    config: {\n      signUpEnabled: boolean,\n      credentialEnabled: boolean,\n      passkeyEnabled: boolean,\n      magicLinkEnabled: boolean,\n      oauthProviders: {\n        id: string,\n      }[],\n    },\n  },\n}\n\nexport function AuthPage(props: Props) {\n  return <Suspense fallback={<Fallback {...props} />}>\n    <Inner {...props} />\n  </Suspense>;\n}\n\nfunction Fallback(props: Props) {\n  const { t } = useTranslation();\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch' style={{ maxWidth: '380px', flexBasis: '380px', padding: props.fullPage ? '1rem' : 0 }}>\n        <div className=\"text-center mb-6 flex flex-col\">\n          <Skeleton className='h-9 w-2/3 self-center' />\n\n          <Skeleton className='h-3 w-16 mt-8' />\n          <Skeleton className='h-9 w-full mt-1' />\n\n          <Skeleton className='h-3 w-24 mt-2' />\n          <Skeleton className='h-9 w-full mt-1' />\n\n          <Skeleton className='h-9 w-full mt-6' />\n        </div>\n      </div>\n    </MaybeFullPage>\n  );\n}\n\nfunction Inner (props: Props) {\n  const stackApp = useStackApp();\n  const user = useUser();\n  const projectFromHook = stackApp.useProject();\n  const project = props.mockProject || projectFromHook;\n  const { t } = useTranslation();\n\n  useEffect(() => {\n    if (props.automaticRedirect) {\n      if (user && !props.mockProject) {\n        runAsynchronously(props.type === 'sign-in' ? stackApp.redirectToAfterSignIn({ replace: true }) : stackApp.redirectToAfterSignUp({ replace: true }));\n      }\n    }\n  }, [user, props.mockProject, stackApp, props.automaticRedirect]);\n\n  if (user && !props.mockProject) {\n    return <PredefinedMessageCard type='signedIn' fullPage={props.fullPage} />;\n  }\n\n  if (props.type === 'sign-up' && !project.config.signUpEnabled) {\n    return <PredefinedMessageCard type='signUpDisabled' fullPage={props.fullPage} />;\n  }\n\n  const enableSeparator = (project.config.credentialEnabled || project.config.magicLinkEnabled) && project.config.oauthProviders.length > 0;\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch' style={{ maxWidth: '380px', flexBasis: '380px', padding: props.fullPage ? '1rem' : 0 }}>\n        <div className=\"text-center mb-6\">\n          <Typography type='h2'>\n            {props.type === 'sign-in' ? t(\"Sign in to your account\") : t(\"Create a new account\")}\n          </Typography>\n          {props.type === 'sign-in' ? (\n            project.config.signUpEnabled && (\n              <Typography>\n                {t(\"Don't have an account?\")}{\" \"}\n                <StyledLink href={stackApp.urls.signUp} onClick={(e) => {\n                  runAsynchronously(stackApp.redirectToSignUp());\n                  e.preventDefault();\n                }}>{t(\"Sign up\")}</StyledLink>\n              </Typography>\n            )\n          ) : (\n            <Typography>\n              {t(\"Already have an account?\")}{\" \"}\n              <StyledLink href={stackApp.urls.signIn} onClick={(e) => {\n                runAsynchronously(stackApp.redirectToSignIn());\n                e.preventDefault();\n              }}>{t(\"Sign in\")}</StyledLink>\n            </Typography>\n          )}\n        </div>\n        <div className='gap-4 flex flex-col items-stretch stack-scope'>\n          <OAuthButtonGroup type={props.type} mockProject={props.mockProject} />\n          {project.config.passkeyEnabled && props.type === \"sign-in\" && <PasskeyButton type={props.type} />}\n        </div>\n\n        {enableSeparator && <SeparatorWithText text={t('Or continue with')} />}\n        {project.config.credentialEnabled && project.config.magicLinkEnabled ? (\n          <Tabs defaultValue={props.firstTab || 'magic-link'}>\n            <TabsList className={cn('w-full mb-2', {\n              'flex-row-reverse': props.firstTab === 'password'\n            })}>\n              <TabsTrigger value='magic-link' className='flex-1'>{t(\"Email\")}</TabsTrigger>\n              <TabsTrigger value='password' className='flex-1'>{t(\"Email & Password\")}</TabsTrigger>\n            </TabsList>\n            <TabsContent value='magic-link'>\n              <MagicLinkSignIn/>\n            </TabsContent>\n            <TabsContent value='password'>\n              {props.type === 'sign-up' ? <CredentialSignUp noPasswordRepeat={props.noPasswordRepeat} /> : <CredentialSignIn/>}\n            </TabsContent>\n          </Tabs>\n        ) : project.config.credentialEnabled ? (\n          props.type === 'sign-up' ? <CredentialSignUp noPasswordRepeat={props.noPasswordRepeat} /> : <CredentialSignIn/>\n        ) : project.config.magicLinkEnabled ? (\n          <MagicLinkSignIn/>\n        ) : project.config.oauthProviders.length === 0 ? <Typography variant={\"destructive\"} className=\"text-center\">{t(\"No authentication method enabled.\")}</Typography> : null}\n        {props.extraInfo && (\n          <div className='flex flex-col items-center text-center text-sm text-gray-500 mt-2'>\n            <div>{props.extraInfo}</div>\n          </div>\n        )}\n      </div>\n    </MaybeFullPage>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components-page/auth-page.tsx"],"sourcesContent":["'use client';\n\nimport { runAsynchronously } from '@stackframe/stack-shared/dist/utils/promises';\nimport { Skeleton, StyledLink, Tabs, TabsContent, TabsList, TabsTrigger, Typography, cn } from '@stackframe/stack-ui';\nimport { Suspense, useEffect } from 'react';\nimport { useStackApp, useUser } from '..';\nimport { CredentialSignIn } from '../components/credential-sign-in';\nimport { CredentialSignUp } from '../components/credential-sign-up';\nimport { MaybeFullPage } from '../components/elements/maybe-full-page';\nimport { SeparatorWithText } from '../components/elements/separator-with-text';\nimport { MagicLinkSignIn } from '../components/magic-link-sign-in';\nimport { PredefinedMessageCard } from '../components/message-cards/predefined-message-card';\nimport { OAuthButtonGroup } from '../components/oauth-button-group';\nimport { PasskeyButton } from '../components/passkey-button';\nimport { useTranslation } from '../lib/translations';\n\ntype Props = {\n  noPasswordRepeat?: boolean,\n  firstTab?: 'magic-link' | 'password',\n  fullPage?: boolean,\n  type: 'sign-in' | 'sign-up',\n  automaticRedirect?: boolean,\n  extraInfo?: React.ReactNode,\n  mockProject?: {\n    config: {\n      signUpEnabled: boolean,\n      credentialEnabled: boolean,\n      passkeyEnabled: boolean,\n      magicLinkEnabled: boolean,\n      oauthProviders: {\n        id: string,\n      }[],\n    },\n  },\n}\n\nexport function AuthPage(props: Props) {\n  return <Suspense fallback={<Fallback {...props} />}>\n    <Inner {...props} />\n  </Suspense>;\n}\n\nfunction Fallback(props: Props) {\n  const { t } = useTranslation();\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch' style={{ maxWidth: '380px', flexBasis: '380px', padding: props.fullPage ? '1rem' : 0 }}>\n        <div className=\"text-center mb-6 flex flex-col\">\n          <Skeleton className='h-9 w-2/3 self-center' />\n\n          <Skeleton className='h-3 w-16 mt-8' />\n          <Skeleton className='h-9 w-full mt-1' />\n\n          <Skeleton className='h-3 w-24 mt-2' />\n          <Skeleton className='h-9 w-full mt-1' />\n\n          <Skeleton className='h-9 w-full mt-6' />\n        </div>\n      </div>\n    </MaybeFullPage>\n  );\n}\n\nfunction Inner (props: Props) {\n  const stackApp = useStackApp();\n  const user = useUser();\n  const projectFromHook = stackApp.useProject();\n  const project = props.mockProject || projectFromHook;\n  const { t } = useTranslation();\n\n  useEffect(() => {\n    if (props.automaticRedirect) {\n      if (user && !props.mockProject) {\n        runAsynchronously(props.type === 'sign-in' ? stackApp.redirectToAfterSignIn({ replace: true }) : stackApp.redirectToAfterSignUp({ replace: true }));\n      }\n    }\n  }, [user, props.mockProject, stackApp, props.automaticRedirect]);\n\n  if (user && !props.mockProject) {\n    return <PredefinedMessageCard type='signedIn' fullPage={props.fullPage} />;\n  }\n\n  if (props.type === 'sign-up' && !project.config.signUpEnabled) {\n    return <PredefinedMessageCard type='signUpDisabled' fullPage={props.fullPage} />;\n  }\n\n  const hasOAuthProviders = project.config.oauthProviders.length > 0;\n  const hasPasskey = (project.config.passkeyEnabled === true && props.type === \"sign-in\");\n  const enableSeparator = (project.config.credentialEnabled || project.config.magicLinkEnabled) && (hasOAuthProviders || hasPasskey);\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch' style={{ maxWidth: '380px', flexBasis: '380px', padding: props.fullPage ? '1rem' : 0 }}>\n        <div className=\"text-center mb-6\">\n          <Typography type='h2'>\n            {props.type === 'sign-in' ? t(\"Sign in to your account\") : t(\"Create a new account\")}\n          </Typography>\n          {props.type === 'sign-in' ? (\n            project.config.signUpEnabled && (\n              <Typography>\n                {t(\"Don't have an account?\")}{\" \"}\n                <StyledLink href={stackApp.urls.signUp} onClick={(e) => {\n                  runAsynchronously(stackApp.redirectToSignUp());\n                  e.preventDefault();\n                }}>{t(\"Sign up\")}</StyledLink>\n              </Typography>\n            )\n          ) : (\n            <Typography>\n              {t(\"Already have an account?\")}{\" \"}\n              <StyledLink href={stackApp.urls.signIn} onClick={(e) => {\n                runAsynchronously(stackApp.redirectToSignIn());\n                e.preventDefault();\n              }}>{t(\"Sign in\")}</StyledLink>\n            </Typography>\n          )}\n        </div>\n        {(hasOAuthProviders || hasPasskey) && (\n          <div className='gap-4 flex flex-col items-stretch stack-scope'>\n            {hasOAuthProviders && <OAuthButtonGroup type={props.type} mockProject={props.mockProject} />}\n            {hasPasskey && <PasskeyButton type={props.type} />}\n          </div>\n        )}\n\n        {enableSeparator && <SeparatorWithText text={t('Or continue with')} />}\n        {project.config.credentialEnabled && project.config.magicLinkEnabled ? (\n          <Tabs defaultValue={props.firstTab || 'magic-link'}>\n            <TabsList className={cn('w-full mb-2', {\n              'flex-row-reverse': props.firstTab === 'password'\n            })}>\n              <TabsTrigger value='magic-link' className='flex-1'>{t(\"Email\")}</TabsTrigger>\n              <TabsTrigger value='password' className='flex-1'>{t(\"Email & Password\")}</TabsTrigger>\n            </TabsList>\n            <TabsContent value='magic-link'>\n              <MagicLinkSignIn/>\n            </TabsContent>\n            <TabsContent value='password'>\n              {props.type === 'sign-up' ? <CredentialSignUp noPasswordRepeat={props.noPasswordRepeat} /> : <CredentialSignIn/>}\n            </TabsContent>\n          </Tabs>\n        ) : project.config.credentialEnabled ? (\n          props.type === 'sign-up' ? <CredentialSignUp noPasswordRepeat={props.noPasswordRepeat} /> : <CredentialSignIn/>\n        ) : project.config.magicLinkEnabled ? (\n          <MagicLinkSignIn/>\n        ) : !(hasOAuthProviders || hasPasskey) ? <Typography variant={\"destructive\"} className=\"text-center\">{t(\"No authentication method enabled.\")}</Typography> : null}\n        {props.extraInfo && (\n          <div className={cn('flex flex-col items-center text-center text-sm text-gray-500', {\n            'mt-2': project.config.credentialEnabled || project.config.magicLinkEnabled,\n            'mt-6': !(project.config.credentialEnabled || project.config.magicLinkEnabled),\n          })}>\n            <div>{props.extraInfo}</div>\n          </div>\n        )}\n      </div>\n    </MaybeFullPage>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/esm/components-page/auth-page.js

@@ -49,7 +49,9 @@ function Inner(props) {
   if (props.type === "sign-up" && !project.config.signUpEnabled) {
     return /* @__PURE__ */ jsx(PredefinedMessageCard, { type: "signUpDisabled", fullPage: props.fullPage });
   }
-  const enableSeparator = (project.config.credentialEnabled || project.config.magicLinkEnabled) && project.config.oauthProviders.length > 0;
+  const hasOAuthProviders = project.config.oauthProviders.length > 0;
+  const hasPasskey = project.config.passkeyEnabled === true && props.type === "sign-in";
+  const enableSeparator = (project.config.credentialEnabled || project.config.magicLinkEnabled) && (hasOAuthProviders || hasPasskey);
   return /* @__PURE__ */ jsx(MaybeFullPage, { fullPage: !!props.fullPage, children: /* @__PURE__ */ jsxs("div", { className: "stack-scope flex flex-col items-stretch", style: { maxWidth: "380px", flexBasis: "380px", padding: props.fullPage ? "1rem" : 0 }, children: [
     /* @__PURE__ */ jsxs("div", { className: "text-center mb-6", children: [
       /* @__PURE__ */ jsx(Typography, { type: "h2", children: props.type === "sign-in" ? t("Sign in to your account") : t("Create a new account") }),
@@ -69,9 +71,9 @@ function Inner(props) {
         }, children: t("Sign in") })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "gap-4 flex flex-col items-stretch stack-scope", children: [
-      /* @__PURE__ */ jsx(OAuthButtonGroup, { type: props.type, mockProject: props.mockProject }),
-      project.config.passkeyEnabled && props.type === "sign-in" && /* @__PURE__ */ jsx(PasskeyButton, { type: props.type })
+    (hasOAuthProviders || hasPasskey) && /* @__PURE__ */ jsxs("div", { className: "gap-4 flex flex-col items-stretch stack-scope", children: [
+      hasOAuthProviders && /* @__PURE__ */ jsx(OAuthButtonGroup, { type: props.type, mockProject: props.mockProject }),
+      hasPasskey && /* @__PURE__ */ jsx(PasskeyButton, { type: props.type })
     ] }),
     enableSeparator && /* @__PURE__ */ jsx(SeparatorWithText, { text: t("Or continue with") }),
     project.config.credentialEnabled && project.config.magicLinkEnabled ? /* @__PURE__ */ jsxs(Tabs, { defaultValue: props.firstTab || "magic-link", children: [
@@ -83,8 +85,11 @@ function Inner(props) {
       ] }),
       /* @__PURE__ */ jsx(TabsContent, { value: "magic-link", children: /* @__PURE__ */ jsx(MagicLinkSignIn, {}) }),
       /* @__PURE__ */ jsx(TabsContent, { value: "password", children: props.type === "sign-up" ? /* @__PURE__ */ jsx(CredentialSignUp, { noPasswordRepeat: props.noPasswordRepeat }) : /* @__PURE__ */ jsx(CredentialSignIn, {}) })
-    ] }) : project.config.credentialEnabled ? props.type === "sign-up" ? /* @__PURE__ */ jsx(CredentialSignUp, { noPasswordRepeat: props.noPasswordRepeat }) : /* @__PURE__ */ jsx(CredentialSignIn, {}) : project.config.magicLinkEnabled ? /* @__PURE__ */ jsx(MagicLinkSignIn, {}) : project.config.oauthProviders.length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "destructive", className: "text-center", children: t("No authentication method enabled.") }) : null,
-    props.extraInfo && /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center text-center text-sm text-gray-500 mt-2", children: /* @__PURE__ */ jsx("div", { children: props.extraInfo }) })
+    ] }) : project.config.credentialEnabled ? props.type === "sign-up" ? /* @__PURE__ */ jsx(CredentialSignUp, { noPasswordRepeat: props.noPasswordRepeat }) : /* @__PURE__ */ jsx(CredentialSignIn, {}) : project.config.magicLinkEnabled ? /* @__PURE__ */ jsx(MagicLinkSignIn, {}) : !(hasOAuthProviders || hasPasskey) ? /* @__PURE__ */ jsx(Typography, { variant: "destructive", className: "text-center", children: t("No authentication method enabled.") }) : null,
+    props.extraInfo && /* @__PURE__ */ jsx("div", { className: cn("flex flex-col items-center text-center text-sm text-gray-500", {
+      "mt-2": project.config.credentialEnabled || project.config.magicLinkEnabled,
+      "mt-6": !(project.config.credentialEnabled || project.config.magicLinkEnabled)
+    }), children: /* @__PURE__ */ jsx("div", { children: props.extraInfo }) })
   ] }) });
 }
 export {

package/dist/esm/components-page/auth-page.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components-page/auth-page.tsx"],"sourcesContent":["'use client';\n\nimport { runAsynchronously } from '@stackframe/stack-shared/dist/utils/promises';\nimport { Skeleton, StyledLink, Tabs, TabsContent, TabsList, TabsTrigger, Typography, cn } from '@stackframe/stack-ui';\nimport { Suspense, useEffect } from 'react';\nimport { useStackApp, useUser } from '..';\nimport { CredentialSignIn } from '../components/credential-sign-in';\nimport { CredentialSignUp } from '../components/credential-sign-up';\nimport { MaybeFullPage } from '../components/elements/maybe-full-page';\nimport { SeparatorWithText } from '../components/elements/separator-with-text';\nimport { MagicLinkSignIn } from '../components/magic-link-sign-in';\nimport { PredefinedMessageCard } from '../components/message-cards/predefined-message-card';\nimport { OAuthButtonGroup } from '../components/oauth-button-group';\nimport { PasskeyButton } from '../components/passkey-button';\nimport { useTranslation } from '../lib/translations';\n\ntype Props = {\n  noPasswordRepeat?: boolean,\n  firstTab?: 'magic-link' | 'password',\n  fullPage?: boolean,\n  type: 'sign-in' | 'sign-up',\n  automaticRedirect?: boolean,\n  extraInfo?: React.ReactNode,\n  mockProject?: {\n    config: {\n      signUpEnabled: boolean,\n      credentialEnabled: boolean,\n      passkeyEnabled: boolean,\n      magicLinkEnabled: boolean,\n      oauthProviders: {\n        id: string,\n      }[],\n    },\n  },\n}\n\nexport function AuthPage(props: Props) {\n  return <Suspense fallback={<Fallback {...props} />}>\n    <Inner {...props} />\n  </Suspense>;\n}\n\nfunction Fallback(props: Props) {\n  const { t } = useTranslation();\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch' style={{ maxWidth: '380px', flexBasis: '380px', padding: props.fullPage ? '1rem' : 0 }}>\n        <div className=\"text-center mb-6 flex flex-col\">\n          <Skeleton className='h-9 w-2/3 self-center' />\n\n          <Skeleton className='h-3 w-16 mt-8' />\n          <Skeleton className='h-9 w-full mt-1' />\n\n          <Skeleton className='h-3 w-24 mt-2' />\n          <Skeleton className='h-9 w-full mt-1' />\n\n          <Skeleton className='h-9 w-full mt-6' />\n        </div>\n      </div>\n    </MaybeFullPage>\n  );\n}\n\nfunction Inner (props: Props) {\n  const stackApp = useStackApp();\n  const user = useUser();\n  const projectFromHook = stackApp.useProject();\n  const project = props.mockProject || projectFromHook;\n  const { t } = useTranslation();\n\n  useEffect(() => {\n    if (props.automaticRedirect) {\n      if (user && !props.mockProject) {\n        runAsynchronously(props.type === 'sign-in' ? stackApp.redirectToAfterSignIn({ replace: true }) : stackApp.redirectToAfterSignUp({ replace: true }));\n      }\n    }\n  }, [user, props.mockProject, stackApp, props.automaticRedirect]);\n\n  if (user && !props.mockProject) {\n    return <PredefinedMessageCard type='signedIn' fullPage={props.fullPage} />;\n  }\n\n  if (props.type === 'sign-up' && !project.config.signUpEnabled) {\n    return <PredefinedMessageCard type='signUpDisabled' fullPage={props.fullPage} />;\n  }\n\n  const enableSeparator = (project.config.credentialEnabled || project.config.magicLinkEnabled) && project.config.oauthProviders.length > 0;\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch' style={{ maxWidth: '380px', flexBasis: '380px', padding: props.fullPage ? '1rem' : 0 }}>\n        <div className=\"text-center mb-6\">\n          <Typography type='h2'>\n            {props.type === 'sign-in' ? t(\"Sign in to your account\") : t(\"Create a new account\")}\n          </Typography>\n          {props.type === 'sign-in' ? (\n            project.config.signUpEnabled && (\n              <Typography>\n                {t(\"Don't have an account?\")}{\" \"}\n                <StyledLink href={stackApp.urls.signUp} onClick={(e) => {\n                  runAsynchronously(stackApp.redirectToSignUp());\n                  e.preventDefault();\n                }}>{t(\"Sign up\")}</StyledLink>\n              </Typography>\n            )\n          ) : (\n            <Typography>\n              {t(\"Already have an account?\")}{\" \"}\n              <StyledLink href={stackApp.urls.signIn} onClick={(e) => {\n                runAsynchronously(stackApp.redirectToSignIn());\n                e.preventDefault();\n              }}>{t(\"Sign in\")}</StyledLink>\n            </Typography>\n          )}\n        </div>\n        <div className='gap-4 flex flex-col items-stretch stack-scope'>\n          <OAuthButtonGroup type={props.type} mockProject={props.mockProject} />\n          {project.config.passkeyEnabled && props.type === \"sign-in\" && <PasskeyButton type={props.type} />}\n        </div>\n\n        {enableSeparator && <SeparatorWithText text={t('Or continue with')} />}\n        {project.config.credentialEnabled && project.config.magicLinkEnabled ? (\n          <Tabs defaultValue={props.firstTab || 'magic-link'}>\n            <TabsList className={cn('w-full mb-2', {\n              'flex-row-reverse': props.firstTab === 'password'\n            })}>\n              <TabsTrigger value='magic-link' className='flex-1'>{t(\"Email\")}</TabsTrigger>\n              <TabsTrigger value='password' className='flex-1'>{t(\"Email & Password\")}</TabsTrigger>\n            </TabsList>\n            <TabsContent value='magic-link'>\n              <MagicLinkSignIn/>\n            </TabsContent>\n            <TabsContent value='password'>\n              {props.type === 'sign-up' ? <CredentialSignUp noPasswordRepeat={props.noPasswordRepeat} /> : <CredentialSignIn/>}\n            </TabsContent>\n          </Tabs>\n        ) : project.config.credentialEnabled ? (\n          props.type === 'sign-up' ? <CredentialSignUp noPasswordRepeat={props.noPasswordRepeat} /> : <CredentialSignIn/>\n        ) : project.config.magicLinkEnabled ? (\n          <MagicLinkSignIn/>\n        ) : project.config.oauthProviders.length === 0 ? <Typography variant={\"destructive\"} className=\"text-center\">{t(\"No authentication method enabled.\")}</Typography> : null}\n        {props.extraInfo && (\n          <div className='flex flex-col items-center text-center text-sm text-gray-500 mt-2'>\n            <div>{props.extraInfo}</div>\n          </div>\n        )}\n      </div>\n    </MaybeFullPage>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components-page/auth-page.tsx"],"sourcesContent":["'use client';\n\nimport { runAsynchronously } from '@stackframe/stack-shared/dist/utils/promises';\nimport { Skeleton, StyledLink, Tabs, TabsContent, TabsList, TabsTrigger, Typography, cn } from '@stackframe/stack-ui';\nimport { Suspense, useEffect } from 'react';\nimport { useStackApp, useUser } from '..';\nimport { CredentialSignIn } from '../components/credential-sign-in';\nimport { CredentialSignUp } from '../components/credential-sign-up';\nimport { MaybeFullPage } from '../components/elements/maybe-full-page';\nimport { SeparatorWithText } from '../components/elements/separator-with-text';\nimport { MagicLinkSignIn } from '../components/magic-link-sign-in';\nimport { PredefinedMessageCard } from '../components/message-cards/predefined-message-card';\nimport { OAuthButtonGroup } from '../components/oauth-button-group';\nimport { PasskeyButton } from '../components/passkey-button';\nimport { useTranslation } from '../lib/translations';\n\ntype Props = {\n  noPasswordRepeat?: boolean,\n  firstTab?: 'magic-link' | 'password',\n  fullPage?: boolean,\n  type: 'sign-in' | 'sign-up',\n  automaticRedirect?: boolean,\n  extraInfo?: React.ReactNode,\n  mockProject?: {\n    config: {\n      signUpEnabled: boolean,\n      credentialEnabled: boolean,\n      passkeyEnabled: boolean,\n      magicLinkEnabled: boolean,\n      oauthProviders: {\n        id: string,\n      }[],\n    },\n  },\n}\n\nexport function AuthPage(props: Props) {\n  return <Suspense fallback={<Fallback {...props} />}>\n    <Inner {...props} />\n  </Suspense>;\n}\n\nfunction Fallback(props: Props) {\n  const { t } = useTranslation();\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch' style={{ maxWidth: '380px', flexBasis: '380px', padding: props.fullPage ? '1rem' : 0 }}>\n        <div className=\"text-center mb-6 flex flex-col\">\n          <Skeleton className='h-9 w-2/3 self-center' />\n\n          <Skeleton className='h-3 w-16 mt-8' />\n          <Skeleton className='h-9 w-full mt-1' />\n\n          <Skeleton className='h-3 w-24 mt-2' />\n          <Skeleton className='h-9 w-full mt-1' />\n\n          <Skeleton className='h-9 w-full mt-6' />\n        </div>\n      </div>\n    </MaybeFullPage>\n  );\n}\n\nfunction Inner (props: Props) {\n  const stackApp = useStackApp();\n  const user = useUser();\n  const projectFromHook = stackApp.useProject();\n  const project = props.mockProject || projectFromHook;\n  const { t } = useTranslation();\n\n  useEffect(() => {\n    if (props.automaticRedirect) {\n      if (user && !props.mockProject) {\n        runAsynchronously(props.type === 'sign-in' ? stackApp.redirectToAfterSignIn({ replace: true }) : stackApp.redirectToAfterSignUp({ replace: true }));\n      }\n    }\n  }, [user, props.mockProject, stackApp, props.automaticRedirect]);\n\n  if (user && !props.mockProject) {\n    return <PredefinedMessageCard type='signedIn' fullPage={props.fullPage} />;\n  }\n\n  if (props.type === 'sign-up' && !project.config.signUpEnabled) {\n    return <PredefinedMessageCard type='signUpDisabled' fullPage={props.fullPage} />;\n  }\n\n  const hasOAuthProviders = project.config.oauthProviders.length > 0;\n  const hasPasskey = (project.config.passkeyEnabled === true && props.type === \"sign-in\");\n  const enableSeparator = (project.config.credentialEnabled || project.config.magicLinkEnabled) && (hasOAuthProviders || hasPasskey);\n\n  return (\n    <MaybeFullPage fullPage={!!props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch' style={{ maxWidth: '380px', flexBasis: '380px', padding: props.fullPage ? '1rem' : 0 }}>\n        <div className=\"text-center mb-6\">\n          <Typography type='h2'>\n            {props.type === 'sign-in' ? t(\"Sign in to your account\") : t(\"Create a new account\")}\n          </Typography>\n          {props.type === 'sign-in' ? (\n            project.config.signUpEnabled && (\n              <Typography>\n                {t(\"Don't have an account?\")}{\" \"}\n                <StyledLink href={stackApp.urls.signUp} onClick={(e) => {\n                  runAsynchronously(stackApp.redirectToSignUp());\n                  e.preventDefault();\n                }}>{t(\"Sign up\")}</StyledLink>\n              </Typography>\n            )\n          ) : (\n            <Typography>\n              {t(\"Already have an account?\")}{\" \"}\n              <StyledLink href={stackApp.urls.signIn} onClick={(e) => {\n                runAsynchronously(stackApp.redirectToSignIn());\n                e.preventDefault();\n              }}>{t(\"Sign in\")}</StyledLink>\n            </Typography>\n          )}\n        </div>\n        {(hasOAuthProviders || hasPasskey) && (\n          <div className='gap-4 flex flex-col items-stretch stack-scope'>\n            {hasOAuthProviders && <OAuthButtonGroup type={props.type} mockProject={props.mockProject} />}\n            {hasPasskey && <PasskeyButton type={props.type} />}\n          </div>\n        )}\n\n        {enableSeparator && <SeparatorWithText text={t('Or continue with')} />}\n        {project.config.credentialEnabled && project.config.magicLinkEnabled ? (\n          <Tabs defaultValue={props.firstTab || 'magic-link'}>\n            <TabsList className={cn('w-full mb-2', {\n              'flex-row-reverse': props.firstTab === 'password'\n            })}>\n              <TabsTrigger value='magic-link' className='flex-1'>{t(\"Email\")}</TabsTrigger>\n              <TabsTrigger value='password' className='flex-1'>{t(\"Email & Password\")}</TabsTrigger>\n            </TabsList>\n            <TabsContent value='magic-link'>\n              <MagicLinkSignIn/>\n            </TabsContent>\n            <TabsContent value='password'>\n              {props.type === 'sign-up' ? <CredentialSignUp noPasswordRepeat={props.noPasswordRepeat} /> : <CredentialSignIn/>}\n            </TabsContent>\n          </Tabs>\n        ) : project.config.credentialEnabled ? (\n          props.type === 'sign-up' ? <CredentialSignUp noPasswordRepeat={props.noPasswordRepeat} /> : <CredentialSignIn/>\n        ) : project.config.magicLinkEnabled ? (\n          <MagicLinkSignIn/>\n        ) : !(hasOAuthProviders || hasPasskey) ? <Typography variant={\"destructive\"} className=\"text-center\">{t(\"No authentication method enabled.\")}</Typography> : null}\n        {props.extraInfo && (\n          <div className={cn('flex flex-col items-center text-center text-sm text-gray-500', {\n            'mt-2': project.config.credentialEnabled || project.config.magicLinkEnabled,\n            'mt-6': !(project.config.credentialEnabled || project.config.magicLinkEnabled),\n          })}>\n            <div>{props.extraInfo}</div>\n          </div>\n        )}\n      </div>\n    </MaybeFullPage>\n  );\n}\n"],"mappings":"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","names":[]}