@iyulab/data-components 0.3.0 → 0.3.1

package/dist/components/u-rich-table/URichTable.js

@@ -1,5 +1,618 @@
-import { URichTable } from './URichTable.component.js';
-
-URichTable.define("u-rich-table");
-
+import { __decorateMetadata } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorateMetadata.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { richTableStyles } from "./styles.js";
+import { parseTSV, toTSV } from "./utils/clipboard.js";
+import { LitElement, html } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+//#region src/components/u-rich-table/URichTable.ts
+var URichTable = class URichTable extends LitElement {
+	constructor(..._args) {
+		super(..._args);
+		this.columns = [];
+		this.data = [];
+		this.totalCount = 0;
+		this.pageSize = 25;
+		this.currentPage = 1;
+		this.loading = false;
+		this.emptyMessage = "데이터가 없습니다";
+		this.selectable = false;
+		this.editable = false;
+		this.addable = false;
+		this.filterable = false;
+		this.expandable = false;
+		this.selectedIds = /* @__PURE__ */ new Set();
+		this.focusedCell = null;
+		this.editingCell = null;
+		this.editValue = "";
+		this.expandedIds = /* @__PURE__ */ new Set();
+		this.sort = null;
+		this.filters = {};
+		this.validationErrors = /* @__PURE__ */ new Map();
+		this.rowErrors = /* @__PURE__ */ new Map();
+		this._lastSelectedIndex = -1;
+		this._onGlobalKeyDown = (e) => {
+			if (e.ctrlKey || e.metaKey) {
+				if (e.key === "c") this._handleCopy();
+				else if (e.key === "v") this._handlePaste();
+				else if (e.key === "a" && !this.editingCell) {
+					e.preventDefault();
+					this._selectAll();
+				}
+			}
+			if (!this.editingCell && this.focusedCell) {
+				if (e.key === "ArrowUp") {
+					e.preventDefault();
+					this._moveFocus(0, -1);
+				}
+				if (e.key === "ArrowDown") {
+					e.preventDefault();
+					this._moveFocus(0, 1);
+				}
+				if (e.key === "ArrowLeft") {
+					e.preventDefault();
+					this._moveFocus(-1, 0);
+				}
+				if (e.key === "ArrowRight") {
+					e.preventDefault();
+					this._moveFocus(1, 0);
+				}
+				if (e.key === "Enter") {
+					const col = this.columns[this.focusedCell.colIndex];
+					if (col?.editable) {
+						const value = this.data[this.focusedCell.rowIndex]?.[col.key];
+						this._onCellDblClick(this.focusedCell.rowIndex, this.focusedCell.colIndex, value);
+					}
+				}
+				if (e.key === " " && this.selectable) {
+					e.preventDefault();
+					const rowId = this.data[this.focusedCell.rowIndex]?._id;
+					if (rowId) this._onRowSelect(rowId);
+				}
+				if (e.key === "Delete" && this.selectedIds.size > 0) for (const row of this.getSelectedRows()) this.dispatchEvent(new CustomEvent("row-delete", {
+					detail: { row },
+					bubbles: true,
+					composed: true
+				}));
+			}
+		};
+	}
+	static {
+		this.styles = richTableStyles;
+	}
+	revertRow(_rowId) {}
+	setRowError(rowId, message) {
+		this.rowErrors = new Map(this.rowErrors).set(rowId, message);
+	}
+	clearRowError(rowId) {
+		const next = new Map(this.rowErrors);
+		next.delete(rowId);
+		this.rowErrors = next;
+	}
+	getSelectedRows() {
+		return this.data.filter((row) => this.selectedIds.has(row._id));
+	}
+	render() {
+		return html`
+      ${this._renderToolbar()}
+      <table>
+        ${this._renderHeader()}
+        <tbody>
+          ${this.filterable ? this._renderFilterRow() : ""}
+          ${this._renderBody()}
+          ${this.addable ? this._renderNewRow() : ""}
+        </tbody>
+      </table>
+      ${this._renderPagination()}
+    `;
+	}
+	_renderToolbar() {
+		const selectedCount = this.selectedIds.size;
+		return html`
+      <div class="toolbar">
+        ${this.selectable ? html`
+          <div class="selection-info">
+            <input type="checkbox"
+              .checked=${selectedCount > 0 && selectedCount === this.data.length}
+              .indeterminate=${selectedCount > 0 && selectedCount < this.data.length}
+              @change=${this._onSelectAll} />
+            ${selectedCount > 0 ? html`<span>${selectedCount}건 선택됨</span>` : ""}
+          </div>
+          ${selectedCount > 0 ? html`<slot name="bulk-actions"></slot>` : ""}
+        ` : ""}
+        <div style="flex:1"></div>
+        <slot name="toolbar-end"></slot>
+        ${this.addable ? html`
+          <button class="btn btn-success" @click=${this._onAddRowClick}>+ 새 행</button>
+        ` : ""}
+      </div>
+    `;
+	}
+	_renderHeader() {
+		return html`
+      <thead>
+        <tr>
+          ${this.selectable ? html`<th class="checkbox-cell"></th>` : ""}
+          ${this.expandable ? html`<th class="expand-cell"></th>` : ""}
+          ${this.columns.map((col) => html`
+            <th
+              class=${col.sortable ? "sortable" : ""}
+              style=${col.width ? `width: ${col.width}` : ""}
+              @click=${() => col.sortable && this._onSortClick(col.key)}>
+              ${col.label}
+              ${this.sort?.field === col.key ? html`
+                <span class="sort-indicator">${this.sort.direction === "asc" ? "▲" : "▼"}</span>
+              ` : ""}
+            </th>
+          `)}
+          <th class="actions-cell"></th>
+        </tr>
+      </thead>
+    `;
+	}
+	_renderFilterRow() {
+		return html`
+      <tr class="filter-row">
+        ${this.selectable ? html`<td></td>` : ""}
+        ${this.expandable ? html`<td></td>` : ""}
+        ${this.columns.map((col) => html`
+          <td>
+            ${col.filterable !== false ? col.filterType === "select" && col.options ? html`<select @change=${(e) => this._onFilterChange(col.key, e.target.value)}>
+                    <option value="">전체</option>
+                    ${col.options.map((o) => html`<option value=${o.value}>${o.label}</option>`)}
+                  </select>` : html`<input
+                    placeholder="필터..."
+                    @input=${(e) => this._onFilterChange(col.key, e.target.value)} />` : ""}
+          </td>
+        `)}
+        <td></td>
+      </tr>
+    `;
+	}
+	_renderBody() {
+		if (this.loading) return html`<tr><td colspan=${this._colSpan()}><div class="loading-overlay">로딩 중...</div></td></tr>`;
+		if (this.data.length === 0) return html`<tr><td colspan=${this._colSpan()}><div class="empty-message">${this.emptyMessage}</div></td></tr>`;
+		return this.data.map((row, rowIdx) => {
+			const rowId = row._id;
+			const isSelected = this.selectedIds.has(rowId);
+			const isExpanded = this.expandedIds.has(rowId);
+			const hasError = this.rowErrors.has(rowId);
+			return html`
+        <tr class="${isSelected ? "selected" : ""} ${hasError ? "error" : ""} ${this.editingCell?.rowIndex === rowIdx ? "editing" : ""}">
+          ${this.selectable ? html`
+            <td class="checkbox-cell">
+              <input type="checkbox" .checked=${isSelected}
+                @change=${() => this._onRowSelect(rowId)}
+                @click=${(e) => e.shiftKey && this._onShiftSelect(rowIdx)} />
+            </td>
+          ` : ""}
+          ${this.expandable ? html`
+            <td class="expand-cell" @click=${() => this._onExpandToggle(rowId)}>
+              ${isExpanded ? "▼" : "▶"}
+            </td>
+          ` : ""}
+          ${this.columns.map((col, colIdx) => this._renderCell(row, rowIdx, col, colIdx))}
+          <td class="actions-cell">
+            <span style="cursor:pointer;color:#94a3b8" @click=${() => this._onRowMenu(row)}>⋯</span>
+          </td>
+        </tr>
+        ${isExpanded && this.detailRenderer ? html`
+          <tr class="detail-row">
+            <td colspan=${this._colSpan()}>${this.detailRenderer(row)}</td>
+          </tr>
+        ` : ""}
+        ${hasError ? html`
+          <tr><td colspan=${this._colSpan()} style="padding:2px 8px;background:#fef2f2;color:#ef4444;font-size:11px;">
+            ${this.rowErrors.get(rowId)}
+          </td></tr>
+        ` : ""}
+      `;
+		});
+	}
+	_renderCell(row, rowIdx, col, colIdx) {
+		const isEditing = this.editingCell?.rowIndex === rowIdx && this.editingCell?.colIndex === colIdx;
+		const isFocused = this.focusedCell?.rowIndex === rowIdx && this.focusedCell?.colIndex === colIdx;
+		const value = row[col.key];
+		if (isEditing && col.editable) {
+			const validationError = this.validationErrors.get(`${rowIdx}-${colIdx}`);
+			if (col.type === "select" && col.options) return html`
+          <td>
+            <select class="cell-edit-input" @change=${this._onCellEditConfirm} @keydown=${this._onEditKeyDown}>
+              ${col.options.map((o) => html`<option value=${o.value} ?selected=${o.value === String(value)}>${o.label}</option>`)}
+            </select>
+          </td>
+        `;
+			return html`
+        <td>
+          <input class="cell-edit-input ${validationError ? "invalid" : ""}"
+            type=${col.type === "number" ? "number" : col.type === "date" ? "date" : "text"}
+            .value=${this.editValue}
+            @input=${(e) => this.editValue = e.target.value}
+            @keydown=${this._onEditKeyDown}
+            @blur=${this._onCellEditConfirm} />
+          ${validationError ? html`<div class="validation-error">${validationError}</div>` : ""}
+        </td>
+      `;
+		}
+		return html`
+      <td class=${isFocused ? "focused-cell" : ""}
+        style=${col.align ? `text-align: ${col.align}` : ""}
+        @click=${() => this._onCellClick(rowIdx, colIdx)}
+        @dblclick=${() => col.editable && this._onCellDblClick(rowIdx, colIdx, value)}>
+        ${this._renderCellContent(col, value, row)}
+      </td>
+    `;
+	}
+	_renderCellContent(col, value, row) {
+		if (col.render) {
+			const result = col.render(value, row);
+			if (typeof result === "string") return result;
+			if (result instanceof HTMLElement) {
+				const container = document.createElement("span");
+				container.appendChild(result);
+				return html`${container}`;
+			}
+			return String(value ?? "");
+		}
+		if (col.type === "badge" && col.badgeColors) return html`<span class="badge" style="background:${col.badgeColors[String(value)] ?? "#f3f4f6"}">${this._getOptionLabel(col, value)}</span>`;
+		if (col.type === "select" && col.options) return this._getOptionLabel(col, value);
+		if (col.type === "number" && value != null) return Number(value).toLocaleString();
+		return String(value ?? "");
+	}
+	_renderNewRow() {
+		return html`
+      <tr class="new-row">
+        ${this.selectable ? html`<td class="checkbox-cell"><span style="color:#86efac">+</span></td>` : ""}
+        ${this.expandable ? html`<td></td>` : ""}
+        ${this.columns.map((col, colIdx) => html`
+          <td>
+            ${col.editable !== false ? html`
+              <input placeholder=${col.label}
+                data-new-col=${colIdx}
+                @keydown=${this._onNewRowKeyDown}
+                @focus=${this._onNewRowFocus} />
+            ` : html`<span></span>`}
+          </td>
+        `)}
+        <td></td>
+      </tr>
+    `;
+	}
+	_renderPagination() {
+		if (this.totalCount <= 0) return html``;
+		const totalPages = Math.ceil(this.totalCount / this.pageSize);
+		const start = (this.currentPage - 1) * this.pageSize + 1;
+		const end = Math.min(this.currentPage * this.pageSize, this.totalCount);
+		return html`
+      <div class="pagination">
+        <span>전체 ${this.totalCount.toLocaleString()}건 중 ${start}-${end} 표시</span>
+        <div class="page-buttons">
+          <button ?disabled=${this.currentPage <= 1} @click=${() => this._onPageChange(this.currentPage - 1)}>◀</button>
+          ${this._getPageNumbers(totalPages).map((p) => html`
+            <button class=${p === this.currentPage ? "active" : ""} @click=${() => this._onPageChange(p)}>${p}</button>
+          `)}
+          <button ?disabled=${this.currentPage >= totalPages} @click=${() => this._onPageChange(this.currentPage + 1)}>▶</button>
+          <select @change=${(e) => this._onPageSizeChange(Number(e.target.value))}>
+            ${[
+			25,
+			50,
+			100
+		].map((s) => html`<option value=${s} ?selected=${s === this.pageSize}>${s}행</option>`)}
+          </select>
+        </div>
+      </div>
+    `;
+	}
+	_onSelectAll(e) {
+		if (e.target.checked) this.selectedIds = new Set(this.data.map((r) => r._id));
+		else this.selectedIds = /* @__PURE__ */ new Set();
+		this._fireSelectionChange();
+	}
+	_onRowSelect(rowId) {
+		const next = new Set(this.selectedIds);
+		if (next.has(rowId)) next.delete(rowId);
+		else next.add(rowId);
+		this.selectedIds = next;
+		this._fireSelectionChange();
+	}
+	_onShiftSelect(rowIdx) {
+		if (this._lastSelectedIndex < 0) return;
+		const start = Math.min(this._lastSelectedIndex, rowIdx);
+		const end = Math.max(this._lastSelectedIndex, rowIdx);
+		const next = new Set(this.selectedIds);
+		for (let i = start; i <= end; i++) next.add(this.data[i]._id);
+		this.selectedIds = next;
+		this._fireSelectionChange();
+	}
+	_onSortClick(field) {
+		if (this.sort?.field === field) if (this.sort.direction === "asc") this.sort = {
+			field,
+			direction: "desc"
+		};
+		else this.sort = null;
+		else this.sort = {
+			field,
+			direction: "asc"
+		};
+		this.dispatchEvent(new CustomEvent("sort-change", {
+			detail: this.sort ? {
+				field: this.sort.field,
+				direction: this.sort.direction
+			} : {
+				field,
+				direction: null
+			},
+			bubbles: true,
+			composed: true
+		}));
+	}
+	_onFilterChange(field, value) {
+		if (value) this.filters = {
+			...this.filters,
+			[field]: value
+		};
+		else {
+			const { [field]: _, ...rest } = this.filters;
+			this.filters = rest;
+		}
+		this.dispatchEvent(new CustomEvent("filter-change", {
+			detail: { filters: this.filters },
+			bubbles: true,
+			composed: true
+		}));
+	}
+	_onCellClick(rowIdx, colIdx) {
+		this.focusedCell = {
+			rowIndex: rowIdx,
+			colIndex: colIdx
+		};
+		this._lastSelectedIndex = rowIdx;
+	}
+	_onCellDblClick(rowIdx, colIdx, value) {
+		this.editingCell = {
+			rowIndex: rowIdx,
+			colIndex: colIdx
+		};
+		this.editValue = String(value ?? "");
+		this.requestUpdate();
+		requestAnimationFrame(() => {
+			const input = this.shadowRoot?.querySelector(".cell-edit-input");
+			input?.focus();
+			input?.select();
+		});
+	}
+	_onEditKeyDown(e) {
+		if (e.key === "Enter") {
+			e.preventDefault();
+			this._onCellEditConfirm();
+			if (this.editingCell && this.editingCell.rowIndex < this.data.length - 1) {
+				const nextRow = this.editingCell.rowIndex + 1;
+				const col = this.editingCell.colIndex;
+				const nextValue = this.data[nextRow][this.columns[col].key];
+				this._onCellDblClick(nextRow, col, nextValue);
+			}
+		} else if (e.key === "Escape") {
+			this.editingCell = null;
+			this.editValue = "";
+		} else if (e.key === "Tab") {
+			e.preventDefault();
+			this._onCellEditConfirm();
+			this._moveToNextEditableCell(e.shiftKey);
+		}
+	}
+	_onCellEditConfirm() {
+		if (!this.editingCell) return;
+		const { rowIndex, colIndex } = this.editingCell;
+		const col = this.columns[colIndex];
+		const row = this.data[rowIndex];
+		const oldValue = row[col.key];
+		let newValue = this.editValue;
+		if (col.type === "number") newValue = Number(newValue);
+		if (col.required && !newValue && newValue !== 0) {
+			this.validationErrors = new Map(this.validationErrors).set(`${rowIndex}-${colIndex}`, "필수 항목입니다");
+			return;
+		}
+		if (col.validator) {
+			const error = col.validator(newValue, row);
+			if (error) {
+				this.validationErrors = new Map(this.validationErrors).set(`${rowIndex}-${colIndex}`, error);
+				return;
+			}
+		}
+		const nextErrors = new Map(this.validationErrors);
+		nextErrors.delete(`${rowIndex}-${colIndex}`);
+		this.validationErrors = nextErrors;
+		if (newValue !== oldValue) this.dispatchEvent(new CustomEvent("row-update", {
+			detail: {
+				row,
+				field: col.key,
+				value: newValue,
+				oldValue
+			},
+			bubbles: true,
+			composed: true
+		}));
+		this.editingCell = null;
+		this.editValue = "";
+	}
+	_onExpandToggle(rowId) {
+		const next = new Set(this.expandedIds);
+		const expanded = !next.has(rowId);
+		if (expanded) next.add(rowId);
+		else next.delete(rowId);
+		this.expandedIds = next;
+		this.dispatchEvent(new CustomEvent("row-expand", {
+			detail: {
+				row: this.data.find((r) => r._id === rowId),
+				expanded
+			},
+			bubbles: true,
+			composed: true
+		}));
+	}
+	_onAddRowClick() {
+		(this.shadowRoot?.querySelector(".new-row input"))?.focus();
+	}
+	_onNewRowFocus() {}
+	_onNewRowKeyDown(e) {
+		if (e.key === "Enter") {
+			e.preventDefault();
+			const inputs = Array.from(this.shadowRoot?.querySelectorAll(".new-row input") ?? []);
+			const newRow = {};
+			this.columns.forEach((col, i) => {
+				if (col.editable !== false && inputs[i]) {
+					let val = inputs[i].value;
+					if (col.type === "number") val = Number(val);
+					newRow[col.key] = val;
+				}
+			});
+			this.dispatchEvent(new CustomEvent("row-create", {
+				detail: { row: newRow },
+				bubbles: true,
+				composed: true
+			}));
+			inputs.forEach((input) => input.value = "");
+			inputs[0]?.focus();
+		} else if (e.key === "Tab" && !e.shiftKey) {
+			const target = e.target;
+			if (Number(target.dataset.newCol) >= this.columns.filter((c) => c.editable !== false).length - 1) {
+				e.preventDefault();
+				this._onNewRowKeyDown(new KeyboardEvent("keydown", { key: "Enter" }));
+			}
+		}
+	}
+	_onRowMenu(row) {
+		this.dispatchEvent(new CustomEvent("row-delete", {
+			detail: { row },
+			bubbles: true,
+			composed: true
+		}));
+	}
+	_onPageChange(page) {
+		this.dispatchEvent(new CustomEvent("page-change", {
+			detail: {
+				page,
+				pageSize: this.pageSize
+			},
+			bubbles: true,
+			composed: true
+		}));
+	}
+	_onPageSizeChange(pageSize) {
+		this.dispatchEvent(new CustomEvent("page-change", {
+			detail: {
+				page: 1,
+				pageSize
+			},
+			bubbles: true,
+			composed: true
+		}));
+	}
+	_colSpan() {
+		let span = this.columns.length + 1;
+		if (this.selectable) span++;
+		if (this.expandable) span++;
+		return span;
+	}
+	_getOptionLabel(col, value) {
+		return col.options?.find((o) => o.value === String(value))?.label ?? String(value ?? "");
+	}
+	_getPageNumbers(totalPages) {
+		const pages = [];
+		const start = Math.max(1, this.currentPage - 2);
+		const end = Math.min(totalPages, start + 4);
+		for (let i = start; i <= end; i++) pages.push(i);
+		return pages;
+	}
+	_moveToNextEditableCell(reverse) {
+		if (!this.editingCell) return;
+		let { rowIndex, colIndex } = this.editingCell;
+		const editableCols = this.columns.map((c, i) => c.editable ? i : -1).filter((i) => i >= 0);
+		const currentIdx = editableCols.indexOf(colIndex);
+		if (reverse) {
+			if (currentIdx > 0) colIndex = editableCols[currentIdx - 1];
+			else if (rowIndex > 0) {
+				rowIndex--;
+				colIndex = editableCols[editableCols.length - 1];
+			}
+		} else if (currentIdx < editableCols.length - 1) colIndex = editableCols[currentIdx + 1];
+		else if (rowIndex < this.data.length - 1) {
+			rowIndex++;
+			colIndex = editableCols[0];
+		}
+		const value = this.data[rowIndex]?.[this.columns[colIndex]?.key];
+		this._onCellDblClick(rowIndex, colIndex, value);
+	}
+	_fireSelectionChange() {
+		this.dispatchEvent(new CustomEvent("selection-change", {
+			detail: { selectedRows: this.getSelectedRows() },
+			bubbles: true,
+			composed: true
+		}));
+	}
+	connectedCallback() {
+		super.connectedCallback();
+		this.addEventListener("keydown", this._onGlobalKeyDown);
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.removeEventListener("keydown", this._onGlobalKeyDown);
+	}
+	async _handleCopy() {
+		const rows = this.getSelectedRows();
+		if (rows.length === 0) return;
+		const tsv = toTSV(rows, this.columns);
+		await navigator.clipboard.writeText(tsv);
+	}
+	async _handlePaste() {
+		if (this.editingCell) return;
+		const text = await navigator.clipboard.readText();
+		if (!text.trim()) return;
+		const parsedRows = parseTSV(text, this.columns);
+		if (parsedRows.length === 0) return;
+		this.dispatchEvent(new CustomEvent("paste", {
+			detail: { rows: parsedRows },
+			bubbles: true,
+			composed: true
+		}));
+	}
+	_moveFocus(dx, dy) {
+		if (!this.focusedCell) return;
+		const newCol = Math.max(0, Math.min(this.columns.length - 1, this.focusedCell.colIndex + dx));
+		this.focusedCell = {
+			rowIndex: Math.max(0, Math.min(this.data.length - 1, this.focusedCell.rowIndex + dy)),
+			colIndex: newCol
+		};
+	}
+	_selectAll() {
+		this.selectedIds = new Set(this.data.map((r) => r._id));
+		this._fireSelectionChange();
+	}
+	static define(tagName = "u-rich-table") {
+		if (!customElements.get(tagName)) customElements.define(tagName, this);
+	}
+};
+__decorate([property({ type: Array }), __decorateMetadata("design:type", Array)], URichTable.prototype, "columns", void 0);
+__decorate([property({ type: Array }), __decorateMetadata("design:type", Array)], URichTable.prototype, "data", void 0);
+__decorate([property({ type: Number }), __decorateMetadata("design:type", Object)], URichTable.prototype, "totalCount", void 0);
+__decorate([property({ type: Number }), __decorateMetadata("design:type", Object)], URichTable.prototype, "pageSize", void 0);
+__decorate([property({ type: Number }), __decorateMetadata("design:type", Object)], URichTable.prototype, "currentPage", void 0);
+__decorate([property({ type: Boolean }), __decorateMetadata("design:type", Object)], URichTable.prototype, "loading", void 0);
+__decorate([property({ type: String }), __decorateMetadata("design:type", Object)], URichTable.prototype, "emptyMessage", void 0);
+__decorate([property({ type: Boolean }), __decorateMetadata("design:type", Object)], URichTable.prototype, "selectable", void 0);
+__decorate([property({ type: Boolean }), __decorateMetadata("design:type", Object)], URichTable.prototype, "editable", void 0);
+__decorate([property({ type: Boolean }), __decorateMetadata("design:type", Object)], URichTable.prototype, "addable", void 0);
+__decorate([property({ type: Boolean }), __decorateMetadata("design:type", Object)], URichTable.prototype, "filterable", void 0);
+__decorate([property({ type: Boolean }), __decorateMetadata("design:type", Object)], URichTable.prototype, "expandable", void 0);
+__decorate([property({ attribute: false }), __decorateMetadata("design:type", Function)], URichTable.prototype, "detailRenderer", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "selectedIds", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "focusedCell", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "editingCell", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "editValue", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "expandedIds", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "sort", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "filters", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "validationErrors", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], URichTable.prototype, "rowErrors", void 0);
+URichTable = __decorate([customElement("u-rich-table")], URichTable);
+//#endregion
 export { URichTable };

package/dist/components/u-rich-table/styles.js

@@ -1,6 +1,6 @@
-import { css } from 'lit';
-
-const richTableStyles = css`
+import { css } from "lit";
+//#region src/components/u-rich-table/styles.ts
+var richTableStyles = css`
   :host {
     display: block;
     font-family: system-ui, -apple-system, sans-serif;
@@ -429,5 +429,5 @@ const richTableStyles = css`
     color: var(--u-txt-color-disabled, #525252);
   }
 `;
-
+//#endregion
 export { richTableStyles };