kdletters
cdc823611b
新增素材拖拽桥接 hook，承接素材拖向画布或文件夹的全局 pointer 监听 恢复认证弹窗 portal 渲染，避免全屏画布遮住账号入口 优化画布背景设置面板，补回当前色、色域、色相、预设、HEX 和恢复默认 补充素材拖拽、认证弹窗和背景面板回归测试并更新文档与 TRACKING
80 lines
2.2 KiB
TypeScript
80 lines
2.2 KiB
TypeScript
import type { CSSProperties, 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;
|
|
size?: 'sm' | 'md' | 'lg' | 'xl' | 'fullscreen';
|
|
showHeader?: boolean;
|
|
overlaySpacing?: 'default' | 'none';
|
|
zIndexClassName?: string;
|
|
overlayClassName?: string;
|
|
overlayStyle?: CSSProperties;
|
|
authCardClassName?: string;
|
|
panelClassName?: string;
|
|
bodyClassName?: string;
|
|
panelStyle?: CSSProperties;
|
|
};
|
|
|
|
function joinClassNames(...classNames: Array<string | false | null | undefined>) {
|
|
return classNames.filter(Boolean).join(' ');
|
|
}
|
|
|
|
/**
|
|
* 认证入口弹窗共享壳层。
|
|
* 这里只统一主题遮罩、auth card、标题栏和关闭按钮，登录 / 邀请码表单状态仍留在各自业务组件。
|
|
*/
|
|
export function PlatformAuthModalShell({
|
|
title,
|
|
platformTheme,
|
|
onClose,
|
|
children,
|
|
closeLabel,
|
|
size = 'sm',
|
|
showHeader = true,
|
|
overlaySpacing = 'default',
|
|
zIndexClassName = 'z-[120]',
|
|
overlayClassName,
|
|
overlayStyle,
|
|
authCardClassName = 'platform-auth-card !rounded-[2rem] sm:!rounded-[2rem]',
|
|
panelClassName,
|
|
bodyClassName = '!p-0',
|
|
panelStyle,
|
|
}: PlatformAuthModalShellProps) {
|
|
return (
|
|
<UnifiedModal
|
|
open
|
|
title={title}
|
|
onClose={onClose}
|
|
closeLabel={closeLabel}
|
|
closeVariant="platformIcon"
|
|
closeOnBackdrop
|
|
closeOnEscape={false}
|
|
size={size}
|
|
showHeader={showHeader}
|
|
zIndexClassName={zIndexClassName}
|
|
overlayClassName={joinClassNames(
|
|
`platform-theme platform-theme--${platformTheme} text-[var(--platform-text-strong)]`,
|
|
overlaySpacing === 'default' && '!px-3 !py-4 sm:!p-4',
|
|
overlayClassName,
|
|
)}
|
|
overlayStyle={overlayStyle}
|
|
panelClassName={joinClassNames(
|
|
authCardClassName,
|
|
panelClassName,
|
|
)}
|
|
headerClassName="!items-center !px-5 !py-4"
|
|
titleClassName="text-lg font-semibold text-[var(--platform-text-strong)]"
|
|
bodyClassName={bodyClassName}
|
|
panelStyle={panelStyle}
|
|
>
|
|
{children}
|
|
</UnifiedModal>
|
|
);
|
|
}
|