@oscarpalmer/tabela 0.14.0 → 0.15.0

package/dist/managers/style.manager.mjs

@@ -0,0 +1,181 @@
+import { CSS_BUTTON, CSS_CELL, CSS_CELL_FOOTER, CSS_CELL_GROUP, CSS_HEADING, CSS_HEADING_CONTENT, CSS_HEADING_SORTER, CSS_ROW, CSS_ROWGROUP_BODY, CSS_ROWGROUP_FOOTER, CSS_ROWGROUP_HEADER, CSS_ROW_SELECTED, CSS_SELECTION, CSS_TABLE, CSS_WRAPPER } from "../models/style.model.mjs";
+//#region src/managers/style.manager.ts
+var StyleManager = class {
+	constructor(state) {
+		this.state = state;
+		if (appended) return;
+		appended = true;
+		const style = document.createElement("style");
+		style.textContent = styling;
+		document.head.appendChild(style);
+	}
+};
+const styling = `/** Table */
+
+:where(.${CSS_WRAPPER}) {
+	flex: 1;
+	position: relative;
+	background-color: var(--oui-absolute);
+	border: 1px solid grey;
+}
+
+:where(.${CSS_TABLE}) {
+	min-height: 24em;
+	display: flex;
+	flex-flow: column nowrap;
+	flex: 1;
+	overflow: auto;
+	position: absolute;
+	inset: 0;
+}
+
+/** Row group */
+
+:where(.${CSS_ROWGROUP_HEADER}),
+:where(.${CSS_ROWGROUP_FOOTER}) {
+	background-color: white;
+	position: sticky;
+	left: 0;
+	z-index: 10;
+}
+
+:where(.${CSS_ROWGROUP_HEADER}) {
+	top: 0;
+}
+
+:where(.${CSS_ROWGROUP_FOOTER}) {
+	bottom: 0;
+}
+
+:where(.${CSS_ROWGROUP_BODY}) {
+	display: flex;
+	flex-flow: column nowrap;
+	flex: 1;
+}
+
+:where(.${CSS_ROWGROUP_BODY}:focus) {
+	outline: none;
+}
+
+:where(.${CSS_WRAPPER}:has(.${CSS_ROWGROUP_BODY}:focus-visible)) {
+	outline: 2px solid var(--oui-blue-6);
+	outline-offset: 2px;
+}
+
+/** Row */
+
+:where(.${CSS_ROW}) {
+	width: 100%;
+	display: flex;
+	flex-flow: row nowrap;
+}
+
+:where(.${CSS_ROW}:last-child .${CSS_CELL}) {
+	border-bottom-width: 0;
+}
+
+:where(.${CSS_ROW}--body),
+:where(.${CSS_ROW}--group) {
+	flex: 1;
+	position: absolute;
+}
+
+:where(.${CSS_ROW_SELECTED}) {
+	background-color: var(--oui-blue-1);
+	color: var(--oui-blue-9);
+}
+
+:where(.${CSS_WRAPPER}:has(.${CSS_ROWGROUP_BODY}:focus-visible) .${CSS_ROW}[data-active="true"]) {
+	outline: 2px solid var(--oui-blue-6);
+	outline-offset: 2px;
+}
+
+/** Cells */
+
+:where(.${CSS_CELL}),
+:where(.${CSS_HEADING}) {
+	padding: 0.5em;
+	border-color: gray;
+	border-style: solid;
+	border-width: 0 1px 1px 0;
+	line-height: 1;
+}
+
+:where(.${CSS_WRAPPER} .${CSS_CELL}:last-child),
+:where(.${CSS_ROW} .${CSS_HEADING}:last-child) {
+	flex: 1;
+	border-right-width: 0;
+}
+
+:where(.${CSS_CELL}) {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+:where(.${CSS_HEADING}) {
+	display: flex;
+	flex-flow: row nowrap;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5em;
+	cursor: pointer;
+}
+
+:where(.${CSS_HEADING_CONTENT}) {
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+
+:where(.${CSS_HEADING}[data-sort-direction] .${CSS_HEADING_SORTER})::after {
+	width: 1em;
+	height: 1em;
+	display: inline-flex;
+	font-size: .75em;
+	font-weight: bold;
+}
+
+:where(.${CSS_HEADING}[data-sort-direction="ascending"] .${CSS_HEADING_SORTER})::after {
+	content: '\\21C8';
+}
+
+:where(.${CSS_HEADING}[data-sort-direction="descending"] .${CSS_HEADING_SORTER})::after {
+	content: '\\21CA';
+}
+
+:where(.${CSS_CELL_FOOTER}) {
+	border-top-width: 1px;
+	border-bottom-width: 0;
+}
+
+:where(.${CSS_CELL_GROUP}) {
+	padding: 0;
+	display: flex;
+	flex-flow: row nowrap;
+	align-items: center;
+	gap: 0.5em;
+}
+
+:where(.${CSS_CELL_GROUP} .${CSS_BUTTON}) {
+	margin: 0 0 0 .25rem;
+}
+
+/** Misc. */
+
+:where(.${CSS_BUTTON}) {
+	font-size: .75rem;
+	font-weight: bold;
+}
+
+:where(.${CSS_SELECTION}) {
+	background-color: color-mix(in oklch, var(--oui-blue-6), transparent);
+	border: 1px solid var(--oui-blue-6);
+	border-radius: .25rem;
+	position: fixed;
+	z-index: 1000;
+}
+`.replace(/^\s+|\s+|\s+$/g, " ");
+let appended = false;
+//#endregion
+export { StyleManager };

