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}
      portal={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>
  );
}