<div class="next-table-wrapper {{@wrapperClass}} {{if (and @pagination (not @useTfootPagination)) 'has-floating-pagination'}}">
    <table class="{{if @canExpand 'is-expandable'}}" ...attributes {{did-insert this.setupComponent}}>
        {{#if (has-block)}}
            {{yield
                (hash
                    columns=this.visibleColumns
                    rows=this.rows
                    pagination=@pagination
                    emptyState=this.emptyStateContext
                    body=(component "table/body" selectable=@selectable rows=this.rows columns=this.visibleColumns canExpand=@canExpand onRowClick=@onRowClick)
                    head=(component
                        "table/head"
                        canSelectAll=@canSelectAll
                        canExpand=@canExpand
                        rows=this.rows
                        columns=this.visibleColumns
                        allRowsToggled=this.allRowsToggled
                        selectAllRows=this.selectAllRows
                        selectAllColumnWidth=@selectAllColumnWidth
                    )
                )
            }}
            {{#if @insertPagination}}
                {{#if @useTfootPagination}}
                    <Table::Foot @tfootVerticalOffset={{@tfootVerticalOffset}} @tfootVerticalOffsetElements={{@tfootVerticalOffsetElements}}>
                        <tr class="tfoot-row {{if @pagination 'next-pagination-row'}}">
                            <td class="tfoot-column {{if @pagination 'next-pagination-column'}}" colspan={{add this.visibleColumns.length 1}}>
                                <div class="tfoot-wrapper">
                                    {{#if @pagination}}
                                        <Pagination @columns={{this.visibleColumns}} @meta={{@paginationMeta}} @currentPage={{@page}} @onPageChange={{@onPageChange}} />
                                    {{/if}}
                                </div>
                            </td>
                        </tr>
                    </Table::Foot>
                {{/if}}
            {{/if}}
        {{else}}
            <Table::Head @canSelectAll={{@canSelectAll}} @columns={{this.visibleColumns}}>
                <Table::Row>
                    {{#if @canSelectAll}}
                        <Table::Th @width={{or @selectAllColumnWidth 40}} @resizable={{false}} @sticky={{@checkboxSticky}}>
                            <Table::Cell::Checkbox @value={{this.allRowsToggled}} @onToggle={{this.selectAllRows}} />
                        </Table::Th>
                    {{/if}}
                    {{#each this.visibleColumns as |column|}}
                        <Table::Th @column={{column}} @resizable={{column.resizable}} @sortable={{column.sortable}}>{{column.label}}</Table::Th>
                    {{/each}}
                </Table::Row>
            </Table::Head>
            {{#if this.hasRows}}
                <Table::Body @selectable={{@selectable}} @rows={{this.rows}} @columns={{this.visibleColumns}} @canExpand={{@canExpand}} @onRowClick={{@onRowClick}}>
                    {{#each this.rows as |row|}}
                        <Table::Row @selected={{get row "checked"}} @onRowClick={{@onRowClick}} @row={{row}}>
                            {{#if @selectable}}
                                <Table::Td @sticky={{@checkboxSticky}}>
                                    <Table::Cell::Checkbox @row={{row}} @value={{get row "checked"}} />
                                </Table::Td>
                            {{/if}}
                            {{#each this.visibleColumns as |column|}}
                                <Table::Td @column={{column}} @row={{row}} @value={{get row column.valuePath}} />
                            {{/each}}
                        </Table::Row>
                    {{/each}}
                </Table::Body>
            {{else}}
                <tbody>
                    <tr class="next-table-empty-state-row">
                        <td colspan={{this.emptyStateColspan}} class="next-table-empty-state-cell">
                            {{#if (has-block "emptyState")}}
                                {{yield this.emptyStateContext to="emptyState"}}
                            {{else if @emptyStateComponent}}
                                {{component @emptyStateComponent context=this.emptyStateContext}}
                            {{else}}
                                <div class="next-table-empty-state">
                                    {{#if @emptyStateIcon}}
                                        <div class="next-table-empty-state-icon">
                                            <FaIcon @icon={{@emptyStateIcon}} @prefix={{@emptyStateIconPrefix}} />
                                        </div>
                                    {{/if}}
                                    <div class="next-table-empty-state-title">{{or @emptyStateTitle "No records found"}}</div>
                                    {{#if @emptyStateDescription}}
                                        <div class="next-table-empty-state-description">{{@emptyStateDescription}}</div>
                                    {{/if}}
                                    {{#if @emptyStateAction}}
                                        <button type="button" class="next-table-empty-state-action" {{on "click" @emptyStateAction.onClick}}>
                                            {{@emptyStateAction.label}}
                                        </button>
                                    {{/if}}
                                </div>
                            {{/if}}
                        </td>
                    </tr>
                </tbody>
            {{/if}}
            {{#if (or @tfoot (and @pagination @useTfootPagination))}}
                <Table::Foot @columns={{this.visibleColumns}} @tfootVerticalOffset={{@tfootVerticalOffset}} @tfootVerticalOffsetElements={{@tfootVerticalOffsetElements}}>
                    <tr class="tfoot-row {{if @pagination 'next-pagination-row'}}">
                        <td class="tfoot-column {{if @pagination 'next-pagination-column'}}" colspan={{add this.visibleColumns.length 1}}>
                            <div class="tfoot-wrapper">
                                {{#if @pagination}}
                                    <Pagination @columns={{this.visibleColumns}} @meta={{@paginationMeta}} @currentPage={{@page}} @onPageChange={{@onPageChange}} />
                                {{/if}}
                            </div>
                        </td>
                    </tr>
                </Table::Foot>
            {{/if}}
        {{/if}}
    </table>
    {{#if (and @pagination (not @useTfootPagination))}}
        <div class="floating-pagination">
            <Pagination @columns={{this.visibleColumns}} @meta={{@paginationMeta}} @currentPage={{@page}} @onPageChange={{@onPageChange}} />
        </div>
    {{/if}}
</div>