package/dist/models/body.model.d.mts

@@ -0,0 +1,7 @@
+//#region src/models/body.model.d.ts
+type BodyElements = {
+  faker: HTMLDivElement;
+  group: HTMLDivElement;
+};
+//#endregion
+export { BodyElements };

package/dist/models/body.model.mjs

@@ -0,0 +1 @@
+export {};

package/dist/models/column.model.d.mts

@@ -0,0 +1,13 @@
+//#region src/models/column.model.d.ts
+type Column = {
+  key: string;
+  label: string;
+  width: number;
+};
+type TabelaColumn = {
+  key: string;
+  label: string;
+  width?: number;
+};
+//#endregion
+export { Column, TabelaColumn };

package/dist/models/column.model.mjs

@@ -0,0 +1 @@
+export {};

package/dist/models/data.model.d.mts

@@ -0,0 +1,28 @@
+import { State } from "./tabela.model.mjs";
+import { Key, PlainObject } from "@oscarpalmer/atoms/models";
+
+//#region src/models/data.model.d.ts
+type DataKeys = {
+  active?: Key[];
+  original: Key[];
+};
+type DataState = {
+  keys: DataKeys;
+  values: DataValues;
+} & State;
+type DataValue = string | PlainObject;
+type DataValues = {
+  array: DataValue[];
+  mapped: Map<Key, PlainObject>;
+};
+type TabelaData = {
+  add(data: PlainObject[]): Promise<void>;
+  clear(): Promise<void>;
+  get(active?: boolean): PlainObject[];
+  remove(keys: Key[]): Promise<void>;
+  remove(data: PlainObject[]): Promise<void>;
+  synchronize(data: PlainObject[], remove?: boolean): Promise<void>;
+  update(data: PlainObject[]): Promise<void>;
+};
+//#endregion
+export { DataState, DataValue, TabelaData };

package/dist/models/data.model.mjs

@@ -0,0 +1 @@
+export {};

package/dist/models/dom.model.d.mts

@@ -0,0 +1,19 @@
+//#region src/models/dom.model.d.ts
+declare const ARIA_ACTIVEDESCENDANT = "aria-activedescendant";
+declare const ARIA_LABEL = "aria-label";
+declare const ARIA_SELECTED = "aria-selected";
+declare const ARIA_SORT = "aria-sort";
+declare const ATTRIBUTE_DATA_ACTIVE = "data-active";
+declare const ATTRIBUTE_DATA_EVENT = "data-event";
+declare const ATTRIBUTE_DATA_KEY = "data-key";
+declare const ATTRIBUTE_DATA_SORT_DIRECTION = "data-sort-direction";
+declare const ATTRIBUTE_DATA_SORT_POSITION = "data-sort-position";
+declare const ATTRIBUTE_ROLE = "role";
+declare const ELEMENT_DIV = "div";
+declare const ROLE_CELL = "cell";
+declare const ROLE_COLUMNHEADER = "columnheader";
+declare const ROLE_ROW = "row";
+declare const ROLE_ROWGROUP = "rowgroup";
+declare const ROLE_TABLE = "table";
+//#endregion
+export { ARIA_ACTIVEDESCENDANT, ARIA_LABEL, ARIA_SELECTED, ARIA_SORT, ATTRIBUTE_DATA_ACTIVE, ATTRIBUTE_DATA_EVENT, ATTRIBUTE_DATA_KEY, ATTRIBUTE_DATA_SORT_DIRECTION, ATTRIBUTE_DATA_SORT_POSITION, ATTRIBUTE_ROLE, ELEMENT_DIV, ROLE_CELL, ROLE_COLUMNHEADER, ROLE_ROW, ROLE_ROWGROUP, ROLE_TABLE };

