{% load ui_classes ui_props %}

<c-vars orientation="horizontal" class="" />
{% if orientation == "vertical" %}
    {% ui_class "ui.menu" "separatorRoot" orientation="vertical" class=class as root_class %}
    {% ui_class "ui.menu" "separatorRule" orientation="vertical" as rule_class %}
    <div role="none"
         data-ui-menu-separator
         data-orientation="vertical"
         class="{{ root_class }}"
         {{ attrs }}>
        <div role="separator" aria-orientation="vertical" class="{{ rule_class }}"></div>
    </div>
{% else %}
    {% ui_class "ui.menu" "separatorRoot" orientation="horizontal" class=class as root_class %}
    {% ui_class "ui.menu" "separatorRule" orientation="horizontal" as rule_class %}
    <div role="none"
         data-ui-menu-separator
         data-orientation="horizontal"
         class="{{ root_class }}"
         {{ attrs }}>
        <div role="separator" aria-orientation="horizontal" class="{{ rule_class }}"></div>
    </div>
{% endif %}