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 { baseTheme } from '@toeverything/theme';
import { css, html, unsafeCSS } from 'lit';
import { customElement, query } from 'lit/decorators.js';
import { createIcon } from '../../../../_common/components/icon/uni-icon.js';
import { BaseCellRenderer } from '../base-cell.js';
import { columnRenderer, createFromBaseCellRenderer } from '../renderer.js';
import { textColumnTypeName, textPureColumnConfig } from './define.js';
let TextCell = class TextCell extends BaseCellRenderer {
    render() {
        return html ` <div class="affine-database-text">${this.value ?? ''}</div>`;
    }
};
TextCell.styles = css `
    affine-database-text-cell {
      display: block;
      width: 100%;
      height: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .affine-database-text {
      display: flex;
      align-items: center;
      height: 100%;
      width: 100%;
      padding: 0;
      border: none;
      font-family: ${unsafeCSS(baseTheme.fontSansFamily)};
      font-size: var(--affine-font-base);
      line-height: var(--affine-line-height);
      color: var(--affine-text-primary-color);
      font-weight: 400;
      background-color: transparent;
    }
  `;
TextCell = __decorate([
    customElement('affine-database-text-cell')
], TextCell);
export { TextCell };
let TextCellEditing = class TextCellEditing extends BaseCellRenderer {
    constructor() {
        super(...arguments);
        this.focusEnd = () => {
            const end = this._inputEle.value.length;
            this._inputEle.focus();
            this._inputEle.setSelectionRange(end, end);
        };
        this._setValue = (str = this._inputEle.value) => {
            this._inputEle.value = `${this.value ?? ''}`;
            this.onChange(str);
        };
        this._keydown = (e) => {
            if (e.key === 'Enter' && !e.isComposing) {
                this._setValue();
                setTimeout(() => {
                    this.selectCurrentCell(false);
                });
            }
        };
    }
    onExitEditMode() {
        this._setValue();
    }
    firstUpdated() {
        this.focusEnd();
    }
    render() {
        return html `<input
      .value="${this.value ?? ''}"
      @keydown="${this._keydown}"
      class="affine-database-text"
    />`;
    }
};
TextCellEditing.styles = css `
    affine-database-text-cell-editing {
      display: block;
      width: 100%;
      height: 100%;
      cursor: text;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .affine-database-text {
      display: flex;
      align-items: center;
      height: 100%;
      width: 100%;
      padding: 0;
      border: none;
      font-family: ${unsafeCSS(baseTheme.fontSansFamily)};
      font-size: var(--affine-font-base);
      line-height: var(--affine-line-height);
      color: var(--affine-text-primary-color);
      font-weight: 400;
      background-color: transparent;
    }

    .affine-database-text:focus {
      outline: none;
    }
  `;
__decorate([
    query('input')
], TextCellEditing.prototype, "_inputEle", void 0);
TextCellEditing = __decorate([
    customElement('affine-database-text-cell-editing')
], TextCellEditing);
export { TextCellEditing };
columnRenderer.register({
    type: textColumnTypeName,
    icon: createIcon('TextIcon'),
    cellRenderer: {
        view: createFromBaseCellRenderer(TextCell),
        edit: createFromBaseCellRenderer(TextCellEditing),
    },
});
export const textColumnConfig = textPureColumnConfig;
//# sourceMappingURL=cell-renderer.js.map