@infinite-table/infinite-react 0.0.4 → 0.0.5

package/index.d.ts

@@ -327,45 +327,6 @@ declare module "components/DataSource/state/getInitialState" {
         state: DataSourceState<T>;
     }): DataSourceDerivedState<T>;
 }
-declare module "components/DataSource/state/reducer" {
-    import type { DataSourceState, DataSourceDerivedState } from "components/DataSource/types";
-    export function concludeReducer<T>(params: {
-        previousState: DataSourceState<T> & DataSourceDerivedState<T>;
-        state: DataSourceState<T> & DataSourceDerivedState<T>;
-    }): DataSourceState<T> & DataSourceDerivedState<T>;
-}
-declare module "components/DataSource/index" {
-    import { DataSourceProps } from "components/DataSource/types";
-    import { useDataSource } from "components/DataSource/publicHooks/useDataSource";
-    import { GroupRowsState } from "components/DataSource/GroupRowsState";
-    function DataSource<T>(props: DataSourceProps<T>): JSX.Element;
-    export { useDataSource, DataSource, GroupRowsState };
-    export * from "components/DataSource/types";
-}
-declare module "components/DataSource/GroupRowsState" {
-    import { DataSourceExpandedAndCollapsedGroupRows } from "components/DataSource/index";
-    export class GroupRowsState<KeyType extends any = any> {
-        private expandedMap?;
-        private collapsedMap?;
-        private collapsedAll;
-        private expandedAll;
-        private initialState;
-        constructor(state: DataSourceExpandedAndCollapsedGroupRows<KeyType> | GroupRowsState<KeyType>);
-        getState(): DataSourceExpandedAndCollapsedGroupRows<KeyType>;
-        destroy(): void;
-        private update;
-        areAllCollapsed(): boolean;
-        areAllExpanded(): boolean;
-        collapseAll(): void;
-        expandAll(): void;
-        isGroupRowExpanded(keys: KeyType[]): boolean | undefined;
-        isGroupRowCollapsed(keys: KeyType[]): boolean;
-        setGroupRowExpanded(keys: KeyType[], shouldExpand: boolean): void;
-        collapseGroupRow(keys: KeyType[]): void;
-        expandGroupRow(keys: KeyType[]): void;
-        toggleGroupRow(keys: KeyType[]): void;
-    }
-}
 declare module "components/types/Renderable" {
     import * as React from 'react';
     export type Renderable = React.ReactNode;
@@ -393,6 +354,7 @@ declare module "components/InfiniteTable/types/InfiniteTableColumn" {
     import type { DiscriminatedUnion, RequireAtLeastOne } from "components/InfiniteTable/types/Utility";
     import type { InfiniteTableRowInfo } from "components/InfiniteTable/types/index";
     import { CSSProperties } from 'react';
+    import { PivotBy } from "utils/groupAndPivot/index";
     export type { DiscriminatedUnion, RequireAtLeastOne };
     export type InfiniteTableToggleGroupRowFn = (groupKeys: any[]) => void;
     export interface InfiniteTableColumnRenderParam<DATA_TYPE, COL_TYPE = InfiniteTableComputedColumn<DATA_TYPE>> {
@@ -495,7 +457,16 @@ declare module "components/InfiniteTable/types/InfiniteTableColumn" {
         pivotColumn?: true;
         pivotTotalColumn?: true;
         pivotGroupKeys?: any[];
-        renderValue?: InfiniteTableColumnRenderValueFunction<T>;
+        pivotByForColumn?: DataSourcePivotBy<T>;
+        pivotIndexForColumn?: number;
+        pivotGroupKeyForColumn?: any;
+    };
+    export type InfiniteTablePivotFinalColumn<DataType, KeyType extends any = any> = InfiniteTablePivotColumn<DataType> & {
+        pivotBy: DataSourcePivotBy<DataType>[];
+        pivotGroupKeys: KeyType[];
+        pivotByForColumn: PivotBy<DataType, KeyType>;
+        pivotIndexForColumn: number;
+        pivotGroupKeyForColumn: KeyType;
     };
     type InfiniteTableComputedColumnBase<T> = {
         computedWidth: number;
@@ -521,12 +492,61 @@ declare module "components/InfiniteTable/types/InfiniteTableColumn" {
     };
     export type InfiniteTableComputedColumn<T> = InfiniteTableColumn<T> & InfiniteTableComputedColumnBase<T> & InfiniteTablePivotColumn<T> & InfiniteTableGeneratedGroupColumn<T>;
 }
+declare module "utils/groupAndPivot/getPivotColumnsAndColumnGroups" {
+    import type { DataSourcePivotBy } from "components/DataSource/index";
+    import type { InfiniteTablePropColumnGroups, InfiniteTablePropColumns } from "components/InfiniteTable/index";
+    import type { InfiniteTablePivotColumn } from "components/InfiniteTable/types/InfiniteTableColumn";
+    import type { InfiniteTablePropPivotTotalColumnPosition } from "components/InfiniteTable/types/InfiniteTableState";
+    import { DeepMap } from "utils/DeepMap";
+    export type ComputedColumnsAndGroups<DataType> = {
+        columns: InfiniteTablePropColumns<DataType, InfiniteTablePivotColumn<DataType>>;
+        columnGroups: InfiniteTablePropColumnGroups;
+    };
+    export function getPivotColumnsAndColumnGroups<DataType, KeyType = any>(deepMap: DeepMap<KeyType, boolean>, pivotBy: DataSourcePivotBy<DataType>[], pivotTotalColumnPosition: InfiniteTablePropPivotTotalColumnPosition): ComputedColumnsAndGroups<DataType>;
+}
+declare module "components/DataSource/state/reducer" {
+    import type { DataSourceState, DataSourceDerivedState } from "components/DataSource/types";
+    export function concludeReducer<T>(params: {
+        previousState: DataSourceState<T> & DataSourceDerivedState<T>;
+        state: DataSourceState<T> & DataSourceDerivedState<T>;
+    }): DataSourceState<T> & DataSourceDerivedState<T>;
+}
+declare module "components/DataSource/index" {
+    import { DataSourceProps } from "components/DataSource/types";
+    import { useDataSource } from "components/DataSource/publicHooks/useDataSource";
+    import { GroupRowsState } from "components/DataSource/GroupRowsState";
+    function DataSource<T>(props: DataSourceProps<T>): JSX.Element;
+    export { useDataSource, DataSource, GroupRowsState };
+    export * from "components/DataSource/types";
+}
+declare module "components/DataSource/GroupRowsState" {
+    import { DataSourceExpandedAndCollapsedGroupRows } from "components/DataSource/index";
+    export class GroupRowsState<KeyType extends any = any> {
+        private expandedMap?;
+        private collapsedMap?;
+        private collapsedAll;
+        private expandedAll;
+        private initialState;
+        constructor(state: DataSourceExpandedAndCollapsedGroupRows<KeyType> | GroupRowsState<KeyType>);
+        getState(): DataSourceExpandedAndCollapsedGroupRows<KeyType>;
+        destroy(): void;
+        private update;
+        areAllCollapsed(): boolean;
+        areAllExpanded(): boolean;
+        collapseAll(): void;
+        expandAll(): void;
+        isGroupRowExpanded(keys: KeyType[]): boolean | undefined;
+        isGroupRowCollapsed(keys: KeyType[]): boolean;
+        setGroupRowExpanded(keys: KeyType[], shouldExpand: boolean): void;
+        collapseGroupRow(keys: KeyType[]): void;
+        expandGroupRow(keys: KeyType[]): void;
+        toggleGroupRow(keys: KeyType[]): void;
+    }
+}
 declare module "utils/groupAndPivot/index" {
-    import { DataSourcePivotBy } from "@infinite-table/infinite-react";
     import { GroupRowsState } from "components/DataSource/GroupRowsState";
-    import { InfiniteTablePivotColumn } from "components/InfiniteTable/types/InfiniteTableColumn";
-    import { InfiniteTableGroupColumnBase, InfiniteTablePropColumnGroups, InfiniteTablePropColumns } from "components/InfiniteTable/types/InfiniteTableProps";
-    import { InfiniteTablePropPivotTotalColumnPosition } from "components/InfiniteTable/types/InfiniteTableState";
+    import { InfiniteTablePivotColumn, InfiniteTablePivotFinalColumn } from "components/InfiniteTable/types/InfiniteTableColumn";
+    import { InfiniteTableGroupColumnBase } from "components/InfiniteTable/types/InfiniteTableProps";
     import { DeepMap } from "utils/DeepMap";
     export type AggregationReducer<T, AggregationResultType> = {
         initialValue: AggregationResultType;
@@ -584,7 +604,11 @@ declare module "utils/groupAndPivot/index" {
         toKey?: (value: any, data: DataType) => GroupKeyType<KeyType>;
         column?: InfiniteTableGroupColumnBase<DataType>;
     };
-    export type PivotBy<DataType, KeyType> = GroupBy<DataType, KeyType>;
+    export type PivotBy<DataType, KeyType> = Omit<GroupBy<DataType, KeyType>, 'column'> & {
+        column?: InfiniteTablePivotColumn<DataType> | (({ column, }: {
+            column: InfiniteTablePivotFinalColumn<DataType, KeyType>;
+        }) => Partial<InfiniteTablePivotColumn<DataType>>);
+    };
     type GroupParams<DataType, KeyType> = {
         groupBy: GroupBy<DataType, KeyType>[];
         defaultToKey?: (value: any, item: DataType) => GroupKeyType<KeyType>;
@@ -610,11 +634,6 @@ declare module "utils/groupAndPivot/index" {
     export function enhancedFlatten<DataType, KeyType = any>(param: EnhancedFlattenParam<DataType, KeyType>): {
         data: InfiniteTableRowInfo<DataType>[];
     };
-    export type ComputedColumnsAndGroups<DataType> = {
-        columns: InfiniteTablePropColumns<DataType, InfiniteTablePivotColumn<DataType>>;
-        columnGroups: InfiniteTablePropColumnGroups;
-    };
-    export function getPivotColumnsAndColumnGroups<DataType, KeyType = any>(deepMap: DeepMap<KeyType, boolean>, pivotBy: DataSourcePivotBy<DataType>[], pivotTotalColumnPosition: InfiniteTablePropPivotTotalColumnPosition): ComputedColumnsAndGroups<DataType>;
 }
 declare module "components/InfiniteTable/theme.css" {
     export const ThemeVars: import("@vanilla-extract/private").MapLeafNodes<{
@@ -865,7 +884,7 @@ declare module "components/InfiniteTable/types/InfiniteTableProps" {
         groupCount: number;
         groupRowsBy: DataSourceGroupRowsBy<T>[];
     };
-    export type PivotColumnGetterOptions<T> = {
+    export type InfiniteTablePivotColumnGetterOptions<T> = {
         column: InfiniteTablePivotColumn<T>;
         groupRowsBy: DataSourcePropGroupRowsBy<T>;
         pivotBy: DataSourcePropPivotBy<T>;
@@ -879,7 +898,7 @@ declare module "components/InfiniteTable/types/InfiniteTableProps" {
     };
     export type InfiniteTablePropGroupColumn<T> = InfiniteTableGroupColumnBase<T> | InfiniteTableGroupColumnFunction<T>;
     export type InfiniteTableGroupColumnFunction<T> = (options: InfiniteTableGroupColumnGetterOptions<T>, toggleGroupRow: (groupKeys: any[]) => void) => InfiniteTableGroupColumnBase<T>;
-    export type InfiniteTablePropPivotColumn<T> = InfiniteTablePivotColumnBase<T> | ((options: PivotColumnGetterOptions<T>) => InfiniteTablePivotColumnBase<T>);
+    export type InfiniteTablePropPivotColumn<T> = InfiniteTablePivotColumnBase<T> | ((options: InfiniteTablePivotColumnGetterOptions<T>) => InfiniteTablePivotColumnBase<T>);
     export type InfiniteTablePropPivotRowLabelsColumn<T> = InfiniteTablePropPivotColumn<T>;
     export type InfiniteTablePropComponents = {
         LoadMask?: React.FC<LoadMaskProps>;
@@ -1177,8 +1196,8 @@ declare module "components/InfiniteTable/state/getInitialState" {
         pivotTotalColumnPosition: 1 | ((value: import("components/InfiniteTable/types/InfiniteTableState").InfiniteTablePropPivotTotalColumnPosition | undefined) => import("components/InfiniteTable/types/InfiniteTableState").InfiniteTablePropPivotTotalColumnPosition);
         pivotColumns: 1 | ((value: import("components/InfiniteTable/types").InfiniteTablePropColumns<T, import("components/InfiniteTable/types/InfiniteTableColumn").InfiniteTablePivotColumn<T>> | undefined) => import("components/InfiniteTable/types").InfiniteTablePropColumns<T, import("components/InfiniteTable/types/InfiniteTableColumn").InfiniteTablePivotColumn<T>> | undefined);
         pivotColumnGroups: 1 | ((value: import("components/InfiniteTable/types").InfiniteTablePropColumnGroups | undefined) => import("components/InfiniteTable/types").InfiniteTablePropColumnGroups | undefined);
-        sortable: 1 | ((value: boolean | undefined) => boolean);
         pivotColumn: 1 | ((value: Partial<import("components/InfiniteTable/types/InfiniteTableProps").InfiniteTablePropPivotColumn<T>> | undefined) => Partial<import("components/InfiniteTable/types/InfiniteTableProps").InfiniteTablePropPivotColumn<T>> | undefined);
+        sortable: 1 | ((value: boolean | undefined) => boolean);
         components: 1 | ((value: import("components/InfiniteTable/types").InfiniteTablePropComponents | undefined) => import("components/InfiniteTable/types").InfiniteTablePropComponents | undefined);
         groupColumn: 1 | ((value: Partial<InfiniteTablePropGroupColumn<T>> | undefined) => Partial<InfiniteTablePropGroupColumn<T>> | undefined);
         loadingText: 1 | ((value: import("react").ReactNode) => import("react").ReactNode);
@@ -1510,9 +1529,9 @@ declare module "components/InfiniteTable/hooks/useToggleGroupRow" {
     export function useToggleGroupRow<T>(): ToggleGrouRowFn;
 }
 declare module "components/InfiniteTable/hooks/useColumnsWhen" {
-    import { InfiniteTableColumn } from "components/InfiniteTable/index";
-    import { DataSourceGroupRowsBy } from "components/DataSource/index";
-    import { InfiniteTablePropGroupRenderStrategy, InfiniteTableProps } from "components/InfiniteTable/types/InfiniteTableProps";
+    import type { InfiniteTableColumn } from "components/InfiniteTable/index";
+    import type { DataSourceGroupRowsBy } from "components/DataSource/index";
+    import type { InfiniteTablePropGroupRenderStrategy, InfiniteTableProps } from "components/InfiniteTable/types/InfiniteTableProps";
     export function useColumnsWhen<T>(): void;
     export function getColumnsWhenGrouping<T>(params: {
         columns: Map<string, InfiniteTableColumn<T>>;

package/index.esm.js

@@ -2025,48 +2025,51 @@ function getComputedPivotColumnsFromDataSourcePivotColumns(pivotColumns, params)
       return;
     }
     let column = __spreadValues({}, col);
-    if (pivotColumn) {
-      if (typeof pivotColumn === "function") {
-        column = __spreadValues(__spreadValues({}, column), pivotColumn({
-          column,
-          pivotBy,
-          groupRowsBy
-        }));
-      } else {
-        column = __spreadValues(__spreadValues({}, column), pivotColumn);
-      }
-    }
     const isPivotRowLabelsColumn = !column.pivotColumn && !column.pivotTotalColumn;
-    if (pivotRowLabelsColumn && isPivotRowLabelsColumn) {
-      if (typeof pivotRowLabelsColumn === "function") {
-        column = __spreadValues(__spreadValues({}, column), pivotRowLabelsColumn({
-          column,
-          pivotBy,
-          groupRowsBy
-        }));
-      } else {
-        column = __spreadValues(__spreadValues({}, column), pivotRowLabelsColumn);
+    if (!isPivotRowLabelsColumn) {
+      if (pivotColumn) {
+        if (typeof pivotColumn === "function") {
+          column = __spreadValues(__spreadValues({}, column), pivotColumn({
+            column,
+            pivotBy,
+            groupRowsBy
+          }));
+        } else {
+          column = __spreadValues(__spreadValues({}, column), pivotColumn);
+        }
       }
-    }
-    if (isPivotRowLabelsColumn && !column.render) {
-      column.render = (renderOptions) => {
-        var _a;
-        let { value, rowInfo, column: column2, groupRowsBy: groupRowsBy2 } = renderOptions;
-        if (column2.renderValue) {
-          value = column2.renderValue(renderOptions);
+    } else {
+      if (pivotRowLabelsColumn) {
+        if (typeof pivotRowLabelsColumn === "function") {
+          column = __spreadValues(__spreadValues({}, column), pivotRowLabelsColumn({
+            column,
+            pivotBy,
+            groupRowsBy
+          }));
+        } else {
+          column = __spreadValues(__spreadValues({}, column), pivotRowLabelsColumn);
         }
-        const showExpanderIcon = (((_a = rowInfo.groupKeys) == null ? void 0 : _a.length) || 0) < groupRowsBy2.length;
-        return /* @__PURE__ */ createElement4("div", {
-          className: join(display.flex, alignItems.center, GroupRowExpanderCls)
-        }, showExpanderIcon ? /* @__PURE__ */ createElement4(ExpanderIcon, {
-          expanded: !rowInfo.collapsed,
-          onChange: () => {
-            toggleGroupRow(rowInfo.groupKeys);
+      }
+      if (!column.render) {
+        column.render = (renderOptions) => {
+          var _a;
+          let { value, rowInfo, column: column2, groupRowsBy: groupRowsBy2 } = renderOptions;
+          if (column2.renderValue) {
+            value = column2.renderValue(renderOptions);
           }
-        }) : null, /* @__PURE__ */ createElement4("div", {
-          className: cssEllipsisClassName
-        }, value != null ? value : null));
-      };
+          const showExpanderIcon = (((_a = rowInfo.groupKeys) == null ? void 0 : _a.length) || 0) < groupRowsBy2.length;
+          return /* @__PURE__ */ createElement4("div", {
+            className: join(display.flex, alignItems.center, GroupRowExpanderCls)
+          }, showExpanderIcon ? /* @__PURE__ */ createElement4(ExpanderIcon, {
+            expanded: !rowInfo.collapsed,
+            onChange: () => {
+              toggleGroupRow(rowInfo.groupKeys);
+            }
+          }) : null, /* @__PURE__ */ createElement4("div", {
+            className: cssEllipsisClassName
+          }, value != null ? value : null));
+        };
+      }
     }
     if (!column.render && column.renderValue) {
       column.render = (renderOptions) => {
@@ -2685,78 +2688,6 @@ function mapPropsToState2(params) {
   };
 }
 
-// src/utils/multisort/sortTypes.ts
-var sortTypes = {
-  number: function(first, second) {
-    return first - second;
-  },
-  string: function(first, second) {
-    first = `${first}`;
-    second = `${second}`;
-    return first.localeCompare(second);
-  }
-};
-var sortTypes_default = sortTypes;
-
-// src/utils/multisort/index.ts
-var multisort = (sortInfo, array, get) => {
-  array.sort(getMultisortFunction(sortInfo, get));
-  return array;
-};
-multisort.knownTypes = sortTypes_default;
-var getSingleSortFunction = (info) => {
-  if (!info) {
-    return;
-  }
-  const field = info.field;
-  var dir = info.dir < 0 ? -1 : info.dir > 0 ? 1 : 0;
-  if (!dir) {
-    return;
-  }
-  let fn = info.fn;
-  if (!fn && info.type) {
-    fn = multisort.knownTypes[info.type];
-    if (!fn) {
-      console.warn(`Unknown sort type "${info.type}" - please pass one of ${Object.keys(multisort.knownTypes).join(", ")}`);
-    }
-  }
-  if (!fn) {
-    fn = sortTypes_default.string;
-  }
-  return (first, second) => {
-    const a = field ? first[field] : first;
-    const b = field ? second[field] : second;
-    return dir * fn(a, b);
-  };
-};
-var getSortFunctions = (sortInfo) => {
-  return sortInfo.map(getSingleSortFunction).filter((fn) => fn instanceof Function);
-};
-var getMultisortFunction = (sortInfo, get) => {
-  const fns = getSortFunctions(sortInfo);
-  return (first, second) => {
-    if (get) {
-      first = get(first);
-      second = get(second);
-    }
-    let result = 0;
-    let i = 0;
-    let fn;
-    const len = fns.length;
-    for (; i < len; i++) {
-      fn = fns[i];
-      if (!fn) {
-        continue;
-      }
-      result = fn(first, second);
-      if (result !== 0) {
-        return result;
-      }
-    }
-    return result;
-  };
-};
-
 // src/utils/groupAndPivot/index.ts
 function DEFAULT_TO_KEY(value) {
   return value;
@@ -2986,6 +2917,80 @@ function enhancedFlatten(param) {
     data: result
   };
 }
+
+// src/utils/multisort/sortTypes.ts
+var sortTypes = {
+  number: function(first, second) {
+    return first - second;
+  },
+  string: function(first, second) {
+    first = `${first}`;
+    second = `${second}`;
+    return first.localeCompare(second);
+  }
+};
+var sortTypes_default = sortTypes;
+
+// src/utils/multisort/index.ts
+var multisort = (sortInfo, array, get) => {
+  array.sort(getMultisortFunction(sortInfo, get));
+  return array;
+};
+multisort.knownTypes = sortTypes_default;
+var getSingleSortFunction = (info) => {
+  if (!info) {
+    return;
+  }
+  const field = info.field;
+  var dir = info.dir < 0 ? -1 : info.dir > 0 ? 1 : 0;
+  if (!dir) {
+    return;
+  }
+  let fn = info.fn;
+  if (!fn && info.type) {
+    fn = multisort.knownTypes[info.type];
+    if (!fn) {
+      console.warn(`Unknown sort type "${info.type}" - please pass one of ${Object.keys(multisort.knownTypes).join(", ")}`);
+    }
+  }
+  if (!fn) {
+    fn = sortTypes_default.string;
+  }
+  return (first, second) => {
+    const a = field ? first[field] : first;
+    const b = field ? second[field] : second;
+    return dir * fn(a, b);
+  };
+};
+var getSortFunctions = (sortInfo) => {
+  return sortInfo.map(getSingleSortFunction).filter((fn) => fn instanceof Function);
+};
+var getMultisortFunction = (sortInfo, get) => {
+  const fns = getSortFunctions(sortInfo);
+  return (first, second) => {
+    if (get) {
+      first = get(first);
+      second = get(second);
+    }
+    let result = 0;
+    let i = 0;
+    let fn;
+    const len = fns.length;
+    for (; i < len; i++) {
+      fn = fns[i];
+      if (!fn) {
+        continue;
+      }
+      result = fn(first, second);
+      if (result !== 0) {
+        return result;
+      }
+    }
+    return result;
+  };
+};
+
+// src/utils/groupAndPivot/getPivotColumnsAndColumnGroups.ts
 function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPosition) {
   const pivotLength = pivotBy.length;
   const columns = new Map([
@@ -3010,10 +3015,14 @@ function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPositi
     if (keys.length === pivotLength) {
       const parentKeys = keys.slice(0, -1);
       let columnGroupId = parentKeys.join("/");
-      columns.set(`${keys.join("/")}`, {
+      const pivotByForColumn = pivotBy[keys.length - 1];
+      let computedPivotColumn = __spreadValues({
         pivotBy,
         pivotColumn: true,
         pivotGroupKeys: keys,
+        pivotGroupKeyForColumn: keys[keys.length - 1],
+        pivotIndexForColumn: keys.length - 1,
+        pivotByForColumn,
         sortable: false,
         columnGroup: parentKeys.length ? `${columnGroupId}` : void 0,
         header: keys[keys.length - 1],
@@ -3022,7 +3031,15 @@ function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPositi
           const value = (_c = (_b = (_a = rowInfo.pivotValuesMap) == null ? void 0 : _a.get(keys)) == null ? void 0 : _b.reducerResults[0]) != null ? _c : null;
           return value;
         }
-      });
+      }, pivotByForColumn.column);
+      if (pivotByForColumn.column) {
+        if (typeof pivotByForColumn.column === "function") {
+          Object.assign(computedPivotColumn, pivotByForColumn.column({ column: computedPivotColumn }));
+        } else {
+          Object.assign(computedPivotColumn, pivotByForColumn.column);
+        }
+      }
+      columns.set(`${keys.join("/")}`, computedPivotColumn);
     } else {
       const colGroupId = keys.join("/");
       const parentKeys = keys.slice(0, -1);
@@ -3031,11 +3048,15 @@ function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPositi
         header: keys.join(" >> ")
       });
       if (pivotTotalColumnPosition !== false) {
-        columns.set(`${keys.join("/")}-total`, {
+        const pivotByForColumn = pivotBy[keys.length - 1];
+        let computedPivotColumn = __spreadValues({
           columnGroup: parentKeys.length ? parentKeys.join("/") : void 0,
           header: `${keys.join("/")} total `,
           pivotTotalColumn: true,
           pivotGroupKeys: keys,
+          pivotGroupKeyForColumn: keys[keys.length - 1],
+          pivotByForColumn,
+          pivotIndexForColumn: keys.length - 1,
           pivotBy,
           sortable: false,
           valueGetter: ({ rowInfo }) => {
@@ -3043,7 +3064,15 @@ function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPositi
             const value = (_c = (_b = (_a = rowInfo.pivotValuesMap) == null ? void 0 : _a.get(keys)) == null ? void 0 : _b.reducerResults[0]) != null ? _c : null;
             return value;
           }
-        });
+        }, pivotByForColumn.column);
+        if (pivotByForColumn.column) {
+          if (typeof pivotByForColumn.column === "function") {
+            Object.assign(computedPivotColumn, pivotByForColumn.column({ column: computedPivotColumn }));
+          } else {
+            Object.assign(computedPivotColumn, pivotByForColumn.column);
+          }
+        }
+        columns.set(`${keys.join("/")}-total`, computedPivotColumn);
       }
     }
     if (pivotTotalColumnPosition === "start" || pivotTotalColumnPosition === false) {
@@ -6828,7 +6857,7 @@ var useLicense = (licenseKey) => {
   const valid = useMemo11(() => {
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "0.0.4"
+      version: "0.0.5"
     });
     if (!licenseKey && !valid2 && isInsideSandbox) {
       return true;

package/index.js

@@ -2011,48 +2011,51 @@ function getComputedPivotColumnsFromDataSourcePivotColumns(pivotColumns, params)
       return;
     }
     let column = __spreadValues({}, col);
-    if (pivotColumn) {
-      if (typeof pivotColumn === "function") {
-        column = __spreadValues(__spreadValues({}, column), pivotColumn({
-          column,
-          pivotBy,
-          groupRowsBy
-        }));
-      } else {
-        column = __spreadValues(__spreadValues({}, column), pivotColumn);
-      }
-    }
     const isPivotRowLabelsColumn = !column.pivotColumn && !column.pivotTotalColumn;
-    if (pivotRowLabelsColumn && isPivotRowLabelsColumn) {
-      if (typeof pivotRowLabelsColumn === "function") {
-        column = __spreadValues(__spreadValues({}, column), pivotRowLabelsColumn({
-          column,
-          pivotBy,
-          groupRowsBy
-        }));
-      } else {
-        column = __spreadValues(__spreadValues({}, column), pivotRowLabelsColumn);
+    if (!isPivotRowLabelsColumn) {
+      if (pivotColumn) {
+        if (typeof pivotColumn === "function") {
+          column = __spreadValues(__spreadValues({}, column), pivotColumn({
+            column,
+            pivotBy,
+            groupRowsBy
+          }));
+        } else {
+          column = __spreadValues(__spreadValues({}, column), pivotColumn);
+        }
       }
-    }
-    if (isPivotRowLabelsColumn && !column.render) {
-      column.render = (renderOptions) => {
-        var _a;
-        let { value, rowInfo, column: column2, groupRowsBy: groupRowsBy2 } = renderOptions;
-        if (column2.renderValue) {
-          value = column2.renderValue(renderOptions);
+    } else {
+      if (pivotRowLabelsColumn) {
+        if (typeof pivotRowLabelsColumn === "function") {
+          column = __spreadValues(__spreadValues({}, column), pivotRowLabelsColumn({
+            column,
+            pivotBy,
+            groupRowsBy
+          }));
+        } else {
+          column = __spreadValues(__spreadValues({}, column), pivotRowLabelsColumn);
         }
-        const showExpanderIcon = (((_a = rowInfo.groupKeys) == null ? void 0 : _a.length) || 0) < groupRowsBy2.length;
-        return /* @__PURE__ */ React7.createElement("div", {
-          className: join(display.flex, alignItems.center, GroupRowExpanderCls)
-        }, showExpanderIcon ? /* @__PURE__ */ React7.createElement(ExpanderIcon, {
-          expanded: !rowInfo.collapsed,
-          onChange: () => {
-            toggleGroupRow(rowInfo.groupKeys);
+      }
+      if (!column.render) {
+        column.render = (renderOptions) => {
+          var _a;
+          let { value, rowInfo, column: column2, groupRowsBy: groupRowsBy2 } = renderOptions;
+          if (column2.renderValue) {
+            value = column2.renderValue(renderOptions);
           }
-        }) : null, /* @__PURE__ */ React7.createElement("div", {
-          className: cssEllipsisClassName
-        }, value != null ? value : null));
-      };
+          const showExpanderIcon = (((_a = rowInfo.groupKeys) == null ? void 0 : _a.length) || 0) < groupRowsBy2.length;
+          return /* @__PURE__ */ React7.createElement("div", {
+            className: join(display.flex, alignItems.center, GroupRowExpanderCls)
+          }, showExpanderIcon ? /* @__PURE__ */ React7.createElement(ExpanderIcon, {
+            expanded: !rowInfo.collapsed,
+            onChange: () => {
+              toggleGroupRow(rowInfo.groupKeys);
+            }
+          }) : null, /* @__PURE__ */ React7.createElement("div", {
+            className: cssEllipsisClassName
+          }, value != null ? value : null));
+        };
+      }
     }
     if (!column.render && column.renderValue) {
       column.render = (renderOptions) => {
@@ -2666,78 +2669,6 @@ function mapPropsToState2(params) {
   };
 }
 
-// src/utils/multisort/sortTypes.ts
-var sortTypes = {
-  number: function(first, second) {
-    return first - second;
-  },
-  string: function(first, second) {
-    first = `${first}`;
-    second = `${second}`;
-    return first.localeCompare(second);
-  }
-};
-var sortTypes_default = sortTypes;
-
-// src/utils/multisort/index.ts
-var multisort = (sortInfo, array, get) => {
-  array.sort(getMultisortFunction(sortInfo, get));
-  return array;
-};
-multisort.knownTypes = sortTypes_default;
-var getSingleSortFunction = (info) => {
-  if (!info) {
-    return;
-  }
-  const field = info.field;
-  var dir = info.dir < 0 ? -1 : info.dir > 0 ? 1 : 0;
-  if (!dir) {
-    return;
-  }
-  let fn = info.fn;
-  if (!fn && info.type) {
-    fn = multisort.knownTypes[info.type];
-    if (!fn) {
-      console.warn(`Unknown sort type "${info.type}" - please pass one of ${Object.keys(multisort.knownTypes).join(", ")}`);
-    }
-  }
-  if (!fn) {
-    fn = sortTypes_default.string;
-  }
-  return (first, second) => {
-    const a = field ? first[field] : first;
-    const b = field ? second[field] : second;
-    return dir * fn(a, b);
-  };
-};
-var getSortFunctions = (sortInfo) => {
-  return sortInfo.map(getSingleSortFunction).filter((fn) => fn instanceof Function);
-};
-var getMultisortFunction = (sortInfo, get) => {
-  const fns = getSortFunctions(sortInfo);
-  return (first, second) => {
-    if (get) {
-      first = get(first);
-      second = get(second);
-    }
-    let result = 0;
-    let i = 0;
-    let fn;
-    const len = fns.length;
-    for (; i < len; i++) {
-      fn = fns[i];
-      if (!fn) {
-        continue;
-      }
-      result = fn(first, second);
-      if (result !== 0) {
-        return result;
-      }
-    }
-    return result;
-  };
-};
-
 // src/utils/groupAndPivot/index.ts
 function DEFAULT_TO_KEY(value) {
   return value;
@@ -2967,6 +2898,80 @@ function enhancedFlatten(param) {
     data: result
   };
 }
+
+// src/utils/multisort/sortTypes.ts
+var sortTypes = {
+  number: function(first, second) {
+    return first - second;
+  },
+  string: function(first, second) {
+    first = `${first}`;
+    second = `${second}`;
+    return first.localeCompare(second);
+  }
+};
+var sortTypes_default = sortTypes;
+
+// src/utils/multisort/index.ts
+var multisort = (sortInfo, array, get) => {
+  array.sort(getMultisortFunction(sortInfo, get));
+  return array;
+};
+multisort.knownTypes = sortTypes_default;
+var getSingleSortFunction = (info) => {
+  if (!info) {
+    return;
+  }
+  const field = info.field;
+  var dir = info.dir < 0 ? -1 : info.dir > 0 ? 1 : 0;
+  if (!dir) {
+    return;
+  }
+  let fn = info.fn;
+  if (!fn && info.type) {
+    fn = multisort.knownTypes[info.type];
+    if (!fn) {
+      console.warn(`Unknown sort type "${info.type}" - please pass one of ${Object.keys(multisort.knownTypes).join(", ")}`);
+    }
+  }
+  if (!fn) {
+    fn = sortTypes_default.string;
+  }
+  return (first, second) => {
+    const a = field ? first[field] : first;
+    const b = field ? second[field] : second;
+    return dir * fn(a, b);
+  };
+};
+var getSortFunctions = (sortInfo) => {
+  return sortInfo.map(getSingleSortFunction).filter((fn) => fn instanceof Function);
+};
+var getMultisortFunction = (sortInfo, get) => {
+  const fns = getSortFunctions(sortInfo);
+  return (first, second) => {
+    if (get) {
+      first = get(first);
+      second = get(second);
+    }
+    let result = 0;
+    let i = 0;
+    let fn;
+    const len = fns.length;
+    for (; i < len; i++) {
+      fn = fns[i];
+      if (!fn) {
+        continue;
+      }
+      result = fn(first, second);
+      if (result !== 0) {
+        return result;
+      }
+    }
+    return result;
+  };
+};
+
+// src/utils/groupAndPivot/getPivotColumnsAndColumnGroups.ts
 function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPosition) {
   const pivotLength = pivotBy.length;
   const columns = new Map([
@@ -2991,10 +2996,14 @@ function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPositi
     if (keys.length === pivotLength) {
       const parentKeys = keys.slice(0, -1);
       let columnGroupId = parentKeys.join("/");
-      columns.set(`${keys.join("/")}`, {
+      const pivotByForColumn = pivotBy[keys.length - 1];
+      let computedPivotColumn = __spreadValues({
         pivotBy,
         pivotColumn: true,
         pivotGroupKeys: keys,
+        pivotGroupKeyForColumn: keys[keys.length - 1],
+        pivotIndexForColumn: keys.length - 1,
+        pivotByForColumn,
         sortable: false,
         columnGroup: parentKeys.length ? `${columnGroupId}` : void 0,
         header: keys[keys.length - 1],
@@ -3003,7 +3012,15 @@ function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPositi
           const value = (_c = (_b = (_a = rowInfo.pivotValuesMap) == null ? void 0 : _a.get(keys)) == null ? void 0 : _b.reducerResults[0]) != null ? _c : null;
           return value;
         }
-      });
+      }, pivotByForColumn.column);
+      if (pivotByForColumn.column) {
+        if (typeof pivotByForColumn.column === "function") {
+          Object.assign(computedPivotColumn, pivotByForColumn.column({ column: computedPivotColumn }));
+        } else {
+          Object.assign(computedPivotColumn, pivotByForColumn.column);
+        }
+      }
+      columns.set(`${keys.join("/")}`, computedPivotColumn);
     } else {
       const colGroupId = keys.join("/");
       const parentKeys = keys.slice(0, -1);
@@ -3012,11 +3029,15 @@ function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPositi
         header: keys.join(" >> ")
       });
       if (pivotTotalColumnPosition !== false) {
-        columns.set(`${keys.join("/")}-total`, {
+        const pivotByForColumn = pivotBy[keys.length - 1];
+        let computedPivotColumn = __spreadValues({
           columnGroup: parentKeys.length ? parentKeys.join("/") : void 0,
           header: `${keys.join("/")} total `,
           pivotTotalColumn: true,
           pivotGroupKeys: keys,
+          pivotGroupKeyForColumn: keys[keys.length - 1],
+          pivotByForColumn,
+          pivotIndexForColumn: keys.length - 1,
           pivotBy,
           sortable: false,
           valueGetter: ({ rowInfo }) => {
@@ -3024,7 +3045,15 @@ function getPivotColumnsAndColumnGroups(deepMap, pivotBy, pivotTotalColumnPositi
             const value = (_c = (_b = (_a = rowInfo.pivotValuesMap) == null ? void 0 : _a.get(keys)) == null ? void 0 : _b.reducerResults[0]) != null ? _c : null;
             return value;
           }
-        });
+        }, pivotByForColumn.column);
+        if (pivotByForColumn.column) {
+          if (typeof pivotByForColumn.column === "function") {
+            Object.assign(computedPivotColumn, pivotByForColumn.column({ column: computedPivotColumn }));
+          } else {
+            Object.assign(computedPivotColumn, pivotByForColumn.column);
+          }
+        }
+        columns.set(`${keys.join("/")}-total`, computedPivotColumn);
       }
     }
     if (pivotTotalColumnPosition === "start" || pivotTotalColumnPosition === false) {
@@ -6730,7 +6759,7 @@ var useLicense = (licenseKey) => {
   const valid = (0, import_react42.useMemo)(() => {
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "0.0.4"
+      version: "0.0.5"
     });
     if (!licenseKey && !valid2 && isInsideSandbox) {
       return true;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@infinite-table/infinite-react",
   "description": "Infinite Table for React",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "main": "index.js",
   "module": "index.esm.js",
   "typings": "index.d.ts",
@@ -15,5 +15,5 @@
   },
   "license": "Commercial & Open Source",
   "//": "will be updated at build time",
-  "publishedAt": 1638307822158
+  "publishedAt": 1638368677113
 }