设置组 SettingsGroup

<section class="xxd-group">
  <h2 class="xxd-group__title">写入</h2>
  <div class="xxd-group__body">
    <div class="xxd-row">
      <div class="xxd-row__text"><div class="xxd-row__title">写入标题</div><div class="xxd-row__desc">第一行 # 标题作为文章标题</div></div>
      <div class="xxd-row__control"><input type="checkbox" role="switch" class="xxd-switch" aria-label="写入标题"></div>
    </div>
  </div>
</section>

export function SettingsGroupDemo() {
  const [on, setOn] = useState(true);
  return (
    <Settings style={{ maxWidth: 420 }}>
      <SettingsGroup title="写入">
        <SettingsRow title="写入标题" description="第一行 # 标题作为文章标题" control={<input type="checkbox" role="switch" className="xxd-switch" aria-label="写入标题" checked={on} onChange={(e) => setOn(e.target.checked)} />} />
        <SettingsRow title="本地图片文件夹" description="未连接" href="#" />
      </SettingsGroup>
    </Settings>
  );
}