diff --git a/packages/builder/src/components/userInterface/temporaryPanelStructure.js b/packages/builder/src/components/userInterface/temporaryPanelStructure.js index aaac780afd..5d60008760 100644 --- a/packages/builder/src/components/userInterface/temporaryPanelStructure.js +++ b/packages/builder/src/components/userInterface/temporaryPanelStructure.js @@ -352,6 +352,12 @@ export default { defaultValue: "500", control: Input }, + { + label: "Pagination", + key: "pagination", + valueKey: "checked", + control: Checkbox, + }, ], }, children: [], diff --git a/packages/standard-components/components.json b/packages/standard-components/components.json index 4650d63e00..8464729993 100644 --- a/packages/standard-components/components.json +++ b/packages/standard-components/components.json @@ -238,7 +238,8 @@ "material" ] }, - "height": "number" + "height": "number", + "pagination": "bool" } }, "dataform": { diff --git a/packages/standard-components/src/DataGrid/Component.svelte b/packages/standard-components/src/DataGrid/Component.svelte index 727037b434..d7cc2d2e5f 100644 --- a/packages/standard-components/src/DataGrid/Component.svelte +++ b/packages/standard-components/src/DataGrid/Component.svelte @@ -19,6 +19,7 @@ export let editable export let theme = 'alpine' export let height; + export let pagination let dataLoaded = false let data @@ -33,6 +34,8 @@ }, rowSelection: editable ? "multiple" : false, suppressRowClickSelection: !editable, + paginationAutoPageSize: true, + pagination } onMount(async () => {