Separator

Implemented Layout

Horizontal / vertical rules with optional label.

Presentation commands show demo feedback. Read the interaction guide to connect real actions.

Horizontal

Show template

{% load wdj %}
{% include "wdj/components/separator.html" only %}

Vertical

Show template

{% load wdj %}
{% include "wdj/components/separator.html" with orientation="vertical" only %}

Label

Or continue with

Show template

{% load wdj %}
{% include "wdj/components/separator.html" with label="Or continue with" only %}

API Reference

Prop	Type	Default	Description
label	string	unset	Visible accessible label. Supply an explicit aria-label via attrs when the control is bare.
orientation	string	unset	Orientation; pass the documented value shown in the examples.
class	string	""	Class; pass the documented value shown in the examples.

Accessibility notes

Every interactive component keeps real semantics and keyboard support: native controls where possible, ARIA only where necessary, and a visible focus ring. See the Accessibility page for the shared contract.

Read the accessibility contract