diff --git a/docs/src/pages/framed/DataTable/DataTableBatchSelectionInitial.svelte b/docs/src/pages/framed/DataTable/DataTableBatchSelectionInitial.svelte
new file mode 100644
index 00000000..2a602a55
--- /dev/null
+++ b/docs/src/pages/framed/DataTable/DataTableBatchSelectionInitial.svelte
@@ -0,0 +1,24 @@
+<script>
+  import { DataTable } from "carbon-components-svelte";
+
+  let selectedRowIds = [2, 4];
+
+  $: console.log("selectedRowIds", selectedRowIds);
+</script>
+
+<DataTable
+  batchSelection
+  bind:selectedRowIds
+  headers="{[
+    { key: 'name', value: 'Name' },
+    { key: 'port', value: 'Port' },
+    { key: 'rule', value: 'Rule' },
+  ]}"
+  rows="{Array.from({ length: 6 }).map((_, i) => ({
+    id: i,
+    name: 'Load Balancer ' + (i + 1),
+    protocol: 'HTTP',
+    port: i % 3 ? (i % 2 ? 3000 : 80) : 443,
+    rule: i % 3 ? 'Round robin' : 'DNS delegation',
+  }))}"
+/>