SettingsRow

SettingsRow is part of the Containers set, imported from @jcsoftdev/ui/containers.

Import

import { SettingsRow } from "@jcsoftdev/ui/containers";

Single-component entry points tree-shake to just this component: @jcsoftdev/ui/containers/settings-row.

Usage

<SettingsRow
  title="Recordatorio por WhatsApp"
  description="Se envía al cliente 2 horas antes de la cita."
  control={<Switch defaultChecked aria-label="Recordatorio por WhatsApp" />}
/>

Props

Prop	Type	Default	Description
title *	ReactNode
description	ReactNode
control	ReactNode		Control on the right: a switch, a button, etc.
titleId	string		Id for the title element, so the control can reference it with aria-labelledby.

* marks a required prop.

It also accepts the native props of the element or primitive it renders (for example className, id, aria-* and event handlers).

Storybook stories

• Default
• With Button
• Without Description
• Without Control
• Narrow

Source

packages/ui/src/containers/settings-row/settings-row.tsx