@oscarpalmer/tabela 0.13.0 → 0.15.0

package/dist/components/body.component.d.mts

@@ -1,2 +1,11 @@
-import { t as BodyComponent } from "../body.component-_VDOpJhV.mjs";
+import { BodyElements } from "../models/body.model.mjs";
+import { State } from "../models/tabela.model.mjs";
+
+//#region src/components/body.component.d.ts
+declare class BodyComponent {
+  readonly elements: BodyElements;
+  constructor(state: State);
+  destroy(): void;
+}
+//#endregion
 export { BodyComponent };

package/dist/components/body.component.mjs

@@ -1,20 +1,22 @@
-import { CSS_TABELA_FAKER, CSS_TABELA_ROWGROUP_BODY } from "../models/style.model.mjs";
+import { ATTRIBUTE_DATA_EVENT } from "../models/dom.model.mjs";
+import { CSS_FAKER, CSS_ROWGROUP_BODY } from "../models/style.model.mjs";
 import { createElement, createRowGroup } from "../helpers/dom.helpers.mjs";
+import { EVENT_BODY } from "../models/event.model.mjs";
 //#region src/components/body.component.ts
 function createFaker() {
-	return createElement("div", { className: CSS_TABELA_FAKER });
+	return createElement("div", { className: CSS_FAKER });
 }
 var BodyComponent = class {
 	elements = {
 		faker: createFaker(),
 		group: void 0
 	};
-	constructor() {
-		const group = createRowGroup(false);
+	constructor(state) {
+		const group = createRowGroup(state.options.rowHeight, false);
 		this.elements.group = group;
-		group.className += ` ${CSS_TABELA_ROWGROUP_BODY}`;
+		group.className += ` ${CSS_ROWGROUP_BODY}`;
 		group.tabIndex = 0;
-		group.setAttribute("data-event", "body");
+		group.setAttribute(ATTRIBUTE_DATA_EVENT, EVENT_BODY);
 		group.append(this.elements.faker);
 	}
 	destroy() {

package/dist/components/column.component.d.mts

@@ -1,2 +1,16 @@
-import { t as ColumnComponent } from "../column.component-Bx46r3JI.mjs";
+import { Column, TabelaColumn } from "../models/column.model.mjs";
+
+//#region src/components/column.component.d.ts
+declare class ColumnComponent {
+  elements: ColumnElements;
+  options: Column;
+  constructor(column: TabelaColumn);
+  destroy(): void;
+}
+type ColumnElements = {
+  content: HTMLDivElement;
+  sorter: HTMLDivElement;
+  wrapper: HTMLDivElement;
+};
+//#endregion
 export { ColumnComponent };

package/dist/components/column.component.mjs

@@ -1,16 +1,18 @@
-import { CSS_TABELA_HEADING, CSS_TABELA_HEADING_CONTENT, CSS_TABELA_HEADING_SORTER } from "../models/style.model.mjs";
+import { ATTRIBUTE_DATA_EVENT, ATTRIBUTE_DATA_KEY, ATTRIBUTE_ROLE, ROLE_COLUMNHEADER } from "../models/dom.model.mjs";
+import { CSS_HEADING, CSS_HEADING_CONTENT, CSS_HEADING_SORTER } from "../models/style.model.mjs";
 import { createElement } from "../helpers/dom.helpers.mjs";
+import { EVENT_HEADING } from "../models/event.model.mjs";
 //#region src/components/column.component.ts
 var ColumnComponent = class {
 	elements;
 	options;
 	constructor(column) {
-		const width = Number.parseInt(getComputedStyle(document.body).fontSize, 10) * (column.width ?? column.title.length * 1.5);
+		const width = Number.parseInt(getComputedStyle(document.body).fontSize, 10) * (column.width ?? column.label.length * 1.5);
 		this.options = {
 			...column,
 			width
 		};
-		this.elements = createHeading(this.options.field, this.options.title, width);
+		this.elements = createHeading(this.options.key, this.options.label, width);
 	}
 	destroy() {
 		this.elements.content.remove();
@@ -20,19 +22,19 @@ var ColumnComponent = class {
 		this.options = void 0;
 	}
 };
-function createHeading(field, title, width) {
+function createHeading(key, title, width) {
 	const wrapper = createElement("div", {
-		className: CSS_TABELA_HEADING,
-		role: "columnheader"
+		className: CSS_HEADING,
+		[ATTRIBUTE_ROLE]: ROLE_COLUMNHEADER
 	}, {
-		"data-event": "heading",
-		"data-field": field
+		[ATTRIBUTE_DATA_EVENT]: EVENT_HEADING,
+		[ATTRIBUTE_DATA_KEY]: key
 	}, { width: `${width}px` });
 	const content = createElement("div", {
-		className: CSS_TABELA_HEADING_CONTENT,
+		className: CSS_HEADING_CONTENT,
 		textContent: title
 	});
-	const sorter = createElement("div", { className: CSS_TABELA_HEADING_SORTER });
+	const sorter = createElement("div", { className: CSS_HEADING_SORTER });
 	wrapper.append(content, sorter);
 	return {
 		content,

package/dist/components/footer.component.d.mts

@@ -1,2 +1,13 @@
-import { t as FooterComponent } from "../footer.component-Curiab8j.mjs";
+import { FooterElements } from "../models/footer.model.mjs";
+import { ColumnComponent } from "./column.component.mjs";
+import { State } from "../models/tabela.model.mjs";
+
+//#region src/components/footer.component.d.ts
+declare class FooterComponent {
+  readonly elements: FooterElements;
+  constructor(state: State);
+  destroy(): void;
+  update(columns: ColumnComponent[]): void;
+}
+//#endregion
 export { FooterComponent };

package/dist/components/footer.component.mjs

@@ -1,17 +1,17 @@
-import { CSS_TABELA_CELL_FOOTER, CSS_TABELA_ROWGROUP_FOOTER, CSS_TABELA_ROW_FOOTER } from "../models/style.model.mjs";
+import { CSS_CELL_FOOTER, CSS_ROWGROUP_FOOTER, CSS_ROW_FOOTER } from "../models/style.model.mjs";
 import { createCell, createRowGroup } from "../helpers/dom.helpers.mjs";
 //#region src/components/footer.component.ts
 var FooterComponent = class {
 	elements;
-	constructor() {
-		const { group, row } = createRowGroup();
+	constructor(state) {
+		const { group, row } = createRowGroup(state.options.rowHeight);
 		this.elements = {
 			group,
 			row,
 			cells: []
 		};
-		group.className += ` ${CSS_TABELA_ROWGROUP_FOOTER}`;
-		row.className += ` ${CSS_TABELA_ROW_FOOTER}`;
+		group.className += ` ${CSS_ROWGROUP_FOOTER}`;
+		row.className += ` ${CSS_ROW_FOOTER}`;
 	}
 	destroy() {
 		this.elements.cells.length = 0;
@@ -25,7 +25,7 @@ var FooterComponent = class {
 		elements.row.innerHTML = "";
 		for (let index = 0; index < length; index += 1) {
 			const cell = createCell(columns[index].options.width ?? 4, false);
-			cell.className += ` ${CSS_TABELA_CELL_FOOTER}`;
+			cell.className += ` ${CSS_CELL_FOOTER}`;
 			cell.innerHTML = "&nbsp;";
 			elements.cells.push(cell);
 			elements.row.append(cell);

package/dist/components/group.component.d.mts

@@ -1,2 +1,20 @@
-import { i as updateGroup, n as removeGroup, r as renderGroup, t as GroupComponent } from "../group.component-Cq1YYbfJ.mjs";
+import { GroupValue } from "../models/group.model.mjs";
+import { State } from "../models/tabela.model.mjs";
+
+//#region src/components/group.component.d.ts
+declare class GroupComponent {
+  readonly label: string;
+  element: HTMLElement | undefined;
+  expanded: boolean;
+  filtered: number;
+  readonly key: string;
+  selected: number;
+  total: number;
+  readonly value: GroupValue;
+  constructor(label: string, value: unknown);
+}
+declare function removeGroup(group: GroupComponent): void;
+declare function renderGroup(state: State, component: GroupComponent): void;
+declare function updateGroup(state: State, component: GroupComponent, emit: boolean): void;
+//#endregion
 export { GroupComponent, removeGroup, renderGroup, updateGroup };

package/dist/components/group.component.mjs

@@ -1,5 +1,8 @@
-import { CSS_TABELA_ROW, CSS_TABELA_ROW_GROUP } from "../models/style.model.mjs";
+import { ATTRIBUTE_DATA_EVENT, ATTRIBUTE_DATA_KEY, ATTRIBUTE_ROLE, ROLE_CELL } from "../models/dom.model.mjs";
+import { CSS_BUTTON, CSS_BUTTON_GROUP, CSS_CELL, CSS_CELL_GROUP, CSS_GROUP_SELECTED, CSS_GROUP_TOTAL, CSS_ROW, CSS_ROW_GROUP } from "../models/style.model.mjs";
 import { createElement } from "../helpers/dom.helpers.mjs";
+import { EVENT_GROUP, EVENT_GROUP_UPDATE } from "../models/event.model.mjs";
+import { GROUP_KEY_PREFIX } from "../models/group.model.mjs";
 import { getString } from "@oscarpalmer/atoms/string";
 //#region src/components/group.component.ts
 var GroupComponent = class {
@@ -13,7 +16,7 @@ var GroupComponent = class {
 	constructor(label, value) {
 		this.label = label;
 		const stringified = getString(value);
-		this.key = `group:${stringified}`;
+		this.key = `${GROUP_KEY_PREFIX}${stringified}`;
 		this.value = {
 			stringified,
 			original: value
@@ -27,25 +30,28 @@ function removeGroup(group) {
 }
 function renderGroup(state, component) {
 	component.element ??= createElement("div", {
-		className: `${CSS_TABELA_ROW} ${CSS_TABELA_ROW_GROUP}`,
-		innerHTML: `<div class="tabela__cell tabela__cell--group" role="cell">
-	<button class="tabela__button tabela__button--group" data-event="group" data-key="tabela_${state.id}_${component.key}" type="button">
+		className: `${CSS_ROW} ${CSS_ROW_GROUP}`,
+		innerHTML: `<div class="${CSS_CELL} ${CSS_CELL_GROUP}" role="${ROLE_CELL}">
+	<button class="${CSS_BUTTON} ${CSS_BUTTON_GROUP}" ${ATTRIBUTE_DATA_EVENT}="${EVENT_GROUP}" ${ATTRIBUTE_DATA_KEY}="${state.prefix}_${component.key}" type="button">
 		<span aria-hidden="true"></span>
 		<span>Open/close</span>
 	</button>
 	<p>${component.label}</p>
-	<span class="tabela__group__total">${component.total}</span>
-	<span class="tabela__group__selected">${component.selected === 0 ? "" : component.selected}</span>
+	<span class="${CSS_GROUP_TOTAL}">${component.total}</span>
+	<span class="${CSS_GROUP_SELECTED}">${component.selected === 0 ? "" : component.selected}</span>
 </div>`,
-		role: "row"
+		[ATTRIBUTE_ROLE]: "row"
 	}, {}, { height: `${state.options.rowHeight}px` });
 }
-function updateGroup(state, component) {
+function updateGroup(state, component, emit) {
 	if (component.element == null) return;
-	const selected = component.element.querySelector(".tabela__group__selected");
-	const total = component.element.querySelector(".tabela__group__total");
+	const selected = component.element.querySelector(selectedSelector);
+	const total = component.element.querySelector(totalSelector);
 	if (selected != null) selected.textContent = component.selected === 0 ? "" : String(component.selected);
 	if (total != null) total.textContent = String(component.total);
+	if (emit) state.managers.event.emit(EVENT_GROUP_UPDATE, [component]);
 }
+const selectedSelector = `.${CSS_GROUP_SELECTED}`;
+const totalSelector = `.${CSS_GROUP_TOTAL}`;
 //#endregion
 export { GroupComponent, removeGroup, renderGroup, updateGroup };

package/dist/components/header.component.d.mts

@@ -1,2 +1,13 @@
-import { t as HeaderComponent } from "../header.component-BjjlpZIg.mjs";
+import { ColumnComponent } from "./column.component.mjs";
+import { HeaderElements } from "../models/header.model.mjs";
+import { State } from "../models/tabela.model.mjs";
+
+//#region src/components/header.component.d.ts
+declare class HeaderComponent {
+  readonly elements: HeaderElements;
+  constructor(state: State);
+  destroy(): void;
+  update(columns: ColumnComponent[]): void;
+}
+//#endregion
 export { HeaderComponent };

package/dist/components/header.component.mjs

@@ -1,16 +1,16 @@
-import { CSS_TABELA_ROWGROUP_HEADER, CSS_TABELA_ROW_HEADER } from "../models/style.model.mjs";
+import { CSS_ROWGROUP_HEADER, CSS_ROW_HEADER } from "../models/style.model.mjs";
 import { createRowGroup } from "../helpers/dom.helpers.mjs";
 //#region src/components/header.component.ts
 var HeaderComponent = class {
 	elements;
-	constructor() {
-		const { group, row } = createRowGroup();
+	constructor(state) {
+		const { group, row } = createRowGroup(state.options.rowHeight);
 		this.elements = {
 			group,
 			row
 		};
-		group.className += ` ${CSS_TABELA_ROWGROUP_HEADER}`;
-		row.className += ` ${CSS_TABELA_ROW_HEADER}`;
+		group.className += ` ${CSS_ROWGROUP_HEADER}`;
+		row.className += ` ${CSS_ROW_HEADER}`;
 	}
 	destroy() {
 		this.elements.group = void 0;

package/dist/components/row.component.d.mts

@@ -1,2 +1,15 @@
-import { h as renderRow, m as removeRow, p as RowComponent } from "../group.component-Cq1YYbfJ.mjs";
+import { RenderElementPool } from "../models/render.model.mjs";
+import { State } from "../models/tabela.model.mjs";
+import { Key } from "@oscarpalmer/atoms/models";
+
+//#region src/components/row.component.d.ts
+declare function removeRow(pool: RenderElementPool, row: RowComponent): void;
+declare function renderRow(state: State, row: RowComponent): void;
+declare class RowComponent {
+  readonly key: Key;
+  cells: Record<string, HTMLDivElement>;
+  element: HTMLDivElement | undefined;
+  constructor(key: Key);
+}
+//#endregion
 export { RowComponent, removeRow, renderRow };

package/dist/components/row.component.mjs

@@ -1,5 +1,7 @@
-import { CSS_TABELA_ROW_BODY, CSS_TABELA_ROW_SELECTED } from "../models/style.model.mjs";
+import { ARIA_SELECTED, ATTRIBUTE_DATA_ACTIVE, ATTRIBUTE_DATA_EVENT, ATTRIBUTE_DATA_KEY } from "../models/dom.model.mjs";
+import { CSS_ROW_BODY, CSS_ROW_SELECTED } from "../models/style.model.mjs";
 import { createCell, createRow } from "../helpers/dom.helpers.mjs";
+import "../models/event.model.mjs";
 import { setAttributes } from "@oscarpalmer/toretto/attribute";
 import { getValue } from "@oscarpalmer/atoms/value/handle";
 //#region src/components/row.component.ts
@@ -13,31 +15,33 @@ function removeRow(pool, row) {
 	row.cells = {};
 }
 function renderRow(state, row) {
-	const element = row.element ?? state.managers.render.pool.rows.shift() ?? createRow();
+	const { managers, options, prefix } = state;
+	const element = row.element ?? managers.render.pool.rows.shift() ?? createRow(options.rowHeight);
 	row.element = element;
 	element.innerHTML = "";
-	const selected = state.managers.selection.items.has(row.key);
+	const selected = managers.selection.items.has(row.key);
 	const key = String(row.key);
 	setAttributes(element, {
-		"aria-selected": String(selected),
-		"data-active": String(state.managers.navigation.active === row.key),
-		"data-event": "row",
-		"data-key": key,
-		id: `tabela_${state.id}_${key}`
+		[ARIA_SELECTED]: String(selected),
+		[ATTRIBUTE_DATA_ACTIVE]: String(managers.navigation.active === row.key),
+		[ATTRIBUTE_DATA_EVENT]: "row",
+		[ATTRIBUTE_DATA_KEY]: key,
+		id: `${prefix}${key}`
 	});
-	element.classList.add(CSS_TABELA_ROW_BODY);
-	if (selected) element.classList.add(CSS_TABELA_ROW_SELECTED);
-	else element.classList.remove(CSS_TABELA_ROW_SELECTED);
-	const columns = state.managers.column.items;
+	element.classList.add(CSS_ROW_BODY);
+	if (selected) element.classList.add(CSS_ROW_SELECTED);
+	else element.classList.remove(CSS_ROW_SELECTED);
+	const columns = managers.column.items;
 	const { length } = columns;
-	const data = state.managers.data.state.values.mapped.get(row.key);
+	const data = managers.data.state.values.mapped.get(row.key);
 	if (data == null) return;
 	for (let index = 0; index < length; index += 1) {
 		const { options } = columns[index];
-		state.managers.render.pool.cells[options.field] ??= [];
-		const cell = state.managers.render.pool.cells[columns[index].options.field].shift() ?? createCell(options.width);
-		cell.textContent = String(getValue(data, options.field));
-		row.cells[options.field] = cell;
+		const { key, width } = options;
+		managers.render.pool.cells[key] ??= [];
+		const cell = managers.render.pool.cells[key].shift() ?? createCell(width);
+		cell.textContent = String(getValue(data, key));
+		row.cells[key] = cell;
 		element.append(cell);
 	}
 }

package/dist/helpers/dom.helpers.d.mts

@@ -5,8 +5,8 @@ type RowGroupWithRow = {
 };
 declare function createCell(width: number, body?: boolean): HTMLDivElement;
 declare function createElement<TagName extends keyof HTMLElementTagNameMap>(tagName: TagName, properties?: Partial<HTMLElementTagNameMap[TagName]>, attributes?: Record<string, string>, style?: Partial<CSSStyleDeclaration>): HTMLElementTagNameMap[TagName];
-declare function createRowGroup(): RowGroupWithRow;
-declare function createRowGroup(withRow: boolean): HTMLDivElement;
-declare function createRow(): HTMLDivElement;
+declare function createRowGroup(height: number): RowGroupWithRow;
+declare function createRowGroup(height: number, withRow: boolean): HTMLDivElement;
+declare function createRow(height: number): HTMLDivElement;
 //#endregion
 export { createCell, createElement, createRow, createRowGroup };

package/dist/helpers/dom.helpers.mjs

@@ -1,13 +1,14 @@
-import { CSS_TABELA_CELL, CSS_TABELA_CELL_BODY, CSS_TABELA_ROW, CSS_TABELA_ROWGROUP } from "../models/style.model.mjs";
+import { ROLE_CELL, ROLE_ROWGROUP } from "../models/dom.model.mjs";
+import { CSS_CELL, CSS_CELL_BODY, CSS_ROW, CSS_ROWGROUP } from "../models/style.model.mjs";
 import { setAttributes } from "@oscarpalmer/toretto/attribute";
 import { setStyles } from "@oscarpalmer/toretto/style";
 //#region src/helpers/dom.helpers.ts
 function createCell(width, body) {
 	const cell = createElement("div", {
-		className: CSS_TABELA_CELL,
-		role: "cell"
+		className: CSS_CELL,
+		role: ROLE_CELL
 	}, {}, { width: `${width}px` });
-	if (body ?? true) cell.classList.add(CSS_TABELA_CELL_BODY);
+	if (body ?? true) cell.classList.add(CSS_CELL_BODY);
 	return cell;
 }
 function createElement(tagName, properties, attributes, style) {
@@ -19,24 +20,24 @@ function createElement(tagName, properties, attributes, style) {
 	setStyles(element, style ?? {});
 	return element;
 }
-function createRowGroup(withRow) {
+function createRowGroup(height, withRow) {
 	const group = createElement("div", {
-		className: CSS_TABELA_ROWGROUP,
-		role: "rowgroup"
+		className: CSS_ROWGROUP,
+		role: ROLE_ROWGROUP
 	});
 	if (!(withRow ?? true)) return group;
-	const row = createRow();
+	const row = createRow(height);
 	group.append(row);
 	return {
 		group,
 		row
 	};
 }
-function createRow() {
+function createRow(height) {
 	return createElement("div", {
-		className: CSS_TABELA_ROW,
+		className: CSS_ROW,
 		role: "row"
-	}, {}, { height: "32px" });
+	}, {}, { height: `${height}px` });
 }
 //#endregion
 export { createCell, createElement, createRow, createRowGroup };

package/dist/helpers/misc.helpers.d.mts

@@ -1,6 +1,12 @@
+import { TabelaGroup } from "../models/group.model.mjs";
+import { EventName } from "../models/event.model.mjs";
+import { GroupComponent } from "../components/group.component.mjs";
 import { Key } from "@oscarpalmer/atoms/models";
 
 //#region src/helpers/misc.helpers.d.ts
+declare function getGroup(group: GroupComponent): TabelaGroup;
 declare function getKey(value: unknown): Key | undefined;
+declare function isEvent(value: unknown): value is EventName;
+declare function isGroupKey(key: unknown): boolean;
 //#endregion
-export { getKey };
+export { getGroup, getKey, isEvent, isGroupKey };

package/dist/helpers/misc.helpers.mjs

@@ -1,9 +1,20 @@
+import { EVENTS_NAMES } from "../models/event.model.mjs";
+import { GROUP_KEY_EXPRESSION } from "../models/group.model.mjs";
 //#region src/helpers/misc.helpers.ts
+function getGroup(group) {
+	return { value: group.value.original };
+}
 function getKey(value) {
 	if (typeof value === "number") return value;
 	if (typeof value !== "string") return;
 	return integerExpression.test(value) ? Number.parseInt(value, 10) : value;
 }
+function isEvent(value) {
+	return EVENTS_NAMES.has(value);
+}
+function isGroupKey(key) {
+	return typeof key === "string" && GROUP_KEY_EXPRESSION.test(key);
+}
 const integerExpression = /^\d+$/;
 //#endregion
-export { getKey };
+export { getGroup, getKey, isEvent, isGroupKey };

package/dist/index.d.mts

@@ -1,4 +1,4 @@
-import { t as TabelaOptions } from "./tabela.options-RkZvfptB.mjs";
+import { TabelaOptions } from "./models/tabela.options.mjs";
 import { Tabela } from "./tabela.mjs";
 
 //#region src/index.d.ts

package/dist/managers/column.manager.d.mts

@@ -1,2 +1,17 @@
-import { O as ColumnManager } from "../group.component-Cq1YYbfJ.mjs";
+import { TabelaColumn } from "../models/column.model.mjs";
+import { ColumnComponent } from "../components/column.component.mjs";
+import { State } from "../models/tabela.model.mjs";
+
+//#region src/managers/column.manager.d.ts
+declare class ColumnManager {
+  state: State;
+  items: ColumnComponent[];
+  constructor(state: State);
+  destroy(): void;
+  get(key: string): ColumnComponent | undefined;
+  remove(key: string): void;
+  remove(keys: string[]): void;
+  set(columns: TabelaColumn[]): void;
+}
+//#endregion
 export { ColumnManager };

package/dist/managers/column.manager.mjs

@@ -12,17 +12,17 @@ var ColumnManager = class {
 		this.items = void 0;
 		this.state = void 0;
 	}
-	get(field) {
-		return this.items.find((item) => item.options.field === field);
+	get(key) {
+		return this.items.find((item) => item.options.key === key);
 	}
 	remove(value) {
 		const { items, state } = this;
 		const { components, managers } = state;
-		const fields = (Array.isArray(value) ? value : [value]).filter((item) => typeof item === "string");
-		const { length } = fields;
+		const keys = (Array.isArray(value) ? value : [value]).filter((item) => typeof item === "string");
+		const { length } = keys;
 		if (length === 0) return;
-		for (let fieldIndex = 0; fieldIndex < length; fieldIndex += 1) {
-			const itemIndex = items.findIndex((component) => component.options.field === fields[fieldIndex]);
+		for (let keyIndex = 0; keyIndex < length; keyIndex += 1) {
+			const itemIndex = items.findIndex((component) => component.options.key === keys[keyIndex]);
 			if (itemIndex > -1) {
 				items[itemIndex].destroy();
 				items.splice(itemIndex, 1);
@@ -30,7 +30,7 @@ var ColumnManager = class {
 		}
 		components.header.update(items);
 		components.footer.update(items);
-		managers.render.removeCells(fields);
+		managers.render.removeCells(keys);
 	}
 	set(columns) {
 		const { items, state } = this;

package/dist/managers/data.manager.d.mts

@@ -1,2 +1,27 @@
-import { w as DataManager } from "../group.component-Cq1YYbfJ.mjs";
+import { DataState, TabelaData } from "../models/data.model.mjs";
+import { State } from "../models/tabela.model.mjs";
+import { Key, PlainObject } from "@oscarpalmer/atoms/models";
+
+//#region src/managers/data.manager.d.ts
+declare class DataManager {
+  handlers: TabelaData;
+  state: DataState;
+  get keys(): Key[];
+  get size(): number;
+  constructor(state: State);
+  add(data: PlainObject[], render: boolean): Promise<void>;
+  clear(): Promise<void>;
+  destroy(): void;
+  get(active?: boolean): PlainObject[];
+  getIndex(item: Key): number;
+  remove(items: Array<Key | PlainObject>, render: false): Promise<PlainObject[]>;
+  remove(items: Array<Key | PlainObject>, render: true): Promise<void>;
+  removeItems(data: Key[], clear: boolean, render: false): Promise<PlainObject[]>;
+  removeItems(data: Key[], clear: boolean, render: true): Promise<void>;
+  render(): void;
+  set(data: PlainObject[]): void;
+  synchronize(data: PlainObject[], remove: boolean): Promise<void>;
+  update(data: PlainObject[], render: boolean): Promise<void>;
+}
+//#endregion
 export { DataManager };