import { lazy, Suspense } from 'react'
import styles from './page-form.module.css'

const FormExamples = lazy(() => import('./components/form-examples/form-examples'))

export default function FormPage() {
  return (
    <div className={styles.page}>
      <header className={styles.header}>
        <h1>表单</h1>
        <p>Spectrum 表单控件、交互状态与数据校验示例。</p>
      </header>
      <Suspense fallback={<p role="status">正在加载表单…</p>}>
        <FormExamples />
      </Suspense>
    </div>
  )
}