We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
I do understand that Svelte 5 is still not out but I think will be good to have visibility of what it's not working anyway.
When using Date Range Picker ERR_SVELTE_TOO_MANY_UPDATES is triggered.
Date Range Picker
<script lang="ts"> import type { DateRange } from 'bits-ui'; import { CalendarDate, DateFormatter, getLocalTimeZone, type DateValue } from '@internationalized/date'; import { cn } from '$lib/utils'; import { Button } from '$lib/components/ui/button'; import { RangeCalendar } from '$lib/components/ui/range-calendar'; import * as Popover from '$lib/components/ui/popover'; import { IconCalendar } from '@tabler/icons-svelte'; const df = new DateFormatter('en-US', { dateStyle: 'medium' }); let value: DateRange | undefined = { start: new CalendarDate(2022, 1, 20), end: new CalendarDate(2022, 1, 20).add({ days: 20 }) }; let startValue: DateValue | undefined = undefined; </script> <div class="grid gap-2"> <Popover.Root openFocus> <Popover.Trigger asChild let:builder> <Button variant="outline" class="{cn( 'w-[300px] justify-start text-left font-normal', !value && 'text-muted-foreground' )}" builders="{[builder]}" > <IconCalendar class="mr-2 h-4 w-4" /> {#if value && value.start} {#if value.end} {df.format(value.start.toDate(getLocalTimeZone()))} - {df.format( value.end.toDate(getLocalTimeZone()) )} {:else} {df.format(value.start.toDate(getLocalTimeZone()))} {/if} {:else if startValue} {df.format(startValue.toDate(getLocalTimeZone()))} {:else} Pick a date {/if} </Button> </Popover.Trigger> <Popover.Content class="w-auto p-0" align="start"> <RangeCalendar bind:value="{value}" bind:startValue="{startValue}" placeholder="{value?.start}" initialFocus numberOfMonths="{2}" /> </Popover.Content> </Popover.Root> </div>
Uncaught Error: ERR_SVELTE_TOO_MANY_UPDATES: Maximum update depth exceeded. This can happen when a reactive block or effect repeatedly sets a new value. Svelte limits the number of nested updates to prevent infinite loops. infinite_loop_guard runtime.js:445 flush_queued_effects runtime.js:463 flush_local_render_effects runtime.js:593 pre_effect effects.js:162 execute_signal_fn runtime.js:248 execute_effect runtime.js:418 flush_queued_effects runtime.js:474 process_microtask runtime.js:497 schedule_effect runtime.js:524 mark_signal_consumers runtime.js:897 mark_signal_consumers runtime.js:899 mark_signal_consumers runtime.js:899 set sources.js:148 set value +page.svelte:166 prop render.js:2790 set value range-calendar.svelte:56 prop render.js:2790 onValueChange range-calendar.svelte:74 update overridable.js:9 update index.js:82 update overridable.js:5 set2 overridable.js:16 createRangeCalendar create.js:846 destroy effect.js:18 sync index.js:170 unsubscribers index.js:184 set index.js:69 handleCellClick create.js:642 unsub create.js:369 handlerWithMelt event.js:23 withMelt event.js:51 addMeltEventListener event.js:25 addMeltEventListener event.js:25 action create.js:363 Range_calendar_day bits-ui.js:32674 action render.js:1955 untrack runtime.js:942 action render.js:1955 execute_signal_fn runtime.js:248 execute_effect runtime.js:418 flush_queued_effects runtime.js:474 process_microtask runtime.js:498 schedule_effect runtime.js:524 mark_signal_consumers runtime.js:897 set sources.js:148 Popover_trigger bits-ui.js:31401 untrack runtime.js:942 Popover_trigger bits-ui.js:31400 pre_effect effects.js:161 execute_signal_fn runtime.js:248 execute_effect runtime.js:418 flush_queued_effects runtime.js:474 process_microtask runtime.js:497 schedule_effect runtime.js:524 mark_signal_consumers runtime.js:897 mark_signal_consumers runtime.js:899 set sources.js:148 prop render.js:2841 onOpenChange popover.svelte:30 update overridable.js:9 runtime.js:445:8 infinite_loop_guard runtime.js:445 flush_queued_effects runtime.js:463 flush_local_render_effects runtime.js:593 pre_effect effects.js:162 execute_signal_fn runtime.js:248 execute_effect runtime.js:418 flush_queued_effects runtime.js:474 process_microtask runtime.js:497 (Async: VoidFunction) schedule_effect runtime.js:524 mark_signal_consumers runtime.js:897 mark_signal_consumers runtime.js:899 mark_signal_consumers runtime.js:899 set sources.js:148 set value +page.svelte:166 prop render.js:2790 set value range-calendar.svelte:56 prop render.js:2790 onValueChange range-calendar.svelte:74 update overridable.js:9 update index.js:82 update overridable.js:5 set2 overridable.js:16 createRangeCalendar create.js:846 destroy effect.js:18 sync index.js:170 unsubscribers index.js:184 set index.js:69 handleCellClick create.js:642 unsub create.js:369 handlerWithMelt event.js:23 withMelt event.js:51 (Async: EventListener.handleEvent) addMeltEventListener event.js:25 forEach self-hosted:203 addMeltEventListener event.js:25 action create.js:363 Range_calendar_day bits-ui.js:32674 action render.js:1955 untrack runtime.js:942 action render.js:1955 execute_signal_fn runtime.js:248 execute_effect runtime.js:418 flush_queued_effects runtime.js:474 process_microtask runtime.js:498 (Async: VoidFunction) schedule_effect runtime.js:524 mark_signal_consumers runtime.js:897 set sources.js:148 Popover_trigger bits-ui.js:31401 untrack runtime.js:942 Popover_trigger bits-ui.js:31400 pre_effect effects.js:161 execute_signal_fn runtime.js:248 execute_effect runtime.js:418 flush_queued_effects runtime.js:474 process_microtask runtime.js:497 (Async: VoidFunction) schedule_effect runtime.js:524 mark_signal_consumers runtime.js:897 mark_signal_consumers runtime.js:899 set sources.js:148 prop render.js:2841 onOpenChange popover.svelte:30 update overridable.js:9
System: OS: macOS 14.3.1 CPU: (10) arm64 Apple M1 Pro Memory: 655.69 MB / 32.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm pnpm: 8.15.4 - /opt/homebrew/bin/pnpm Browsers: Chrome: 122.0.6261.111 Firefox Nightly: 125.0a1 Safari: 17.3.1 Safari Technology Preview: 17.4 npmPackages: @sveltejs/kit: ^2.5.2 => 2.5.2 bits-ui: ^0.19.5 => 0.19.5 cmdk-sv: ^0.0.15 => 0.0.15 svelte: ^5.0.0-next.72 => 5.0.0-next.72
blocking an upgrade
The text was updated successfully, but these errors were encountered:
Not supporting Svelte 5 until it's stable.
Related: sveltejs/svelte#10359
Sorry, something went wrong.
Closing this to not clutter the issues that we aren't able to resolve.
just to update, this appears to be working fine on svelte@5.0.0-next.75
No branches or pull requests
Describe the bug
I do understand that Svelte 5 is still not out but I think will be good to have visibility of what it's not working anyway.
When using
Date Range Picker
ERR_SVELTE_TOO_MANY_UPDATES is triggered.Reproduction
+page.svelte
Logs
System Info
Severity
blocking an upgrade
The text was updated successfully, but these errors were encountered: