SettingsSection

SettingsSection is the canonical preferences pattern: a titled card with divided rows. Use SettingsRow for each preference.

#Default usage

<SettingsSection description="Tune workspace defaults." title="Workspace">
  <SettingsRow
    control={<Switch defaultChecked aria-label="Notifications" />}
    description="Email me when builds finish."
    title="Notifications"
  />
  <SettingsRow
    control={<Switch aria-label="Beta opt-in" />}
    description="Try preview features before release."
    title="Beta features"
  />
</SettingsSection>

#Import

import { SettingsRow, SettingsSection } from "@froggdesign/enter-ui-react";

#Accessibility

The section renders as <section> with an <h3> title; each control should bring its own label or aria-label.

#API

• SettingsSection: titled <section> card.
• SettingsRow: title, description, and a required control slot.

#Styling

Every exported component accepts className. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.