Box

El componente Box es un componente simple que representa un contenedor que puede ser utilizado para agrupar contenido dentro de una caja con estilos personalizados.

Ejemplo

Importacion

Para importar el componente Box, se puede hacer desde fenextjs o fenextjs-component

import { Box, BoxProps } from "fenextjs/cjs/component/Box";

o

import { Box, BoxProps } from "fenextjs-component/cjs/Box";

Parametros

ParametroTipoRequeridoDefaultDescripcion
childrenReactNodenoContenido del componente
classNamestringno""Clase personalizada del componente

Storybook

Para ver el storybook del componente lo puede hacer con este link (opens in a new tab)

Usos

  • Uso básico del componente Box
<Box>
  <h2>Contenido dentro del Box</h2>
  <p>Este es un párrafo dentro del Box.</p>
</Box>
  • Box con clase de estilo personalizada
<Box className="custom-box">
  <h2>Contenido personalizado dentro del Box</h2>
  <p>Este es otro párrafo dentro del Box con estilos personalizados.</p>
</Box>