@lucasbernardosn/react-table 0.0.0-stage → 0.1.0

package/dist/components/data-table/toolbar/data-table-density-select.js

@@ -0,0 +1,60 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useSelector } from "@tanstack/react-store";
+import { Select } from "@lucasbernardosn/react-ui/collections/select";
+//#region src/components/data-table/toolbar/data-table-density-select.tsx
+const DEFAULT_LABELS = {
+	compact: "Compacta",
+	standard: "Padrão",
+	comfortable: "Confortável"
+};
+const DENSITIES = [
+	"compact",
+	"standard",
+	"comfortable"
+];
+/**
+* O select da densidade das linhas, para a barra de ferramentas. Sem rótulo visível: o nome para
+* o leitor de tela é "Densidade", trocável pelo `aria-label`.
+*
+* Renderiza o `Select` do `ui` por dentro; as props passam para o trigger.
+*
+* @example
+* ```tsx
+* <DataTable.DensitySelect table={table} />
+* ```
+*/
+const DataTableDensitySelect = (props) => {
+	const { table, labels, size = "sm", disabled, ...rest } = props;
+	/** Re-renderiza quando a densidade muda. */
+	const density = useSelector(table.atoms.rowDensity);
+	const items = DENSITIES.map((value) => ({
+		label: labels?.[value] ?? DEFAULT_LABELS[value],
+		value
+	}));
+	return /* @__PURE__ */ jsxs(Select.Root, {
+		size,
+		value: density,
+		items,
+		disabled,
+		onValueChange: (value) => {
+			if (value !== null) table.setRowDensity(value);
+		},
+		children: [/* @__PURE__ */ jsxs(Select.Trigger, {
+			"data-component": "DataTable.DensitySelect",
+			"aria-label": "Densidade",
+			...rest,
+			children: [/* @__PURE__ */ jsx(Select.Value, {}), /* @__PURE__ */ jsx(Select.Icon, {})]
+		}), /* @__PURE__ */ jsx(Select.Portal, { children: /* @__PURE__ */ jsx(Select.Positioner, {
+			alignItemWithTrigger: false,
+			children: /* @__PURE__ */ jsx(Select.Popup, { children: /* @__PURE__ */ jsx(Select.List, { children: items.map((item) => /* @__PURE__ */ jsxs(Select.Item, {
+				value: item.value,
+				children: [/* @__PURE__ */ jsx(Select.ItemIndicator, {}), /* @__PURE__ */ jsx(Select.ItemText, { children: item.label })]
+			}, item.value)) }) })
+		}) })]
+	});
+};
+DataTableDensitySelect.displayName = "DataTable.DensitySelect";
+//#endregion
+export { DataTableDensitySelect };
+
+//# sourceMappingURL=data-table-density-select.js.map

package/dist/components/data-table/toolbar/data-table-density-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-density-select.js","names":[],"sources":["../../../../src/components/data-table/toolbar/data-table-density-select.tsx"],"sourcesContent":["import { Select } from '@lucasbernardosn/react-ui/collections/select';\nimport type { MergeOverride } from '@lucasbernardosn/utils';\nimport { useSelector } from '@tanstack/react-store';\nimport type { RowData, TableFeatures } from '@tanstack/react-table';\nimport type { RowDensity } from '../../../features';\nimport type { TableWith } from '../../../types';\n\nexport type DataTableDensitySelectProps<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n> = MergeOverride<\n  Select.TriggerProps,\n  {\n    /** A tabela. Exige `rowDensityFeature`. */\n    table: TableWith<TFeatures, TData, 'rowDensityFeature'>;\n    /**\n     * O nome de cada densidade.\n     * @default { compact: 'Compacta', standard: 'Padrão', comfortable: 'Confortável' }\n     */\n    labels?: Partial<Record<RowDensity, string>>;\n    /**\n     * O tamanho do select.\n     * @default 'sm'\n     */\n    size?: Select.RootProps<RowDensity>['size'];\n  }\n>;\n\nconst DEFAULT_LABELS: Record<RowDensity, string> = {\n  compact: 'Compacta',\n  standard: 'Padrão',\n  comfortable: 'Confortável',\n};\n\nconst DENSITIES: RowDensity[] = ['compact', 'standard', 'comfortable'];\n\n/**\n * O select da densidade das linhas, para a barra de ferramentas. Sem rótulo visível: o nome para\n * o leitor de tela é \"Densidade\", trocável pelo `aria-label`.\n *\n * Renderiza o `Select` do `ui` por dentro; as props passam para o trigger.\n *\n * @example\n * ```tsx\n * <DataTable.DensitySelect table={table} />\n * ```\n */\nexport const DataTableDensitySelect = <\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(\n  props: DataTableDensitySelectProps<TFeatures, TData>,\n) => {\n  const { table, labels, size = 'sm', disabled, ...rest } = props;\n\n  /** Re-renderiza quando a densidade muda. */\n  const density = useSelector(table.atoms.rowDensity);\n\n  const items = DENSITIES.map((value) => ({\n    label: labels?.[value] ?? DEFAULT_LABELS[value],\n    value,\n  }));\n\n  return (\n    <Select.Root<RowDensity>\n      size={size}\n      value={density}\n      items={items}\n      disabled={disabled}\n      onValueChange={(value) => {\n        if (value !== null) {\n          table.setRowDensity(value);\n        }\n      }}\n    >\n      <Select.Trigger\n        data-component=\"DataTable.DensitySelect\"\n        aria-label=\"Densidade\"\n        {...rest}\n      >\n        <Select.Value />\n        <Select.Icon />\n      </Select.Trigger>\n\n      <Select.Portal>\n        <Select.Positioner alignItemWithTrigger={false}>\n          <Select.Popup>\n            <Select.List>\n              {items.map((item) => (\n                <Select.Item\n                  key={item.value}\n                  value={item.value}\n                >\n                  <Select.ItemIndicator />\n                  <Select.ItemText>{item.label}</Select.ItemText>\n                </Select.Item>\n              ))}\n            </Select.List>\n          </Select.Popup>\n        </Select.Positioner>\n      </Select.Portal>\n    </Select.Root>\n  );\n};\n\nDataTableDensitySelect.displayName = 'DataTable.DensitySelect';\n"],"mappings":";;;;AA4BA,MAAM,iBAA6C;CACjD,SAAS;CACT,UAAU;CACV,aAAa;AACf;AAEA,MAAM,YAA0B;CAAC;CAAW;CAAY;AAAa;;;;;;;;;;;;AAarE,MAAa,0BAIX,UACG;CACH,MAAM,EAAE,OAAO,QAAQ,OAAO,MAAM,UAAU,GAAG,SAAS;;CAG1D,MAAM,UAAU,YAAY,MAAM,MAAM,UAAU;CAElD,MAAM,QAAQ,UAAU,KAAK,WAAW;EACtC,OAAO,SAAS,UAAU,eAAe;EACzC;CACF,EAAE;CAEF,OACE,qBAAC,OAAO,MAAR;EACQ;EACN,OAAO;EACA;EACG;EACV,gBAAgB,UAAU;GACxB,IAAI,UAAU,MACZ,MAAM,cAAc,KAAK;EAE7B;EATF,UAAA,CAWE,qBAAC,OAAO,SAAR;GACE,kBAAe;GACf,cAAW;GACX,GAAI;GAHN,UAAA,CAKE,oBAAC,OAAO,OAAR,CAAe,CAAA,GACf,oBAAC,OAAO,MAAR,CAAc,CAAA,CACA;EAEhB,CAAA,GAAA,oBAAC,OAAO,QAAR,EAAA,UACE,oBAAC,OAAO,YAAR;GAAmB,sBAAsB;GACvC,UAAA,oBAAC,OAAO,OAAR,EAAA,UACE,oBAAC,OAAO,MAAR,EAAA,UACG,MAAM,KAAK,SACV,qBAAC,OAAO,MAAR;IAEE,OAAO,KAAK;IAFd,UAAA,CAIE,oBAAC,OAAO,eAAR,CAAuB,CAAA,GACvB,oBAAC,OAAO,UAAR,EAAA,UAAkB,KAAK,MAAuB,CAAA,CACnC;GALN,GAAA,KAAK,KAKC,CACd,EACU,CAAA,EACD,CAAA;EACG,CAAA,EACN,CAAA,CACJ;;AAEjB;AAEA,uBAAuB,cAAc"}

