Divisor

Línea divisoria que separa contenidos. Admite la dirección horizontal o vertical, líneas discontinuas y bordes personalizados, y la alineación del texto.

Divisor

<template>
  <div class="demo-col" style="max-width: 420px">
    <p class="demo-note">Línea horizontal</p>
    <LhDivider />
    <p class="demo-note">Con texto (centrada por defecto)</p>
    <LhDivider>Tinta china</LhDivider>
    <LhDivider label-position="left">Texto alineado a la izquierda</LhDivider>
    <LhDivider label-position="right">Texto alineado a la derecha</LhDivider>
    <p class="demo-note">Discontinua / borde personalizado</p>
    <LhDivider dashed />
    <LhDivider border-style="dotted">Línea de puntos</LhDivider>
    <p class="demo-note">Línea vertical</p>
    <div class="demo-row">
      <span>Paisaje</span>
      <LhDivider direction="vertical" />
      <span>Flores y pájaros</span>
      <LhDivider direction="vertical" />
      <span>Figuras</span>
    </div>
  </div>
</template>

Props

Prop	Descripción	Tipo	Predeterminado
direction	Dirección	'horizontal' \| 'vertical'	'horizontal'
dashed	Línea discontinua	boolean	false
labelPosition	Alineación del texto (surte efecto en horizontal; en vertical siempre centrada)	'left' \| 'center' \| 'right'	'center'
borderStyle	Estilo del borde (prevalece sobre dashed)	string	—
sx	Propiedades de layout abreviadas	—	—

Slots

Slot	Descripción
default	Texto de la divisoria (en horizontal se dispone a izquierda y derecha; en vertical, arriba y abajo)