package/dist/models/dom.model.mjs

@@ -0,0 +1,19 @@
+//#region src/models/dom.model.ts
+const ARIA_ACTIVEDESCENDANT = "aria-activedescendant";
+const ARIA_LABEL = "aria-label";
+const ARIA_SELECTED = "aria-selected";
+const ARIA_SORT = "aria-sort";
+const ATTRIBUTE_DATA_ACTIVE = "data-active";
+const ATTRIBUTE_DATA_EVENT = "data-event";
+const ATTRIBUTE_DATA_KEY = "data-key";
+const ATTRIBUTE_DATA_SORT_DIRECTION = "data-sort-direction";
+const ATTRIBUTE_DATA_SORT_POSITION = "data-sort-position";
+const ATTRIBUTE_ROLE = "role";
+const ELEMENT_DIV = "div";
+const ROLE_CELL = "cell";
+const ROLE_COLUMNHEADER = "columnheader";
+const ROLE_ROW = "row";
+const ROLE_ROWGROUP = "rowgroup";
+const ROLE_TABLE = "table";
+//#endregion
+export { ARIA_ACTIVEDESCENDANT, ARIA_LABEL, ARIA_SELECTED, ARIA_SORT, ATTRIBUTE_DATA_ACTIVE, ATTRIBUTE_DATA_EVENT, ATTRIBUTE_DATA_KEY, ATTRIBUTE_DATA_SORT_DIRECTION, ATTRIBUTE_DATA_SORT_POSITION, ATTRIBUTE_ROLE, ELEMENT_DIV, ROLE_CELL, ROLE_COLUMNHEADER, ROLE_ROW, ROLE_ROWGROUP, ROLE_TABLE };

package/dist/models/event.model.d.mts