package/dist/components/data-table/toolbar/data-table-sort-column-select.d.ts

@@ -0,0 +1,47 @@
+import { TableWith } from "../../../types/table-with.js";
+import "../../../types/index.js";
+import { Column, RowData, TableFeatures } from "@tanstack/react-table";
+import { Select } from "@lucasbernardosn/react-ui/collections/select";
+import { MergeOverride } from "@lucasbernardosn/utils";
+//#region src/components/data-table/toolbar/data-table-sort-column-select.d.ts
+export type DataTableSortColumnSelectProps<TFeatures extends TableFeatures, TData extends RowData> = MergeOverride<Select.TriggerProps, {
+  /** A tabela. Exige `rowSortingFeature`. */
+  table: TableWith<TFeatures, TData, 'rowSortingFeature'>;
+  /**
+   * O nome de uma coluna.
+   * @default getDefaultColumnLabel: o `header` quando é texto, e o id quando não é
+   */
+  getLabel?: (column: Column<TFeatures, TData>) => string;
+  /**
+   * O nome da opção que tira a ordenação.
+   * @default 'Sem ordenação'
+   */
+  noSortingLabel?: string;
+  /**
+   * O tamanho do select.
+   * @default 'sm'
+   */
+  size?: Select.RootProps<string>['size'];
+}>;
+/**
+ * O select da coluna da ordenação, para onde o cabeçalho não serve de controle, como no celular.
+ * Lista as colunas visíveis que ordenam, e "Sem ordenação" no topo; a coluna da ordenação atual
+ * entra no fim mesmo escondida. Escolher uma coluna troca a
+ * ordenação inteira por ela, na direção atual, ou na primeira da coluna sem ordenação antes. Com
+ * a ordenação por várias colunas, mostra a primeira.
+ *
+ * Vai junto com o `DataTable.SortDirectionSelect`. Quando aparecem é do app, pela `className`
+ * (ex.: `sm:hidden`). Renderiza o `Select` do `ui` por dentro; as props passam para o trigger.
+ *
+ * @example
+ * ```tsx
+ * <DataTable.SortColumnSelect table={table} className="sm:hidden" />
+ * <DataTable.SortDirectionSelect table={table} className="sm:hidden" />
+ * ```
+ */
+export declare const DataTableSortColumnSelect: {
+  <TFeatures extends TableFeatures, TData extends RowData>(props: DataTableSortColumnSelectProps<TFeatures, TData>): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=data-table-sort-column-select.d.ts.map

package/dist/components/data-table/toolbar/data-table-sort-column-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-sort-column-select.d.ts","names":[],"sources":["../../../../src/components/data-table/toolbar/data-table-sort-column-select.tsx"],"mappings":";;;;;;YAWY,+BACV,kBAAkB,eAClB,cAAc,WACZ,cACF,OAAO;;EAGL,OAAO,UAAU,WAAW;;;;;EAK5B,YAAY,QAAQ,OAAO,WAAW;;;;;EAKtC;;;;;EAKA,OAAO,OAAO;;;;;;;;;;;;;;;;;;qBAuBL;GACX,kBAAkB,eAClB,cAAc,SAAO,OAEd,+BAA+B,WAAW,yBAAM,IAAA"}

package/dist/components/data-table/toolbar/data-table-sort-column-select.js

@@ -0,0 +1,78 @@
+import { getDefaultColumnLabel } from "../../../utils/get-default-column-label.js";
+import { hasColumnFeature, hasTableFeature } from "../../../utils/has-feature.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useSelector } from "@tanstack/react-store";
+import { Select } from "@lucasbernardosn/react-ui/collections/select";
+//#region src/components/data-table/toolbar/data-table-sort-column-select.tsx
+/** O valor da opção que tira a ordenação. Um id de coluna nunca é vazio. */
+const NO_SORTING = "";
+/**
+* O select da coluna da ordenação, para onde o cabeçalho não serve de controle, como no celular.
+* Lista as colunas visíveis que ordenam, e "Sem ordenação" no topo; a coluna da ordenação atual
+* entra no fim mesmo escondida. Escolher uma coluna troca a
+* ordenação inteira por ela, na direção atual, ou na primeira da coluna sem ordenação antes. Com
+* a ordenação por várias colunas, mostra a primeira.
+*
+* Vai junto com o `DataTable.SortDirectionSelect`. Quando aparecem é do app, pela `className`
+* (ex.: `sm:hidden`). Renderiza o `Select` do `ui` por dentro; as props passam para o trigger.
+*
+* @example
+* ```tsx
+* <DataTable.SortColumnSelect table={table} className="sm:hidden" />
+* <DataTable.SortDirectionSelect table={table} className="sm:hidden" />
+* ```
+*/
+const DataTableSortColumnSelect = (props) => {
+	const { table, getLabel = getDefaultColumnLabel, noSortingLabel = "Sem ordenação", size = "sm", disabled, ...rest } = props;
+	/** Re-renderiza quando a primeira coluna da ordenação muda. */
+	const sortedColumnId = useSelector(table.atoms.sorting, (sorting) => sorting[0]?.id ?? NO_SORTING);
+	const sortableColumns = useSelector(table.store, () => hasTableFeature(table, "columnVisibilityFeature") ? table.getVisibleLeafColumns() : table.getAllLeafColumns()).filter((column) => hasColumnFeature(column, "rowSortingFeature") && column.getCanSort());
+	/**
+	* A coluna da ordenação entra no fim mesmo fora da lista: escondida, ou sem a ordenação pelo
+	* usuário mas ordenada pelo código. Sem ela, o trigger mostraria o id.
+	*/
+	const sortedColumn = sortedColumnId === NO_SORTING || sortableColumns.some((column) => column.id === sortedColumnId) ? void 0 : table.getColumn(sortedColumnId);
+	const items = [{
+		label: noSortingLabel,
+		value: NO_SORTING
+	}, ...[...sortableColumns, ...sortedColumn ? [sortedColumn] : []].map((column) => ({
+		label: getLabel(column),
+		value: column.id
+	}))];
+	const handleValueChange = (columnId) => {
+		if (columnId === null || columnId === NO_SORTING) {
+			table.resetSorting(true);
+			return;
+		}
+		const column = table.getColumn(columnId);
+		if (!(column && hasColumnFeature(column, "rowSortingFeature"))) return;
+		table.setSorting((sorting) => [{
+			id: columnId,
+			desc: sorting[0]?.desc ?? column.getFirstSortDir() === "desc"
+		}]);
+	};
+	return /* @__PURE__ */ jsxs(Select.Root, {
+		size,
+		value: sortedColumnId,
+		items,
+		disabled,
+		onValueChange: handleValueChange,
+		children: [/* @__PURE__ */ jsxs(Select.Trigger, {
+			"data-component": "DataTable.SortColumnSelect",
+			"aria-label": "Ordenar por",
+			...rest,
+			children: [/* @__PURE__ */ jsx(Select.Value, {}), /* @__PURE__ */ jsx(Select.Icon, {})]
+		}), /* @__PURE__ */ jsx(Select.Portal, { children: /* @__PURE__ */ jsx(Select.Positioner, {
+			alignItemWithTrigger: false,
+			children: /* @__PURE__ */ jsx(Select.Popup, { children: /* @__PURE__ */ jsx(Select.List, { children: items.map((item) => /* @__PURE__ */ jsxs(Select.Item, {
+				value: item.value,
+				children: [/* @__PURE__ */ jsx(Select.ItemIndicator, {}), /* @__PURE__ */ jsx(Select.ItemText, { children: item.label })]
+			}, item.value)) }) })
+		}) })]
+	});
+};
+DataTableSortColumnSelect.displayName = "DataTable.SortColumnSelect";
+//#endregion
+export { DataTableSortColumnSelect };
+
+//# sourceMappingURL=data-table-sort-column-select.js.map

package/dist/components/data-table/toolbar/data-table-sort-column-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-sort-column-select.js","names":[],"sources":["../../../../src/components/data-table/toolbar/data-table-sort-column-select.tsx"],"sourcesContent":["import { Select } from '@lucasbernardosn/react-ui/collections/select';\nimport type { MergeOverride } from '@lucasbernardosn/utils';\nimport { useSelector } from '@tanstack/react-store';\nimport type { Column, RowData, TableFeatures } from '@tanstack/react-table';\nimport type { TableWith } from '../../../types';\nimport {\n  getDefaultColumnLabel,\n  hasColumnFeature,\n  hasTableFeature,\n} from '../../../utils';\n\nexport type DataTableSortColumnSelectProps<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n> = MergeOverride<\n  Select.TriggerProps,\n  {\n    /** A tabela. Exige `rowSortingFeature`. */\n    table: TableWith<TFeatures, TData, 'rowSortingFeature'>;\n    /**\n     * O nome de uma coluna.\n     * @default getDefaultColumnLabel: o `header` quando é texto, e o id quando não é\n     */\n    getLabel?: (column: Column<TFeatures, TData>) => string;\n    /**\n     * O nome da opção que tira a ordenação.\n     * @default 'Sem ordenação'\n     */\n    noSortingLabel?: string;\n    /**\n     * O tamanho do select.\n     * @default 'sm'\n     */\n    size?: Select.RootProps<string>['size'];\n  }\n>;\n\n/** O valor da opção que tira a ordenação. Um id de coluna nunca é vazio. */\nconst NO_SORTING = '';\n\n/**\n * O select da coluna da ordenação, para onde o cabeçalho não serve de controle, como no celular.\n * Lista as colunas visíveis que ordenam, e \"Sem ordenação\" no topo; a coluna da ordenação atual\n * entra no fim mesmo escondida. Escolher uma coluna troca a\n * ordenação inteira por ela, na direção atual, ou na primeira da coluna sem ordenação antes. Com\n * a ordenação por várias colunas, mostra a primeira.\n *\n * Vai junto com o `DataTable.SortDirectionSelect`. Quando aparecem é do app, pela `className`\n * (ex.: `sm:hidden`). Renderiza o `Select` do `ui` por dentro; as props passam para o trigger.\n *\n * @example\n * ```tsx\n * <DataTable.SortColumnSelect table={table} className=\"sm:hidden\" />\n * <DataTable.SortDirectionSelect table={table} className=\"sm:hidden\" />\n * ```\n */\nexport const DataTableSortColumnSelect = <\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(\n  props: DataTableSortColumnSelectProps<TFeatures, TData>,\n) => {\n  const {\n    table,\n    getLabel = getDefaultColumnLabel,\n    noSortingLabel = 'Sem ordenação',\n    size = 'sm',\n    disabled,\n    ...rest\n  } = props;\n\n  /** Re-renderiza quando a primeira coluna da ordenação muda. */\n  const sortedColumnId = useSelector(\n    table.atoms.sorting,\n    (sorting) => sorting[0]?.id ?? NO_SORTING,\n  );\n\n  /**\n   * As colunas, que o TanStack memoiza: re-renderiza quando a ordem ou a visibilidade mudam. A\n   * visibilidade é opcional, então assina o store.\n   */\n  const columns = useSelector(table.store, () =>\n    hasTableFeature(table, 'columnVisibilityFeature')\n      ? table.getVisibleLeafColumns()\n      : table.getAllLeafColumns(),\n  );\n\n  const sortableColumns = columns.filter(\n    (column) =>\n      hasColumnFeature(column, 'rowSortingFeature') && column.getCanSort(),\n  );\n\n  /**\n   * A coluna da ordenação entra no fim mesmo fora da lista: escondida, ou sem a ordenação pelo\n   * usuário mas ordenada pelo código. Sem ela, o trigger mostraria o id.\n   */\n  const sortedColumn =\n    sortedColumnId === NO_SORTING ||\n    sortableColumns.some((column) => column.id === sortedColumnId)\n      ? undefined\n      : table.getColumn(sortedColumnId);\n\n  const items = [\n    { label: noSortingLabel, value: NO_SORTING },\n    ...[...sortableColumns, ...(sortedColumn ? [sortedColumn] : [])].map(\n      (column) => ({ label: getLabel(column), value: column.id }),\n    ),\n  ];\n\n  const handleValueChange = (columnId: string | null) => {\n    if (columnId === null || columnId === NO_SORTING) {\n      table.resetSorting(true);\n\n      return;\n    }\n\n    const column = table.getColumn(columnId);\n\n    if (!(column && hasColumnFeature(column, 'rowSortingFeature'))) {\n      return;\n    }\n\n    table.setSorting((sorting) => [\n      {\n        id: columnId,\n        desc: sorting[0]?.desc ?? column.getFirstSortDir() === 'desc',\n      },\n    ]);\n  };\n\n  return (\n    <Select.Root<string>\n      size={size}\n      value={sortedColumnId}\n      items={items}\n      disabled={disabled}\n      onValueChange={handleValueChange}\n    >\n      <Select.Trigger\n        data-component=\"DataTable.SortColumnSelect\"\n        aria-label=\"Ordenar por\"\n        {...rest}\n      >\n        <Select.Value />\n        <Select.Icon />\n      </Select.Trigger>\n\n      <Select.Portal>\n        <Select.Positioner alignItemWithTrigger={false}>\n          <Select.Popup>\n            <Select.List>\n              {items.map((item) => (\n                <Select.Item\n                  key={item.value}\n                  value={item.value}\n                >\n                  <Select.ItemIndicator />\n                  <Select.ItemText>{item.label}</Select.ItemText>\n                </Select.Item>\n              ))}\n            </Select.List>\n          </Select.Popup>\n        </Select.Positioner>\n      </Select.Portal>\n    </Select.Root>\n  );\n};\n\nDataTableSortColumnSelect.displayName = 'DataTable.SortColumnSelect';\n"],"mappings":";;;;;;;AAsCA,MAAM,aAAa;;;;;;;;;;;;;;;;;AAkBnB,MAAa,6BAIX,UACG;CACH,MAAM,EACJ,OACA,WAAW,uBACX,iBAAiB,iBACjB,OAAO,MACP,UACA,GAAG,SACD;;CAGJ,MAAM,iBAAiB,YACrB,MAAM,MAAM,UACX,YAAY,QAAQ,EAAE,EAAE,MAAM,UACjC;CAYA,MAAM,kBANU,YAAY,MAAM,aAChC,gBAAgB,OAAO,yBAAyB,IAC5C,MAAM,sBAAsB,IAC5B,MAAM,kBAAkB,CAGA,CAAC,CAAC,QAC7B,WACC,iBAAiB,QAAQ,mBAAmB,KAAK,OAAO,WAAW,CACvE;;;;;CAMA,MAAM,eACJ,mBAAmB,cACnB,gBAAgB,MAAM,WAAW,OAAO,OAAO,cAAc,IACzD,KAAA,IACA,MAAM,UAAU,cAAc;CAEpC,MAAM,QAAQ,CACZ;EAAE,OAAO;EAAgB,OAAO;CAAW,GAC3C,GAAG,CAAC,GAAG,iBAAiB,GAAI,eAAe,CAAC,YAAY,IAAI,CAAC,CAAE,CAAC,CAAC,KAC9D,YAAY;EAAE,OAAO,SAAS,MAAM;EAAG,OAAO,OAAO;CAAG,EAC3D,CACF;CAEA,MAAM,qBAAqB,aAA4B;EACrD,IAAI,aAAa,QAAQ,aAAa,YAAY;GAChD,MAAM,aAAa,IAAI;GAEvB;EACF;EAEA,MAAM,SAAS,MAAM,UAAU,QAAQ;EAEvC,IAAI,EAAE,UAAU,iBAAiB,QAAQ,mBAAmB,IAC1D;EAGF,MAAM,YAAY,YAAY,CAC5B;GACE,IAAI;GACJ,MAAM,QAAQ,EAAE,EAAE,QAAQ,OAAO,gBAAgB,MAAM;EACzD,CACF,CAAC;CACH;CAEA,OACE,qBAAC,OAAO,MAAR;EACQ;EACN,OAAO;EACA;EACG;EACV,eAAe;EALjB,UAAA,CAOE,qBAAC,OAAO,SAAR;GACE,kBAAe;GACf,cAAW;GACX,GAAI;GAHN,UAAA,CAKE,oBAAC,OAAO,OAAR,CAAe,CAAA,GACf,oBAAC,OAAO,MAAR,CAAc,CAAA,CACA;EAEhB,CAAA,GAAA,oBAAC,OAAO,QAAR,EAAA,UACE,oBAAC,OAAO,YAAR;GAAmB,sBAAsB;GACvC,UAAA,oBAAC,OAAO,OAAR,EAAA,UACE,oBAAC,OAAO,MAAR,EAAA,UACG,MAAM,KAAK,SACV,qBAAC,OAAO,MAAR;IAEE,OAAO,KAAK;IAFd,UAAA,CAIE,oBAAC,OAAO,eAAR,CAAuB,CAAA,GACvB,oBAAC,OAAO,UAAR,EAAA,UAAkB,KAAK,MAAuB,CAAA,CACnC;GALN,GAAA,KAAK,KAKC,CACd,EACU,CAAA,EACD,CAAA;EACG,CAAA,EACN,CAAA,CACJ;;AAEjB;AAEA,0BAA0B,cAAc"}

package/dist/components/data-table/toolbar/data-table-sort-direction-select.d.ts

@@ -0,0 +1,40 @@
+import { TableWith } from "../../../types/table-with.js";
+import "../../../types/index.js";
+import { RowData, SortDirection, TableFeatures } from "@tanstack/react-table";
+import { Select } from "@lucasbernardosn/react-ui/collections/select";
+import { MergeOverride } from "@lucasbernardosn/utils";
+//#region src/components/data-table/toolbar/data-table-sort-direction-select.d.ts
+export type DataTableSortDirectionSelectProps<TFeatures extends TableFeatures, TData extends RowData> = MergeOverride<Select.TriggerProps, {
+  /** A tabela. Exige `rowSortingFeature`. */
+  table: TableWith<TFeatures, TData, 'rowSortingFeature'>;
+  /**
+   * O nome de cada direção.
+   * @default { asc: 'Crescente', desc: 'Decrescente' }
+   */
+  labels?: Partial<Record<SortDirection, string>>;
+  /**
+   * O tamanho do select.
+   * @default 'sm'
+   */
+  size?: Select.RootProps<SortDirection>['size'];
+}>;
+/**
+ * O select da direção da ordenação, para ir junto com o `DataTable.SortColumnSelect`. Troca a
+ * direção da primeira coluna da ordenação; sem ordenação, fica desabilitado.
+ *
+ * Renderiza o `Select` do `ui` por dentro; as props passam para o trigger.
+ *
+ * @example
+ * ```tsx
+ * <DataTable.SortDirectionSelect
+ *   table={table}
+ *   labels={{ asc: 'A–Z', desc: 'Z–A' }}
+ * />
+ * ```
+ */
+export declare const DataTableSortDirectionSelect: {
+  <TFeatures extends TableFeatures, TData extends RowData>(props: DataTableSortDirectionSelectProps<TFeatures, TData>): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//# sourceMappingURL=data-table-sort-direction-select.d.ts.map

package/dist/components/data-table/toolbar/data-table-sort-direction-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-sort-direction-select.d.ts","names":[],"sources":["../../../../src/components/data-table/toolbar/data-table-sort-direction-select.tsx"],"mappings":";;;;;;YAUY,kCACV,kBAAkB,eAClB,cAAc,WACZ,cACF,OAAO;;EAGL,OAAO,UAAU,WAAW;;;;;EAK5B,SAAS,QAAQ,OAAO;;;;;EAKxB,OAAO,OAAO,UAAU;;;;;;;;;;;;;;;;qBAyBf;GACX,kBAAkB,eAClB,cAAc,SAAO,OAEd,kCAAkC,WAAW,yBAAM,IAAA"}

package/dist/components/data-table/toolbar/data-table-sort-direction-select.js

@@ -0,0 +1,66 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useSelector } from "@tanstack/react-store";
+import { Select } from "@lucasbernardosn/react-ui/collections/select";
+//#region src/components/data-table/toolbar/data-table-sort-direction-select.tsx
+const DEFAULT_LABELS = {
+	asc: "Crescente",
+	desc: "Decrescente"
+};
+const DIRECTIONS = ["asc", "desc"];
+/**
+* O select da direção da ordenação, para ir junto com o `DataTable.SortColumnSelect`. Troca a
+* direção da primeira coluna da ordenação; sem ordenação, fica desabilitado.
+*
+* Renderiza o `Select` do `ui` por dentro; as props passam para o trigger.
+*
+* @example
+* ```tsx
+* <DataTable.SortDirectionSelect
+*   table={table}
+*   labels={{ asc: 'A–Z', desc: 'Z–A' }}
+* />
+* ```
+*/
+const DataTableSortDirectionSelect = (props) => {
+	const { table, labels, size = "sm", disabled, ...rest } = props;
+	/**
+	* A direção da primeira coluna da ordenação, ou `null` sem ordenação. Re-renderiza quando
+	* muda.
+	*/
+	const direction = useSelector(table.atoms.sorting, (sorting) => sorting[0] ? sorting[0].desc ? "desc" : "asc" : null);
+	const items = DIRECTIONS.map((value) => ({
+		label: labels?.[value] ?? DEFAULT_LABELS[value],
+		value
+	}));
+	/** Sem ordenação, o trigger mostra a crescente, desabilitado, para não ficar vazio. */
+	const placeholder = labels?.asc ?? DEFAULT_LABELS.asc;
+	return /* @__PURE__ */ jsxs(Select.Root, {
+		size,
+		value: direction,
+		items,
+		disabled: disabled || direction === null,
+		onValueChange: (value) => {
+			if (value !== null) table.setSorting(([first, ...others]) => first ? [{
+				...first,
+				desc: value === "desc"
+			}, ...others] : []);
+		},
+		children: [/* @__PURE__ */ jsxs(Select.Trigger, {
+			"data-component": "DataTable.SortDirectionSelect",
+			"aria-label": "Direção da ordenação",
+			...rest,
+			children: [/* @__PURE__ */ jsx(Select.Value, { placeholder }), /* @__PURE__ */ jsx(Select.Icon, {})]
+		}), /* @__PURE__ */ jsx(Select.Portal, { children: /* @__PURE__ */ jsx(Select.Positioner, {
+			alignItemWithTrigger: false,
+			children: /* @__PURE__ */ jsx(Select.Popup, { children: /* @__PURE__ */ jsx(Select.List, { children: items.map((item) => /* @__PURE__ */ jsxs(Select.Item, {
+				value: item.value,
+				children: [/* @__PURE__ */ jsx(Select.ItemIndicator, {}), /* @__PURE__ */ jsx(Select.ItemText, { children: item.label })]
+			}, item.value)) }) })
+		}) })]
+	});
+};
+DataTableSortDirectionSelect.displayName = "DataTable.SortDirectionSelect";
+//#endregion
+export { DataTableSortDirectionSelect };
+
+//# sourceMappingURL=data-table-sort-direction-select.js.map

package/dist/components/data-table/toolbar/data-table-sort-direction-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-sort-direction-select.js","names":[],"sources":["../../../../src/components/data-table/toolbar/data-table-sort-direction-select.tsx"],"sourcesContent":["import { Select } from '@lucasbernardosn/react-ui/collections/select';\nimport type { MergeOverride } from '@lucasbernardosn/utils';\nimport { useSelector } from '@tanstack/react-store';\nimport type {\n  RowData,\n  SortDirection,\n  TableFeatures,\n} from '@tanstack/react-table';\nimport type { TableWith } from '../../../types';\n\nexport type DataTableSortDirectionSelectProps<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n> = MergeOverride<\n  Select.TriggerProps,\n  {\n    /** A tabela. Exige `rowSortingFeature`. */\n    table: TableWith<TFeatures, TData, 'rowSortingFeature'>;\n    /**\n     * O nome de cada direção.\n     * @default { asc: 'Crescente', desc: 'Decrescente' }\n     */\n    labels?: Partial<Record<SortDirection, string>>;\n    /**\n     * O tamanho do select.\n     * @default 'sm'\n     */\n    size?: Select.RootProps<SortDirection>['size'];\n  }\n>;\n\nconst DEFAULT_LABELS: Record<SortDirection, string> = {\n  asc: 'Crescente',\n  desc: 'Decrescente',\n};\n\nconst DIRECTIONS: SortDirection[] = ['asc', 'desc'];\n\n/**\n * O select da direção da ordenação, para ir junto com o `DataTable.SortColumnSelect`. Troca a\n * direção da primeira coluna da ordenação; sem ordenação, fica desabilitado.\n *\n * Renderiza o `Select` do `ui` por dentro; as props passam para o trigger.\n *\n * @example\n * ```tsx\n * <DataTable.SortDirectionSelect\n *   table={table}\n *   labels={{ asc: 'A–Z', desc: 'Z–A' }}\n * />\n * ```\n */\nexport const DataTableSortDirectionSelect = <\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(\n  props: DataTableSortDirectionSelectProps<TFeatures, TData>,\n) => {\n  const { table, labels, size = 'sm', disabled, ...rest } = props;\n\n  /**\n   * A direção da primeira coluna da ordenação, ou `null` sem ordenação. Re-renderiza quando\n   * muda.\n   */\n  const direction = useSelector(\n    table.atoms.sorting,\n    (sorting): SortDirection | null =>\n      sorting[0] ? (sorting[0].desc ? 'desc' : 'asc') : null,\n  );\n\n  const items = DIRECTIONS.map((value) => ({\n    label: labels?.[value] ?? DEFAULT_LABELS[value],\n    value,\n  }));\n\n  /** Sem ordenação, o trigger mostra a crescente, desabilitado, para não ficar vazio. */\n  const placeholder = labels?.asc ?? DEFAULT_LABELS.asc;\n\n  return (\n    <Select.Root<SortDirection>\n      size={size}\n      value={direction}\n      items={items}\n      disabled={disabled || direction === null}\n      onValueChange={(value) => {\n        if (value !== null) {\n          table.setSorting(([first, ...others]) =>\n            first ? [{ ...first, desc: value === 'desc' }, ...others] : [],\n          );\n        }\n      }}\n    >\n      <Select.Trigger\n        data-component=\"DataTable.SortDirectionSelect\"\n        aria-label=\"Direção da ordenação\"\n        {...rest}\n      >\n        <Select.Value placeholder={placeholder} />\n        <Select.Icon />\n      </Select.Trigger>\n\n      <Select.Portal>\n        <Select.Positioner alignItemWithTrigger={false}>\n          <Select.Popup>\n            <Select.List>\n              {items.map((item) => (\n                <Select.Item\n                  key={item.value}\n                  value={item.value}\n                >\n                  <Select.ItemIndicator />\n                  <Select.ItemText>{item.label}</Select.ItemText>\n                </Select.Item>\n              ))}\n            </Select.List>\n          </Select.Popup>\n        </Select.Positioner>\n      </Select.Portal>\n    </Select.Root>\n  );\n};\n\nDataTableSortDirectionSelect.displayName = 'DataTable.SortDirectionSelect';\n"],"mappings":";;;;AA+BA,MAAM,iBAAgD;CACpD,KAAK;CACL,MAAM;AACR;AAEA,MAAM,aAA8B,CAAC,OAAO,MAAM;;;;;;;;;;;;;;;AAgBlD,MAAa,gCAIX,UACG;CACH,MAAM,EAAE,OAAO,QAAQ,OAAO,MAAM,UAAU,GAAG,SAAS;;;;;CAM1D,MAAM,YAAY,YAChB,MAAM,MAAM,UACX,YACC,QAAQ,KAAM,QAAQ,EAAE,CAAC,OAAO,SAAS,QAAS,IACtD;CAEA,MAAM,QAAQ,WAAW,KAAK,WAAW;EACvC,OAAO,SAAS,UAAU,eAAe;EACzC;CACF,EAAE;;CAGF,MAAM,cAAc,QAAQ,OAAO,eAAe;CAElD,OACE,qBAAC,OAAO,MAAR;EACQ;EACN,OAAO;EACA;EACP,UAAU,YAAY,cAAc;EACpC,gBAAgB,UAAU;GACxB,IAAI,UAAU,MACZ,MAAM,YAAY,CAAC,OAAO,GAAG,YAC3B,QAAQ,CAAC;IAAE,GAAG;IAAO,MAAM,UAAU;GAAO,GAAG,GAAG,MAAM,IAAI,CAAC,CAC/D;EAEJ;EAXF,UAAA,CAaE,qBAAC,OAAO,SAAR;GACE,kBAAe;GACf,cAAW;GACX,GAAI;GAHN,UAAA,CAKE,oBAAC,OAAO,OAAR,EAA2B,YAAc,CAAA,GACzC,oBAAC,OAAO,MAAR,CAAc,CAAA,CACA;EAEhB,CAAA,GAAA,oBAAC,OAAO,QAAR,EAAA,UACE,oBAAC,OAAO,YAAR;GAAmB,sBAAsB;GACvC,UAAA,oBAAC,OAAO,OAAR,EAAA,UACE,oBAAC,OAAO,MAAR,EAAA,UACG,MAAM,KAAK,SACV,qBAAC,OAAO,MAAR;IAEE,OAAO,KAAK;IAFd,UAAA,CAIE,oBAAC,OAAO,eAAR,CAAuB,CAAA,GACvB,oBAAC,OAAO,UAAR,EAAA,UAAkB,KAAK,MAAuB,CAAA,CACnC;GALN,GAAA,KAAK,KAKC,CACd,EACU,CAAA,EACD,CAAA;EACG,CAAA,EACN,CAAA,CACJ;;AAEjB;AAEA,6BAA6B,cAAc"}

package/dist/features/active-row/active-row-feature.d.ts

@@ -0,0 +1,22 @@
+import { TableFeature } from "@tanstack/react-table";
+//#region src/features/active-row/active-row-feature.d.ts
+/**
+ * Feature do TanStack Table para a linha ativa, a do teclado. Registre com essa chave:
+ * `tableFeatures({ activeRowFeature })`.
+ *
+ * Guarda o id da linha ativa. Com ela, o `DataTable.Root` vira `role="grid"`, e as setas andam
+ * entre as `DataTable.Row`, que gravam a linha que recebe o foco, do teclado ou do clique. A
+ * linha ativa é separada da seleção.
+ *
+ * @example
+ * ```ts
+ * const features = tableFeatures({ columnSizingFeature, activeRowFeature });
+ *
+ * const table = useTable({ features, columns, data });
+ *
+ * table.getActiveRow()?.original;
+ * ```
+ */
+export declare const activeRowFeature: TableFeature;
+//#endregion
+//# sourceMappingURL=active-row-feature.d.ts.map

package/dist/features/active-row/active-row-feature.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"active-row-feature.d.ts","names":[],"sources":["../../../src/features/active-row/active-row-feature.ts"],"mappings":";;;;;;;;;;;;;;;;;;;qBAmCa,kBAAkB"}

