@oscarpalmer/tabela 0.8.0 → 0.10.0

package/dist/tabela.full.js

@@ -1,3 +1,14 @@
+function compact$1(array, strict) {
+	if (!Array.isArray(array)) return [];
+	if (strict === true) return array.filter(Boolean);
+	const { length } = array;
+	const compacted = [];
+	for (let index = 0; index < length; index += 1) {
+		const item = array[index];
+		if (item != null) compacted.push(item);
+	}
+	return compacted;
+}
 /**
 * Get the string value from any value
 * @param value Original value
@@ -12,6 +23,32 @@ function getString$1(value) {
 	return asString.startsWith("[object ") ? JSON.stringify(value) : asString;
 }
 /**
+* Join an array of values into a string
+* @param value Array of values
+* @param delimiter Delimiter to use between values
+* @returns Joined string
+*/
+function join$1(value, delimiter) {
+	return compact$1(value).map(getString$1).join(typeof delimiter === "string" ? delimiter : "");
+}
+/**
+* Split a string into words _(and other readable parts)_
+* @param value Original string
+* @returns Array of words found in the string
+*/
+function words$1(value) {
+	return typeof value === "string" ? value.match(EXPRESSION_WORDS$1) ?? [] : [];
+}
+var EXPRESSION_WORDS$1 = /[^\x00-\x2f\x3a-\x40\x5b-\x60\x7b-\x7f]+/g;
+/**
+* Is the value a number?
+* @param value Value to check
+* @returns `true` if the value is a `number`, otherwise `false`
+*/
+function isNumber$1(value) {
+	return typeof value === "number" && !Number.isNaN(value);
+}
+/**
 * Is the value a plain object?
 * @param value Value to check
 * @returns `true` if the value is a plain object, otherwise `false`
@@ -22,9 +59,237 @@ function isPlainObject$1(value) {
 	const prototype = Object.getPrototypeOf(value);
 	return prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null;
 }
+/**
+* Clamp a number between a minimum and maximum value
+* @param value Value to clamp
+* @param minimum Minimum value
+* @param maximum Maximum value
+* @param loop If `true`, the value will loop around when smaller than the minimum or larger than the maximum _(defaults to `false`)_
+* @returns Clamped value
+*/
+function clamp$1(value, minimum, maximum, loop) {
+	if (![
+		value,
+		minimum,
+		maximum
+	].every(isNumber$1)) return NaN;
+	if (value < minimum) return loop === true ? maximum : minimum;
+	return value > maximum ? loop === true ? minimum : maximum : value;
+}
+function getSizedMaximum$1(first, second) {
+	let actual;
+	if (typeof first === "number") actual = first;
+	else actual = typeof second === "number" ? second : MAXIMUM_DEFAULT$1;
+	return clamp$1(actual, 1, MAXIMUM_ABSOLUTE$1);
+}
+var MAXIMUM_ABSOLUTE$1 = 16777216;
+var MAXIMUM_DEFAULT$1 = 1048576;
+/**
+* A Map with a maximum size
+*
+* Behavior is similar to a _LRU_-cache, where the least recently used entries are removed
+*/
+var SizedMap$1 = class extends Map {
+	/**
+	* The maximum size of the Map
+	*/
+	#maximumSize;
+	/**
+	* Is the Map full?
+	*/
+	get full() {
+		return this.size >= this.#maximumSize;
+	}
+	get maximum() {
+		return this.#maximumSize;
+	}
+	constructor(first, second) {
+		const maximum = getSizedMaximum$1(first, second);
+		super();
+		this.#maximumSize = maximum;
+		if (Array.isArray(first)) {
+			const { length } = first;
+			if (length <= maximum) for (let index = 0; index < length; index += 1) this.set(...first[index]);
+			else for (let index = 0; index < maximum; index += 1) this.set(...first[length - maximum + index]);
+		}
+	}
+	/**
+	* @inheritdoc
+	*/
+	get(key) {
+		const value = super.get(key);
+		if (value !== void 0 || this.has(key)) this.set(key, value);
+		return value;
+	}
+	/**
+	* @inheritdoc
+	*/
+	set(key, value) {
+		if (this.has(key)) this.delete(key);
+		else if (this.size >= this.#maximumSize) this.delete(this.keys().next().value);
+		return super.set(key, value);
+	}
+};
+var Memoized$1 = class {
+	#state;
+	/**
+	* Maximum cache size
+	*/
+	get maximum() {
+		return this.#state.cache?.maximum ?? NaN;
+	}
+	/**
+	* Current cache size
+	*/
+	get size() {
+		return this.#state.cache?.size ?? NaN;
+	}
+	constructor(callback, options) {
+		const cache = new SizedMap$1(options.cacheSize);
+		const getter = (...parameters) => {
+			const key = options.cacheKey?.(...parameters) ?? (parameters.length === 1 ? parameters[0] : join$1(parameters.map(getString$1), "_"));
+			if (cache.has(key)) return cache.get(key);
+			const value = callback(...parameters);
+			cache.set(key, value);
+			return value;
+		};
+		this.#state = {
+			cache,
+			getter
+		};
+	}
+	/**
+	* Clear the cache
+	*/
+	clear() {
+		this.#state.cache?.clear();
+	}
+	/**
+	* Delete a result from the cache
+	* @param key Key to delete
+	* @returns `true` if the key existed and was removed, otherwise `false`
+	*/
+	delete(key) {
+		return this.#state.cache?.delete(key) ?? false;
+	}
+	/**
+	* Destroy the instance _(clearing its cache and removing its callback)_
+	*/
+	destroy() {
+		this.#state.cache?.clear();
+		this.#state.cache = void 0;
+		this.#state.getter = void 0;
+	}
+	/**
+	* Get a result from the cache
+	* @param key Key to get
+	* @returns Cached result or `undefined` if it does not exist
+	*/
+	get(key) {
+		return this.#state.cache?.get(key);
+	}
+	/**
+	* Does the result exist?
+	* @param key Key to check
+	* @returns `true` if the result exists, otherwise `false`
+	*/
+	has(key) {
+		return this.#state.cache?.has(key) ?? false;
+	}
+	/**
+	* Run the callback with the provided parameters
+	* @param parameters Parameters to pass to the callback
+	* @returns Cached or computed _(then cached)_ result
+	*/
+	run(...parameters) {
+		if (this.#state.cache == null || this.#state.getter == null) throw new Error("The Memoized instance has been destroyed");
+		return this.#state.getter(...parameters);
+	}
+};
+function getMemoizationOptions$1(input) {
+	const { cacheKey, cacheSize } = isPlainObject$1(input) ? input : {};
+	return {
+		cacheKey: typeof cacheKey === "function" ? cacheKey : void 0,
+		cacheSize: typeof cacheSize === "number" && cacheSize > 0 ? cacheSize : DEFAULT_CACHE_SIZE$1
+	};
+}
+/**
+* Memoize a function, caching and retrieving results based on the first parameter
+* @param callback Callback to memoize
+* @param options Memoization options
+* @returns Memoized instance
+*/
+function memoize$1(callback, options) {
+	return new Memoized$1(callback, getMemoizationOptions$1(options));
+}
+var DEFAULT_CACHE_SIZE$1 = 1024;
+/**
+* Convert a string to camel case _(thisIsCamelCase)_
+* @param value String to convert
+* @returns Camel-cased string
+*/
+function camelCase(value) {
+	return toCase("camel", value, true, false);
+}
+/**
+* Capitalize the first letter of a string _(and lowercase the rest)_
+* @param value String to capitalize
+* @returns Capitalized string
+*/
+function capitalize(value) {
+	if (typeof value !== "string" || value.length === 0) return "";
+	memoizedCapitalize ??= memoize$1((v) => v.length === 1 ? v.toLocaleUpperCase() : `${v.charAt(0).toLocaleUpperCase()}${v.slice(1).toLocaleLowerCase()}`);
+	return memoizedCapitalize.run(value);
+}
+function toCase(type, value, capitalizeAny, capitalizeFirst) {
+	caseMemoizers[type] ??= memoize$1(toCaseCallback.bind({
+		type,
+		capitalizeAny,
+		capitalizeFirst
+	}));
+	return caseMemoizers[type].run(value);
+}
+function toCaseCallback(value) {
+	if (typeof value !== "string") return "";
+	if (value.length < 1) return value;
+	const { capitalizeAny, capitalizeFirst, type } = this;
+	const parts = words$1(value);
+	const partsLength = parts.length;
+	const cased = [];
+	for (let partIndex = 0; partIndex < partsLength; partIndex += 1) {
+		const items = parts[partIndex].replace(EXPRESSION_ACRONYM, (full, one, two, three) => three === "s" ? full : `${one}-${two}${three}`).replace(EXPRESSION_CAMEL_CASE, REPLACEMENT_CAMEL_CASE).split("-");
+		const itemsLength = items.length;
+		const partResult = [];
+		let itemCount = 0;
+		for (let itemIndex = 0; itemIndex < itemsLength; itemIndex += 1) {
+			const item = items[itemIndex];
+			if (item.length === 0) continue;
+			if (!capitalizeAny || itemCount === 0 && partIndex === 0 && !capitalizeFirst) partResult.push(item.toLocaleLowerCase());
+			else partResult.push(capitalize(item));
+			itemCount += 1;
+		}
+		cased.push(join$1(partResult, delimiters[type]));
+	}
+	return join$1(cased, delimiters[type]);
+}
+var caseMemoizers = {};
+var delimiters = {
+	camel: "",
+	kebab: "-",
+	pascal: "",
+	snake: "_"
+};
+var EXPRESSION_CAMEL_CASE = /(\p{Ll})(\p{Lu})/gu;
+var EXPRESSION_ACRONYM = /(\p{Lu}*)(\p{Lu})(\p{Ll}+)/gu;
+var REPLACEMENT_CAMEL_CASE = "$1-$2";
+var memoizedCapitalize;
 function getBoolean(value, defaultValue) {
 	return typeof value === "boolean" ? value : defaultValue ?? false;
 }
+function getStyleValue(element, property, computed) {
+	const name = camelCase(property);
+	return computed ? getComputedStyle(element)[name] : element.style[name];
+}
 /**
 * Is the value an event target?
 * @param value Value to check
@@ -57,6 +322,33 @@ function isNullableOrWhitespace(value) {
 	return value == null || EXPRESSION_WHITESPACE$1.test(getString$1(value));
 }
 var EXPRESSION_WHITESPACE$1 = /^\s*$/;
+function setElementValue(element, first, second, third, callback) {
+	if (!isHTMLOrSVGElement(element)) return;
+	if (typeof first === "string") setElementValues(element, first, second, third, callback);
+	else if (isAttribute(first)) setElementValues(element, first.name, first.value, third, callback);
+}
+function setElementValues(element, first, second, third, callback) {
+	if (!isHTMLOrSVGElement(element)) return;
+	if (typeof first === "string") {
+		callback(element, first, second, third);
+		return;
+	}
+	const isArray = Array.isArray(first);
+	if (!isArray && !(typeof first === "object" && first !== null)) return;
+	const entries = isArray ? first : Object.entries(first).map(([name, value]) => ({
+		name,
+		value
+	}));
+	const { length } = entries;
+	for (let index = 0; index < length; index += 1) {
+		const entry = entries[index];
+		if (typeof entry === "object" && typeof entry?.name === "string") callback(element, entry.name, entry.value, third);
+	}
+}
+function updateElementValue(element, key, value, set, remove, isBoolean, json) {
+	if (isBoolean ? value == null : isNullableOrWhitespace(value)) remove.call(element, key);
+	else set.call(element, key, json ? JSON.stringify(value) : String(value));
+}
 function badAttributeHandler(name, value) {
 	if (typeof name !== "string" || name.trim().length === 0 || typeof value !== "string") return true;
 	if (EXPRESSION_CLOBBERED_NAME.test(name) && (value in document || value in formElement) || EXPRESSION_EVENT_NAME.test(name)) return true;
@@ -165,32 +457,28 @@ var elementEvents = {
 };
 var formElement = document.createElement("form");
 var textArea;
-function setElementValue(element, first, second, third, callback) {
-	if (!isHTMLOrSVGElement(element)) return;
-	if (typeof first === "string") setElementValues(element, first, second, third, callback);
-	else if (isAttribute(first)) setElementValues(element, first.name, first.value, third, callback);
+function setAttribute(element, first, second, third) {
+	setElementValue(element, first, second, third, updateAttribute);
 }
-function setElementValues(element, first, second, third, callback) {
-	if (!isHTMLOrSVGElement(element)) return;
-	if (typeof first === "string") {
-		callback(element, first, second, third);
-		return;
-	}
-	const isArray = Array.isArray(first);
-	if (!isArray && !(typeof first === "object" && first !== null)) return;
-	const entries = isArray ? first : Object.entries(first).map(([name, value]) => ({
-		name,
-		value
-	}));
-	const { length } = entries;
+function setAttributes(element, attributes, dispatch) {
+	setElementValues(element, attributes, null, dispatch, updateAttribute);
+}
+/**
+* Get styles from an element
+* @param element Element to get the styles from
+* @param properties Styles to get
+* @param computed Get the computed styles? _(defaults to `false`)_
+* @returns Style values
+*/
+function getStyles(element, properties, computed) {
+	const styles = {};
+	if (!(isHTMLOrSVGElement(element) && Array.isArray(properties))) return styles;
+	const { length } = properties;
 	for (let index = 0; index < length; index += 1) {
-		const entry = entries[index];
-		if (typeof entry === "object" && typeof entry?.name === "string") callback(element, entry.name, entry.value, third);
+		const property = properties[index];
+		if (typeof property === "string") styles[property] = getStyleValue(element, property, computed === true);
 	}
-}
-function updateElementValue(element, key, value, set, remove, isBoolean, json) {
-	if (isBoolean ? value == null : isNullableOrWhitespace(value)) remove.call(element, key);
-	else set.call(element, key, json ? JSON.stringify(value) : String(value));
+	return styles;
 }
 /**
 * Set styles on an element
@@ -200,6 +488,38 @@ function updateElementValue(element, key, value, set, remove, isBoolean, json) {
 function setStyles(element, styles) {
 	setElementValues(element, styles, null, null, updateStyleProperty);
 }
+/**
+* Toggle styles for an element
+* @param element Element to style
+* @param styles Styles to be set or removed
+* @returns Style toggler
+*/
+function toggleStyles(element, styles) {
+	function toggle(set) {
+		hasSet = set;
+		let next;
+		if (set) {
+			values = getStyles(element, keys);
+			next = styles;
+		} else {
+			next = { ...values };
+			values = {};
+			for (const key of keys) values[key] = void 0;
+		}
+		setStyles(element, next);
+	}
+	const keys = Object.keys(styles);
+	let hasSet = false;
+	let values = {};
+	return {
+		set() {
+			if (!hasSet) toggle(true);
+		},
+		remove() {
+			if (hasSet) toggle(false);
+		}
+	};
+}
 function updateStyleProperty(element, key, value) {
 	updateElementValue(element, key, value, function(property, style) {
 		this.style[property] = style;
@@ -207,18 +527,12 @@ function updateStyleProperty(element, key, value) {
 		this.style[property] = "";
 	}, false, false);
 }
-function setAttribute(element, first, second, third) {
-	setElementValue(element, first, second, third, updateAttribute);
-}
-function setAttributes(element, attributes, dispatch) {
-	setElementValues(element, attributes, null, dispatch, updateAttribute);
-}
 function createCell(width, body) {
 	const cell = createElement("div", {
 		className: "tabela__cell",
 		role: "cell"
 	}, {}, { width: `${width}px` });
-	if (body ?? true) cell.classList.add("tabela__cell-body");
+	if (body ?? true) cell.classList.add("tabela__cell--body");
 	return cell;
 }
 function createElement(tagName, properties, attributes, style) {
@@ -235,33 +549,21 @@ function createRowGroup(withRow) {
 		role: "rowgroup"
 	}, {}, {});
 	if (!(withRow ?? true)) return group;
-	const row = createRow(false);
+	const row = createRow();
 	group.append(row);
 	return {
 		group,
 		row
 	};
 }
-function createRow(withStyle) {
-	const row = createElement("div", {
+function createRow() {
+	return createElement("div", {
 		className: "tabela__row",
 		role: "row"
 	}, {}, {});
-	if (withStyle ?? true) setStyles(row, {
-		inset: "0 auto auto 0",
-		position: "absolute"
-	});
-	return row;
 }
 function createFaker() {
-	return createElement("div", {}, {}, {
-		height: "0",
-		inset: "0 auto auto 0",
-		opacity: "0",
-		pointerEvents: "none",
-		position: "absolute",
-		width: "1px"
-	});
+	return createElement("div", { className: "tabela__faker" }, {}, {});
 }
 var BodyComponent = class {
 	elements = {
@@ -271,13 +573,8 @@ var BodyComponent = class {
 	constructor() {
 		const group = createRowGroup(false);
 		this.elements.group = group;
-		group.className += " tabela__rowgroup-body";
+		group.className += " tabela__rowgroup--body";
 		group.tabIndex = 0;
-		setStyles(group, {
-			height: "100%",
-			overflow: "auto",
-			position: "relative"
-		});
 		group.append(this.elements.faker);
 	}
 	destroy() {
@@ -294,8 +591,8 @@ var FooterComponent = class {
 			row,
 			cells: []
 		};
-		group.className += " tabela__rowgroup-footer";
-		row.className += " tabela__row-footer";
+		group.className += " tabela__rowgroup--footer";
+		row.className += " tabela__row--footer";
 	}
 	destroy() {
 		this.elements.cells.length = 0;
@@ -309,7 +606,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 += " tabela__cell-footer";
+			cell.className += " tabela__cell--footer";
 			cell.innerHTML = "&nbsp;";
 			elements.cells.push(cell);
 			elements.row.append(cell);
@@ -324,8 +621,8 @@ var HeaderComponent = class {
 			group,
 			row
 		};
-		group.className += " tabela__rowgroup-header";
-		row.className += " tabela__row-header";
+		group.className += " tabela__rowgroup--header";
+		row.className += " tabela__row--header";
 	}
 	destroy() {
 		this.elements.group = void 0;
@@ -383,6 +680,8 @@ var ColumnManager = class {
 		this.set(columns);
 	}
 	destroy() {
+		const { length } = this.items;
+		for (let index = 0; index < length; index += 1) this.items[index].destroy();
 		this.items.length = 0;
 	}
 	remove(value) {
@@ -392,11 +691,14 @@ var ColumnManager = class {
 		if (length === 0) return;
 		for (let fieldIndex = 0; fieldIndex < length; fieldIndex += 1) {
 			const itemIndex = items.findIndex((component) => component.options.field === fields[fieldIndex]);
-			if (itemIndex > -1) items.splice(itemIndex, 1);
+			if (itemIndex > -1) {
+				items[itemIndex].destroy();
+				items.splice(itemIndex, 1);
+			}
 		}
 		components.header.update(items);
 		components.footer.update(items);
-		managers.virtualization.removeCells(fields);
+		managers.render.removeCells(fields);
 	}
 	set(columns) {
 		const { components, items } = this;
@@ -480,6 +782,14 @@ function isConstructor(value) {
 	return typeof value === "function" && value.prototype?.constructor === value;
 }
 /**
+* Is the value a key?
+* @param value Value to check
+* @returns `true` if the value is a `Key` _(`number` or `string`)_, otherwise `false`
+*/
+function isKey(value) {
+	return typeof value === "number" || typeof value === "string";
+}
+/**
 * Is the value a number?
 * @param value Value to check
 * @returns `true` if the value is a `number`, otherwise `false`
@@ -498,6 +808,90 @@ function isPlainObject(value) {
 	const prototype = Object.getPrototypeOf(value);
 	return prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null;
 }
+/**
+* Is the value a typed array?
+* @param value Value to check
+* @returns `true` if the value is a typed array, otherwise `false`
+*/
+function isTypedArray(value) {
+	TYPED_ARRAYS ??= new Set([
+		Int8Array,
+		Uint8Array,
+		Uint8ClampedArray,
+		Int16Array,
+		Uint16Array,
+		Int32Array,
+		Uint32Array,
+		Float32Array,
+		Float64Array,
+		BigInt64Array,
+		BigUint64Array
+	]);
+	return TYPED_ARRAYS.has(value?.constructor);
+}
+var TYPED_ARRAYS;
+/**
+* Chunk an array into smaller arrays
+* @param array Array to chunk
+* @param size Size of each chunk _(minimum is `1`, maximum is `5000`; defaults to `5000`)_
+* @returns Array of arrays
+*/
+function chunk(array, size) {
+	if (!Array.isArray(array)) return [];
+	if (array.length === 0) return [];
+	const { length } = array;
+	const actualSize = typeof size === "number" && size > 0 && size <= MAX_SIZE ? size : MAX_SIZE;
+	if (length <= actualSize) return [array];
+	const chunks = [];
+	let index = 0;
+	while (index < length) {
+		chunks.push(array.slice(index, index + actualSize));
+		index += actualSize;
+	}
+	return chunks;
+}
+var MAX_SIZE = 5e3;
+function compact(array, strict) {
+	if (!Array.isArray(array)) return [];
+	if (strict === true) return array.filter(Boolean);
+	const { length } = array;
+	const compacted = [];
+	for (let index = 0; index < length; index += 1) {
+		const item = array[index];
+		if (item != null) compacted.push(item);
+	}
+	return compacted;
+}
+function insertChunkedValues(type, array, items, start, deleteCount) {
+	const actualDeleteCount = deleteCount < 0 ? 0 : deleteCount;
+	const actualStart = Math.min(Math.max(0, start), array.length);
+	const chunked = chunk(items);
+	const lastIndex = chunked.length - 1;
+	let index = Number(chunked.length);
+	let returned;
+	while (index > 0) {
+		index -= 1;
+		const spliced = array.splice(actualStart, index === lastIndex ? actualDeleteCount : 0, ...chunked[index]);
+		if (returned == null) returned = spliced;
+		else returned.push(...spliced);
+	}
+	if (type === "insert") return array;
+	return type === "splice" ? returned : array.length;
+}
+function insertValues(type, array, items, start, deleteCount) {
+	const spliceArray = type === "insert" || type === "splice";
+	if (!Array.isArray(array) || typeof start !== "number" || !Array.isArray(items) || items.length === 0) return spliceArray ? [] : 0;
+	return insertChunkedValues(type, array, items, start, spliceArray ? deleteCount : 0);
+}
+/**
+* Push items into an array _(at the end)_
+* @param array Original array
+* @param pushed Pushed items
+* @returns New length of the array
+*/
+function push(array, pushed) {
+	return insertValues("push", array, pushed, array.length, 0);
+}
 function aggregate(type, array, key) {
 	const length = Array.isArray(array) ? array.length : 0;
 	if (length === 0) return {
@@ -556,6 +950,15 @@ function getString(value) {
 	return asString.startsWith("[object ") ? JSON.stringify(value) : asString;
 }
 /**
+* Join an array of values into a string
+* @param value Array of values
+* @param delimiter Delimiter to use between values
+* @returns Joined string
+*/
+function join(value, delimiter) {
+	return compact(value).map(getString).join(typeof delimiter === "string" ? delimiter : "");
+}
+/**
 * Split a string into words _(and other readable parts)_
 * @param value Original string
 * @returns Array of words found in the string
@@ -659,7 +1062,7 @@ function compareSymbols(first, second) {
 }
 function compareValue(first, second, compareStrings) {
 	const firstType = typeof first;
-	if (firstType === typeof second && firstType in comparators) return comparators[firstType](first, second);
+	if (firstType === typeof second && firstType in comparators$1) return comparators$1[firstType](first, second);
 	if (first instanceof Date && second instanceof Date) return compareNumbers(first.getTime(), second.getTime());
 	return compare.handlers.handle(first, second, compareStrings);
 }
@@ -667,7 +1070,7 @@ function getComparisonParts(value) {
 	if (Array.isArray(value)) return value;
 	return typeof value === "object" ? [value] : words(getString(value));
 }
-var comparators = {
+var comparators$1 = {
 	bigint: compareNumbers,
 	boolean: compareNumbers,
 	number: compareNumbers,
@@ -678,7 +1081,7 @@ function getCallback(value, key, forObject) {
 	if (forObject && typeof value.value === "function") return value.value;
 	return typeof value === "function" ? value : void 0;
 }
-function getKey(value, forObject) {
+function getKey$1(value, forObject) {
 	if (forObject && typeof value.key === "string") return value.key;
 	return typeof value === "string" ? value : void 0;
 }
@@ -694,7 +1097,7 @@ function getSorter(value, modifier) {
 		modifier
 	};
 	sorter.compare = forObject && typeof value.compare === "function" ? value.compare : void 0;
-	sorter.key = getKey(value, forObject);
+	sorter.key = getKey$1(value, forObject);
 	sorter.modifier = getModifier(value, modifier, forObject);
 	sorter.callback = getCallback(value, sorter.key, forObject);
 	if (sorter.key != null || sorter.callback != null) {
@@ -780,7 +1183,7 @@ var DataManager = class {
 	}
 	async add(data, render) {
 		const { field, values } = this;
-		values.objects.array.push(...data);
+		push(values.objects.array, data);
 		values.objects.mapped = toMap(values.objects.array, field);
 		if (render) this.render();
 	}
@@ -793,6 +1196,7 @@ var DataManager = class {
 		values.keys.active = void 0;
 		values.keys.original.length = 0;
 		values.objects.array.length = 0;
+		this.handlers = void 0;
 	}
 	get(active) {
 		const { values } = this;
@@ -816,8 +1220,9 @@ var DataManager = class {
 	render() {
 		const { field, managers, values } = this;
 		values.keys.original = sort(values.objects.array.map((item) => item[field]));
-		if (managers.sort.items.length > 0) managers.sort.sort();
-		else managers.virtualization.update(true);
+		if (Object.keys(managers.filter.items).length > 0) managers.filter.filter();
+		else if (managers.sort.items.length > 0) managers.sort.sort();
+		else managers.render.update(true);
 	}
 	set(data) {
 		const { field, values } = this;
@@ -957,6 +1362,26 @@ function createEventOptions(options) {
 		signal: options?.signal instanceof AbortSignal ? options.signal : void 0
 	};
 }
+/**
+* Get the X- and Y-coordinates from a pointer event
+* @param event Pointer event
+* @returns X- and Y-coordinates
+*/
+function getPosition(event) {
+	let x;
+	let y;
+	if (event instanceof MouseEvent) {
+		x = event.clientX;
+		y = event.clientY;
+	} else if (event instanceof TouchEvent) {
+		x = event.touches[0]?.clientX;
+		y = event.touches[0]?.clientY;
+	}
+	return typeof x === "number" && typeof y === "number" ? {
+		x,
+		y
+	} : void 0;
+}
 function on(target, type, listener, options) {
 	if (!isEventTarget(target) || typeof type !== "string" || typeof listener !== "function") return noop;
 	const extended = createEventOptions(options);
@@ -1156,9 +1581,9 @@ function getSupport() {
 })();
 var EventManager = class {
 	listener;
-	constructor(managers, element) {
+	constructor(element, managers) {
 		this.managers = managers;
-		on(element, "click", (event) => {
+		this.listener = on(element, "click", (event) => {
 			this.onClick(event);
 		}, { passive: false });
 	}
@@ -1172,6 +1597,10 @@ var EventManager = class {
 			case "heading":
 				this.onSort(event, target);
 				break;
+			case "row":
+				this.managers.selection.handle(event, target);
+				break;
+			default: break;
 		}
 	}
 	onSort(event, target) {
@@ -1181,6 +1610,489 @@ var EventManager = class {
 		if (field != null) managers.sort.toggle(event, field, direction);
 	}
 };
+/**
+* Clamp a number between a minimum and maximum value
+* @param value Value to clamp
+* @param minimum Minimum value
+* @param maximum Maximum value
+* @param loop If `true`, the value will loop around when smaller than the minimum or larger than the maximum _(defaults to `false`)_
+* @returns Clamped value
+*/
+function clamp(value, minimum, maximum, loop) {
+	if (![
+		value,
+		minimum,
+		maximum
+	].every(isNumber)) return NaN;
+	if (value < minimum) return loop === true ? maximum : minimum;
+	return value > maximum ? loop === true ? minimum : maximum : value;
+}
+/**
+* Get the number value from an unknown value _(based on Lodash)_
+* @param value Original value
+* @returns Original value as a number, or `NaN` if the value is unable to be parsed
+*/
+function getNumber(value) {
+	if (typeof value === "number") return value;
+	if (typeof value === "bigint" || typeof value === "boolean") return Number(value);
+	if (value == null || typeof value === "symbol") return NaN;
+	if (typeof value === "function") return getNumber(value());
+	let parsed = value.valueOf();
+	if (typeof parsed === "object") parsed = parsed.toString();
+	if (typeof parsed !== "string") return getNumber(parsed);
+	const trimmed = parsed.trim();
+	if (trimmed.length === 0) return NaN;
+	if (EXPRESSION_ZEROISH.test(parsed)) return 0;
+	const isBinary = EXPRESSION_BINARY.test(trimmed);
+	if (isBinary || EXPRESSION_OCTAL.test(trimmed)) return Number.parseInt(trimmed.slice(2), isBinary ? 2 : OCTAL_VALUE);
+	return Number(EXPRESSION_HEX.test(trimmed) ? trimmed : trimmed.replace(EXPRESSION_UNDERSCORE, ""));
+}
+var EXPRESSION_BINARY = /^0b[01]+$/i;
+var EXPRESSION_HEX = /^0x[0-9a-f]+$/i;
+var EXPRESSION_OCTAL = /^0o[0-7]+$/i;
+var EXPRESSION_UNDERSCORE = /_/g;
+var EXPRESSION_ZEROISH = /^\s*0+\s*$/;
+var OCTAL_VALUE = 8;
+function getSizedMaximum(first, second) {
+	let actual;
+	if (typeof first === "number") actual = first;
+	else actual = typeof second === "number" ? second : MAXIMUM_DEFAULT;
+	return clamp(actual, 1, MAXIMUM_ABSOLUTE);
+}
+var MAXIMUM_ABSOLUTE = 16777216;
+var MAXIMUM_DEFAULT = 1048576;
+/**
+* A Map with a maximum size
+*
+* Behavior is similar to a _LRU_-cache, where the least recently used entries are removed
+*/
+var SizedMap = class extends Map {
+	/**
+	* The maximum size of the Map
+	*/
+	#maximumSize;
+	/**
+	* Is the Map full?
+	*/
+	get full() {
+		return this.size >= this.#maximumSize;
+	}
+	get maximum() {
+		return this.#maximumSize;
+	}
+	constructor(first, second) {
+		const maximum = getSizedMaximum(first, second);
+		super();
+		this.#maximumSize = maximum;
+		if (Array.isArray(first)) {
+			const { length } = first;
+			if (length <= maximum) for (let index = 0; index < length; index += 1) this.set(...first[index]);
+			else for (let index = 0; index < maximum; index += 1) this.set(...first[length - maximum + index]);
+		}
+	}
+	/**
+	* @inheritdoc
+	*/
+	get(key) {
+		const value = super.get(key);
+		if (value !== void 0 || this.has(key)) this.set(key, value);
+		return value;
+	}
+	/**
+	* @inheritdoc
+	*/
+	set(key, value) {
+		if (this.has(key)) this.delete(key);
+		else if (this.size >= this.#maximumSize) this.delete(this.keys().next().value);
+		return super.set(key, value);
+	}
+};
+var Memoized = class {
+	#state;
+	/**
+	* Maximum cache size
+	*/
+	get maximum() {
+		return this.#state.cache?.maximum ?? NaN;
+	}
+	/**
+	* Current cache size
+	*/
+	get size() {
+		return this.#state.cache?.size ?? NaN;
+	}
+	constructor(callback, options) {
+		const cache = new SizedMap(options.cacheSize);
+		const getter = (...parameters) => {
+			const key = options.cacheKey?.(...parameters) ?? (parameters.length === 1 ? parameters[0] : join(parameters.map(getString), "_"));
+			if (cache.has(key)) return cache.get(key);
+			const value = callback(...parameters);
+			cache.set(key, value);
+			return value;
+		};
+		this.#state = {
+			cache,
+			getter
+		};
+	}
+	/**
+	* Clear the cache
+	*/
+	clear() {
+		this.#state.cache?.clear();
+	}
+	/**
+	* Delete a result from the cache
+	* @param key Key to delete
+	* @returns `true` if the key existed and was removed, otherwise `false`
+	*/
+	delete(key) {
+		return this.#state.cache?.delete(key) ?? false;
+	}
+	/**
+	* Destroy the instance _(clearing its cache and removing its callback)_
+	*/
+	destroy() {
+		this.#state.cache?.clear();
+		this.#state.cache = void 0;
+		this.#state.getter = void 0;
+	}
+	/**
+	* Get a result from the cache
+	* @param key Key to get
+	* @returns Cached result or `undefined` if it does not exist
+	*/
+	get(key) {
+		return this.#state.cache?.get(key);
+	}
+	/**
+	* Does the result exist?
+	* @param key Key to check
+	* @returns `true` if the result exists, otherwise `false`
+	*/
+	has(key) {
+		return this.#state.cache?.has(key) ?? false;
+	}
+	/**
+	* Run the callback with the provided parameters
+	* @param parameters Parameters to pass to the callback
+	* @returns Cached or computed _(then cached)_ result
+	*/
+	run(...parameters) {
+		if (this.#state.cache == null || this.#state.getter == null) throw new Error("The Memoized instance has been destroyed");
+		return this.#state.getter(...parameters);
+	}
+};
+function getMemoizationOptions(input) {
+	const { cacheKey, cacheSize } = isPlainObject(input) ? input : {};
+	return {
+		cacheKey: typeof cacheKey === "function" ? cacheKey : void 0,
+		cacheSize: typeof cacheSize === "number" && cacheSize > 0 ? cacheSize : DEFAULT_CACHE_SIZE
+	};
+}
+/**
+* Memoize a function, caching and retrieving results based on the first parameter
+* @param callback Callback to memoize
+* @param options Memoization options
+* @returns Memoized instance
+*/
+function memoize(callback, options) {
+	return new Memoized(callback, getMemoizationOptions(options));
+}
+var DEFAULT_CACHE_SIZE = 1024;
+/**
+* Check if a string ends with a specified substring
+* @param haystack String to look in
+* @param needle String to look for
+* @param ignoreCase Ignore case when matching? _(defaults to `false`)_
+* @returns `true` if the string ends with the given substring, otherwise `false`
+*/
+function endsWith(haystack, needle, ignoreCase) {
+	return match("endsWith", haystack, needle, ignoreCase === true);
+}
+/**
+* Check if a string includes a specified substring
+* @param haystack String to look in
+* @param needle String to look for
+* @param ignoreCase Ignore case when matching? _(defaults to `false`)_
+* @returns `true` if the string includes the given substring, otherwise `false`
+*/
+function includes(haystack, needle, ignoreCase) {
+	return match("includes", haystack, needle, ignoreCase === true);
+}
+function match(type, haystack, needle, ignoreCase) {
+	if (typeof haystack !== "string" || typeof needle !== "string") return false;
+	matchMemoizers[type] ??= memoize(matchCallback.bind(type));
+	return matchMemoizers[type].run(haystack, needle, ignoreCase);
+}
+function matchCallback(haystack, needle, ignoreCase) {
+	return (ignoreCase ? haystack.toLocaleLowerCase() : haystack)[this](ignoreCase ? needle.toLocaleLowerCase() : needle);
+}
+/**
+* Check if a string starts with a specified substring
+* @param haystack String to look in
+* @param needle String to look for
+* @param ignoreCase Ignore case when matching? _(defaults to `false`)_
+* @returns `true` if the string starts with the given substring, otherwise `false`
+*/
+function startsWith(haystack, needle, ignoreCase) {
+	return match("startsWith", haystack, needle, ignoreCase === true);
+}
+var matchMemoizers = {};
+function equal(first, second, options) {
+	return equalValue(first, second, getEqualOptions(options));
+}
+equal.handlers = getCompareHandlers(equal, { callback: Object.is });
+equal.initialize = initializeEqualizer;
+equal.register = registerEqualizer;
+equal.unregister = unregisterEqualizer;
+function equalArray(first, second, options) {
+	const { length } = first;
+	if (length !== second.length) return false;
+	let offset = 0;
+	if (length >= ARRAY_THRESHOLD) {
+		offset = Math.round(length / ARRAY_PEEK_PERCENTAGE);
+		offset = offset > ARRAY_THRESHOLD ? ARRAY_THRESHOLD : offset;
+		for (let index = 0; index < offset; index += 1) if (!(equalValue(first[index], second[index], options) && equalValue(first[length - index - 1], second[length - index - 1], options))) return false;
+	}
+	const firstChunks = chunk(first.slice(offset, length - offset), ARRAY_THRESHOLD);
+	const secondChunks = chunk(second.slice(offset, length - offset), ARRAY_THRESHOLD);
+	const chunksLength = firstChunks.length;
+	for (let chunkIndex = 0; chunkIndex < chunksLength; chunkIndex += 1) {
+		const firstChunk = firstChunks[chunkIndex];
+		const secondChunk = secondChunks[chunkIndex];
+		const chunkLength = firstChunk.length;
+		for (let index = 0; index < chunkLength; index += 1) if (!equalValue(firstChunk[index], secondChunk[index], options)) return false;
+	}
+	return true;
+}
+function equalArrayBuffer(first, second, options) {
+	return first.byteLength === second.byteLength ? equalArray(new Uint8Array(first), new Uint8Array(second), options) : false;
+}
+function equalDataView(first, second, options) {
+	return first.byteOffset === second.byteOffset ? equalArrayBuffer(first.buffer, second.buffer, options) : false;
+}
+function equalMap(first, second, options) {
+	const { size } = first;
+	if (size !== second.size) return false;
+	const firstKeys = [...first.keys()];
+	const secondKeys = [...second.keys()];
+	if (firstKeys.some((key) => !secondKeys.includes(key))) return false;
+	for (let index = 0; index < size; index += 1) {
+		const key = firstKeys[index];
+		if (!equalValue(first.get(key), second.get(key), options)) return false;
+	}
+	return true;
+}
+function equalPlainObject(first, second, options) {
+	let firstKeys = [...Object.keys(first), ...Object.getOwnPropertySymbols(first)];
+	let secondKeys = [...Object.keys(second), ...Object.getOwnPropertySymbols(second)];
+	if (options.ignoreKeys.enabled || options.ignoreExpressions.enabled) {
+		firstKeys = firstKeys.filter((key) => filterKey(key, options));
+		secondKeys = secondKeys.filter((key) => filterKey(key, options));
+	}
+	const { length } = firstKeys;
+	if (length !== secondKeys.length || firstKeys.some((key) => !secondKeys.includes(key))) return false;
+	for (let index = 0; index < length; index += 1) {
+		const key = firstKeys[index];
+		if (!equalValue(first[key], second[key], options)) return false;
+	}
+	return true;
+}
+function equalProperties(first, second, properties, options) {
+	const { length } = properties;
+	for (let index = 0; index < length; index += 1) {
+		const property = properties[index];
+		if (!equalValue(first[property], second[property], options)) return false;
+	}
+	return true;
+}
+function equalSet(first, second, options) {
+	const { size } = first;
+	if (size !== second.size) return false;
+	const firstValues = [...first];
+	const secondValues = [...second];
+	for (let index = 0; index < size; index += 1) {
+		const firstValue = firstValues[index];
+		if (!secondValues.some((secondValue) => equalValue(firstValue, secondValue, options))) return false;
+	}
+	return true;
+}
+function equalTypedArray(first, second) {
+	if (first.constructor !== second.constructor) return false;
+	if (first.byteLength !== second.byteLength) return false;
+	const { length } = first;
+	for (let index = 0; index < length; index += 1) if (first[index] !== second[index]) return false;
+	return true;
+}
+function equalValue(first, second, options) {
+	if (options.relaxedNullish && first == null && second == null) return true;
+	switch (true) {
+		case Object.is(first, second): return true;
+		case first == null || second == null: return first === second;
+		case typeof first !== typeof second: return false;
+		case typeof first === "string" && options.ignoreCase === true: return Object.is(first.toLocaleLowerCase(), second.toLocaleLowerCase());
+		case first instanceof ArrayBuffer && second instanceof ArrayBuffer: return equalArrayBuffer(first, second, options);
+		case first instanceof Date && second instanceof Date: return Object.is(Number(first), Number(second));
+		case first instanceof DataView && second instanceof DataView: return equalDataView(first, second, options);
+		case first instanceof Error && second instanceof Error: return equalProperties(first, second, ["name", "message"], options);
+		case first instanceof Map && second instanceof Map: return equalMap(first, second, options);
+		case first instanceof RegExp && second instanceof RegExp: return equalProperties(first, second, ["source", "flags"], options);
+		case first instanceof Set && second instanceof Set: return equalSet(first, second, options);
+		case Array.isArray(first) && Array.isArray(second): return equalArray(first, second, options);
+		case isPlainObject(first) && isPlainObject(second): return equalPlainObject(first, second, options);
+		case isTypedArray(first) && isTypedArray(second): return equalTypedArray(first, second);
+		default: return equal.handlers.handle(first, second, options);
+	}
+}
+/**
+* Create an equalizer with predefined options
+* @param options Comparison options
+* @returns Equalizer function
+*/
+function initializeEqualizer(options) {
+	const actual = getEqualOptions(options);
+	const equalizer = (first, second) => equalValue(first, second, actual);
+	equalizer.register = registerEqualizer;
+	equalizer.unregister = unregisterEqualizer;
+	return equalizer;
+}
+/**
+* Register a equality comparison function for a specific class
+* @param constructor Class constructor
+* @param fn Comparison function
+*/
+function registerEqualizer(constructor, handler) {
+	equal.handlers.register(constructor, handler);
+}
+/**
+* Unregister a equality comparison handler for a specific class
+* @param constructor Class constructor
+*/
+function unregisterEqualizer(constructor) {
+	equal.handlers.unregister(constructor);
+}
+function filterKey(key, options) {
+	if (typeof key !== "string") return true;
+	if (options.ignoreExpressions.enabled && options.ignoreExpressions.values.some((expression) => expression.test(key))) return false;
+	if (options.ignoreKeys.enabled && options.ignoreKeys.values.has(key)) return false;
+	return true;
+}
+function getEqualOptions(input) {
+	const options = {
+		ignoreCase: false,
+		ignoreExpressions: {
+			enabled: false,
+			values: []
+		},
+		ignoreKeys: {
+			enabled: false,
+			values: /* @__PURE__ */ new Set()
+		},
+		relaxedNullish: false
+	};
+	if (typeof input === "boolean") {
+		options.ignoreCase = input;
+		return options;
+	}
+	if (!isPlainObject(input)) return options;
+	options.ignoreCase = typeof input.ignoreCase === "boolean" ? input.ignoreCase : false;
+	options.ignoreExpressions.values = (Array.isArray(input.ignoreKeys) ? input.ignoreKeys : [input.ignoreKeys]).filter((key) => key instanceof RegExp);
+	options.ignoreKeys.values = new Set((Array.isArray(input.ignoreKeys) ? input.ignoreKeys : [input.ignoreKeys]).filter((key) => typeof key === "string"));
+	options.ignoreExpressions.enabled = options.ignoreExpressions.values.length > 0;
+	options.ignoreKeys.enabled = options.ignoreKeys.values.size > 0;
+	options.relaxedNullish = input.relaxedNullish === true;
+	return options;
+}
+var ARRAY_PEEK_PERCENTAGE = 10;
+var ARRAY_THRESHOLD = 100;
+var FilterManager = class {
+	handlers = Object.freeze({
+		add: (item) => this.add(item),
+		clear: () => this.clear(),
+		remove: (value) => this.remove(value),
+		set: (items) => this.set(items)
+	});
+	items = {};
+	constructor(managers) {
+		this.managers = managers;
+	}
+	add(item) {
+		if (this.items[item.field] == null) this.items[item.field] = [];
+		else if (this.items[item.field].findIndex((existing) => equal(existing, item)) !== -1) return;
+		this.items[item.field].push(item);
+		this.filter();
+	}
+	clear() {
+		if (Object.keys(this.items).length > 0) {
+			this.items = {};
+			this.filter();
+		}
+	}
+	destroy() {
+		this.handlers = void 0;
+		this.items = {};
+	}
+	filter() {
+		const { managers } = this;
+		const filtered = [];
+		const filters = Object.entries(this.items);
+		const keysLength = managers.data.values.keys.original.length;
+		rowLoop: for (let keyIndex = 0; keyIndex < keysLength; keyIndex += 1) {
+			const key = managers.data.values.keys.original[keyIndex];
+			const row = managers.data.values.objects.mapped.get(key);
+			if (row == null) continue;
+			filterLoop: for (let filterIndex = 0; filterIndex < filters.length; filterIndex += 1) {
+				const [field, items] = filters[filterIndex];
+				const value = row[field];
+				for (let itemIndex = 0; itemIndex < items.length; itemIndex += 1) {
+					const filter = items[itemIndex];
+					if (comparators[filter.comparison](value, filter.value)) continue filterLoop;
+				}
+				continue rowLoop;
+			}
+			filtered.push(key);
+		}
+		managers.data.values.keys.active = filtered;
+		if (managers.sort.items.length > 0) managers.sort.sort();
+		else managers.render.update(true, true);
+	}
+	remove(value) {
+		if (typeof value === "string") {
+			if (this.items[value] == null) return;
+			this.items = {};
+		} else {
+			const { field } = value;
+			if (this.items[field] == null) return;
+			if (this.items[field].findIndex((item) => equal(item, value)) === -1) return;
+		}
+		this.filter();
+	}
+	set(items) {
+		const keyed = {};
+		const { length } = items;
+		for (let index = 0; index < length; index += 1) {
+			const item = items[index];
+			keyed[item.field] ??= [];
+			keyed[item.field].push(item);
+		}
+		this.items = keyed;
+		this.filter();
+	}
+};
+const comparators = {
+	contains: (row, filter) => includes(getString(row), getString(filter), true),
+	"ends-with": (row, filter) => endsWith(getString(row), getString(filter), true),
+	equals: (row, filter) => equalizer(row, filter),
+	"greater-than": (row, filter) => getNumber(row) > getNumber(filter),
+	"greater-than-or-equal": (row, filter) => getNumber(row) >= getNumber(filter),
+	"less-than": (row, filter) => getNumber(row) < getNumber(filter),
+	"less-than-or-equal": (row, filter) => getNumber(row) <= getNumber(filter),
+	"not-contains": (row, filter) => !includes(getString(row), getString(filter), true),
+	"not-equals": (row, filter) => !equalizer(row, filter),
+	"starts-with": (row, filter) => startsWith(getString(row), getString(filter), true)
+};
+const equalizer = equal.initialize({ ignoreCase: true });
 function removeRow(pool, row) {
 	if (row.element != null) {
 		row.element.innerHTML = "";
@@ -1191,18 +2103,26 @@ function removeRow(pool, row) {
 	row.cells = {};
 }
 function renderRow(managers, row) {
-	const element = row.element ?? managers.virtualization.pool.rows.shift() ?? createRow();
+	const element = row.element ?? managers.render.pool.rows.shift() ?? createRow();
 	row.element = element;
-	element.dataset.key = String(row.key);
 	element.innerHTML = "";
+	const selected = managers.selection.items.has(row.key);
+	setAttributes(element, {
+		"aria-selected": String(selected),
+		"data-event": "row",
+		"data-key": String(row.key)
+	});
+	element.classList.add("tabela__row--body");
+	if (selected) element.classList.add("tabela__row--selected");
+	else element.classList.remove("tabela__row--selected");
 	const columns = managers.column.items;
 	const { length } = columns;
 	const data = managers.data.values.objects.mapped.get(row.key);
 	if (data == null) return;
 	for (let index = 0; index < length; index += 1) {
 		const { options } = columns[index];
-		managers.virtualization.pool.cells[options.field] ??= [];
-		const cell = managers.virtualization.pool.cells[columns[index].options.field].shift() ?? createCell(options.width);
+		managers.render.pool.cells[options.field] ??= [];
+		const cell = managers.render.pool.cells[columns[index].options.field].shift() ?? createCell(options.width);
 		cell.textContent = String(data[options.field]);
 		row.cells[options.field] = cell;
 		element.append(cell);
@@ -1223,6 +2143,9 @@ var RowManager = class {
 		this.height = rowHeight;
 	}
 	destroy() {
+		const components = [...this.components.values()];
+		const { length } = components;
+		for (let index = 0; index < length; index += 1) removeRow(this.managers.render.pool, components[index]);
 		this.components.clear();
 	}
 	get(key) {
@@ -1237,13 +2160,210 @@ var RowManager = class {
 		return this.components.has(key);
 	}
 	remove(key) {
-		this.components.delete(key);
+		const row = this.components.get(key);
+		if (row != null) {
+			removeRow(this.managers.render.pool, row);
+			this.components.delete(key);
+		}
 	}
 	update(key) {
 		const row = this.components.get(key);
 		if (row != null) renderRow(this.managers, row);
 	}
 };
+function getKey(value) {
+	if (typeof value === "number") return value;
+	if (typeof value !== "string") return;
+	return integerExpression.test(value) ? Number.parseInt(value, 10) : value;
+}
+const integerExpression = /^\d+$/;
+const dragStyling = toggleStyles(document.body, {
+	userSelect: "none",
+	webkitUserSelect: "none"
+});
+var SelectionManager = class {
+	handlers = Object.freeze({
+		clear: () => this.clear(),
+		deselect: (keys) => this.deselect(keys),
+		select: (keys) => this.select(keys),
+		toggle: () => this.toggle()
+	});
+	items = /* @__PURE__ */ new Set();
+	last;
+	constructor(element, managers) {
+		this.element = element;
+		this.managers = managers;
+		mapped.set(element, this);
+	}
+	clear() {
+		if (this.items.size === 0) return;
+		const removed = [...this.items];
+		this.items.clear();
+		this.update(removed);
+	}
+	deselect(keys) {
+		const { length } = keys;
+		const removed = [];
+		for (let index = 0; index < length; index += 1) {
+			const key = keys[index];
+			if (this.items.delete(key)) removed.push(key);
+		}
+		if (removed.length > 0) this.update(removed);
+	}
+	destroy() {
+		mapped.delete(this.element);
+		this.handlers = void 0;
+		this.element = void 0;
+		this.items = void 0;
+	}
+	handle(event, target) {
+		const key = getKey(target.getAttribute("data-key"));
+		if (key == null) return;
+		const { items } = this;
+		if (event.shiftKey) {
+			if (this.last == null) {
+				this.last = key;
+				return;
+			}
+			this.range(this.last, key);
+			this.last = key;
+			return;
+		}
+		this.last = key;
+		if (event.ctrlKey || event.metaKey) {
+			if (items.has(key)) this.deselect([key]);
+			else this.select([key]);
+			return;
+		}
+		if (items.has(key)) if (items.size === 1) this.clear();
+		else this.set([key]);
+		else this.set([key]);
+	}
+	range(from, to) {
+		const keyed = isKey(from) && isKey(to);
+		const fromKey = keyed ? from : getKey(from.getAttribute("data-key"));
+		const toKey = keyed ? to : getKey(to.getAttribute("data-key"));
+		if (fromKey === toKey) return;
+		const keys = this.managers.data.values.keys.active ?? this.managers.data.values.keys.original;
+		const fromIndex = keys.indexOf(fromKey);
+		const toIndex = keys.indexOf(toKey);
+		if (fromIndex === -1 || toIndex === -1) return;
+		const [start, end] = fromIndex < toIndex ? [fromIndex, toIndex] : [toIndex, fromIndex];
+		const selected = [];
+		for (let index = start; index <= end; index += 1) selected.push(keys[index]);
+		if (keyed) this.select(selected);
+		else this.set(selected);
+	}
+	select(keys) {
+		const { length } = keys;
+		let update = false;
+		for (let index = 0; index < length; index += 1) {
+			const key = keys[index];
+			if (!this.items.has(key)) {
+				this.items.add(key);
+				update = true;
+			}
+		}
+		if (update) this.update([]);
+	}
+	set(keys) {
+		const { items } = this;
+		const removed = [...items].filter((key) => !keys.includes(key));
+		const added = keys.filter((key) => !items.has(key));
+		if (removed.length === 0 && added.length === 0) return;
+		this.items = new Set(keys);
+		this.update(removed);
+	}
+	toggle() {
+		const { items, managers } = this;
+		const all = managers.data.values.keys.active ?? managers.data.values.keys.original;
+		if (items.size === all.length) this.clear();
+		else this.select(all);
+	}
+	update(removed) {
+		const items = [...removed.map((key) => ({
+			key,
+			removed: true
+		})), ...[...this.items].map((key) => ({
+			key,
+			removed: false
+		}))];
+		const { length } = items;
+		for (let index = 0; index < length; index += 1) {
+			const { key, removed } = items[index];
+			const row = this.managers.row.get(key);
+			if (row == null || row.element == null) continue;
+			setAttribute(row.element, "aria-selected", String(!removed));
+			if (removed) row.element.classList.remove("tabela__row--selected");
+			else row.element.classList.add("tabela__row--selected");
+		}
+	}
+};
+function getPlaceholder() {
+	placeholder ??= createElement("div", { className: "tabela__selection--placeholder" }, {}, {});
+	return placeholder;
+}
+function onMouseDown(event) {
+	if (shifted) {
+		const row = findAncestor(event.target, ".tabela__row--body");
+		if (!(row instanceof HTMLElement)) return;
+		startElement = row;
+		startPosition = getPosition(event);
+		dragStyling.set();
+	}
+}
+function onMouseMove(event) {
+	if (startElement == null) return;
+	const currentPosition = getPosition(event);
+	if (currentPosition == null || startPosition == null) return;
+	const element = getPlaceholder();
+	if (element.parentElement == null) document.body.append(element);
+	const { x: cX, y: cY } = currentPosition;
+	const { x: sX, y: sY } = startPosition;
+	const top = Math.min(cY, sY);
+	const left = Math.min(cX, sX);
+	const width = Math.abs(cX - sX);
+	const height = Math.abs(cY - sY);
+	element.style.inset = `${top}px ${window.innerWidth - left - width}px ${window.innerHeight - top - height}px ${left}px`;
+}
+function onMouseUp(event) {
+	if (startElement == null) return;
+	if (!event.shiftKey) {
+		shifted = false;
+		dragStyling.remove();
+	}
+	getPlaceholder().remove();
+	const row = findAncestor(event.target, ".tabela__row--body");
+	if (row instanceof HTMLElement) {
+		endElement = row;
+		const endTable = findAncestor(endElement, ".tabela");
+		const startTable = findAncestor(startElement, ".tabela");
+		if (startTable != null && startTable === endTable) mapped.get(startTable)?.range(startElement, endElement);
+	}
+	endElement = void 0;
+	startElement = void 0;
+	startPosition = void 0;
+}
+function onShift(event, value) {
+	if (event.key === "Shift") shifted = value;
+}
+function onShiftDown(event) {
+	onShift(event, true);
+}
+function onShiftUp(event) {
+	onShift(event, false);
+}
+const mapped = /* @__PURE__ */ new WeakMap();
+let shifted = false;
+let endElement;
+let placeholder;
+let startPosition;
+let startElement;
+on(document, "keydown", onShiftDown);
+on(document, "keyup", onShiftUp);
+on(document, "mousedown", onMouseDown);
+on(document, "mousemove", onMouseMove);
+on(document, "mouseup", onMouseUp);
 var SortManager = class {
 	handlers = Object.freeze({
 		add: (field, direction) => this.add(field, direction),
@@ -1267,13 +2387,19 @@ var SortManager = class {
 	addOrSet(event, field) {
 		if (event.ctrlKey || event.metaKey) this.add(field);
 		else this.set([{
-			key: field,
+			field,
 			direction: "ascending"
 		}]);
 	}
 	clear() {
+		if (this.items.length > 0) {
+			this.items.length = 0;
+			this.sort();
+		}
+	}
+	destroy() {
+		this.handlers = void 0;
 		this.items.length = 0;
-		this.sort();
 	}
 	flip(field) {
 		const item = this.items.find((item) => item.key === field);
@@ -1293,14 +2419,17 @@ var SortManager = class {
 		else this.clear();
 	}
 	set(items) {
-		this.items.splice(0, this.items.length, ...items);
+		this.items.splice(0, this.items.length, ...items.map((item) => ({
+			key: item.field,
+			direction: item.direction
+		})));
 		this.sort();
 	}
 	sort() {
 		const { items, managers } = this;
-		managers.data.values.keys.active = items.length === 0 ? void 0 : sort(managers.data.values.objects.array, items).map((row) => row[managers.data.field]);
-		managers.virtualization.update(true, true);
-		for (const column of managers.column.items) {
+		const { length } = managers.column.items;
+		for (let index = 0; index < length; index += 1) {
+			const column = managers.column.items[index];
 			const sorterIndex = items.findIndex((item) => item.key === column.options.field);
 			const sorterItem = items[sorterIndex];
 			setAttributes(column.elements.wrapper, {
@@ -1309,6 +2438,8 @@ var SortManager = class {
 			});
 			setAttribute(column.elements.sorter, "data-sort-position", sorterIndex > -1 && items.length > 1 ? sorterIndex + 1 : void 0);
 		}
+		managers.data.values.keys.active = items.length === 0 ? void 0 : sort(managers.data.values.keys.active?.map((key) => managers.data.values.objects.mapped.get(key)) ?? managers.data.values.objects.array, items).map((row) => row[managers.data.field]);
+		managers.render.update(true, true);
 	}
 	toggle(event, field, direction) {
 		switch (direction) {
@@ -1328,12 +2459,12 @@ function getRange(down) {
 	const { components, managers } = this;
 	const { clientHeight, scrollTop } = components.body.elements.group;
 	const first = Math.floor(scrollTop / managers.row.height);
-	const last = Math.min(managers.data.values.keys.active?.length ?? managers.data.values.keys.original.length - 1, Math.ceil((scrollTop + clientHeight) / managers.row.height) - 1);
+	const last = Math.min((managers.data.values.keys.active?.length ?? managers.data.values.keys.original.length) - 1, Math.ceil((scrollTop + clientHeight) / managers.row.height) - 1);
 	const before = Math.ceil(clientHeight / managers.row.height) * (down ? 1 : 2);
 	const after = Math.ceil(clientHeight / managers.row.height) * (down ? 2 : 1);
 	const start = Math.max(0, first - before);
 	return {
-		end: Math.min(managers.data.values.keys.active?.length ?? managers.data.values.keys.original.length - 1, last + after),
+		end: Math.min((managers.data.values.keys.active?.length ?? managers.data.values.keys.original.length) - 1, last + after),
 		start
 	};
 }
@@ -1348,7 +2479,7 @@ function onScroll() {
 		this.state.active = true;
 	}
 }
-var VirtualizationManager = class {
+var RenderManager = class {
 	fragment;
 	listener;
 	pool = {
@@ -1366,21 +2497,26 @@ var VirtualizationManager = class {
 		this.listener = on(components.body.elements.group, "scroll", onScroll.bind(this));
 	}
 	destroy() {
-		this.listener();
-		for (const [index, row] of this.visible) {
-			removeRow(this.pool, row);
-			this.visible.delete(index);
-		}
-		this.pool.cells = {};
-		this.pool.rows = [];
+		const { listener, pool, visible } = this;
+		listener();
+		visible.clear();
+		pool.cells = {};
+		pool.rows = [];
+		this.listener = void 0;
+		this.visible = void 0;
 	}
 	removeCells(fields) {
+		const { managers, pool, visible } = this;
 		const { length } = fields;
-		for (let index = 0; index < length; index += 1) delete this.pool.cells[fields[index]];
-		for (const [, row] of this.visible) for (let index = 0; index < length; index += 1) {
-			row.cells[fields[index]].innerHTML = "";
-			row.cells[fields[index]].remove();
-			delete row.cells[fields[index]];
+		for (let index = 0; index < length; index += 1) delete pool.cells[fields[index]];
+		for (const [, key] of visible) {
+			const row = managers.row.get(key);
+			if (row == null || row.element == null) continue;
+			for (let index = 0; index < length; index += 1) {
+				row.cells[fields[index]].innerHTML = "";
+				row.cells[fields[index]].remove();
+				delete row.cells[fields[index]];
+			}
 		}
 	}
 	getFragment() {
@@ -1395,11 +2531,11 @@ var VirtualizationManager = class {
 		const range = getRange.call(this, down);
 		for (let index = range.start; index <= range.end; index += 1) indices.add(index);
 		let remove = rerender ?? false;
-		for (const [index, row] of visible) {
-			if (!managers.row.has(row.key) || !indices.has(index)) remove = true;
-			if (remove) {
+		for (const [index, key] of visible) {
+			const row = managers.row.get(key);
+			if (remove || row == null || !indices.has(index)) {
 				visible.delete(index);
-				removeRow(pool, row);
+				if (row != null) removeRow(pool, row);
 			}
 		}
 		const fragment = this.getFragment();
@@ -1407,11 +2543,12 @@ var VirtualizationManager = class {
 		let count = 0;
 		for (let index = range.start; index <= range.end; index += 1) {
 			if (visible.has(index)) continue;
-			const row = managers.row.get(keys[index]);
+			const key = keys[index];
+			const row = managers.row.get(key);
 			if (row == null) continue;
 			count += 1;
 			renderRow(managers, row);
-			visible.set(index, row);
+			visible.set(index, key);
 			if (row.element != null) {
 				row.element.style.transform = `translateY(${index * managers.row.height}px)`;
 				fragment.append(row.element);
@@ -1432,11 +2569,15 @@ var Tabela = class {
 		column: void 0,
 		data: void 0,
 		event: void 0,
+		filter: void 0,
+		render: void 0,
 		row: void 0,
-		sort: void 0,
-		virtualization: void 0
+		selection: void 0,
+		sort: void 0
 	};
 	data;
+	filter;
+	selection;
 	sort;
 	get key() {
 		return this.#key;
@@ -1453,13 +2594,17 @@ var Tabela = class {
 		this.#components.footer = new FooterComponent();
 		this.#managers.column = new ColumnManager(this.#managers, this.#components, options.columns);
 		this.#managers.data = new DataManager(this.#managers, this.#components, options.key);
-		this.#managers.event = new EventManager(this.#managers, this.#element);
+		this.#managers.event = new EventManager(this.#element, this.#managers);
+		this.#managers.filter = new FilterManager(this.#managers);
+		this.#managers.render = new RenderManager(this.#managers, this.#components);
 		this.#managers.row = new RowManager(this.#managers, options.rowHeight);
+		this.#managers.selection = new SelectionManager(this.#element, this.#managers);
 		this.#managers.sort = new SortManager(this.#managers);
-		this.#managers.virtualization = new VirtualizationManager(this.#managers, this.#components);
 		element.append(this.#components.header.elements.group, this.#components.body.elements.group, this.#components.footer.elements.group);
 		this.#managers.data.set(options.data);
 		this.data = this.#managers.data.handlers;
+		this.filter = this.#managers.filter.handlers;
+		this.selection = this.#managers.selection.handlers;
 		this.sort = this.#managers.sort.handlers;
 	}
 	destroy() {
@@ -1471,8 +2616,11 @@ var Tabela = class {
 		components.header.destroy();
 		managers.column.destroy();
 		managers.data.destroy();
+		managers.event.destroy();
+		managers.filter.destroy();
+		managers.render.destroy();
 		managers.row.destroy();
-		managers.virtualization.destroy();
+		managers.sort.destroy();
 		element.innerHTML = "";
 		element.role = "";
 		element.classList.remove("tabela");