@@ -0,0 +1,99 @@
+import { TabelaFilterItem } from "./filter.model.mjs";
+import { TabelaGroup, TabelaGroupToggle } from "./group.model.mjs";
+import { TabelaSortItem } from "./sort.model.mjs";
+import { Key, PlainObject } from "@oscarpalmer/atoms/models";
+
+//#region src/models/event.model.d.ts
+type EventDataAdd = (data: PlainObject[]) => void;
+type EventDataClear = () => void;
+type EventDataFiltered = (data: PlainObject[]) => void;
+type EventDataRemove = (data: PlainObject[]) => void;
+type EventDataSorted = (data: PlainObject[]) => void;
+type EventDataSynchronize = (data: {
+  added: PlainObject[];
+  removed: PlainObject[];
+  updated: PlainObject[];
+}) => void;
+type EventDataUpdate = (data: PlainObject[]) => void;
+type EventFilterAdd = (filters: TabelaFilterItem[]) => void;
+type EventFilterClear = () => void;
+type EventFilterRemove = (filters: TabelaFilterItem[]) => void;
+type EventGroupAdd = (groups: TabelaGroup[]) => void;
+type EventGroupClear = () => void;
+type EventGroupRemove = (groups: TabelaGroup[]) => void;
+type EventGroupToggle = (event: TabelaGroupToggle) => void;
+type EventGroupUpdate = (groups: TabelaGroup[]) => void;
+type EventMap = {
+  'data:add': EventDataAdd;
+  'data:clear': EventDataClear;
+  'data:filtered': EventDataFiltered;
+  'data:remove': EventDataRemove;
+  'data:sorted': EventDataSorted;
+  'data:synchronize': EventDataSynchronize;
+  'data:update': EventDataUpdate;
+  'filter:add': EventFilterAdd;
+  'filter:clear': EventFilterClear;
+  'filter:remove': EventFilterRemove;
+  'group:add': EventGroupAdd;
+  'group:clear': EventGroupClear;
+  'group:remove': EventGroupRemove;
+  'group:toggle': EventGroupToggle;
+  'group:update': EventGroupUpdate;
+  'navigation:active': EventNavigationActive;
+  'render:begin': EventRenderBegin;
+  'render:end': EventRenderEnd;
+  'selection:add': EventSelectionAdd;
+  'selection:clear': EventSelectionClear;
+  'selection:remove': EventSelectionRemove;
+  'selection:toggle': EventSelectionToggle;
+  'sort:add': EventSortAdd;
+  'sort:clear': EventSortClear;
+  'sort:flip': EventSortFlip;
+  'sort:remove': EventSortRemove;
+  'sort:set': EventSortSet;
+};
+type EventName = keyof EventMap;
+type EventNavigationActive = (active: Key | null) => void;
+type EventRenderBegin = () => void;
+type EventRenderEnd = () => void;
+type EventSelectionAdd = (keys: Key[]) => void;
+type EventSelectionClear = () => void;
+type EventSelectionRemove = (keys: Key[]) => void;
+type EventSelectionToggle = (keys: Key[]) => void;
+type EventSortAdd = (sorters: TabelaSortItem[]) => void;
+type EventSortClear = () => void;
+type EventSortFlip = (sorters: TabelaSortItem[]) => void;
+type EventSortRemove = (sorters: TabelaSortItem[]) => void;
+type EventSortSet = (sorters: {
+  added: TabelaSortItem[];
+  removed: TabelaSortItem[];
+}) => void;
+type Events = Partial<{ [Name in EventName]: Set<EventMap[Name]> }>;
+type TabelaEvents = {
+  subscribe<Name extends EventName>(name: Name, callback: EventMap[Name]): void;
+  unsubscribe<Name extends EventName>(name: Name, callback: EventMap[Name]): void;
+};
+declare const EVENT_BODY = "body";
+declare const EVENT_DATA_ADD = "data:add";
+declare const EVENT_DATA_CLEAR = "data:clear";
+declare const EVENT_DATA_FILTERED = "data:filtered";
+declare const EVENT_DATA_REMOVE = "data:remove";
+declare const EVENT_DATA_SORTED = "data:sorted";
+declare const EVENT_DATA_SYNCHRONIZE = "data:synchronize";
+declare const EVENT_DATA_UPDATE = "data:update";
+declare const EVENT_GROUP = "group";
+declare const EVENT_GROUP_ADD = "group:add";
+declare const EVENT_GROUP_CLEAR = "group:clear";
+declare const EVENT_GROUP_REMOVE = "group:remove";
+declare const EVENT_GROUP_TOGGLE = "group:toggle";
+declare const EVENT_GROUP_UPDATE = "group:update";
+declare const EVENT_HEADING = "heading";
+declare const EVENT_ROW = "row";
+declare const EVENT_SORT_ADD = "sort:add";
+declare const EVENT_SORT_CLEAR = "sort:clear";
+declare const EVENT_SORT_FLIP = "sort:flip";
+declare const EVENT_SORT_REMOVE = "sort:remove";
+declare const EVENT_SORT_SET = "sort:set";
+declare const EVENTS_NAMES: Set<keyof EventMap>;
+//#endregion
+export { EVENTS_NAMES, EVENT_BODY, EVENT_DATA_ADD, EVENT_DATA_CLEAR, EVENT_DATA_FILTERED, EVENT_DATA_REMOVE, EVENT_DATA_SORTED, EVENT_DATA_SYNCHRONIZE, EVENT_DATA_UPDATE, EVENT_GROUP, EVENT_GROUP_ADD, EVENT_GROUP_CLEAR, EVENT_GROUP_REMOVE, EVENT_GROUP_TOGGLE, EVENT_GROUP_UPDATE, EVENT_HEADING, EVENT_ROW, EVENT_SORT_ADD, EVENT_SORT_CLEAR, EVENT_SORT_FLIP, EVENT_SORT_REMOVE, EVENT_SORT_SET, EventDataAdd, EventDataClear, EventDataFiltered, EventDataRemove, EventDataSorted, EventDataSynchronize, EventDataUpdate, EventFilterAdd, EventFilterClear, EventFilterRemove, EventGroupAdd, EventGroupClear, EventGroupRemove, EventGroupToggle, EventGroupUpdate, EventMap, EventName, EventNavigationActive, EventRenderBegin, EventRenderEnd, EventSelectionAdd, EventSelectionClear, EventSelectionRemove, EventSelectionToggle, EventSortAdd, EventSortClear, EventSortFlip, EventSortRemove, EventSortSet, Events, TabelaEvents };

