Skip to content
New issue

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

Svelte integration causes freeze #52

Open
xiBread opened this issue Feb 16, 2025 · 1 comment
Open

Svelte integration causes freeze #52

xiBread opened this issue Feb 16, 2025 · 1 comment

Comments

@xiBread
Copy link

xiBread commented Feb 16, 2025

Date updates seem to get stuck in some sort of infinite loop and freeze the tab. Happens immediately if an initial date is supplied in the options; otherwise, after all of the fields are filled. The Storybook demo exhibits this behavior.

@xiBread
Copy link
Author

xiBread commented Feb 16, 2025

Minimal workaround that I hacked up:

import type { Action } from "svelte/action";
import { TimescapeManager, type DateType, type Options } from "timescape";

interface TimescapeOptions extends Options {
	onDateChange?: (date?: Date) => void;
}

export function createTimescape({ onDateChange, date, ...options }: TimescapeOptions = {}) {
	const manager = new TimescapeManager(date, options);

	if (onDateChange) {
		manager.on("changeDate", onDateChange);
	}

	const root: Action<HTMLElement> = (node) => {
		manager.registerRoot(node);
	};

	const input: Action<HTMLInputElement, DateType> = (node, type) => {
		manager.registerElement(node, type);
	};

	return {
		manager,
		root,
		input,
	};
}
let date = $state(new Date());

const timescape = createTimescape({
	hour12: true,
	onDateChange(newDate) {
		if (newDate) date = newDate;
	},
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant