/* eslint-disable lit/binding-positions, lit/no-invalid-html */
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 './portal/image.js';
import './portal/note.js';
import { ShadowlessElement, WithDisposable } from '@blockeditor/lit';
import { css } from 'lit';
import { html } from 'lit';
import { customElement, property, query } from 'lit/decorators.js';
import { repeat } from 'lit/directives/repeat.js';
import { html as staticHtml, literal, unsafeStatic } from 'lit/static-html.js';
import { getBlocksInFrame } from '../page-block/edgeless/frame-manager.js';
import {} from '../surface-block/edgeless-types.js';
import { compare } from '../surface-block/managers/group-manager.js';
const portalMap = {
    'affine:note': 'surface-ref-note-portal',
    'affine:image': 'surface-ref-image-portal',
};
let SurfaceRefPortal = class SurfaceRefPortal extends WithDisposable(ShadowlessElement) {
    constructor() {
        super(...arguments);
        this.setViewport = (viewport) => {
            this.requestUpdate();
            this.updateComplete
                .then(() => {
                this.portal?.style.setProperty('transform', `translate(${viewport.translateX}px, ${viewport.translateY}px) scale(${viewport.zoom})`);
                this.portal?.style.setProperty('transform-origin', '0 0');
            })
                .catch(console.error);
        };
    }
    _getBlocksInChildren(model) {
        return Array.from(model.children.keys())
            .map(id => this.page.getBlockById(id))
            .filter(el => el);
    }
    _renderTopLevelBlocks() {
        const containerModel = this.containerModel;
        let topLevelBlocks = 'flavour' in containerModel
            ? getBlocksInFrame(this.page, this.containerModel, false)
            : this._getBlocksInChildren(containerModel);
        topLevelBlocks = topLevelBlocks
            .sort(compare)
            .filter(model => model.flavour !== 'affine:frame');
        return repeat(topLevelBlocks, model => model.id, (model, index) => {
            const tag = literal `${unsafeStatic(portalMap[model.flavour])}`;
            return staticHtml `<${tag}
          .index=${index}
          .model=${model}
          .page=${this.page}
          .host=${this.host}
          .renderModel=${this.renderModel}
        ></${tag}>`;
        });
    }
    render() {
        return html `<div class="surface-blocks-portal">
      ${this._renderTopLevelBlocks()}
    </div>`;
    }
};
SurfaceRefPortal.styles = css `
    .surface-blocks-portal {
      pointer-events: none;
      position: absolute;
      left: 0;
      top: 0;
    }
  `;
__decorate([
    property({ attribute: false })
], SurfaceRefPortal.prototype, "host", void 0);
__decorate([
    property({ attribute: false })
], SurfaceRefPortal.prototype, "page", void 0);
__decorate([
    property({ attribute: false })
], SurfaceRefPortal.prototype, "containerModel", void 0);
__decorate([
    query('.surface-blocks-portal')
], SurfaceRefPortal.prototype, "portal", void 0);
__decorate([
    property({ attribute: false })
], SurfaceRefPortal.prototype, "renderModel", void 0);
SurfaceRefPortal = __decorate([
    customElement('surface-ref-portal')
], SurfaceRefPortal);
export { SurfaceRefPortal };
//# sourceMappingURL=surface-ref-portal.js.map