package/dist/features/active-row/active-row-feature.js

@@ -0,0 +1,55 @@
+import { hasRowFeature, hasTableFeature } from "../../utils/has-feature.js";
+import { assignPrototypeAPIs, assignTableAPIs, makeStateUpdater, setStateSlice } from "@tanstack/react-table";
+//#region src/features/active-row/active-row-feature.ts
+/** A linha ativa de um estado inicial, ou nenhuma quando ele não traz. */
+const getInitialActiveRowId = (initialState) => initialState.activeRowId ?? null;
+/**
+* Feature do TanStack Table para a linha ativa, a do teclado. Registre com essa chave:
+* `tableFeatures({ activeRowFeature })`.
+*
+* Guarda o id da linha ativa. Com ela, o `DataTable.Root` vira `role="grid"`, e as setas andam
+* entre as `DataTable.Row`, que gravam a linha que recebe o foco, do teclado ou do clique. A
+* linha ativa é separada da seleção.
+*
+* @example
+* ```ts
+* const features = tableFeatures({ columnSizingFeature, activeRowFeature });
+*
+* const table = useTable({ features, columns, data });
+*
+* table.getActiveRow()?.original;
+* ```
+*/
+const activeRowFeature = {
+	getInitialState: (initialState) => ({
+		activeRowId: null,
+		...initialState
+	}),
+	getDefaultTableOptions: (table) => ({ onActiveRowIdChange: makeStateUpdater("activeRowId", table) }),
+	constructTableAPIs: (table) => {
+		assignTableAPIs("activeRowFeature", table, {
+			table_setActiveRowId: { fn: (updater) => setStateSlice(table, "activeRowId", updater) },
+			table_resetActiveRowId: { fn: (defaultState) => setStateSlice(table, "activeRowId", defaultState ? null : getInitialActiveRowId(table.initialState)) },
+			table_getActiveRow: { 
+			/**
+			* O guard só tipa os atoms da tabela: com a feature registrada, ele sempre passa.
+			*/
+fn: () => {
+				const activeRowId = hasTableFeature(table, "activeRowFeature") ? table.atoms.activeRowId.get() : null;
+				return activeRowId === null ? void 0 : table.getRowModel().rowsById[activeRowId];
+			} }
+		});
+	},
+	assignRowPrototype: (prototype, table) => {
+		assignPrototypeAPIs("activeRowFeature", prototype, table, { row_getIsActive: { 
+		/**
+		* O TanStack chama com a linha de uma tabela qualquer; o guard tipa o atom, e com a
+		* feature registrada sempre passa.
+		*/
+fn: (row) => hasRowFeature(row, "activeRowFeature") && row.table.atoms.activeRowId.get() === row.id } });
+	}
+};
+//#endregion
+export { activeRowFeature };
+
+//# sourceMappingURL=active-row-feature.js.map

