@singularsystems/neo-react 1.0.0-alpha.2 → 1.0.0-beta.0

package/dist/ReactComponents/Grid/Grid.d.ts

@@ -1,90 +1,87 @@
-import * as React from 'react';
-import { Data, Model } from '@singularsystems/neo-core';
-import { DataViewContext } from '../../React/DataView';
-import { IButtonOptions } from '@singularsystems/neo-core/dist/Components/ButtonOptions';
-import { ItemCallback } from '../PropTypes';
-export declare type GridSection = "header" | "body" | "footer";
-export declare class GridContextParams<T> {
-    currentItem: T;
-    section: GridSection;
-    doneStaticSetup: boolean;
-    inFirstRowInGroup: boolean;
-    columnCount: number;
-    expandProperty?: Model.IPropertyInstance<boolean | null>;
-    expandAll?: boolean;
-    hasSummaries: boolean;
-    dataView: Data.DataViewBase<T>;
-    get inBody(): boolean;
-}
-export declare const GridContext: React.Context<GridContextParams<unknown>>;
-interface IGridProps<T> extends React.HTMLProps<HTMLTableElement> {
-    /**
-     * Datasource of the Grid. Usually a neo List, but can be a js array. This is not required if the grid is nested in
-     * a DataViewProvider like a Pager or DataScroller
-     */
-    items?: T[] | Data.DataViewBase<T>;
-    /** True if the add new button should be shown in the footer. Requires the datasource to be a neo List. */
-    showAddButton?: boolean;
-    /** Add new button options. Will cause add new button to be shown. */
-    addButton?: IButtonOptions;
-    /** Function used to filter items out of the datasource. */
-    filterPredicate?: (item: T, index: number) => boolean;
-    /**
-     * The unique key of the items being displayed. This is only necessary if the items dont have an entityIdentifier
-     * property (non ModelBase items).
-     */
-    keyProperty?: string;
-    /**
-     * Set to false if you don't want to allow sorting.
-     */
-    allowSort?: boolean;
-    /**
-     * Set to true expand all child rows. All expand buttons will be hidden.
-     */
-    expandAll?: boolean;
-    /**
-     * Set to true collapse all child rows. All expand buttons will be hidden.
-     */
-    collapseAll?: boolean;
-    /**
-     * Initial sort column.
-     */
-    initialSort?: keyof T | (keyof T)[];
-    initialSortAscending?: boolean | boolean[];
-    /**
-     * When specified, the default bootstrap table borders (sides and cells) will be added.
-     * This is the default unless overridden in Misc.Settings.grid
-     */
-    isBordered?: boolean;
-    /** When specified, every alternating row will receive a slightly darker background color. */
-    isStriped?: boolean;
-    /** When specified, the table will have no cell borders, and the table will have no main border. */
-    isBorderless?: boolean;
-    /** When specified, a background color will be applied on a row if it is being hovered over. */
-    showHover?: boolean;
-    /** When specified, the table size will be reduced (by reducing the padding sizes in each cell by half). */
-    isSmallTable?: boolean;
-    /** Additional footer row(s) to display below the main footer row. */
-    footerContent?: (data: T[]) => React.ReactNode;
-    /**
-     * Additional content to show next to the add new button.
-     *
-     * Set `showAddButton = false` if you don't want the default button.
-     */
-    footerButtons?: () => React.ReactNode;
-    children: any;
-}
-interface GridPropsWithChildren<T> extends IGridProps<T> {
-    children: ItemCallback<T>;
-}
-export default class Grid<T> extends React.Component<GridPropsWithChildren<T>> {
-    static contextType: React.Context<import("../../React/DataView").DataViewContextParams<unknown>>;
-    context: React.ContextType<typeof DataViewContext>;
-    private gridContext;
-    private prevItems?;
-    private headerItem;
-    constructor(props: GridPropsWithChildren<T>);
-    render(): JSX.Element;
-    private setInitialSort;
-}
-export {};
+import * as React from 'react';
+import { Data, Model } from '@singularsystems/neo-core';
+import { DataViewContext } from '../../React/DataView';
+import { IButtonOptions } from '@singularsystems/neo-core/dist/Components/ButtonOptions';
+import { ItemCallback } from '../PropTypes';
+export type GridSection = "header" | "body" | "footer";
+export declare class GridContextParams<T> {
+    currentItem: T;
+    section: GridSection;
+    doneStaticSetup: boolean;
+    inFirstRowInGroup: boolean;
+    columnCount: number;
+    expandProperty?: Model.IPropertyInstance<boolean | null>;
+    expandAll?: boolean;
+    hasSummaries: boolean;
+    dataView: Data.DataViewBase<T>;
+    get inBody(): boolean;
+}
+export declare const GridContext: React.Context<GridContextParams<unknown>>;
+interface IGridProps<T> extends Omit<React.HTMLProps<HTMLTableElement>, "children"> {
+    /**
+     * Datasource of the Grid. Usually a neo List, but can be a js array. This is not required if the grid is nested in
+     * a DataViewProvider like a Pager or DataScroller
+     */
+    items?: T[] | Data.DataViewBase<T>;
+    /** True if the add new button should be shown in the footer. Requires the datasource to be a neo List. */
+    showAddButton?: boolean;
+    /** Add new button options. Will cause add new button to be shown. */
+    addButton?: IButtonOptions;
+    /** Function used to filter items out of the datasource. */
+    filterPredicate?: (item: T, index: number) => boolean;
+    /**
+     * The unique key of the items being displayed. This is only necessary if the items dont have an entityIdentifier
+     * property (non ModelBase items).
+     */
+    keyProperty?: string;
+    /**
+     * Set to false if you don't want to allow sorting.
+     */
+    allowSort?: boolean;
+    /**
+     * Set to true expand all child rows. All expand buttons will be hidden.
+     */
+    expandAll?: boolean;
+    /**
+     * Set to true collapse all child rows. All expand buttons will be hidden.
+     */
+    collapseAll?: boolean;
+    /**
+     * Initial sort column.
+     */
+    initialSort?: keyof T | (keyof T)[];
+    initialSortAscending?: boolean | boolean[];
+    /**
+     * When specified, the default bootstrap table borders (sides and cells) will be added.
+     * This is the default unless overridden in Misc.Settings.grid
+     */
+    isBordered?: boolean;
+    /** When specified, every alternating row will receive a slightly darker background color. */
+    isStriped?: boolean;
+    /** When specified, the table will have no cell borders, and the table will have no main border. */
+    isBorderless?: boolean;
+    /** When specified, a background color will be applied on a row if it is being hovered over. */
+    showHover?: boolean;
+    /** When specified, the table size will be reduced (by reducing the padding sizes in each cell by half). */
+    isSmallTable?: boolean;
+    /** Additional footer row(s) to display below the main footer row. */
+    footerContent?: (data: T[]) => React.ReactNode;
+    /**
+     * Additional content to show next to the add new button.
+     *
+     * Set `showAddButton = false` if you don't want the default button.
+     */
+    footerButtons?: () => React.ReactNode;
+    children: ItemCallback<T>;
+}
+export default class Grid<T> extends React.Component<IGridProps<T>> {
+    static contextType: React.Context<import("../../React/DataView").DataViewContextParams<unknown>>;
+    context: React.ContextType<typeof DataViewContext>;
+    private gridContext;
+    private prevItems?;
+    private headerItem;
+    constructor(props: IGridProps<T>);
+    render(): JSX.Element;
+    private setInitialSort;
+}
+export {};

