diff --git a/web/routes/uix/components/date-range-field/+page.svelte b/web/routes/uix/components/date-range-field/+page.svelte
index 769060b25..c3c903d8c 100644
--- a/web/routes/uix/components/date-range-field/+page.svelte
+++ b/web/routes/uix/components/date-range-field/+page.svelte
@@ -95,14 +95,14 @@
 			'  <DateRangeField.Label>Period</DateRangeField.Label>',
 			'  <DateRangeField.Input type="start">',
 			'    {#snippet children({ segments })}',
-			'      {#each segments as seg}',
+			'      {#each segments as seg, i (i)}',
 			'        <DateField.Segment part={seg.part}>{seg.value}</DateField.Segment>',
 			'      {/each}',
 			'    {/snippet}',
 			'  </DateRangeField.Input>',
 			'  <DateRangeField.Input type="end">',
 			'    {#snippet children({ segments })}',
-			'      {#each segments as seg}',
+			'      {#each segments as seg, i (i)}',
 			'        <DateField.Segment part={seg.part}>{seg.value}</DateField.Segment>',
 			'      {/each}',
 			'    {/snippet}',
@@ -137,14 +137,14 @@
 			'  <DateRangeField.Label>Period</DateRangeField.Label>',
 			'  <DateRangeField.Input type="start">',
 			'    {#snippet children({ segments })}',
-			'      {#each segments as seg}',
+			'      {#each segments as seg, i (i)}',
 			'        <DateRangeField.Segment part={seg.part}>{seg.value}</DateRangeField.Segment>',
 			'      {/each}',
 			'    {/snippet}',
 			'  </DateRangeField.Input>',
 			'  <DateRangeField.Input type="end">',
 			'    {#snippet children({ segments })}',
-			'      {#each segments as seg}',
+			'      {#each segments as seg, i (i)}',
 			'        <DateRangeField.Segment part={seg.part}>{seg.value}</DateRangeField.Segment>',
 			'      {/each}',
 			'    {/snippet}',
@@ -194,14 +194,14 @@
 				<DateRangeField.Label>Period</DateRangeField.Label>
 				<DateRangeField.Input type="start">
 					{#snippet children({ segments })}
-						{#each segments as seg (seg.part)}
+						{#each segments as seg, i (i)}
 							<DateRangeField.Segment part={seg.part}>{seg.value}</DateRangeField.Segment>
 						{/each}
 					{/snippet}
 				</DateRangeField.Input>
 				<DateRangeField.Input type="end">
 					{#snippet children({ segments })}
-						{#each segments as seg (seg.part)}
+						{#each segments as seg, i (i)}
 							<DateRangeField.Segment part={seg.part}>{seg.value}</DateRangeField.Segment>
 						{/each}
 					{/snippet}