package/dist/models/event.model.mjs

@@ -0,0 +1,53 @@
+//#region src/models/event.model.ts
+const EVENT_BODY = "body";
+const EVENT_DATA_ADD = "data:add";
+const EVENT_DATA_CLEAR = "data:clear";
+const EVENT_DATA_FILTERED = "data:filtered";
+const EVENT_DATA_REMOVE = "data:remove";
+const EVENT_DATA_SORTED = "data:sorted";
+const EVENT_DATA_SYNCHRONIZE = "data:synchronize";
+const EVENT_DATA_UPDATE = "data:update";
+const EVENT_GROUP = "group";
+const EVENT_GROUP_ADD = "group:add";
+const EVENT_GROUP_CLEAR = "group:clear";
+const EVENT_GROUP_REMOVE = "group:remove";
+const EVENT_GROUP_TOGGLE = "group:toggle";
+const EVENT_GROUP_UPDATE = "group:update";
+const EVENT_HEADING = "heading";
+const EVENT_ROW = "row";
+const EVENT_SORT_ADD = "sort:add";
+const EVENT_SORT_CLEAR = "sort:clear";
+const EVENT_SORT_FLIP = "sort:flip";
+const EVENT_SORT_REMOVE = "sort:remove";
+const EVENT_SORT_SET = "sort:set";
+const EVENTS_NAMES = new Set([
+	EVENT_DATA_ADD,
+	EVENT_DATA_CLEAR,
+	EVENT_DATA_FILTERED,
+	EVENT_DATA_REMOVE,
+	EVENT_DATA_SORTED,
+	EVENT_DATA_SYNCHRONIZE,
+	EVENT_DATA_UPDATE,
+	"filter:add",
+	"filter:clear",
+	"filter:remove",
+	EVENT_GROUP_ADD,
+	EVENT_GROUP_CLEAR,
+	EVENT_GROUP_REMOVE,
+	EVENT_GROUP_TOGGLE,
+	EVENT_GROUP_UPDATE,
+	"navigation:active",
+	"render:begin",
+	"render:end",
+	"selection:add",
+	"selection:clear",
+	"selection:remove",
+	"selection:toggle",
+	EVENT_SORT_ADD,
+	EVENT_SORT_CLEAR,
+	EVENT_SORT_FLIP,
+	EVENT_SORT_REMOVE,
+	EVENT_SORT_SET
+]);
+//#endregion
+export { EVENTS_NAMES, EVENT_BODY, EVENT_DATA_ADD, EVENT_DATA_CLEAR, EVENT_DATA_FILTERED, EVENT_DATA_REMOVE, EVENT_DATA_SORTED, EVENT_DATA_SYNCHRONIZE, EVENT_DATA_UPDATE, EVENT_GROUP, EVENT_GROUP_ADD, EVENT_GROUP_CLEAR, EVENT_GROUP_REMOVE, EVENT_GROUP_TOGGLE, EVENT_GROUP_UPDATE, EVENT_HEADING, EVENT_ROW, EVENT_SORT_ADD, EVENT_SORT_CLEAR, EVENT_SORT_FLIP, EVENT_SORT_REMOVE, EVENT_SORT_SET };

package/dist/models/filter.model.d.mts