package/dist/ReactComponents/Grid/Grid.js

@@ -1,203 +1,203 @@
-import { __assign, __decorate, __extends, __metadata, __rest } from "tslib";
-import * as React from 'react';
-import { Data, Utils, Misc } from '@singularsystems/neo-core';
-import { observer, Observer } from 'mobx-react';
-import NeoButton from '../Button';
-import { DataViewContext } from '../../React/DataView';
-// Grid context
-var GridContextParams = /** @class */ (function () {
-    function GridContextParams() {
-        this.doneStaticSetup = false;
-        this.columnCount = 0;
-        this.hasSummaries = false;
-    }
-    Object.defineProperty(GridContextParams.prototype, "inBody", {
-        get: function () {
-            return this.section === "body";
-        },
-        enumerable: false,
-        configurable: true
-    });
-    return GridContextParams;
-}());
-export { GridContextParams };
-export var GridContext = React.createContext(new GridContextParams());
-var Grid = /** @class */ (function (_super) {
-    __extends(Grid, _super);
-    function Grid(props) {
-        var _this = _super.call(this, props) || this;
-        _this.gridContext = new GridContextParams();
-        _this.gridContext.section = "header";
-        return _this;
-    }
-    Grid.prototype.render = function () {
-        var _this = this;
-        var _a = this.props, items = _a.items, showAddButton = _a.showAddButton, addButton = _a.addButton, filterPredicate = _a.filterPredicate, keyProperty = _a.keyProperty, allowSort = _a.allowSort, expandAll = _a.expandAll, collapseAll = _a.collapseAll, initialSort = _a.initialSort, initialSortAscending = _a.initialSortAscending, isBordered = _a.isBordered, isStriped = _a.isStriped, isBorderless = _a.isBorderless, showHover = _a.showHover, isSmallTable = _a.isSmallTable, footerContent = _a.footerContent, footerButtons = _a.footerButtons, domProps = __rest(_a, ["items", "showAddButton", "addButton", "filterPredicate", "keyProperty", "allowSort", "expandAll", "collapseAll", "initialSort", "initialSortAscending", "isBordered", "isStriped", "isBorderless", "showHover", "isSmallTable", "footerContent", "footerButtons"]);
-        if (expandAll === true) {
-            this.gridContext.expandAll = true;
-        }
-        else if (collapseAll === true) {
-            this.gridContext.expandAll = false;
-        }
-        else {
-            this.gridContext.expandAll = undefined;
-        }
-        var className = Utils.joinWithSpaces(domProps.className, "table neo-grid");
-        // apply bordered styling
-        if (isBordered !== null && isBordered !== void 0 ? isBordered : Misc.Settings.grid.isBordered) {
-            className += " table-bordered";
-        }
-        // apply striped styling
-        if (isStriped !== null && isStriped !== void 0 ? isStriped : Misc.Settings.grid.isStriped) {
-            className += " table-striped";
-        }
-        // apply borderless styling
-        if (isBorderless !== null && isBorderless !== void 0 ? isBorderless : Misc.Settings.grid.isBorderless) {
-            className += " table-borderless";
-        }
-        // apply hover styling
-        if (showHover !== null && showHover !== void 0 ? showHover : Misc.Settings.grid.showHover) {
-            className += " table-hover";
-        }
-        // use small table sizing
-        if (isSmallTable !== null && isSmallTable !== void 0 ? isSmallTable : Misc.Settings.grid.isSmallTable) {
-            className += " table-sm";
-        }
-        if (!this.gridContext.dataView || items !== this.prevItems) {
-            this.prevItems = items;
-            if (items) {
-                if (items instanceof Data.DataViewBase) {
-                    this.gridContext.dataView = items;
-                }
-                else {
-                    this.gridContext.dataView = new Data.DataView(items);
-                    this.setInitialSort(initialSort, initialSortAscending);
-                }
-                this.gridContext.dataView.itemFilter = filterPredicate;
-            }
-            else if (this.context) {
-                this.gridContext.dataView = this.context.dataView;
-            }
-            else {
-                throw "NeoGrid requires it's items prop to be set, or must be in a containing datasource.";
-            }
-            if (allowSort !== undefined) {
-                this.gridContext.dataView.allowSort = allowSort;
-            }
-            this.headerItem = this.gridContext.dataView.getMetaItem();
-        }
-        return (React.createElement("table", __assign({}, domProps, { className: className }),
-            React.createElement(GridContext.Provider, { value: this.gridContext },
-                React.createElement(TableSection, { type: "header" }, this.headerItem && this.props.children(this.headerItem, this.headerItem.meta)),
-                React.createElement(TableSection, { type: "body" }, this.gridContext.dataView.getItems().map(function (item) { return (React.createElement(ItemGroup, { item: item, key: keyProperty ? item[keyProperty] : item.entityIdentifier, template: _this.props.children })); })),
-                React.createElement(Observer, null, function () { return (showAddButton || addButton || footerButtons || _this.gridContext.hasSummaries || footerContent !== undefined) ?
-                    React.createElement(TableSection, { type: "footer" },
-                        _this.gridContext.hasSummaries && _this.headerItem && _this.props.children(_this.headerItem, _this.headerItem.meta),
-                        footerContent !== undefined && footerContent(_this.gridContext.dataView.getItems()),
-                        (showAddButton || addButton || footerButtons) &&
-                            React.createElement(AddButtonRow, { addButton: addButton, showAddButton: showAddButton, additionalContent: footerButtons })) : null; }))));
-    };
-    Grid.prototype.setInitialSort = function (initialSort, initialSortAscending) {
-        var _a;
-        var meta = (_a = this.gridContext.dataView.getMetaItem()) === null || _a === void 0 ? void 0 : _a.meta;
-        if (initialSort && meta) {
-            var sortColumns = void 0;
-            var sortAsc_1;
-            if (initialSort instanceof Array) {
-                sortColumns = initialSort;
-                sortAsc_1 = (initialSortAscending !== null && initialSortAscending !== void 0 ? initialSortAscending : []);
-            }
-            else {
-                sortColumns = [initialSort];
-                sortAsc_1 = [initialSortAscending];
-            }
-            this.gridContext.dataView.sortInfo = sortColumns.map(function (c, i) { return new Data.SortOperation(meta[c].propertyInfo, sortAsc_1[i] !== false); });
-        }
-    };
-    Grid.contextType = DataViewContext;
-    Grid = __decorate([
-        observer,
-        __metadata("design:paramtypes", [Object])
-    ], Grid);
-    return Grid;
-}(React.Component));
-export default Grid;
-var TableSection = /** @class */ (function (_super) {
-    __extends(TableSection, _super);
-    function TableSection() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TableSection.prototype.render = function () {
-        this.context.section = this.props.type;
-        return (this.props.type == "header" ?
-            React.createElement("thead", null, this.props.children) :
-            this.props.type == "body" ?
-                React.createElement("tbody", null, this.props.children) :
-                React.createElement("tfoot", null, this.props.children));
-    };
-    TableSection.contextType = GridContext;
-    return TableSection;
-}(React.PureComponent));
-var AddButtonRow = /** @class */ (function (_super) {
-    __extends(AddButtonRow, _super);
-    function AddButtonRow(props) {
-        var _this = _super.call(this, props) || this;
-        _this.domRef = React.createRef();
-        _this.onAddNew = _this.onAddNew.bind(_this);
-        return _this;
-    }
-    AddButtonRow.prototype.onAddNew = function () {
-        var newItem = this.context.dataView.addNonSortedItem();
-        this.focusFirstElement(newItem.entityIdentifier);
-        if (this.context.dataView instanceof Data.WindowedDataView) {
-            var view = this.context.dataView;
-            view.position = (view.filteredItems.length - view.maxItems);
-        }
-    };
-    /**
-     * Focus the first element that is bound to the item identifier provided.
-     */
-    AddButtonRow.prototype.focusFirstElement = function (entityIdentifier) {
-        var _this = this;
-        if (entityIdentifier) {
-            setTimeout(function () {
-                if (_this.domRef.current) {
-                    var tableParent = _this.domRef.current.parentElement.parentElement;
-                    var firstElement = tableParent.querySelector("[id^=\"".concat(entityIdentifier, "\"]"));
-                    if (firstElement && firstElement.focus) {
-                        firstElement.focus();
-                    }
-                }
-            }, 0);
-        }
-    };
-    AddButtonRow.prototype.render = function () {
-        var _a = this.props, addButton = _a.addButton, showAddButton = _a.showAddButton, additionalContent = _a.additionalContent;
-        var addButtonOptions = Utils.populatePartialWithDefaults(addButton, __assign({}, Misc.Settings.grid.addButton));
-        if (!addButtonOptions.onClick)
-            addButtonOptions.onClick = this.onAddNew;
-        return (React.createElement("tr", { ref: this.domRef },
-            React.createElement("td", { colSpan: this.context.columnCount + (this.context.expandProperty ? 1 : 0) },
-                React.createElement("div", { className: "neo-grid-button-row" },
-                    showAddButton !== false && React.createElement(NeoButton, __assign({}, addButtonOptions)),
-                    additionalContent !== undefined && additionalContent()))));
-    };
-    AddButtonRow.contextType = GridContext;
-    return AddButtonRow;
-}(React.Component));
-var ItemGroup = /** @class */ (function (_super) {
-    __extends(ItemGroup, _super);
-    function ItemGroup() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ItemGroup.prototype.render = function () {
-        this.context.currentItem = this.props.item;
-        //this.context.inFirstRowInGroup = true;
-        return (this.props.template(this.props.item, this.props.item.meta));
-    };
-    ItemGroup.contextType = GridContext;
-    ItemGroup = __decorate([
-        observer
-    ], ItemGroup);
-    return ItemGroup;
-}(React.Component));
+import { __assign, __decorate, __extends, __metadata, __rest } from "tslib";
+import * as React from 'react';
+import { Data, Utils, Misc } from '@singularsystems/neo-core';
+import { observer, Observer } from 'mobx-react';
+import NeoButton from '../Button';
+import { DataViewContext } from '../../React/DataView';
+// Grid context
+var GridContextParams = /** @class */ (function () {
+    function GridContextParams() {
+        this.doneStaticSetup = false;
+        this.columnCount = 0;
+        this.hasSummaries = false;
+    }
+    Object.defineProperty(GridContextParams.prototype, "inBody", {
+        get: function () {
+            return this.section === "body";
+        },
+        enumerable: false,
+        configurable: true
+    });
+    return GridContextParams;
+}());
+export { GridContextParams };
+export var GridContext = React.createContext(new GridContextParams());
+var Grid = /** @class */ (function (_super) {
+    __extends(Grid, _super);
+    function Grid(props) {
+        var _this = _super.call(this, props) || this;
+        _this.gridContext = new GridContextParams();
+        _this.gridContext.section = "header";
+        return _this;
+    }
+    Grid.prototype.render = function () {
+        var _this = this;
+        var _a = this.props, items = _a.items, showAddButton = _a.showAddButton, addButton = _a.addButton, filterPredicate = _a.filterPredicate, keyProperty = _a.keyProperty, allowSort = _a.allowSort, expandAll = _a.expandAll, collapseAll = _a.collapseAll, initialSort = _a.initialSort, initialSortAscending = _a.initialSortAscending, isBordered = _a.isBordered, isStriped = _a.isStriped, isBorderless = _a.isBorderless, showHover = _a.showHover, isSmallTable = _a.isSmallTable, footerContent = _a.footerContent, footerButtons = _a.footerButtons, domProps = __rest(_a, ["items", "showAddButton", "addButton", "filterPredicate", "keyProperty", "allowSort", "expandAll", "collapseAll", "initialSort", "initialSortAscending", "isBordered", "isStriped", "isBorderless", "showHover", "isSmallTable", "footerContent", "footerButtons"]);
+        if (expandAll === true) {
+            this.gridContext.expandAll = true;
+        }
+        else if (collapseAll === true) {
+            this.gridContext.expandAll = false;
+        }
+        else {
+            this.gridContext.expandAll = undefined;
+        }
+        var className = Utils.joinWithSpaces(domProps.className, "table neo-grid");
+        // apply bordered styling
+        if (isBordered !== null && isBordered !== void 0 ? isBordered : Misc.Settings.grid.isBordered) {
+            className += " table-bordered";
+        }
+        // apply striped styling
+        if (isStriped !== null && isStriped !== void 0 ? isStriped : Misc.Settings.grid.isStriped) {
+            className += " table-striped";
+        }
+        // apply borderless styling
+        if (isBorderless !== null && isBorderless !== void 0 ? isBorderless : Misc.Settings.grid.isBorderless) {
+            className += " table-borderless";
+        }
+        // apply hover styling
+        if (showHover !== null && showHover !== void 0 ? showHover : Misc.Settings.grid.showHover) {
+            className += " table-hover";
+        }
+        // use small table sizing
+        if (isSmallTable !== null && isSmallTable !== void 0 ? isSmallTable : Misc.Settings.grid.isSmallTable) {
+            className += " table-sm";
+        }
+        if (!this.gridContext.dataView || items !== this.prevItems) {
+            this.prevItems = items;
+            if (items) {
+                if (items instanceof Data.DataViewBase) {
+                    this.gridContext.dataView = items;
+                }
+                else {
+                    this.gridContext.dataView = new Data.DataView(items);
+                    this.setInitialSort(initialSort, initialSortAscending);
+                }
+                this.gridContext.dataView.itemFilter = filterPredicate;
+            }
+            else if (this.context) {
+                this.gridContext.dataView = this.context.dataView;
+            }
+            else {
+                throw "NeoGrid requires it's items prop to be set, or must be in a containing datasource.";
+            }
+            if (allowSort !== undefined) {
+                this.gridContext.dataView.allowSort = allowSort;
+            }
+            this.headerItem = this.gridContext.dataView.getMetaItem();
+        }
+        return (React.createElement("table", __assign({}, domProps, { className: className }),
+            React.createElement(GridContext.Provider, { value: this.gridContext },
+                React.createElement(TableSection, { type: "header" }, this.headerItem && this.props.children(this.headerItem, this.headerItem.meta)),
+                React.createElement(TableSection, { type: "body" }, this.gridContext.dataView.getItems().map(function (item) { return (React.createElement(ItemGroup, { item: item, key: keyProperty ? item[keyProperty] : item.entityIdentifier, template: _this.props.children })); })),
+                React.createElement(Observer, null, function () { return (showAddButton || addButton || footerButtons || _this.gridContext.hasSummaries || footerContent !== undefined) ?
+                    React.createElement(TableSection, { type: "footer" },
+                        _this.gridContext.hasSummaries && _this.headerItem && _this.props.children(_this.headerItem, _this.headerItem.meta),
+                        footerContent !== undefined && footerContent(_this.gridContext.dataView.getItems()),
+                        (showAddButton || addButton || footerButtons) &&
+                            React.createElement(AddButtonRow, { addButton: addButton, showAddButton: showAddButton, additionalContent: footerButtons })) : null; }))));
+    };
+    Grid.prototype.setInitialSort = function (initialSort, initialSortAscending) {
+        var _a;
+        var meta = (_a = this.gridContext.dataView.getMetaItem()) === null || _a === void 0 ? void 0 : _a.meta;
+        if (initialSort && meta) {
+            var sortColumns = void 0;
+            var sortAsc_1;
+            if (initialSort instanceof Array) {
+                sortColumns = initialSort;
+                sortAsc_1 = (initialSortAscending !== null && initialSortAscending !== void 0 ? initialSortAscending : []);
+            }
+            else {
+                sortColumns = [initialSort];
+                sortAsc_1 = [initialSortAscending];
+            }
+            this.gridContext.dataView.sortInfo = sortColumns.map(function (c, i) { return new Data.SortOperation(meta[c].propertyInfo, sortAsc_1[i] !== false); });
+        }
+    };
+    Grid.contextType = DataViewContext;
+    Grid = __decorate([
+        observer,
+        __metadata("design:paramtypes", [Object])
+    ], Grid);
+    return Grid;
+}(React.Component));
+export default Grid;
+var TableSection = /** @class */ (function (_super) {
+    __extends(TableSection, _super);
+    function TableSection() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    TableSection.prototype.render = function () {
+        this.context.section = this.props.type;
+        return (this.props.type == "header" ?
+            React.createElement("thead", null, this.props.children) :
+            this.props.type == "body" ?
+                React.createElement("tbody", null, this.props.children) :
+                React.createElement("tfoot", null, this.props.children));
+    };
+    TableSection.contextType = GridContext;
+    return TableSection;
+}(React.PureComponent));
+var AddButtonRow = /** @class */ (function (_super) {
+    __extends(AddButtonRow, _super);
+    function AddButtonRow(props) {
+        var _this = _super.call(this, props) || this;
+        _this.domRef = React.createRef();
+        _this.onAddNew = _this.onAddNew.bind(_this);
+        return _this;
+    }
+    AddButtonRow.prototype.onAddNew = function () {
+        var newItem = this.context.dataView.addNonSortedItem();
+        this.focusFirstElement(newItem.entityIdentifier);
+        if (this.context.dataView instanceof Data.WindowedDataView) {
+            var view = this.context.dataView;
+            view.position = (view.filteredItems.length - view.maxItems);
+        }
+    };
+    /**
+     * Focus the first element that is bound to the item identifier provided.
+     */
+    AddButtonRow.prototype.focusFirstElement = function (entityIdentifier) {
+        var _this = this;
+        if (entityIdentifier) {
+            setTimeout(function () {
+                if (_this.domRef.current) {
+                    var tableParent = _this.domRef.current.parentElement.parentElement;
+                    var firstElement = tableParent.querySelector("[id^=\"".concat(entityIdentifier, "\"]"));
+                    if (firstElement && firstElement.focus) {
+                        firstElement.focus();
+                    }
+                }
+            }, 0);
+        }
+    };
+    AddButtonRow.prototype.render = function () {
+        var _a = this.props, addButton = _a.addButton, showAddButton = _a.showAddButton, additionalContent = _a.additionalContent;
+        var addButtonOptions = Utils.populatePartialWithDefaults(addButton, __assign({}, Misc.Settings.grid.addButton));
+        if (!addButtonOptions.onClick)
+            addButtonOptions.onClick = this.onAddNew;
+        return (React.createElement("tr", { ref: this.domRef },
+            React.createElement("td", { colSpan: this.context.columnCount + (this.context.expandProperty ? 1 : 0) },
+                React.createElement("div", { className: "neo-grid-button-row" },
+                    showAddButton !== false && React.createElement(NeoButton, __assign({}, addButtonOptions)),
+                    additionalContent !== undefined && additionalContent()))));
+    };
+    AddButtonRow.contextType = GridContext;
+    return AddButtonRow;
+}(React.Component));
+var ItemGroup = /** @class */ (function (_super) {
+    __extends(ItemGroup, _super);
+    function ItemGroup() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    ItemGroup.prototype.render = function () {
+        this.context.currentItem = this.props.item;
+        //this.context.inFirstRowInGroup = true;
+        return (this.props.template(this.props.item, this.props.item.meta));
+    };
+    ItemGroup.contextType = GridContext;
+    ItemGroup = __decorate([
+        observer
+    ], ItemGroup);
+    return ItemGroup;
+}(React.Component));