package/dist/features/active-row/active-row-feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"active-row-feature.js","names":[],"sources":["../../../src/features/active-row/active-row-feature.ts"],"sourcesContent":["import {\n  assignPrototypeAPIs,\n  assignTableAPIs,\n  makeStateUpdater,\n  type Row,\n  type RowData,\n  setStateSlice,\n  type TableFeature,\n  type TableFeatures,\n  type TableState_All,\n  type Updater,\n} from '@tanstack/react-table';\nimport { hasRowFeature, hasTableFeature } from '../../utils';\n\n/** A linha ativa de um estado inicial, ou nenhuma quando ele não traz. */\nconst getInitialActiveRowId = (initialState: Partial<TableState_All>) =>\n  initialState.activeRowId ?? null;\n\n/**\n * Feature do TanStack Table para a linha ativa, a do teclado. Registre com essa chave:\n * `tableFeatures({ activeRowFeature })`.\n *\n * Guarda o id da linha ativa. Com ela, o `DataTable.Root` vira `role=\"grid\"`, e as setas andam\n * entre as `DataTable.Row`, que gravam a linha que recebe o foco, do teclado ou do clique. A\n * linha ativa é separada da seleção.\n *\n * @example\n * ```ts\n * const features = tableFeatures({ columnSizingFeature, activeRowFeature });\n *\n * const table = useTable({ features, columns, data });\n *\n * table.getActiveRow()?.original;\n * ```\n */\nexport const activeRowFeature: TableFeature = {\n  getInitialState: (initialState) => ({\n    activeRowId: null,\n    ...initialState,\n  }),\n\n  getDefaultTableOptions: (table) => ({\n    onActiveRowIdChange: makeStateUpdater('activeRowId', table),\n  }),\n\n  constructTableAPIs: (table) => {\n    assignTableAPIs('activeRowFeature', table, {\n      table_setActiveRowId: {\n        fn: (updater: Updater<string | null>) =>\n          setStateSlice(table, 'activeRowId', updater),\n      },\n      table_resetActiveRowId: {\n        fn: (defaultState?: boolean) =>\n          setStateSlice(\n            table,\n            'activeRowId',\n            defaultState ? null : getInitialActiveRowId(table.initialState),\n          ),\n      },\n      table_getActiveRow: {\n        /**\n         * O guard só tipa os atoms da tabela: com a feature registrada, ele sempre passa.\n         */\n        fn: () => {\n          const activeRowId = hasTableFeature(table, 'activeRowFeature')\n            ? table.atoms.activeRowId.get()\n            : null;\n\n          return activeRowId === null\n            ? undefined\n            : table.getRowModel().rowsById[activeRowId];\n        },\n      },\n    });\n  },\n\n  assignRowPrototype: (prototype, table) => {\n    assignPrototypeAPIs('activeRowFeature', prototype, table, {\n      row_getIsActive: {\n        /**\n         * O TanStack chama com a linha de uma tabela qualquer; o guard tipa o atom, e com a\n         * feature registrada sempre passa.\n         */\n        fn: (row: Row<TableFeatures, RowData>) =>\n          hasRowFeature(row, 'activeRowFeature') &&\n          row.table.atoms.activeRowId.get() === row.id,\n      },\n    });\n  },\n};\n"],"mappings":";;;;AAeA,MAAM,yBAAyB,iBAC7B,aAAa,eAAe;;;;;;;;;;;;;;;;;;AAmB9B,MAAa,mBAAiC;CAC5C,kBAAkB,kBAAkB;EAClC,aAAa;EACb,GAAG;CACL;CAEA,yBAAyB,WAAW,EAClC,qBAAqB,iBAAiB,eAAe,KAAK,EAC5D;CAEA,qBAAqB,UAAU;EAC7B,gBAAgB,oBAAoB,OAAO;GACzC,sBAAsB,EACpB,KAAK,YACH,cAAc,OAAO,eAAe,OAAO,EAC/C;GACA,wBAAwB,EACtB,KAAK,iBACH,cACE,OACA,eACA,eAAe,OAAO,sBAAsB,MAAM,YAAY,CAChE,EACJ;GACA,oBAAoB;;;;AAIlB,UAAU;IACR,MAAM,cAAc,gBAAgB,OAAO,kBAAkB,IACzD,MAAM,MAAM,YAAY,IAAI,IAC5B;IAEJ,OAAO,gBAAgB,OACnB,KAAA,IACA,MAAM,YAAY,CAAC,CAAC,SAAS;GACnC,EACF;EACF,CAAC;CACH;CAEA,qBAAqB,WAAW,UAAU;EACxC,oBAAoB,oBAAoB,WAAW,OAAO,EACxD,iBAAiB;;;;;AAKf,KAAK,QACH,cAAc,KAAK,kBAAkB,KACrC,IAAI,MAAM,MAAM,YAAY,IAAI,MAAM,IAAI,GAC9C,EACF,CAAC;CACH;AACF"}

