@iyulab/data-components 0.3.0 → 0.3.1

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## [0.3.1] - 2026-04-01
+### Changed
+- 컴포넌트 파일 구조 리팩토링: `.component.ts` 파일을 기존 `.ts`로 병합 (UDataView, USimpleSheet, URichTable)
+- UDataView: 다크모드 하드코딩 스타일 제거 — CSS 변수 기반으로 전환
+- 의존성 업데이트: devextreme 25.2.5, vite 8.0.3, typescript-eslint 8.57.2 등
+
+## [0.3.0] - 2026-03-26
+### Added
+- URichTable: 코어 컴포넌트 추가 — 렌더링, 정렬, 필터, 편집, 페이지네이션
+- URichTable: 엑셀 스타일 클립보드(복사/붙여넣기) + 키보드 네비게이션
+- URichTable: 다크모드 지원 (`:host-context([theme="dark"])`)
+- USimpleSheet: `setSelection()`, `selectAll()` 공개 API 추가
+
 ## [0.1.8] - 2026-03-08
 ### Added
 - USimpleSheet: `format` 속성 — Intl.NumberFormatOptions(통화, 퍼센트 등) 또는 콜백 함수로 표시 포맷 지정
@@ -13,5 +26,30 @@
   - 에러 발생 시 빈 문자열 표시
   - 붙여넣기/Fill 시 compute 열 건너뛰기
 
-## [0.1.6]
-- Initial library version release
+## [0.1.6] - 2026-03-08
+### Added
+- USimpleSheet: 드롭다운 셀렉터 기능 (`options`/`strict` 속성)
+  - 드롭다운 상태 관리, 필터링, 키보드 네비게이션
+  - 다크모드 지원
+### Fixed
+- USimpleSheet: 문자 입력 시 이중 입력 방지 (`preventDefault` 추가)
+- USimpleSheet: strict 모드에서 `_isDropdownClick` 리셋 및 안전한 스크롤 처리
+
+## [0.1.4] - 2026-03-07
+### Changed
+- UDataView, USimpleSheet: 다크모드 스타일 업데이트
+
+## [0.1.3] - 2026-03-07
+### Fixed
+- Vite 빌드에 컴포넌트 엔트리 포인트 추가 (sub-path exports 수정)
+
+## [0.1.2] - 2026-03-07
+### Added
+- 컴포넌트별 독립 임포트를 위한 sub-path exports 추가
+
+## [0.1.1] - 2026-03-06
+### Changed
+- 재배포를 위한 버전 범프
+
+## [0.1.0] - 2026-03-06
+- 초기 라이브러리 릴리스

package/dist/_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js

@@ -0,0 +1,9 @@
+//#region \0@oxc-project+runtime@0.122.0/helpers/decorate.js
+function __decorate(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;
+}
+//#endregion
+export { __decorate };

package/dist/_virtual/_@oxc-project_runtime@0.122.0/helpers/decorateMetadata.js

@@ -0,0 +1,6 @@
+//#region \0@oxc-project+runtime@0.122.0/helpers/decorateMetadata.js
+function __decorateMetadata(k, v) {
+	if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+}
+//#endregion
+export { __decorateMetadata };

package/dist/components/data-grid/UDataGrid.js

