Divider
Use as a separator between content.
import '@vonage/vivid/divider';
or, if you need to use a unique prefix:
import { registerDivider } from '@vonage/vivid';
registerDivider('your-prefix');
<script setup lang="ts">
import { VDivider } from '@vonage/vivid-vue';
</script>
<template>
<VDivider />
</template>
The role
attribute in the divider component will be deprecated.
According to accessibility review - dividers shall not be announced by screen readers.
The role
attribute to express the semantic value of the divider. If it is being use purely for decorative purposes, set it to presentation
.
See the Decorative Divider use case.
Name | Type | Description |
---|---|---|
orientation | horizontal (default), vertical |
Controls the orientation |
role | separator (default), presentation |
Controls the semantic role |
appearance | ghost (default), subtle |
Controls the divider's appearance |