package/dist/features/active-row/active-row-feature.types.d.ts

@@ -0,0 +1,64 @@
+import { OnChangeFn, Row, RowData, TableFeature, TableFeatures, Updater } from "@tanstack/react-table";
+//#region src/features/active-row/active-row-feature.types.d.ts
+/** O estado da feature. */
+export type TableState_ActiveRow = {
+  /**
+   * O id da linha ativa, a do teclado: a que tem o ponto de Tab e recebe as teclas. Separada da
+   * seleção, que é a do checkbox.
+   * @default null
+   */
+  activeRowId: string | null;
+};
+/** As opções da feature. */
+export type TableOptions_ActiveRow = {
+  /**
+   * Chamada a cada troca da linha ativa, com o updater. Sem ela, a tabela guarda a linha ativa
+   * sozinha. Para controlar o estado, passe esta função e `state.activeRowId`.
+   */
+  onActiveRowIdChange?: OnChangeFn<string | null>;
+};
+/** As APIs da feature na tabela. */
+export type Table_ActiveRow<TFeatures extends TableFeatures, TData extends RowData> = {
+  /** Troca a linha ativa, com um id, `null` ou um updater. */
+  setActiveRowId: (updater: Updater<string | null>) => void;
+  /**
+   * Volta a linha ativa à do `initialState`. Com `defaultState`, volta ao padrão da feature,
+   * `null`.
+   */
+  resetActiveRowId: (defaultState?: boolean) => void;
+  /**
+   * A linha ativa, se ela está no row model atual. Fora dele, como numa linha apagada ou de
+   * outra página, `undefined`.
+   */
+  getActiveRow: () => Row<TFeatures, TData> | undefined;
+};
+/** As APIs da feature na linha. */
+export type Row_ActiveRow = {
+  /** Se esta é a linha ativa. */
+  getIsActive: () => boolean;
+};
+declare module '@tanstack/react-table' {
+  interface Plugins {
+    activeRowFeature: TableFeature;
+  }
+  interface TableState_FeatureMap {
+    activeRowFeature: TableState_ActiveRow;
+  }
+  /**
+   * O `TableState_All` não junta os plugins sozinho. Sem a chave aqui, o `setStateSlice` e a
+   * leitura do `initialState` dentro da feature não a conhecem. Opcional, como as chaves do
+   * TanStack.
+   */
+  interface TableState_All extends Partial<TableState_ActiveRow> {}
+  interface TableOptions_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
+    activeRowFeature: TableOptions_ActiveRow;
+  }
+  interface Table_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
+    activeRowFeature: Table_ActiveRow<TFeatures, TData>;
+  }
+  interface Row_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
+    activeRowFeature: Row_ActiveRow;
+  }
+}
+//#endregion
+//# sourceMappingURL=active-row-feature.types.d.ts.map