@@ -0,0 +1,26 @@
+//#region src/models/filter.model.d.ts
+type TabelaFilter = {
+  add(item: TabelaFilterItem): void;
+  clear(): void;
+  remove(key: string): void;
+  remove(item: TabelaFilterItem): void;
+  set(items: TabelaFilterItem[]): void;
+};
+type TabelaFilterComparison = 'contains' | 'ends-with' | 'equals' | 'greater-than' | 'greater-than-or-equal' | 'less-than' | 'less-than-or-equal' | 'not-contains' | 'not-equals' | 'starts-with';
+type TabelaFilterItem = {
+  comparison: TabelaFilterComparison;
+  key: string;
+  value: unknown;
+};
+declare const FILTER_CONTAINS: TabelaFilterComparison;
+declare const FILTER_ENDS_WITH: TabelaFilterComparison;
+declare const FILTER_EQUALS: TabelaFilterComparison;
+declare const FILTER_GREATER_THAN: TabelaFilterComparison;
+declare const FILTER_GREATER_THAN_OR_EQUAL: TabelaFilterComparison;
+declare const FILTER_LESS_THAN: TabelaFilterComparison;
+declare const FILTER_LESS_THAN_OR_EQUAL: TabelaFilterComparison;
+declare const FILTER_NOT_CONTAINS: TabelaFilterComparison;
+declare const FILTER_NOT_EQUALS: TabelaFilterComparison;
+declare const FILTER_STARTS_WITH: TabelaFilterComparison;
+//#endregion
+export { FILTER_CONTAINS, FILTER_ENDS_WITH, FILTER_EQUALS, FILTER_GREATER_THAN, FILTER_GREATER_THAN_OR_EQUAL, FILTER_LESS_THAN, FILTER_LESS_THAN_OR_EQUAL, FILTER_NOT_CONTAINS, FILTER_NOT_EQUALS, FILTER_STARTS_WITH, TabelaFilter, TabelaFilterComparison, TabelaFilterItem };

package/dist/models/filter.model.mjs

@@ -0,0 +1,13 @@
+//#region src/models/filter.model.ts
+const FILTER_CONTAINS = "contains";
+const FILTER_ENDS_WITH = "ends-with";
+const FILTER_EQUALS = "equals";
+const FILTER_GREATER_THAN = "greater-than";
+const FILTER_GREATER_THAN_OR_EQUAL = "greater-than-or-equal";
+const FILTER_LESS_THAN = "less-than";
+const FILTER_LESS_THAN_OR_EQUAL = "less-than-or-equal";
+const FILTER_NOT_CONTAINS = "not-contains";
+const FILTER_NOT_EQUALS = "not-equals";
+const FILTER_STARTS_WITH = "starts-with";
+//#endregion
+export { FILTER_CONTAINS, FILTER_ENDS_WITH, FILTER_EQUALS, FILTER_GREATER_THAN, FILTER_GREATER_THAN_OR_EQUAL, FILTER_LESS_THAN, FILTER_LESS_THAN_OR_EQUAL, FILTER_NOT_CONTAINS, FILTER_NOT_EQUALS, FILTER_STARTS_WITH };

package/dist/models/footer.model.d.mts

@@ -0,0 +1,8 @@
+//#region src/models/footer.model.d.ts
+type FooterElements = {
+  cells: HTMLDivElement[];
+  group: HTMLDivElement;
+  row: HTMLDivElement;
+};
+//#endregion
+export { FooterElements };

package/dist/models/footer.model.mjs

@@ -0,0 +1 @@
+export {};

package/dist/models/group.model.d.mts

@@ -0,0 +1,19 @@
+//#region src/models/group.model.d.ts
+type GroupValue = {
+  original: unknown;
+  stringified: string;
+};
+type TabelaGroup = {
+  value: unknown;
+};
+type TabelaGroupHandlers = {
+  set(group?: string): void;
+};
+type TabelaGroupToggle = {
+  collapsed: TabelaGroup[];
+  expanded: TabelaGroup[];
+};
+declare const GROUP_KEY_EXPRESSION: RegExp;
+declare const GROUP_KEY_PREFIX = "group:";
+//#endregion
+export { GROUP_KEY_EXPRESSION, GROUP_KEY_PREFIX, GroupValue, TabelaGroup, TabelaGroupHandlers, TabelaGroupToggle };

package/dist/models/group.model.mjs

