{{#if this.isTextOnly}}
    <div class={{if @item.overwriteWrapperClass @item.wrapperClass (concat @item.wrapperClass " px-1 flex flex-row")}}>
        {{#if @item.icon}}
            <FaIcon @icon={{@item.icon}} @size={{or @item.iconSize "sm"}} class={{or @item.iconClass "mr-2"}} />
        {{/if}}
        <div class="inline-flex flex-col {{@item.inlineClass}}">
            {{#if (is-array @item.text)}}
                {{#each @item.text as |line|}}
                    <div class="{{@item.class}}">{{line}}</div>
                {{/each}}
            {{else}}
                <div class="{{@item.class}}">{{@item.text}}</div>
            {{/if}}
        </div>
    </div>
{{/if}}

{{#if this.isLink}}
    <div class={{if @item.overwriteWrapperClass @item.wrapperClass (concat @item.wrapperClass " px-1")}}>
        <LinkTo @route={{@item.route}} disabled={{@item.disabled}} class="next-dd-item {{@item.class}}">
            {{#if @item.icon}}
                <FaIcon @icon={{@item.icon}} @size={{or @item.iconSize "sm"}} class={{or @item.iconClass "mr-2"}} />
            {{/if}}
            <span>{{@item.text}}</span>
        </LinkTo>
    </div>
{{/if}}

{{#if this.isAnchor}}
    <div class={{if @item.overwriteWrapperClass @item.wrapperClass (concat @item.wrapperClass " px-1")}}>
        <a href={{@item.href}} class="next-dd-item {{if @item.disabled 'disabled'}} {{@item.class}}" target={{@item.target}} disabled={{@item.disabled}} {{on "click" (fn @onAction @item.action @item.params)}}>
            {{#if @item.icon}}
                <FaIcon @icon={{@item.icon}} @size={{or @item.iconSize "sm"}} class={{or @item.iconClass "mr-2"}} />
            {{/if}}
            <span>{{@item.text}}</span>
        </a>
    </div>
{{/if}}

{{#if this.isInteractive}}
    <div class={{if @item.overwriteWrapperClass @item.wrapperClass (concat @item.wrapperClass " px-1")}}>
        <a href="javascript:;" class="next-dd-item {{if this.active 'active'}}" disabled={{@item.disabled}} {{on "click" @item.onClick}} ...attributes>
            {{#if @item.icon}}
                <FaIcon @icon={{@item.icon}} @size={{or @item.iconSize "sm"}} class={{or @item.iconClass "mr-2"}} />
            {{/if}}
            <span>{{@item.text}}</span>
        </a>
    </div>
{{/if}}

{{#if this.isSeperator}}
    <div class="next-dd-menu-seperator"></div>
{{/if}}

{{#if this.isComponent}}
    {{component @item.component @item}}
{{/if}}