package/dist/features/active-row/active-row-feature.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"active-row-feature.types.d.ts","names":[],"sources":["../../../src/features/active-row/active-row-feature.types.ts"],"mappings":";;;YAWY;;;;;;EAMV;;;YAIU;;;;;EAKV,sBAAsB;;;YAIZ,gBACV,kBAAkB,eAClB,cAAc;;EAGd,iBAAiB,SAAS;;;;;EAK1B,mBAAmB;;;;;EAKnB,oBAAoB,IAAI,WAAW;;;YAIzB;;EAEV;;;YASU;IACR,kBAAkB;;YAGV;IACR,kBAAkB;;;;;;;YAQV,uBAAuB,QAAQ;YAE/B,wBACR,kBAAkB,eAClB,cAAc;IAEd,kBAAkB;;YAGV,iBACR,kBAAkB,eAClB,cAAc;IAEd,kBAAkB,gBAAgB,WAAW;;YAGrC,eACR,kBAAkB,eAClB,cAAc;IAEd,kBAAkB"}

package/dist/features/column-alignment/column-alignment-feature.d.ts

@@ -0,0 +1,23 @@
+import { TableFeature } from "@tanstack/react-table";
+//#region src/features/column-alignment/column-alignment-feature.d.ts
+/**
+ * Feature do TanStack Table para o alinhamento por coluna. Registre com essa chave:
+ * `tableFeatures({ columnAlignmentFeature })`.
+ *
+ * Não tem estado: o alinhamento vem do `align` da definição da coluna, e não muda em runtime. A
+ * `DataTable.Cell` e a `DataTable.HeaderCell` o leem por `column.getAlign()` e o marcam em
+ * `data-align`.
+ *
+ * @example
+ * ```ts
+ * const features = tableFeatures({ columnSizingFeature, columnAlignmentFeature });
+ *
+ * const columns = columnHelper.columns([
+ *   columnHelper.accessor('name', { header: 'Nome' }),
+ *   columnHelper.accessor('total', { header: 'Total', align: 'end' }),
+ * ]);
+ * ```
+ */
+export declare const columnAlignmentFeature: TableFeature;
+//#endregion
+//# sourceMappingURL=column-alignment-feature.d.ts.map

