@frank-auth/react
Version:
Flexible and customizable React UI components for Frank Authentication
1 lines • 21.9 kB
Source Map (JSON)
{"version":3,"file":"sign-up-card.cjs","sources":["../../../../../src/components/auth/sign-up/sign-up-card.tsx"],"sourcesContent":["/**\n * @frank-auth/react - Sign Up Card Component\n *\n * Card wrapper for sign-up form with customizable styling and layout.\n */\n\n\"use client\";\n\nimport {\n\tCard,\n\tCardBody,\n\tCardFooter,\n\tCardHeader,\n\tDivider,\n} from \"@/components/ui\";\nimport { motion } from \"framer-motion\";\nimport React from \"react\";\n\nimport { useConfig } from \"../../../hooks/use-config\";\nimport { useTheme } from \"../../../hooks/use-theme\";\nimport type { SignUpCardProps } from \"./index\";\nimport { SignUpForm } from \"./sign-up-form\";\n\n// ============================================================================\n// Sign Up Card Component\n// ============================================================================\n\nexport function SignUpCard({\n\tvariant = \"shadow\",\n\tclassName = \"\",\n\tpadding = \"lg\",\n\tradius = \"lg\",\n\tshadow = \"md\",\n\tisBlurred = false,\n\tmethods = [\"password\", \"oauth\", \"magic-link\"],\n\temail,\n\torganizationId,\n\tinvitationToken,\n\tredirectUrl,\n\tonSuccess,\n\tonError,\n\ttitle,\n\tsubtitle,\n\tsize = \"md\",\n\tshowBranding = true,\n\tdisabled = false,\n\trequireTerms = true,\n\ttermsUrl = \"/terms\",\n\tprivacyUrl = \"/privacy\",\n\tfooter,\n\theader,\n\tmaxWidth = 450,\n\tcentered = false,\n}: SignUpCardProps) {\n\tconst { components, organizationSettings } = useConfig();\n\tconst { getColorValue } = useTheme();\n\n\t// Custom component override\n\tconst CustomSignUpCard = components.SignUpCard;\n\tif (CustomSignUpCard) {\n\t\treturn (\n\t\t\t<CustomSignUpCard\n\t\t\t\t{...{\n\t\t\t\t\tvariant,\n\t\t\t\t\tclassName,\n\t\t\t\t\tpadding,\n\t\t\t\t\tradius,\n\t\t\t\t\tshadow,\n\t\t\t\t\tisBlurred,\n\t\t\t\t\tmethods,\n\t\t\t\t\temail,\n\t\t\t\t\torganizationId,\n\t\t\t\t\tinvitationToken,\n\t\t\t\t\tredirectUrl,\n\t\t\t\t\tonSuccess,\n\t\t\t\t\tonError,\n\t\t\t\t\ttitle,\n\t\t\t\t\tsubtitle,\n\t\t\t\t\tsize,\n\t\t\t\t\tshowBranding,\n\t\t\t\t\tdisabled,\n\t\t\t\t\trequireTerms,\n\t\t\t\t\ttermsUrl,\n\t\t\t\t\tprivacyUrl,\n\t\t\t\t\tfooter,\n\t\t\t\t\theader,\n\t\t\t\t\tmaxWidth,\n\t\t\t\t\tcentered,\n\t\t\t\t}}\n\t\t\t/>\n\t\t);\n\t}\n\n\t// Animation variants\n\tconst cardVariants = {\n\t\thidden: {\n\t\t\topacity: 0,\n\t\t\ty: 20,\n\t\t\tscale: 0.95,\n\t\t},\n\t\tvisible: {\n\t\t\topacity: 1,\n\t\t\ty: 0,\n\t\t\tscale: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: \"easeOut\",\n\t\t\t},\n\t\t},\n\t};\n\n\t// Card styles\n\tconst cardStyles: React.CSSProperties = {\n\t\tmaxWidth: typeof maxWidth === \"number\" ? `${maxWidth}px` : maxWidth,\n\t};\n\n\t// Organization branding\n\tconst orgBranding = showBranding && organizationSettings?.branding;\n\n\t// Parse invitation data for display\n\tconst invitationData = React.useMemo(() => {\n\t\tif (!invitationToken) return null;\n\t\ttry {\n\t\t\tconst decoded = atob(invitationToken);\n\t\t\treturn JSON.parse(decoded);\n\t\t} catch {\n\t\t\treturn null;\n\t\t}\n\t}, [invitationToken]);\n\n\t// Default content\n\tconst getDefaultContent = () => {\n\t\tif (invitationData) {\n\t\t\treturn {\n\t\t\t\ttitle: `Join ${invitationData.orgName || \"Organization\"}`,\n\t\t\t\tsubtitle: invitationData.inviterName\n\t\t\t\t\t? `${invitationData.inviterName} has invited you to join`\n\t\t\t\t\t: \"You've been invited to join\",\n\t\t\t};\n\t\t}\n\n\t\tif (orgBranding?.customSignUpText) {\n\t\t\treturn {\n\t\t\t\ttitle: orgBranding.customSignUpText.title || \"Create your account\",\n\t\t\t\tsubtitle: orgBranding.customSignUpText.subtitle || \"Join us today\",\n\t\t\t};\n\t\t}\n\n\t\treturn {\n\t\t\ttitle: \"Create your account\",\n\t\t\tsubtitle: \"Join us today\",\n\t\t};\n\t};\n\n\tconst defaultContent = getDefaultContent();\n\tconst finalTitle = title || defaultContent.title;\n\tconst finalSubtitle = subtitle || defaultContent.subtitle;\n\n\t// Container classes\n\tconst containerClasses = [\n\t\tcentered ? \"flex items-center justify-center min-h-screen p-4\" : \"\",\n\t]\n\t\t.filter(Boolean)\n\t\t.join(\" \");\n\n\t// Card component\n\tconst cardContent = (\n\t\t<Card\n\t\t\tclassName={`${className} ${centered ? \"w-full\" : \"\"}`}\n\t\t\tstyle={cardStyles}\n\t\t\tshadow={shadow}\n\t\t\tradius={radius}\n\t\t\tisBlurred={isBlurred}\n\t\t>\n\t\t\t{/* Card Header */}\n\t\t\t<CardHeader\n\t\t\t\tclassName={`flex flex-col items-center text-center gap-3 p-${padding}`}\n\t\t\t>\n\t\t\t\t{header || (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{/* Organization Logo */}\n\t\t\t\t\t\t{orgBranding?.logoUrl && (\n\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\tsrc={orgBranding.logoUrl}\n\t\t\t\t\t\t\t\talt=\"Organization Logo\"\n\t\t\t\t\t\t\t\tclassName=\"h-12 w-auto mb-2\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{/* Title */}\n\t\t\t\t\t\t{finalTitle && (\n\t\t\t\t\t\t\t<h1 className=\"text-2xl font-bold text-foreground\">\n\t\t\t\t\t\t\t\t{finalTitle}\n\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{/* Subtitle */}\n\t\t\t\t\t\t{finalSubtitle && (\n\t\t\t\t\t\t\t<p className=\"text-default-500 text-sm max-w-sm\">\n\t\t\t\t\t\t\t\t{finalSubtitle}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{/* Invitation Badge */}\n\t\t\t\t\t\t{invitationData && (\n\t\t\t\t\t\t\t<div className=\"bg-primary-50 dark:bg-primary-900/20 rounded-lg px-3 py-2 text-sm\">\n\t\t\t\t\t\t\t\t<p className=\"text-primary-600 dark:text-primary-400\">\n\t\t\t\t\t\t\t\t\t<span className=\"font-medium\">Role:</span>{\" \"}\n\t\t\t\t\t\t\t\t\t{invitationData.role}\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t{invitationData.expiresAt && (\n\t\t\t\t\t\t\t\t\t<p className=\"text-primary-500 text-xs mt-1\">\n\t\t\t\t\t\t\t\t\t\tExpires:{\" \"}\n\t\t\t\t\t\t\t\t\t\t{new Date(invitationData.expiresAt).toLocaleDateString()}\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</CardHeader>\n\n\t\t\t{/* Divider */}\n\t\t\t<Divider />\n\n\t\t\t{/* Card Body */}\n\t\t\t<CardBody className={`p-${padding}`}>\n\t\t\t\t<SignUpForm\n\t\t\t\t\tmethods={methods}\n\t\t\t\t\temail={email}\n\t\t\t\t\torganizationId={organizationId}\n\t\t\t\t\tinvitationToken={invitationToken}\n\t\t\t\t\tredirectUrl={redirectUrl}\n\t\t\t\t\tonSuccess={onSuccess}\n\t\t\t\t\tonError={onError}\n\t\t\t\t\ttitle={undefined} // Title is in header\n\t\t\t\t\tsubtitle={undefined} // Subtitle is in header\n\t\t\t\t\tsize={size}\n\t\t\t\t\tshowBranding={false} // Branding is in header\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\trequireTerms={requireTerms}\n\t\t\t\t\ttermsUrl={termsUrl}\n\t\t\t\t\tprivacyUrl={privacyUrl}\n\t\t\t\t\tvariant=\"minimal\"\n\t\t\t\t\tclassName=\"space-y-4\"\n\t\t\t\t\tshowSignInLink={true}\n\t\t\t\t\tautoFocus={true}\n\t\t\t\t/>\n\t\t\t</CardBody>\n\n\t\t\t{/* Card Footer */}\n\t\t\t{footer && (\n\t\t\t\t<>\n\t\t\t\t\t<Divider />\n\t\t\t\t\t<CardFooter className={`p-${padding} text-center`}>\n\t\t\t\t\t\t{footer}\n\t\t\t\t\t</CardFooter>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</Card>\n\t);\n\n\t// Wrap with animation\n\tconst animatedCard = (\n\t\t<motion.div\n\t\t\tinitial=\"hidden\"\n\t\t\tanimate=\"visible\"\n\t\t\tvariants={cardVariants}\n\t\t\tstyle={{ maxWidth }}\n\t\t\tclassName={centered ? \"w-full\" : \"\"}\n\t\t>\n\t\t\t{cardContent}\n\t\t</motion.div>\n\t);\n\n\t// Wrap with container if centered\n\treturn centered ? (\n\t\t<div className={containerClasses}>{animatedCard}</div>\n\t) : (\n\t\tanimatedCard\n\t);\n}\n\n// ============================================================================\n// Sign Up Card Variants\n// ============================================================================\n\n/**\n * Bordered Sign Up Card\n */\nexport function BorderedSignUpCard(props: Omit<SignUpCardProps, \"variant\">) {\n\treturn <SignUpCard {...props} variant=\"bordered\" />;\n}\n\n/**\n * Flat Sign Up Card\n */\nexport function FlatSignUpCard(props: Omit<SignUpCardProps, \"variant\">) {\n\treturn <SignUpCard {...props} variant=\"flat\" />;\n}\n\n/**\n * Compact Sign Up Card\n */\nexport function CompactSignUpCard(props: SignUpCardProps) {\n\treturn <SignUpCard {...props} padding=\"sm\" size=\"sm\" maxWidth={350} />;\n}\n\n/**\n * Large Sign Up Card\n */\nexport function LargeSignUpCard(props: SignUpCardProps) {\n\treturn <SignUpCard {...props} padding=\"lg\" size=\"lg\" maxWidth={550} />;\n}\n\n/**\n * Centered Sign Up Card (for full-page layouts)\n */\nexport function CenteredSignUpCard(props: Omit<SignUpCardProps, \"centered\">) {\n\treturn <SignUpCard {...props} centered />;\n}\n\n/**\n * Blurred Glass Sign Up Card\n */\nexport function GlassSignUpCard(props: SignUpCardProps) {\n\treturn (\n\t\t<SignUpCard\n\t\t\t{...props}\n\t\t\tvariant=\"shadow\"\n\t\t\tisBlurred\n\t\t\tclassName=\"backdrop-blur-md border border-white/20 bg-background/80\"\n\t\t/>\n\t);\n}\n\n/**\n * Gradient Sign Up Card\n */\nexport function GradientSignUpCard({\n\tclassName = \"\",\n\t...props\n}: SignUpCardProps) {\n\treturn (\n\t\t<SignUpCard\n\t\t\t{...props}\n\t\t\tvariant=\"shadow\"\n\t\t\tclassName={`bg-gradient-to-br from-primary-50 to-secondary-50 dark:from-primary-900/20 dark:to-secondary-900/20 ${className}`}\n\t\t/>\n\t);\n}\n\n/**\n * Minimal Sign Up Card\n */\nexport function MinimalSignUpCard(props: SignUpCardProps) {\n\treturn <SignUpCard {...props} variant=\"flat\" shadow=\"none\" padding=\"md\" />;\n}\n\n// ============================================================================\n// Invitation Sign Up Card\n// ============================================================================\n\nexport interface InvitationSignUpCardProps\n\textends Omit<SignUpCardProps, \"invitationToken\" | \"organizationId\"> {\n\t/**\n\t * Invitation token\n\t */\n\tinvitationToken: string;\n\n\t/**\n\t * Show invitation details\n\t */\n\tshowInvitationDetails?: boolean;\n\n\t/**\n\t * Invitation expires warning threshold (hours)\n\t */\n\texpirationWarningHours?: number;\n}\n\nexport function InvitationSignUpCard({\n\tinvitationToken,\n\tshowInvitationDetails = true,\n\texpirationWarningHours = 24,\n\theader,\n\tclassName = \"\",\n\t...props\n}: InvitationSignUpCardProps) {\n\t// Parse invitation data\n\tconst invitationData = React.useMemo(() => {\n\t\ttry {\n\t\t\tconst decoded = atob(invitationToken);\n\t\t\treturn JSON.parse(decoded);\n\t\t} catch {\n\t\t\treturn null;\n\t\t}\n\t}, [invitationToken]);\n\n\t// Check if invitation is expiring soon\n\tconst isExpiringSoon = React.useMemo(() => {\n\t\tif (!invitationData?.expiresAt) return false;\n\n\t\tconst expiresAt = new Date(invitationData.expiresAt);\n\t\tconst now = new Date();\n\t\tconst hoursUntilExpiry =\n\t\t\t(expiresAt.getTime() - now.getTime()) / (1000 * 60 * 60);\n\n\t\treturn hoursUntilExpiry <= expirationWarningHours && hoursUntilExpiry > 0;\n\t}, [invitationData, expirationWarningHours]);\n\n\t// Check if invitation is expired\n\tconst isExpired = React.useMemo(() => {\n\t\tif (!invitationData?.expiresAt) return false;\n\t\treturn new Date(invitationData.expiresAt) <= new Date();\n\t}, [invitationData]);\n\n\tif (isExpired) {\n\t\treturn (\n\t\t\t<Card className={`max-w-md mx-auto ${className}`} variant=\"bordered\">\n\t\t\t\t<CardBody className=\"text-center p-8\">\n\t\t\t\t\t<div className=\"text-danger-500 mb-4\">\n\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\tclassName=\"w-16 h-16 mx-auto\"\n\t\t\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\t\t\tviewBox=\"0 0 20 20\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\t\t\t\t\td=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\"\n\t\t\t\t\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t</div>\n\t\t\t\t\t<h2 className=\"text-xl font-semibold text-foreground mb-2\">\n\t\t\t\t\t\tInvitation Expired\n\t\t\t\t\t</h2>\n\t\t\t\t\t<p className=\"text-default-500 mb-4\">\n\t\t\t\t\t\tThis invitation has expired. Please contact the organization to\n\t\t\t\t\t\trequest a new invitation.\n\t\t\t\t\t</p>\n\t\t\t\t\t{invitationData?.inviterEmail && (\n\t\t\t\t\t\t<p className=\"text-sm text-default-400\">\n\t\t\t\t\t\t\tContact: {invitationData.inviterEmail}\n\t\t\t\t\t\t</p>\n\t\t\t\t\t)}\n\t\t\t\t</CardBody>\n\t\t\t</Card>\n\t\t);\n\t}\n\n\tconst customHeader =\n\t\theader ||\n\t\t(showInvitationDetails && invitationData && (\n\t\t\t<div className=\"text-center space-y-3\">\n\t\t\t\t{/* Organization Logo */}\n\t\t\t\t{invitationData.orgLogo && (\n\t\t\t\t\t<img\n\t\t\t\t\t\tsrc={invitationData.orgLogo}\n\t\t\t\t\t\talt={`${invitationData.orgName} Logo`}\n\t\t\t\t\t\tclassName=\"h-16 w-auto mx-auto\"\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{/* Title */}\n\t\t\t\t<h1 className=\"text-2xl font-bold text-foreground\">\n\t\t\t\t\tJoin {invitationData.orgName}\n\t\t\t\t</h1>\n\n\t\t\t\t{/* Invitation Details */}\n\t\t\t\t<div className=\"space-y-2\">\n\t\t\t\t\t{invitationData.inviterName && (\n\t\t\t\t\t\t<p className=\"text-default-600\">\n\t\t\t\t\t\t\t{invitationData.inviterName} has invited you to join as a{\" \"}\n\t\t\t\t\t\t\t<span className=\"font-medium text-primary-600\">\n\t\t\t\t\t\t\t\t{invitationData.role}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</p>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{/* Expiration Warning */}\n\t\t\t\t\t{isExpiringSoon && (\n\t\t\t\t\t\t<div className=\"bg-warning-50 dark:bg-warning-900/20 border border-warning-200 dark:border-warning-800 rounded-lg p-3\">\n\t\t\t\t\t\t\t<p className=\"text-warning-700 dark:text-warning-400 text-sm\">\n\t\t\t\t\t\t\t\t⚠️ This invitation expires soon. Please sign up as soon as\n\t\t\t\t\t\t\t\tpossible.\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t));\n\n\treturn (\n\t\t<SignUpCard\n\t\t\t{...props}\n\t\t\tinvitationToken={invitationToken}\n\t\t\torganizationId={invitationData?.orgId}\n\t\t\theader={customHeader}\n\t\t\tclassName={`${className} ${isExpiringSoon ? \"border-warning-200\" : \"\"}`}\n\t\t/>\n\t);\n}\n\n// ============================================================================\n// Trial Sign Up Card\n// ============================================================================\n\nexport interface TrialSignUpCardProps extends SignUpCardProps {\n\t/**\n\t * Trial duration in days\n\t */\n\ttrialDays?: number;\n\n\t/**\n\t * Features included in trial\n\t */\n\ttrialFeatures?: string[];\n\n\t/**\n\t * Whether credit card is required\n\t */\n\trequiresCreditCard?: boolean;\n}\n\nexport function TrialSignUpCard({\n\ttrialDays = 14,\n\ttrialFeatures = [],\n\trequiresCreditCard = false,\n\ttitle,\n\tsubtitle,\n\theader,\n\tfooter,\n\t...props\n}: TrialSignUpCardProps) {\n\tconst defaultTitle = `Start Your ${trialDays}-Day Free Trial`;\n\tconst defaultSubtitle = requiresCreditCard\n\t\t? `No charge for ${trialDays} days, cancel anytime`\n\t\t: \"No credit card required\";\n\n\tconst customHeader = header || (\n\t\t<div className=\"text-center space-y-3\">\n\t\t\t{/* Trial Badge */}\n\t\t\t<div className=\"inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-success-100 text-success-700 dark:bg-success-900/30 dark:text-success-400\">\n\t\t\t\tFREE TRIAL\n\t\t\t</div>\n\n\t\t\t<h1 className=\"text-2xl font-bold text-foreground\">\n\t\t\t\t{title || defaultTitle}\n\t\t\t</h1>\n\n\t\t\t<p className=\"text-default-500\">{subtitle || defaultSubtitle}</p>\n\n\t\t\t{/* Trial Features */}\n\t\t\t{trialFeatures.length > 0 && (\n\t\t\t\t<div className=\"bg-default-50 dark:bg-default-900/20 rounded-lg p-4 text-left\">\n\t\t\t\t\t<h3 className=\"font-medium text-foreground mb-2 text-center\">\n\t\t\t\t\t\tWhat's included:\n\t\t\t\t\t</h3>\n\t\t\t\t\t<ul className=\"space-y-1 text-sm text-default-600\">\n\t\t\t\t\t\t{trialFeatures.map((feature, index) => (\n\t\t\t\t\t\t\t<li key={index} className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\tclassName=\"w-4 h-4 text-success-500 flex-shrink-0\"\n\t\t\t\t\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\t\t\t\t\tviewBox=\"0 0 20 20\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\t\t\t\t\t\t\td=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\n\t\t\t\t\t\t\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t\t{feature}\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</ul>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n\n\tconst customFooter = footer || (\n\t\t<div className=\"text-center text-xs text-default-500\">\n\t\t\t{requiresCreditCard && (\n\t\t\t\t<p>\n\t\t\t\t\tYour trial starts today. You can cancel anytime before it ends to\n\t\t\t\t\tavoid charges.\n\t\t\t\t</p>\n\t\t\t)}\n\t\t</div>\n\t);\n\n\treturn (\n\t\t<SignUpCard\n\t\t\t{...props}\n\t\t\ttitle={undefined} // Title is in custom header\n\t\t\tsubtitle={undefined} // Subtitle is in custom header\n\t\t\theader={customHeader}\n\t\t\tfooter={customFooter}\n\t\t\tvariant=\"shadow\"\n\t\t\tclassName=\"border-success-200 dark:border-success-800\"\n\t\t/>\n\t);\n}\n\n// ============================================================================\n// Organization Themed Sign Up Card\n// ============================================================================\n\nexport function OrganizationSignUpCard(props: SignUpCardProps) {\n\tconst { organizationSettings } = useConfig();\n\n\tif (!organizationSettings) {\n\t\treturn <SignUpCard {...props} />;\n\t}\n\n\tconst branding = organizationSettings.branding;\n\n\t// Apply organization theme\n\tconst orgProps = {\n\t\t...props,\n\t\tshowBranding: true,\n\t\tclassName: `${props.className || \"\"} organization-themed`,\n\t\tstyle: {\n\t\t\t\"--org-primary\": branding?.primaryColor,\n\t\t\t\"--org-secondary\": branding?.secondaryColor,\n\t\t} as React.CSSProperties,\n\t};\n\n\treturn <SignUpCard {...orgProps} />;\n}\n\n// ============================================================================\n// Export\n// ============================================================================\n\nexport default SignUpCard;\n"],"names":["SignUpCard","variant","className","padding","radius","shadow","isBlurred","methods","email","organizationId","invitationToken","redirectUrl","onSuccess","onError","title","subtitle","size","showBranding","disabled","requireTerms","termsUrl","privacyUrl","footer","header","maxWidth","centered","components","organizationSettings","useConfig","getColorValue","useTheme","CustomSignUpCard","jsx","cardVariants","cardStyles","orgBranding","invitationData","React","decoded","defaultContent","finalTitle","finalSubtitle","containerClasses","cardContent","jsxs","Card","CardHeader","Fragment","Divider","CardBody","SignUpForm","CardFooter","animatedCard","motion"],"mappings":"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"}