@@ -0,0 +1,5 @@
+//#region src/models/group.model.ts
+const GROUP_KEY_EXPRESSION = /^group:(.+)$/;
+const GROUP_KEY_PREFIX = "group:";
+//#endregion
+export { GROUP_KEY_EXPRESSION, GROUP_KEY_PREFIX };

package/dist/models/header.model.d.mts

@@ -0,0 +1,7 @@
+//#region src/models/header.model.d.ts
+type HeaderElements = {
+  group: HTMLDivElement;
+  row: HTMLDivElement;
+};
+//#endregion
+export { HeaderElements };

package/dist/models/header.model.mjs

@@ -0,0 +1 @@
+export {};

package/dist/models/render.model.d.mts

@@ -0,0 +1,22 @@
+import { State } from "./tabela.model.mjs";
+import { Key } from "@oscarpalmer/atoms/models";
+
+//#region src/models/render.model.d.ts
+type RenderElementPool = {
+  cells: Record<string, HTMLDivElement[]>;
+  rows: HTMLDivElement[];
+};
+type RenderRange = {
+  end: number;
+  start: number;
+};
+type RenderState = {
+  active: boolean;
+  top: number;
+} & State;
+type RenderVisible = {
+  indiced: Map<number, Key>;
+  keys: Set<Key>;
+};
+//#endregion
+export { RenderElementPool, RenderRange, RenderState, RenderVisible };

package/dist/models/render.model.mjs

@@ -0,0 +1 @@
+export {};

package/dist/models/selection.model.d.mts

@@ -0,0 +1,12 @@
+import { Key } from "@oscarpalmer/atoms/models";
+
+//#region src/models/selection.model.d.ts
+type TabelaSelection = {
+  add(keys: Key[]): void;
+  clear(): void;
+  remove(keys: Key[]): void;
+  set(keys: Key[]): void;
+  toggle(): void;
+};
+//#endregion
+export { TabelaSelection };

package/dist/models/selection.model.mjs

@@ -0,0 +1 @@
+export {};

package/dist/models/sort.model.d.mts

@@ -0,0 +1,19 @@
+import { SortDirection } from "@oscarpalmer/atoms/array";
+
+//#region src/models/sort.model.d.ts
+type TabelaSort = {
+  add(key: string, direction?: TabelaSortDirection): void;
+  clear(): void;
+  flip(key: string): void;
+  remove(key: string): void;
+  set(items: TabelaSortItem[]): void;
+};
+type TabelaSortDirection = SortDirection;
+type TabelaSortItem = {
+  direction: TabelaSortDirection;
+  key: string;
+};
+declare const SORT_ASCENDING: TabelaSortDirection;
+declare const SORT_DESCENDING: TabelaSortDirection;
+//#endregion
+export { SORT_ASCENDING, SORT_DESCENDING, TabelaSort, TabelaSortDirection, TabelaSortItem };

package/dist/models/sort.model.mjs

@@ -0,0 +1,5 @@
+//#region src/models/sort.model.ts
+const SORT_ASCENDING = "ascending";
+const SORT_DESCENDING = "descending";
+//#endregion
+export { SORT_ASCENDING, SORT_DESCENDING };

package/dist/models/style.model.d.mts

