docs(appearance): document display preferences

packages/appearance/docs/zh-Hans/advanced/atomic-composition.mdx

@@ -15,11 +15,14 @@ toc:
 
 ## 受控原子组件 {#controlled-atoms}
 
-`ThemeModeField`、`CompactLayoutField`、`ThemeColorPicker` 和 `ThemeToggle` 都由 `value` 与回调驱动。它们不要求使用偏好上下文，因此可以接入表单、预览工具或其他状态库。
+`ThemeModeField`、`ColorVisionModeField`、`TextScaleField`、`MotionModeField`、`BrightnessField`、`ThemeColorPicker` 和 `ThemeToggle` 都由 `value` 与回调驱动。它们不要求使用偏好上下文，因此可以接入表单、预览工具或其他状态库。
 
 ```tsx
 <ThemeModeField value={mode} onValueChange={setMode} />
-<CompactLayoutField checked={compacted} onCheckedChange={setCompacted} />
+<ColorVisionModeField value={colorVisionMode} onValueChange={setColorVisionMode} />
+<TextScaleField value={textScale} onValueChange={setTextScale} />
+<MotionModeField value={motionMode} onValueChange={setMotionMode} />
+<BrightnessField value={brightness} onValueChange={setBrightness} />
 ```
 
 ## 组合主题卡片 {#compose-card}
@@ -28,11 +31,9 @@ toc:
 
 ```tsx
 <ThemeConfigCard
-  active={resolvedTheme === "light"}
-  compacted={compacted}
-  config={lightTheme}
-  onConfigChange={setLightTheme}
-  scheme="light"
+  config={{ baseColor, accentColor }}
+  onConfigChange={setThemeColors}
+  scheme={resolvedTheme}
 />
 ```