package/dist/features/column-alignment/column-alignment-feature.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"column-alignment-feature.d.ts","names":[],"sources":["../../../src/features/column-alignment/column-alignment-feature.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;qBA8Ba,wBAAwB"}

package/dist/features/column-alignment/column-alignment-feature.js

@@ -0,0 +1,34 @@
+import { assignPrototypeAPIs } from "@tanstack/react-table";
+//#region src/features/column-alignment/column-alignment-feature.ts
+/** O alinhamento de uma coluna sem `align` na definição. */
+const DEFAULT_COLUMN_ALIGN = "start";
+/**
+* Feature do TanStack Table para o alinhamento por coluna. Registre com essa chave:
+* `tableFeatures({ columnAlignmentFeature })`.
+*
+* Não tem estado: o alinhamento vem do `align` da definição da coluna, e não muda em runtime. A
+* `DataTable.Cell` e a `DataTable.HeaderCell` o leem por `column.getAlign()` e o marcam em
+* `data-align`.
+*
+* @example
+* ```ts
+* const features = tableFeatures({ columnSizingFeature, columnAlignmentFeature });
+*
+* const columns = columnHelper.columns([
+*   columnHelper.accessor('name', { header: 'Nome' }),
+*   columnHelper.accessor('total', { header: 'Total', align: 'end' }),
+* ]);
+* ```
+*/
+const columnAlignmentFeature = { assignColumnPrototype: (prototype, table) => {
+	assignPrototypeAPIs("columnAlignmentFeature", prototype, table, { column_getAlign: { 
+	/**
+	* O TanStack chama com a coluna de uma tabela qualquer: o tipo com todas as features é o
+	* que conhece o `align`.
+	*/
+fn: (column) => column.columnDef.align ?? DEFAULT_COLUMN_ALIGN } });
+} };
+//#endregion
+export { columnAlignmentFeature };
+
+//# sourceMappingURL=column-alignment-feature.js.map

