diff --git a/examples/grid-lite/components-react/src/App.tsx b/examples/grid-lite/components-react/src/App.tsx
index cdb84e1..f24838d 100644
--- a/examples/grid-lite/components-react/src/App.tsx
+++ b/examples/grid-lite/components-react/src/App.tsx
@@ -77,6 +77,19 @@ function App() {
// gridRef={grid}
callback={onGridCallback}
>
+ {/* */}
{
const resolvedChildren = flattenChildren(children)
.map((child) => resolveOptionChild(child))
.filter((child): child is ReactElement => child !== null);
+ const firstNonPaginationIndex = getFirstNonPaginationIndex(resolvedChildren);
function handleChildren(
childNodes: ReactNode,
@@ -205,7 +206,13 @@ export function getChildProps(children: ReactNode): Record {
}
if (meta.gridOption === 'pagination') {
- optionsFromChildren.pagination = normalizePaginationOptions(props);
+ const pagination = normalizePaginationOptions(props);
+ pagination.position = isTopPaginationChild(
+ child,
+ resolvedChildren,
+ firstNonPaginationIndex
+ ) ? 'top' : 'bottom';
+ optionsFromChildren.pagination = pagination;
return;
}
@@ -275,6 +282,32 @@ function applyDeclarativeColumnDefaults(
}
}
+function getFirstNonPaginationIndex(children: ReactElement[]): number {
+ return children.findIndex((child) => {
+ const component = getOptionComponent(child.type);
+
+ return component?._GridReact.gridOption !== 'pagination';
+ });
+}
+
+function isTopPaginationChild(
+ child: ReactElement,
+ children: ReactElement[],
+ firstNonPaginationIndex: number
+): boolean {
+ const childIndex = children.indexOf(child);
+
+ if (childIndex === -1) {
+ return false;
+ }
+
+ if (firstNonPaginationIndex === -1) {
+ return true;
+ }
+
+ return childIndex < firstNonPaginationIndex;
+}
+
function isOptionElement(child: ReactElement): boolean {
return getOptionComponent(child.type) !== null;
}