@urbicon-ui/blocks 6.21.3 → 6.22.0

package/dist/components/Calendar/Calendar.svelte

@@ -441,6 +441,14 @@
     onMonthChange?.(clamped.month, clamped.year);
   }
 
+  // Jump the reference date to a concrete day (mini-calendar drill-down into
+  // week/day view). Delegates to the controller, which clamps to
+  // [minDate, maxDate] and reports back through handleNavigate like every
+  // other controller-driven navigation path.
+  function goToDate(date: Date) {
+    controller.goTo(date);
+  }
+
   function setView(v: CalendarViewMode) {
     view = v;
     onViewChange?.(v);
@@ -572,6 +580,7 @@
     navigateYear,
     goToToday,
     goToMonth,
+    goToDate,
     selectDate,
     setFocusedDate,
     moveFocus,

package/dist/components/Calendar/CalendarMiniMonth.svelte

@@ -52,13 +52,14 @@
   function handleDayClick(date: Date) {
     // Navigate main calendar to this date and select it
     ctx.selectDate(date);
-    // Also sync view to the clicked day's month
-    if (date.getMonth() !== ctx.displayedMonth || date.getFullYear() !== ctx.displayedYear) {
-      ctx.goToMonth(date.getMonth(), date.getFullYear());
-    }
-    // If in week or day view, update displayed date
     if (ctx.view === 'week' || ctx.view === 'day') {
-      ctx.navigateDay(0); // triggers a re-render with the newly selected date
+      // selectDate only updates the selection — it never moves the reference
+      // date, so jump the week/day grid to the clicked day explicitly.
+      ctx.goToDate(date);
+    } else if (date.getMonth() !== ctx.displayedMonth || date.getFullYear() !== ctx.displayedYear) {
+      // Month-based views (month handled its own spill-jump in selectDate;
+      // agenda lands here) only need to sync to the clicked day's month.
+      ctx.goToMonth(date.getMonth(), date.getFullYear());
     }
   }
 
@@ -140,9 +141,10 @@
     </Button>
   </div>
 
-  <!-- Weekday headers -->
+  <!-- Weekday headers — narrow names duplicate in many locales (de-DE: M, D,
+       M, D, F, S, S), so the key needs the column position to stay unique. -->
   <div class="grid grid-cols-7">
-    {#each weekdayNames as name (name)}
+    {#each weekdayNames as name, i (`${i}-${name}`)}
       <span class={slot('miniCalendarWeekday')}>{name}</span>
     {/each}
   </div>

package/dist/components/Calendar/calendar.context.d.ts

@@ -51,6 +51,9 @@ export interface CalendarContext {
     setView: (view: CalendarViewMode) => void;
     /** Navigate to a specific month (used by year grid drill-down). */
     goToMonth: (month: number, year: number) => void;
+    /** Jump the reference date to a specific day, clamped to [minDate, maxDate]
+     * (mini-calendar drill-down into week/day view). */
+    goToDate: (date: Date) => void;
     isDateDisabled: (date: Date) => boolean;
     isDateSelected: (date: Date) => boolean;
     isDateToday: (date: Date) => boolean;

package/dist/components/Calendar/calendar.drag.js

@@ -194,11 +194,8 @@ export function resizableEvent(opts) {
                 return;
             isResizing = false;
             handle.releasePointerCapture(e.pointerId);
-            handle.removeEventListener('pointermove', handlePointerMove);
-            handle.removeEventListener('pointerup', handlePointerUp);
-            handle.removeEventListener('pointercancel', handlePointerUp);
-            document.body.style.cursor = '';
-            // Calculate new end time based on final position
+            // Calculate new end time based on final position — measured BEFORE
+            // cleanup(), which resets the inline height the calculation reads.
             const gridRect = opts.gridEl.getBoundingClientRect();
             const eventRect = opts.eventEl.getBoundingClientRect();
             const gridTotalMinutes = (opts.endHour - opts.startHour) * 60;
@@ -219,14 +216,29 @@ export function resizableEvent(opts) {
             // Compute new end date
             const newEnd = new Date(opts.event.start);
             newEnd.setHours(Math.floor(clampedMinutes / 60), clampedMinutes % 60, 0, 0);
-            // Reset inline height — the parent will re-render with new props
-            opts.eventEl.style.height = '';
+            cleanup();
             opts.onResizeEnd?.(opts.event, newEnd);
         }
+        // Teardown of everything a live resize holds: document-level cursor, the
+        // move/up/cancel listeners, and the event block's inline height (the parent
+        // re-renders the committed height from props).
+        function cleanup() {
+            handle.removeEventListener('pointermove', handlePointerMove);
+            handle.removeEventListener('pointerup', handlePointerUp);
+            handle.removeEventListener('pointercancel', handlePointerUp);
+            document.body.style.cursor = '';
+            opts.eventEl.style.height = '';
+        }
         handle.addEventListener('pointerdown', handlePointerDown);
         handle.style.touchAction = 'none';
         return () => {
             handle.removeEventListener('pointerdown', handlePointerDown);
+            // Clean up any in-progress resize on unmount (mirrors draggableEvent) —
+            // otherwise the row-resize cursor and inline height would leak.
+            if (isResizing) {
+                cleanup();
+                isResizing = false;
+            }
         };
     };
 }