var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { ShadowlessElement, WithDisposable } from '@blockeditor/lit';
import { css } from 'lit';
import { customElement, property } from 'lit/decorators.js';
import { repeat } from 'lit/directives/repeat.js';
import { styleMap } from 'lit/directives/style-map.js';
import { html } from 'lit/static-html.js';
let DataViewColumnPreview = class DataViewColumnPreview extends WithDisposable(ShadowlessElement) {
    renderGroup(rows) {
        const columnIndex = this.tableViewManager.columnGetIndex(this.column.id);
        return html `
      <div
        style="background-color: var(--affine-background-primary-color);border-top: 1px solid var(--affine-border-color);box-shadow: var(--affine-shadow-2);"
      >
        <affine-database-header-column
          .tableViewManager="${this.tableViewManager}"
          .column="${this.column}"
        ></affine-database-header-column>
        ${repeat(rows, (id, index) => {
            const height = this.table.querySelector(`affine-database-cell-container[data-row-id="${id}"]`)?.clientHeight;
            const style = styleMap({
                height: height + 'px',
            });
            return html `<div
            style="border-top: 1px solid var(--affine-border-color)"
          >
            <div style="${style}">
              <affine-database-cell-container
                .column="${this.column}"
                .view="${this.tableViewManager}"
                .rowId="${id}"
                .columnId="${this.column.id}"
                .rowIndex="${index}"
                .columnIndex="${columnIndex}"
              ></affine-database-cell-container>
            </div>
          </div>`;
        })}
      </div>
      <div style="height: 45px;"></div>
    `;
    }
    render() {
        const groupHelper = this.tableViewManager.groupHelper;
        if (!groupHelper) {
            const rows = this.tableViewManager.rows;
            return this.renderGroup(rows);
        }
        return groupHelper.groups.map(group => {
            return html `
        <div style="height: 40px;"></div>
        ${this.renderGroup(group.rows)}
      `;
        });
    }
};
DataViewColumnPreview.styles = css `
    affine-data-view-column-preview {
      pointer-events: none;
      display: block;
    }
  `;
__decorate([
    property({ attribute: false })
], DataViewColumnPreview.prototype, "tableViewManager", void 0);
__decorate([
    property({ attribute: false })
], DataViewColumnPreview.prototype, "column", void 0);
__decorate([
    property({ attribute: false })
], DataViewColumnPreview.prototype, "table", void 0);
DataViewColumnPreview = __decorate([
    customElement('affine-data-view-column-preview')
], DataViewColumnPreview);
export { DataViewColumnPreview };
//# sourceMappingURL=column-renderer.js.map