diff --git a/packages/bits-ui/src/lib/bits/date-range-field/date-range-field.svelte.ts b/packages/bits-ui/src/lib/bits/date-range-field/date-range-field.svelte.ts index 8eb5749d4..3bbd5ca3f 100644 --- a/packages/bits-ui/src/lib/bits/date-range-field/date-range-field.svelte.ts +++ b/packages/bits-ui/src/lib/bits/date-range-field/date-range-field.svelte.ts @@ -137,10 +137,10 @@ export class DateRangeFieldRootState { const value = this.value.value; untrack(() => { - if (value && value.start !== this.startValue.value) { + if (value.start !== undefined && value.start !== this.startValue.value) { this.setStartValue(value.start); } - if (value && value.end !== this.endValue.value) { + if (value.end !== undefined && value.end !== this.endValue.value) { this.setEndValue(value.end); } }); diff --git a/packages/bits-ui/src/lib/bits/date-range-picker/components/date-range-picker.svelte b/packages/bits-ui/src/lib/bits/date-range-picker/components/date-range-picker.svelte index 535cd1ef9..ce2725cfd 100644 --- a/packages/bits-ui/src/lib/bits/date-range-picker/components/date-range-picker.svelte +++ b/packages/bits-ui/src/lib/bits/date-range-picker/components/date-range-picker.svelte @@ -83,7 +83,7 @@ value: box.with( () => value as DateRange, (v) => { - if (value !== v) { + if (!$state.is(value, v)) { value = v; onValueChange(v); } diff --git a/packages/bits-ui/src/lib/bits/link-preview/link-preview.svelte.ts b/packages/bits-ui/src/lib/bits/link-preview/link-preview.svelte.ts index 828c738cb..0db8ffc44 100644 --- a/packages/bits-ui/src/lib/bits/link-preview/link-preview.svelte.ts +++ b/packages/bits-ui/src/lib/bits/link-preview/link-preview.svelte.ts @@ -199,7 +199,6 @@ class LinkPreviewContentState { this.root.isPointerInTransit = isPointerInTransit; onPointerExit(() => { - console.log("pointer exit"); this.root.handleClose(); }); }); diff --git a/packages/bits-ui/src/lib/bits/range-calendar/range-calendar.svelte.ts b/packages/bits-ui/src/lib/bits/range-calendar/range-calendar.svelte.ts index ba5b2ea40..14a5fb14a 100644 --- a/packages/bits-ui/src/lib/bits/range-calendar/range-calendar.svelte.ts +++ b/packages/bits-ui/src/lib/bits/range-calendar/range-calendar.svelte.ts @@ -239,8 +239,8 @@ export class RangeCalendarRootState { if (isBefore(endValue, startValue)) { const start = startValue; const end = endValue; - this.startValue.value = end; - this.endValue.value = start; + this.setStartValue(end); + this.setEndValue(start); return { start: endValue, end: startValue }; } else { return { @@ -268,6 +268,14 @@ export class RangeCalendarRootState { } }; + setStartValue = (value: DateValue | undefined) => { + this.startValue.value = value; + }; + + setEndValue = (value: DateValue | undefined) => { + this.endValue.value = value; + }; + #setMonths = (months: Month[]) => (this.months = months); /** @@ -449,14 +457,14 @@ export class RangeCalendarRootState { !this.preventDeselect.value && !this.endValue.value ) { - this.startValue.value = undefined; + this.setStartValue(undefined); this.placeholder.value = date; this.#announceEmpty(); return; - } else if (!this.endValue) { + } else if (!this.endValue.value) { e.preventDefault(); if (prevLastPressedDate && isSameDay(prevLastPressedDate, date)) { - this.startValue.value = date; + this.setStartValue(date); this.#announceSelectedDate(date); } } @@ -468,8 +476,8 @@ export class RangeCalendarRootState { isSameDay(this.endValue.value, date) && !this.preventDeselect.value ) { - this.startValue.value = undefined; - this.endValue.value = undefined; + this.setStartValue(undefined); + this.setEndValue(undefined); this.placeholder.value = date; this.#announceEmpty(); return; @@ -477,14 +485,14 @@ export class RangeCalendarRootState { if (!this.startValue.value) { this.#announceSelectedDate(date); - this.startValue.value = date; + this.setStartValue(date); } else if (!this.endValue.value) { this.#announceSelectedRange(this.startValue.value, date); - this.endValue.value = date; + this.setEndValue(date); } else if (this.endValue.value && this.startValue.value) { - this.endValue.value = undefined; + this.setEndValue(undefined); this.#announceSelectedDate(date); - this.startValue.value = date; + this.setStartValue(date); } }; diff --git a/packages/bits-ui/src/lib/internal/useGraceArea.svelte.ts b/packages/bits-ui/src/lib/internal/useGraceArea.svelte.ts index 7edb25707..a649db277 100644 --- a/packages/bits-ui/src/lib/internal/useGraceArea.svelte.ts +++ b/packages/bits-ui/src/lib/internal/useGraceArea.svelte.ts @@ -21,7 +21,6 @@ export function useGraceArea( } function handleCreateGraceArea(e: PointerEvent, hoverTarget: HTMLElement) { - console.log("creating grace area"); const currentTarget = e.currentTarget; if (!isHTMLElement(currentTarget)) return; const exitPoint = { x: e.clientX, y: e.clientY }; @@ -36,11 +35,7 @@ export function useGraceArea( $effect(() => { const trigger = triggerNode(); const content = contentNode(); - console.log("trigger", trigger); - console.log("content", content); if (!trigger || !content) return; - console.log("triggernode", trigger); - console.log("contentnode", content); const handleTriggerLeave = (e: PointerEvent) => { handleCreateGraceArea(e, content!); diff --git a/packages/bits-ui/src/tests/slider/Slider.spec.ts b/packages/bits-ui/src/tests/slider/Slider.spec.ts index c59251946..14ed054d9 100644 --- a/packages/bits-ui/src/tests/slider/Slider.spec.ts +++ b/packages/bits-ui/src/tests/slider/Slider.spec.ts @@ -574,7 +574,5 @@ function expectPercentages({ expect(isCloseEnough(percentage, thumb.style.left)).toBeTruthy(); } expect(isCloseEnough(lesserPercentage, range.style.left)).toBeTruthy(); - console.log("higherPercentage", higherPercentage); - console.log("rangeStyleRight", range.style.right); expect(isCloseEnough(100 - higherPercentage, range.style.right)).toBeTruthy(); } diff --git a/sites/docs/src/lib/components/demos/date-range-picker-demo.svelte b/sites/docs/src/lib/components/demos/date-range-picker-demo.svelte index a31e459e1..1bb9deb46 100644 --- a/sites/docs/src/lib/components/demos/date-range-picker-demo.svelte +++ b/sites/docs/src/lib/components/demos/date-range-picker-demo.svelte @@ -3,7 +3,7 @@ import { CalendarBlank, CaretLeft, CaretRight } from "$icons/index.js"; import { cn } from "$lib/utils/index.js"; - let value: DateRange = { start: undefined, end: undefined }; + let value: DateRange = $state({ start: undefined, end: undefined });