@@ -1,174 +1,146 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useMemo } from 'react';
-import 'devextreme/data/odata/store';
-import DataGrid, { LoadPanel, Selection, FilterRow, HeaderFilter, SearchPanel, Grouping, GroupPanel, ColumnChooser, Paging, Export, Toolbar, Item, Column } from 'devextreme-react/data-grid';
-
-function UDataGrid({
-  dataSourceUrl,
-  keyField,
-  selectFields,
-  columns,
-  pageSize = 25,
-  showBorders = true,
-  allowColumnReordering = true,
-  allowColumnResizing = true,
-  showGroupPanel = true,
-  showSearchPanel = true,
-  showFilterRow = true,
-  showHeaderFilter = true,
-  allowExport = true,
-  exportFileName,
-  isDevelopment = false,
-  onDataLoaded,
-  onDataLoadError,
-  onExporting,
-  onRowClick,
-  beforeSend
-}) {
-  const defaultBeforeSend = (operation, ajaxOptions) => {
-    try {
-      if (!ajaxOptions) {
-        console.warn("ajaxOptions가 undefined입니다");
-        return;
-      }
-      if (!ajaxOptions.headers || typeof ajaxOptions.headers !== "object") {
-        ajaxOptions.headers = {};
-      }
-      ajaxOptions.headers["Accept"] = "application/json";
-      ajaxOptions.headers["Content-Type"] = "application/json";
-      if (isDevelopment) {
-        ajaxOptions.crossDomain = true;
-        ajaxOptions.headers["Access-Control-Allow-Origin"] = "*";
-      }
-      console.log(`U-DataGrid ${operation} 요청:`, {
-        url: ajaxOptions.url,
-        headers: ajaxOptions.headers,
-        method: ajaxOptions.type || "GET"
-      });
-    } catch (error) {
-      console.error("beforeSend 처리 중 오류:", error);
-    }
-  };
-  const defaultOnLoadError = (error) => {
-    console.error("U-DataGrid 데이터 로딩 오류:", error);
-    let errorMessage = "데이터를 불러오는 중 오류가 발생했습니다.";
-    try {
-      if (error && typeof error === "object") {
-        if (error.status === 404) {
-          errorMessage = "API 엔드포인트를 찾을 수 없습니다. 서버가 실행중인지 확인해주세요.";
-        } else if (error.status === 0) {
-          errorMessage = "CORS 오류 또는 네트워크 연결 문제입니다. 서버 설정을 확인해주세요.";
-        } else if (error.status >= 500) {
-          errorMessage = "서버 내부 오류입니다. 서버 로그를 확인해주세요.";
-        } else if (error.message) {
-          errorMessage = error.message;
-        } else if (typeof error === "string") {
-          errorMessage = error;
-        }
-      }
-    } catch (parseError) {
-      console.error("오류 메시지 파싱 중 문제:", parseError);
-    }
-    alert(`${errorMessage}
-
-요청 URL: ${dataSourceUrl}`);
-  };
-  const dataSource = useMemo(() => {
-    return {
-      store: {
-        type: "odata",
-        version: 4,
-        url: dataSourceUrl,
-        key: keyField,
-        beforeSend: beforeSend || defaultBeforeSend,
-        onLoading: () => {
-          console.log("U-DataGrid 데이터 로딩 시작...");
-        },
-        onLoaded: (data) => {
-          console.log("U-DataGrid 데이터 로딩 완료:", data);
-          onDataLoaded?.(data);
-        },
-        onLoadError: onDataLoadError || defaultOnLoadError
-      },
-      select: selectFields
-    };
-  }, [dataSourceUrl, keyField, selectFields, beforeSend, onDataLoaded, onDataLoadError]);
-  const handleExporting = (e) => {
-    if (exportFileName) {
-      e.fileName = exportFileName;
-    } else {
-      e.fileName = `DataGrid_Export_${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}`;
-    }
-    onExporting?.(e);
-  };
-  return /* @__PURE__ */ jsx("div", { style: {
-    width: "100%",
-    height: "100%",
-    position: "relative",
-    contain: "layout style",
-    isolation: "isolate",
-    overflow: "hidden"
-  }, children: /* @__PURE__ */ jsxs(
-    DataGrid,
-    {
-      dataSource,
-      showBorders,
-      allowColumnReordering,
-      allowColumnResizing,
-      columnAutoWidth: false,
-      showColumnLines: true,
-      showRowLines: true,
-      rowAlternationEnabled: true,
-      hoverStateEnabled: true,
-      height: "100%",
-      width: "100%",
-      wordWrapEnabled: true,
-      columnResizingMode: "widget",
-      remoteOperations: true,
-      onExporting: handleExporting,
-      onRowClick,
-      children: [
-        /* @__PURE__ */ jsx(LoadPanel, { enabled: true }),
-        /* @__PURE__ */ jsx(Selection, { mode: "multiple" }),
-        showFilterRow && /* @__PURE__ */ jsx(FilterRow, { visible: true }),
-        showHeaderFilter && /* @__PURE__ */ jsx(HeaderFilter, { visible: true }),
-        showSearchPanel && /* @__PURE__ */ jsx(SearchPanel, { visible: true, placeholder: "검색..." }),
-        /* @__PURE__ */ jsx(Grouping, { autoExpandAll: false }),
-        showGroupPanel && /* @__PURE__ */ jsx(GroupPanel, { visible: true }),
-        /* @__PURE__ */ jsx(ColumnChooser, { enabled: true }),
-        /* @__PURE__ */ jsx(Paging, { defaultPageSize: pageSize }),
-        allowExport && /* @__PURE__ */ jsx(Export, { enabled: true }),
-        /* @__PURE__ */ jsxs(Toolbar, { children: [
-          showGroupPanel && /* @__PURE__ */ jsx(Item, { name: "groupPanel" }),
-          allowExport && /* @__PURE__ */ jsx(Item, { name: "exportButton" }),
-          /* @__PURE__ */ jsx(Item, { name: "columnChooserButton" }),
-          showSearchPanel && /* @__PURE__ */ jsx(Item, { name: "searchPanel" })
-        ] }),
-        columns.map((col, index) => /* @__PURE__ */ jsx(
-          Column,
-          {
-            dataField: col.dataField,
-            caption: col.caption,
-            width: col.width,
-            minWidth: col.minWidth,
-            dataType: col.dataType,
-            format: col.format,
-            alignment: col.alignment,
-            fixed: col.fixed,
-            fixedPosition: col.fixedPosition,
-            allowHiding: col.allowHiding,
-            allowSorting: col.allowSorting,
-            allowFiltering: col.allowFiltering,
-            allowGrouping: col.allowGrouping,
-            sortOrder: col.sortOrder,
-            cellRender: col.cellRender,
-            visible: col.visible
-          },
-          col.dataField || `column-${index}`
-        ))
-      ]
-    }
-  ) });
+import { useMemo } from "react";
+import "devextreme/data/odata/store";
+import DataGrid, { Column, ColumnChooser, Export, FilterRow, GroupPanel, Grouping, HeaderFilter, Item, LoadPanel, Paging, SearchPanel, Selection, Toolbar } from "devextreme-react/data-grid";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/data-grid/UDataGrid.tsx
+function UDataGrid({ dataSourceUrl, keyField, selectFields, columns, pageSize = 25, showBorders = true, allowColumnReordering = true, allowColumnResizing = true, showGroupPanel = true, showSearchPanel = true, showFilterRow = true, showHeaderFilter = true, allowExport = true, exportFileName, isDevelopment = false, onDataLoaded, onDataLoadError, onExporting, onRowClick, beforeSend }) {
+	const defaultBeforeSend = (operation, ajaxOptions) => {
+		try {
+			if (!ajaxOptions) {
+				console.warn("ajaxOptions가 undefined입니다");
+				return;
+			}
+			if (!ajaxOptions.headers || typeof ajaxOptions.headers !== "object") ajaxOptions.headers = {};
+			ajaxOptions.headers["Accept"] = "application/json";
+			ajaxOptions.headers["Content-Type"] = "application/json";
+			if (isDevelopment) {
+				ajaxOptions.crossDomain = true;
+				ajaxOptions.headers["Access-Control-Allow-Origin"] = "*";
+			}
+			console.log(`U-DataGrid ${operation} 요청:`, {
+				url: ajaxOptions.url,
+				headers: ajaxOptions.headers,
+				method: ajaxOptions.type || "GET"
+			});
+		} catch (error) {
+			console.error("beforeSend 처리 중 오류:", error);
+		}
+	};
+	const defaultOnLoadError = (error) => {
+		console.error("U-DataGrid 데이터 로딩 오류:", error);
+		let errorMessage = "데이터를 불러오는 중 오류가 발생했습니다.";
+		try {
+			if (error && typeof error === "object") {
+				if (error.status === 404) errorMessage = "API 엔드포인트를 찾을 수 없습니다. 서버가 실행중인지 확인해주세요.";
+				else if (error.status === 0) errorMessage = "CORS 오류 또는 네트워크 연결 문제입니다. 서버 설정을 확인해주세요.";
+				else if (error.status >= 500) errorMessage = "서버 내부 오류입니다. 서버 로그를 확인해주세요.";
+				else if (error.message) errorMessage = error.message;
+				else if (typeof error === "string") errorMessage = error;
+			}
+		} catch (parseError) {
+			console.error("오류 메시지 파싱 중 문제:", parseError);
+		}
+		alert(`${errorMessage}\n\n요청 URL: ${dataSourceUrl}`);
+	};
+	const dataSource = useMemo(() => {
+		return {
+			store: {
+				type: "odata",
+				version: 4,
+				url: dataSourceUrl,
+				key: keyField,
+				beforeSend: beforeSend || defaultBeforeSend,
+				onLoading: () => {
+					console.log("U-DataGrid 데이터 로딩 시작...");
+				},
+				onLoaded: (data) => {
+					console.log("U-DataGrid 데이터 로딩 완료:", data);
+					onDataLoaded?.(data);
+				},
+				onLoadError: onDataLoadError || defaultOnLoadError
+			},
+			select: selectFields
+		};
+	}, [
+		dataSourceUrl,
+		keyField,
+		selectFields,
+		beforeSend,
+		onDataLoaded,
+		onDataLoadError
+	]);
+	const handleExporting = (e) => {
+		if (exportFileName) e.fileName = exportFileName;
+		else e.fileName = `DataGrid_Export_${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}`;
+		onExporting?.(e);
+	};
+	return /* @__PURE__ */ jsx("div", {
+		style: {
+			width: "100%",
+			height: "100%",
+			position: "relative",
+			contain: "layout style",
+			isolation: "isolate",
+			overflow: "hidden"
+		},
+		children: /* @__PURE__ */ jsxs(DataGrid, {
+			dataSource,
+			showBorders,
+			allowColumnReordering,
+			allowColumnResizing,
+			columnAutoWidth: false,
+			showColumnLines: true,
+			showRowLines: true,
+			rowAlternationEnabled: true,
+			hoverStateEnabled: true,
+			height: "100%",
+			width: "100%",
+			wordWrapEnabled: true,
+			columnResizingMode: "widget",
+			remoteOperations: true,
+			onExporting: handleExporting,
+			onRowClick,
+			children: [
+				/* @__PURE__ */ jsx(LoadPanel, { enabled: true }),
+				/* @__PURE__ */ jsx(Selection, { mode: "multiple" }),
+				showFilterRow && /* @__PURE__ */ jsx(FilterRow, { visible: true }),
+				showHeaderFilter && /* @__PURE__ */ jsx(HeaderFilter, { visible: true }),
+				showSearchPanel && /* @__PURE__ */ jsx(SearchPanel, {
+					visible: true,
+					placeholder: "검색..."
+				}),
+				/* @__PURE__ */ jsx(Grouping, { autoExpandAll: false }),
+				showGroupPanel && /* @__PURE__ */ jsx(GroupPanel, { visible: true }),
+				/* @__PURE__ */ jsx(ColumnChooser, { enabled: true }),
+				/* @__PURE__ */ jsx(Paging, { defaultPageSize: pageSize }),
+				allowExport && /* @__PURE__ */ jsx(Export, { enabled: true }),
+				/* @__PURE__ */ jsxs(Toolbar, { children: [
+					showGroupPanel && /* @__PURE__ */ jsx(Item, { name: "groupPanel" }),
+					allowExport && /* @__PURE__ */ jsx(Item, { name: "exportButton" }),
+					/* @__PURE__ */ jsx(Item, { name: "columnChooserButton" }),
+					showSearchPanel && /* @__PURE__ */ jsx(Item, { name: "searchPanel" })
+				] }),
+				columns.map((col, index) => /* @__PURE__ */ jsx(Column, {
+					dataField: col.dataField,
+					caption: col.caption,
+					width: col.width,
+					minWidth: col.minWidth,
+					dataType: col.dataType,
+					format: col.format,
+					alignment: col.alignment,
+					fixed: col.fixed,
+					fixedPosition: col.fixedPosition,
+					allowHiding: col.allowHiding,
+					allowSorting: col.allowSorting,
+					allowFiltering: col.allowFiltering,
+					allowGrouping: col.allowGrouping,
+					sortOrder: col.sortOrder,
+					cellRender: col.cellRender,
+					visible: col.visible
+				}, col.dataField || `column-${index}`))
+			]
+		})
+	});
 }
-
+//#endregion
 export { UDataGrid };

package/dist/components/data-view/UDataView.d.ts

@@ -1,8 +1,49 @@
-import { UDataView } from './UDataView.component.js';
+import { TemplateResult } from 'lit';
+import { UElement } from '@iyulab/components/dist/components/UElement.js';
+export type ViewMode = 'grid' | 'list' | 'table';
+export interface DataColumn {
+    key: string;
+    label?: string;
+    width?: string;
+}
+/**
+ * Data View Component
+ * 데이터를 3가지 레이아웃(grid, list, table)으로 표시하는 컴포넌트
+ */
+export declare class UDataView extends UElement {
+    static styles: import('lit').CSSResultGroup[];
+    /** 표시할 데이터 배열 */
+    items: any[];
+    /** 현재 뷰 모드 */
+    mode: ViewMode;
+    /** 표시할 컬럼 설정 (미지정시 자동 감지) */
+    columns?: DataColumn[];
+    /** 그리드 모드 최소 폭 */
+    gridMinWidth: string;
+    /** 아이템 간격 */
+    gap: string;
+    /** 커스텀 렌더 함수 (grid/list 카드용) */
+    renderCard?: (item: any, index: number) => TemplateResult;
+    /** 커스텀 셀 렌더 함수 (table용) */
+    renderCell?: (item: any, column: DataColumn, index: number) => TemplateResult | string;
+    private selectedIndex;
+    render(): TemplateResult<1>;
+    private renderToolbar;
+    private renderViewButton;
+    private renderContent;
+    private renderGrid;
+    private renderList;
+    private renderTable;
+    private renderGridItem;
+    private renderListItem;
+    private renderDefaultCard;
+    private getCellContent;
+    private getColumns;
+    private formatLabel;
+    private formatValue;
+}
 declare global {
     interface HTMLElementTagNameMap {
         "u-data-view": UDataView;
     }
 }
-export { UDataView };
-export type { Column, ViewMode } from './UDataView.component.js';

package/dist/components/data-view/UDataView.js

@@ -1,5 +1,173 @@
-import { UDataView } from './UDataView.component.js';
-
-UDataView.define("u-data-view");
-
+import { styles } from "./UDataView.styles.js";
+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 { html } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import "@iyulab/components/dist/components/icon/UIcon.js";
+import "@iyulab/components/dist/components/button/UButton.js";
+import { UElement } from "@iyulab/components/dist/components/UElement.js";
+//#region src/components/data-view/UDataView.ts
+var UDataView = class UDataView extends UElement {
+	constructor(..._args) {
+		super(..._args);
+		this.items = [];
+		this.mode = "grid";
+		this.gridMinWidth = "200px";
+		this.gap = "1rem";
+		this.selectedIndex = null;
+	}
+	static {
+		this.styles = [super.styles, styles];
+	}
+	render() {
+		return html`
+      <div class="data-view">
+        ${this.renderToolbar()}
+        ${this.renderContent()}
+      </div>
+    `;
+	}
+	renderToolbar() {
+		return html`
+      <div class="toolbar">
+        <div class="view-toggles">
+          ${this.renderViewButton("grid", "grid-3x3-gap", "Grid")}
+          ${this.renderViewButton("list", "list-ul", "List")}
+          ${this.renderViewButton("table", "table", "Table")}
+        </div>
+        <div class="info">
+          ${this.items.length} items
+        </div>
+      </div>
+    `;
+	}
+	renderViewButton(mode, icon, label) {
+		return html`
+      <u-button
+        ?active=${this.mode === mode}
+        title=${label}
+      >
+        <u-icon lib="bootstrap" name=${icon}></u-icon>
+      </u-button>
+    `;
+	}
+	renderContent() {
+		if (!this.items?.length) return html`<div class="empty">No data available</div>`;
+		switch (this.mode) {
+			case "grid": return this.renderGrid();
+			case "list": return this.renderList();
+			case "table": return this.renderTable();
+		}
+	}
+	renderGrid() {
+		return html`
+      <div class="grid" style="--min-width: ${this.gridMinWidth}; --gap: ${this.gap};">
+        ${this.items.map((item, index) => this.renderGridItem(item, index))}
+      </div>
+    `;
+	}
+	renderList() {
+		return html`
+      <div class="list" style="--gap: ${this.gap};">
+        ${this.items.map((item, index) => this.renderListItem(item, index))}
+      </div>
+    `;
+	}
+	renderTable() {
+		const cols = this.getColumns();
+		return html`
+      <div class="table-wrapper">
+        <table>
+          <thead>
+            <tr>
+              ${cols.map((col) => html`
+                <th style=${col.width ? `width: ${col.width}` : ""}>
+                  ${col.label || this.formatLabel(col.key)}
+                </th>
+              `)}
+            </tr>
+          </thead>
+          <tbody>
+            ${this.items.map((item, index) => html`
+              <tr 
+                class=${this.selectedIndex === index ? "selected" : ""}
+              >
+                ${cols.map((col) => html`
+                  <td>${this.getCellContent(item, col, index)}</td>
+                `)}
+              </tr>
+            `)}
+          </tbody>
+        </table>
+      </div>
+    `;
+	}
+	renderGridItem(item, index) {
+		const content = this.renderCard ? this.renderCard(item, index) : this.renderDefaultCard(item);
+		return html`
+      <div 
+        class="card ${this.selectedIndex === index ? "selected" : ""}"
+      >
+        ${content}
+      </div>
+    `;
+	}
+	renderListItem(item, index) {
+		const content = this.renderCard ? this.renderCard(item, index) : this.renderDefaultCard(item);
+		return html`
+      <div 
+        class="card list-card ${this.selectedIndex === index ? "selected" : ""}"
+      >
+        ${content}
+      </div>
+    `;
+	}
+	renderDefaultCard(item) {
+		return html`
+      <div class="card-content">
+        ${this.getColumns().slice(0, 5).map((col) => {
+			const value = item[col.key];
+			return html`
+            <div class="card-field">
+              <span class="label">${col.label || this.formatLabel(col.key)}:</span>
+              <span class="value">${this.formatValue(value)}</span>
+            </div>
+          `;
+		})}
+      </div>
+    `;
+	}
+	getCellContent(item, column, index) {
+		if (this.renderCell) return this.renderCell(item, column, index);
+		return this.formatValue(item[column.key]);
+	}
+	getColumns() {
+		if (this.columns?.length) return this.columns;
+		if (this.items.length > 0) {
+			const firstItem = this.items[0];
+			return Object.keys(firstItem).map((key) => ({ key }));
+		}
+		return [];
+	}
+	formatLabel(key) {
+		return key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase()).trim();
+	}
+	formatValue(value) {
+		if (value == null) return "—";
+		if (typeof value === "boolean") return value ? "✓" : "✗";
+		if (value instanceof Date) return value.toLocaleString();
+		if (typeof value === "object") return JSON.stringify(value);
+		return String(value);
+	}
+};
+__decorate([property({ type: Array }), __decorateMetadata("design:type", Array)], UDataView.prototype, "items", void 0);
+__decorate([property({ type: String }), __decorateMetadata("design:type", Object)], UDataView.prototype, "mode", void 0);
+__decorate([property({ type: Array }), __decorateMetadata("design:type", Array)], UDataView.prototype, "columns", void 0);
+__decorate([property({ type: String }), __decorateMetadata("design:type", Object)], UDataView.prototype, "gridMinWidth", void 0);
+__decorate([property({ type: String }), __decorateMetadata("design:type", Object)], UDataView.prototype, "gap", void 0);
+__decorate([property({ attribute: false }), __decorateMetadata("design:type", Function)], UDataView.prototype, "renderCard", void 0);
+__decorate([property({ attribute: false }), __decorateMetadata("design:type", Function)], UDataView.prototype, "renderCell", void 0);
+__decorate([state(), __decorateMetadata("design:type", Object)], UDataView.prototype, "selectedIndex", void 0);
+UDataView = __decorate([customElement("u-data-view")], UDataView);
+//#endregion
 export { UDataView };