<c-vars
    class=""
    direction="vertical"
    size="md"
    :directionClasses="{
        'vertical': 'menu-vertical',
        'horizontal': 'menu-horizontal'
    }"
    :sizeClasses="{
        'lg': 'menu-lg',
        'md': 'menu-md',
        'sm': 'menu-sm',
        'xs': 'menu-xs'
    }"
/>

<ul
    class="menu {{ directionClasses|get_item:direction }} {{ sizeClasses|get_item:size }} {{ class }}"
    {{ attrs }}
>
    {{ slot }}
</ul>
