继续收口认证入口弹窗壳层

新增 PlatformAuthModalShell 统一认证白底弹窗壳层

登录入口和邀请码弹窗复用共享认证壳层

补充认证壳层和 AuthGate 接入测试

同步 PlatformUiKit 文档和 Hermes 决策记录
This commit is contained in:
2026-06-11 18:09:54 +08:00
parent 291ab06a5b
commit 59facaf14b
7 changed files with 324 additions and 245 deletions

View File

@@ -0,0 +1,59 @@
import type { ReactNode } from 'react';
import type { PlatformTheme } from '../../../packages/shared/src/contracts/runtime';
import { UnifiedModal } from '../common/UnifiedModal';
type PlatformAuthModalShellProps = {
title: string;
platformTheme: PlatformTheme;
onClose: () => void;
children: ReactNode;
closeLabel: string;
zIndexClassName?: string;
panelClassName?: string;
bodyClassName?: string;
};
function joinClassNames(...classNames: Array<string | false | null | undefined>) {
return classNames.filter(Boolean).join(' ');
}
/**
* 认证入口弹窗共享壳层。
* 这里只统一主题遮罩、auth card、标题栏和关闭按钮登录 / 邀请码表单状态仍留在各自业务组件。
*/
export function PlatformAuthModalShell({
title,
platformTheme,
onClose,
children,
closeLabel,
zIndexClassName = 'z-[120]',
panelClassName,
bodyClassName = '!p-0',
}: PlatformAuthModalShellProps) {
return (
<UnifiedModal
open
title={title}
onClose={onClose}
closeLabel={closeLabel}
closeVariant="platformIcon"
closeOnBackdrop
closeOnEscape={false}
portal={false}
size="sm"
zIndexClassName={zIndexClassName}
overlayClassName={`platform-theme platform-theme--${platformTheme} !px-3 !py-4 text-[var(--platform-text-strong)] sm:!p-4`}
panelClassName={joinClassNames(
'platform-auth-card !rounded-[2rem] sm:!rounded-[2rem]',
panelClassName,
)}
headerClassName="!items-center !px-5 !py-4"
titleClassName="text-lg font-semibold text-[var(--platform-text-strong)]"
bodyClassName={bodyClassName}
>
{children}
</UnifiedModal>
);
}