SectionFooter

Pie de sección o de tarjeta con línea superior: un enlace o grupo a la izquierda y las acciones a la derecha.

Cuándo usarlo

Props. start (izquierda: enlace, ButtonGroup…), actions (derecha), card (añade padding de tarjeta). La acción principal va la última.

Detalles. Funciona sin JavaScript. Con card, 24px a los lados y 16px abajo, para cerrar una tarjeta que empieza con CardHeader.

Ejemplos

Props

Prop	Tipo	Por defecto	Descripción
`start`	`ReactNode`	—	A la izquierda: un enlace, un `ButtonGroup`…
`actions`	`ReactNode`	—	Botones a la derecha: la acción principal, la última.
`card`	`boolean`	—	Añade el padding de tarjeta (24px a los lados, 16px abajo).
`className`	`string`	—

Código

import { SectionFooter } from "@jotis-me/react";

export default function Page() {
	return (
		<>
			<SectionFooter
				start={<Button hierarchy="link-gray" href="/ayuda">Ver ayuda</Button>}
				actions={<Button size="sm" type="submit">Guardar cambios</Button>}
			/>
		</>
	);
}

---
import { SectionFooter } from "@jotis-me/react";
---

<SectionFooter
	start={<Button hierarchy="link-gray" href="/ayuda">Ver ayuda</Button>}
	actions={<Button size="sm" type="submit">Guardar cambios</Button>}
/>