@@ -0,0 +1,29 @@
+//#region src/models/style.model.d.ts
+declare const CSS_BUTTON = "tabela__button";
+declare const CSS_BUTTON_GROUP = "tabela__button--group";
+declare const CSS_CELL = "tabela__cell";
+declare const CSS_CELL_BODY = "tabela__cell--body";
+declare const CSS_CELL_FOOTER = "tabela__cell--footer";
+declare const CSS_CELL_GROUP = "tabela__cell--group";
+declare const CSS_FAKER = "tabela__faker";
+declare const CSS_GROUP = "tabela__group";
+declare const CSS_GROUP_SELECTED = "tabela__group__selected";
+declare const CSS_GROUP_TOTAL = "tabela__group__total";
+declare const CSS_HEADING = "tabela__heading";
+declare const CSS_HEADING_CONTENT = "tabela__heading__content";
+declare const CSS_HEADING_SORTER = "tabela__heading__sorter";
+declare const CSS_ROW = "tabela__row";
+declare const CSS_ROW_BODY = "tabela__row--body";
+declare const CSS_ROW_FOOTER = "tabela__row--footer";
+declare const CSS_ROW_GROUP = "tabela__row--group tabela__group";
+declare const CSS_ROW_HEADER = "tabela__row--header";
+declare const CSS_ROW_SELECTED = "tabela__row--selected";
+declare const CSS_ROWGROUP = "tabela__rowgroup";
+declare const CSS_ROWGROUP_BODY = "tabela__rowgroup--body";
+declare const CSS_ROWGROUP_FOOTER = "tabela__rowgroup--footer";
+declare const CSS_ROWGROUP_HEADER = "tabela__rowgroup--header";
+declare const CSS_SELECTION = "tabela__selection";
+declare const CSS_TABLE = "tabela__table";
+declare const CSS_WRAPPER = "tabela";
+//#endregion
+export { CSS_BUTTON, CSS_BUTTON_GROUP, CSS_CELL, CSS_CELL_BODY, CSS_CELL_FOOTER, CSS_CELL_GROUP, CSS_FAKER, CSS_GROUP, CSS_GROUP_SELECTED, CSS_GROUP_TOTAL, CSS_HEADING, CSS_HEADING_CONTENT, CSS_HEADING_SORTER, CSS_ROW, CSS_ROWGROUP, CSS_ROWGROUP_BODY, CSS_ROWGROUP_FOOTER, CSS_ROWGROUP_HEADER, CSS_ROW_BODY, CSS_ROW_FOOTER, CSS_ROW_GROUP, CSS_ROW_HEADER, CSS_ROW_SELECTED, CSS_SELECTION, CSS_TABLE, CSS_WRAPPER };

package/dist/models/style.model.mjs

@@ -0,0 +1,29 @@
+//#region src/models/style.model.ts
+const CSS_BUTTON = "tabela__button";
+const CSS_BUTTON_GROUP = "tabela__button--group";
+const CSS_CELL = "tabela__cell";
+const CSS_CELL_BODY = "tabela__cell--body";
+const CSS_CELL_FOOTER = "tabela__cell--footer";
+const CSS_CELL_GROUP = "tabela__cell--group";
+const CSS_FAKER = "tabela__faker";
+const CSS_GROUP = "tabela__group";
+const CSS_GROUP_SELECTED = "tabela__group__selected";
+const CSS_GROUP_TOTAL = "tabela__group__total";
+const CSS_HEADING = "tabela__heading";
+const CSS_HEADING_CONTENT = "tabela__heading__content";
+const CSS_HEADING_SORTER = "tabela__heading__sorter";
+const CSS_ROW = "tabela__row";
+const CSS_ROW_BODY = "tabela__row--body";
+const CSS_ROW_FOOTER = "tabela__row--footer";
+const CSS_ROW_GROUP = "tabela__row--group tabela__group";
+const CSS_ROW_HEADER = "tabela__row--header";
+const CSS_ROW_SELECTED = "tabela__row--selected";
+const CSS_ROWGROUP = "tabela__rowgroup";
+const CSS_ROWGROUP_BODY = "tabela__rowgroup--body";
+const CSS_ROWGROUP_FOOTER = "tabela__rowgroup--footer";
+const CSS_ROWGROUP_HEADER = "tabela__rowgroup--header";
+const CSS_SELECTION = "tabela__selection";
+const CSS_TABLE = "tabela__table";
+const CSS_WRAPPER = "tabela";
+//#endregion
+export { CSS_BUTTON, CSS_BUTTON_GROUP, CSS_CELL, CSS_CELL_BODY, CSS_CELL_FOOTER, CSS_CELL_GROUP, CSS_FAKER, CSS_GROUP, CSS_GROUP_SELECTED, CSS_GROUP_TOTAL, CSS_HEADING, CSS_HEADING_CONTENT, CSS_HEADING_SORTER, CSS_ROW, CSS_ROWGROUP, CSS_ROWGROUP_BODY, CSS_ROWGROUP_FOOTER, CSS_ROWGROUP_HEADER, CSS_ROW_BODY, CSS_ROW_FOOTER, CSS_ROW_GROUP, CSS_ROW_HEADER, CSS_ROW_SELECTED, CSS_SELECTION, CSS_TABLE, CSS_WRAPPER };