diff --git a/packages/web/src/jsontree/JSONNested.svelte b/packages/web/src/jsontree/JSONNested.svelte index 0efa828ac..277f56f8c 100644 --- a/packages/web/src/jsontree/JSONNested.svelte +++ b/packages/web/src/jsontree/JSONNested.svelte @@ -29,8 +29,11 @@ const elementData = getContext('json-tree-element-data'); const slicedKeyCount = getContext('json-tree-sliced-key-count'); const keyLabel = labelOverride ?? key; + const PAGE_SIZE = 100; + let visibleKeyCount = PAGE_SIZE; - $: slicedKeys = expanded ? keys : previewKeys.slice(0, slicedKeyCount || 5); + // $: slicedKeys = expanded ? keys : previewKeys.slice(0, Math.max(slicedKeyCount || 5, visibleKeyCount)); + $: slicedKeys = expanded ? keys?.slice(0, visibleKeyCount) : previewKeys.slice(0, slicedKeyCount || 5); $: if (!isParentExpanded) { expanded = false; @@ -52,6 +55,12 @@ $: if (domElement && elementData && elementValue) { elementData.set(domElement, elementValue); } + + function showNextKeys() { + visibleKeyCount += PAGE_SIZE; + } + + $: visibleShowNextKeys = expanded && slicedKeys.length < keys.length;