package/dist/features/column-alignment/column-alignment-feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"column-alignment-feature.js","names":[],"sources":["../../../src/features/column-alignment/column-alignment-feature.ts"],"sourcesContent":["import {\n  assignPrototypeAPIs,\n  type Column,\n  type RowData,\n  type TableFeature,\n  type TableFeatures,\n} from '@tanstack/react-table';\nimport type { ColumnAlign } from './column-alignment-feature.types';\n\n/** O alinhamento de uma coluna sem `align` na definição. */\nconst DEFAULT_COLUMN_ALIGN: ColumnAlign = 'start';\n\n/**\n * Feature do TanStack Table para o alinhamento por coluna. Registre com essa chave:\n * `tableFeatures({ columnAlignmentFeature })`.\n *\n * Não tem estado: o alinhamento vem do `align` da definição da coluna, e não muda em runtime. A\n * `DataTable.Cell` e a `DataTable.HeaderCell` o leem por `column.getAlign()` e o marcam em\n * `data-align`.\n *\n * @example\n * ```ts\n * const features = tableFeatures({ columnSizingFeature, columnAlignmentFeature });\n *\n * const columns = columnHelper.columns([\n *   columnHelper.accessor('name', { header: 'Nome' }),\n *   columnHelper.accessor('total', { header: 'Total', align: 'end' }),\n * ]);\n * ```\n */\nexport const columnAlignmentFeature: TableFeature = {\n  assignColumnPrototype: (prototype, table) => {\n    assignPrototypeAPIs('columnAlignmentFeature', prototype, table, {\n      column_getAlign: {\n        /**\n         * O TanStack chama com a coluna de uma tabela qualquer: o tipo com todas as features é o\n         * que conhece o `align`.\n         */\n        fn: (column: Column<TableFeatures, RowData>) =>\n          column.columnDef.align ?? DEFAULT_COLUMN_ALIGN,\n      },\n    });\n  },\n};\n"],"mappings":";;;AAUA,MAAM,uBAAoC;;;;;;;;;;;;;;;;;;;AAoB1C,MAAa,yBAAuC,EAClD,wBAAwB,WAAW,UAAU;CAC3C,oBAAoB,0BAA0B,WAAW,OAAO,EAC9D,iBAAiB;;;;;AAKf,KAAK,WACH,OAAO,UAAU,SAAS,qBAC9B,EACF,CAAC;AACH,EACF"}

package/dist/features/column-alignment/column-alignment-feature.types.d.ts

@@ -0,0 +1,34 @@
+import { CellData, RowData, TableFeature, TableFeatures } from "@tanstack/react-table";
+//#region src/features/column-alignment/column-alignment-feature.types.d.ts
+/**
+ * O alinhamento do conteúdo de uma coluna. Em direção lógica: `start` e `end` seguem a direção
+ * do texto, à esquerda e à direita num idioma LTR.
+ */
+export type ColumnAlign = 'start' | 'center' | 'end';
+/** As opções da feature na definição da coluna. */
+export type ColumnDef_ColumnAlignment = {
+  /**
+   * O alinhamento do conteúdo das células e do header da coluna. Para mudar o padrão da tabela
+   * inteira, passe no `defaultColumn`.
+   * @default 'start'
+   */
+  align?: ColumnAlign;
+};
+/** As APIs da feature na coluna. */
+export type Column_ColumnAlignment = {
+  /** O alinhamento da coluna: o `align` da definição, ou `'start'`. */
+  getAlign: () => ColumnAlign;
+};
+declare module '@tanstack/react-table' {
+  interface Plugins {
+    columnAlignmentFeature: TableFeature;
+  }
+  interface ColumnDef_FeatureMap<TFeatures extends TableFeatures, TData extends RowData, TValue extends CellData> {
+    columnAlignmentFeature: ColumnDef_ColumnAlignment;
+  }
+  interface Column_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
+    columnAlignmentFeature: Column_ColumnAlignment;
+  }
+}
+//#endregion
+//# sourceMappingURL=column-alignment-feature.types.d.ts.map

package/dist/features/column-alignment/column-alignment-feature.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"column-alignment-feature.types.d.ts","names":[],"sources":["../../../src/features/column-alignment/column-alignment-feature.types.ts"],"mappings":";;;;;;YAYY;;YAGA;;;;;;EAMV,QAAQ;;;YAIE;;EAEV,gBAAgB;;;YASN;IACR,wBAAwB;;YAGhB,qBACR,kBAAkB,eAClB,cAAc,SACd,eAAe;IAEf,wBAAwB;;YAGhB,kBACR,kBAAkB,eAClB,cAAc;IAEd,wBAAwB"}

package/dist/features/index.d.ts

@@ -0,0 +1,9 @@
+import { activeRowFeature } from "./active-row/active-row-feature.js";
+import { Row_ActiveRow, TableOptions_ActiveRow, TableState_ActiveRow, Table_ActiveRow } from "./active-row/active-row-feature.types.js";
+import { columnAlignmentFeature } from "./column-alignment/column-alignment-feature.js";
+import { ColumnAlign, ColumnDef_ColumnAlignment, Column_ColumnAlignment } from "./column-alignment/column-alignment-feature.types.js";
+import { loadingFeature } from "./loading/loading-feature.js";
+import { TableOptions_Loading, TableState_Loading, Table_Loading } from "./loading/loading-feature.types.js";
+import { rowDensityFeature } from "./row-density/row-density-feature.js";
+import { RowDensity, TableOptions_RowDensity, TableState_RowDensity, Table_RowDensity } from "./row-density/row-density-feature.types.js";
+export { type ColumnAlign, type ColumnDef_ColumnAlignment, type Column_ColumnAlignment, type RowDensity, type Row_ActiveRow, type TableOptions_ActiveRow, type TableOptions_Loading, type TableOptions_RowDensity, type TableState_ActiveRow, type TableState_Loading, type TableState_RowDensity, type Table_ActiveRow, type Table_Loading, type Table_RowDensity, activeRowFeature, columnAlignmentFeature, loadingFeature, rowDensityFeature };