{{#if this.visible}}
    <BasicDropdown
        id={{@dropdownId}}
        class={{@wrapperClass}}
        @renderInPlace={{@renderInPlace}}
        @registerAPI={{this.onRegisterAPI}}
        @horizontalPosition={{@horizontalPosition}}
        @verticalPosition={{@verticalPosition}}
        @calculatePosition={{@calculatePosition}}
        @defaultClass={{@defaultClass}}
        @matchTriggerWidth={{@matchTriggerWidth}}
        @onOpen={{@onOpen}}
        @onClose={{@onClose}}
        @disabled={{this.disabled}}
        {{did-insert this.onInsert}}
        as |dd|
    >
        <dd.Trigger class={{@triggerClass}} {{did-insert this.onTriggerInsert}} {{did-update this.onArgsChanged @disabled @visible @permission}}>
            {{#if @buttonComponent}}
                {{component
                    @buttonComponent
                    buttonComponentArgs=this.buttonComponentArgs
                    text=@text
                    class=(concat @buttonClass (if dd.isOpen " dd-is-open"))
                    wrapperClass=@buttonWrapperClass
                    type=this.type
                    active=@active
                    size=this.buttonSize
                    isLoading=@isLoading
                    disabled=this.disabled
                    textClass=@textClass
                    helpText=@helpText
                    tooltipPlacement=@tooltipPlacement
                    img=@img
                    imgClass=@imgClass
                    alt=@alt
                }}
            {{else}}
                <Button
                    title={{@text}}
                    class="{{@buttonClass}} {{if dd.isOpen 'dd-is-open'}}"
                    @wrapperClass={{@buttonWrapperClass}}
                    @type={{this.type}}
                    @active={{@active}}
                    @size={{this.buttonSize}}
                    @isLoading={{@isLoading}}
                    @disabled={{this.disabled}}
                    {{did-insert this.onButtonInsert}}
                    ...attributes
                >
                    {{#if @icon}}
                        <FaIcon @icon={{@icon}} @prefix={{@iconPrefix}} @size={{@iconSize}} class="{{@iconClass}} {{if @text 'mr-2'}}" />
                    {{/if}}
                    {{#if @img}}
                        <img src={{@img}} class={{@imgClass}} alt={{or @alt "image"}} />
                    {{/if}}
                    {{#if (and (not this.doesntHavePermissions) @helpText)}}
                        <Attach::Tooltip @class="clean" @animation="scale" @placement={{or @tooltipPlacement "top"}}>
                            <InputInfo @text={{@helpText}} />
                        </Attach::Tooltip>
                    {{/if}}
                    <div class="{{@textClass}} truncate">
                        {{@text}}
                    </div>
                </Button>
            {{/if}}
            {{#if this.doesntHavePermissions}}
                <Attach::Tooltip @class="clean" @animation="scale" @placement={{or @tooltipPlacement "top"}}>
                    <InputInfo @text={{t "common.unauthorized"}} />
                </Attach::Tooltip>
            {{/if}}
        </dd.Trigger>
        <dd.Content class={{@contentClass}} @overlay={{@overlay}}>
            {{yield dd}}
        </dd.Content>
    </BasicDropdown>
{{/if}}