@tasknotes/calendar 0.1.8 → 0.1.11

package/dist/types/core/layout.d.cts

@@ -24,6 +24,11 @@ export interface TimedPlacement<D = unknown> extends TimedSegment<D> {
      * Only then does the item keep to its lane's share of the column.
      */
     split: boolean;
+    /**
+     * Another item starts exactly where this short one ends, so it is drawn at
+     * its real height instead of being stretched to the minimum height.
+     */
+    abutted?: boolean;
 }
 export interface TimedDayLayout<D = unknown> {
     day: Day;

package/dist/types/core/layout.d.ts

@@ -24,6 +24,11 @@ export interface TimedPlacement<D = unknown> extends TimedSegment<D> {
      * Only then does the item keep to its lane's share of the column.
      */
     split: boolean;
+    /**
+     * Another item starts exactly where this short one ends, so it is drawn at
+     * its real height instead of being stretched to the minimum height.
+     */
+    abutted?: boolean;
 }
 export interface TimedDayLayout<D = unknown> {
     day: Day;

package/dist/types/dom/calendar.d.cts

@@ -39,8 +39,10 @@ export declare class Calendar<D = unknown> implements ViewContext<D> {
     draggingId: string | null;
     private listDragPreview;
     private dragSources;
+    private dragWidth;
     private dragScrollFrame;
     private readonly dragScrollOrigins;
+    private readonly dragScrollEdges;
     private readonly itemWriteStates;
     dragRow: {
         id: string;
@@ -49,6 +51,7 @@ export declare class Calendar<D = unknown> implements ViewContext<D> {
     strip: DateStrip<D> | null;
     private stripSize;
     private rebuilding;
+    private pinch;
     private readonly toolbarEl;
     private readonly viewHost;
     private current;
@@ -204,7 +207,12 @@ export declare class Calendar<D = unknown> implements ViewContext<D> {
     private readonly onPointerDown;
     private activate;
     private startDragScroll;
+    private readonly onTouchStart;
     private readonly onTouchMove;
+    private readonly onTouchEnd;
+    /** Rescales the grid, keeping the anchored time under the fingers. */
+    private pinchTo;
+    private endPinch;
     private readonly onPointerMove;
     private readonly onPointerUp;
     private readonly onPointerCancel;

package/dist/types/dom/calendar.d.ts

@@ -39,8 +39,10 @@ export declare class Calendar<D = unknown> implements ViewContext<D> {
     draggingId: string | null;
     private listDragPreview;
     private dragSources;
+    private dragWidth;
     private dragScrollFrame;
     private readonly dragScrollOrigins;
+    private readonly dragScrollEdges;
     private readonly itemWriteStates;
     dragRow: {
         id: string;
@@ -49,6 +51,7 @@ export declare class Calendar<D = unknown> implements ViewContext<D> {
     strip: DateStrip<D> | null;
     private stripSize;
     private rebuilding;
+    private pinch;
     private readonly toolbarEl;
     private readonly viewHost;
     private current;
@@ -204,7 +207,12 @@ export declare class Calendar<D = unknown> implements ViewContext<D> {
     private readonly onPointerDown;
     private activate;
     private startDragScroll;
+    private readonly onTouchStart;
     private readonly onTouchMove;
+    private readonly onTouchEnd;
+    /** Rescales the grid, keeping the anchored time under the fingers. */
+    private pinchTo;
+    private endPinch;
     private readonly onPointerMove;
     private readonly onPointerUp;
     private readonly onPointerCancel;

package/dist/types/dom/format.d.cts

@@ -1,10 +1,11 @@
 import { type Day } from "../core/date.cjs";
 /** Locale-aware labels. Formatting happens on UTC dates built from civil days, so zones never shift them. */
 export declare class Formatter {
+    private readonly formatTime?;
     private readonly cache;
     readonly locale: string | undefined;
     readonly hour12: boolean;
-    constructor(locale: string | undefined, hour12: boolean | undefined);
+    constructor(locale: string | undefined, hour12: boolean | undefined, formatTime?: ((minute: number) => string) | undefined);
     private fmt;
     private d;
     weekdayShort(day: Day): string;

package/dist/types/dom/format.d.ts

@@ -1,10 +1,11 @@
 import { type Day } from "../core/date.js";
 /** Locale-aware labels. Formatting happens on UTC dates built from civil days, so zones never shift them. */
 export declare class Formatter {
+    private readonly formatTime?;
     private readonly cache;
     readonly locale: string | undefined;
     readonly hour12: boolean;
-    constructor(locale: string | undefined, hour12: boolean | undefined);
+    constructor(locale: string | undefined, hour12: boolean | undefined, formatTime?: ((minute: number) => string) | undefined);
     private fmt;
     private d;
     weekdayShort(day: Day): string;

package/dist/types/dom/options.d.cts

@@ -340,6 +340,7 @@ export interface CalendarOptions<D = unknown> {
     firstDay: number | undefined;
     /** undefined = locale default. */
     hour12: boolean | undefined;
+    formatTime?: (minute: number) => string;
     weekNumbers: boolean;
     weekends: boolean;
     hiddenDays: number[];
@@ -356,11 +357,14 @@ export interface CalendarOptions<D = unknown> {
     scrollTime: string | number;
     /** Pixel height of one slot. */
     slotHeight: number;
+    /** A two-finger pinch on a time grid rescales `slotHeight`. False leaves the pinch to the browser. */
+    pinchZoom: boolean;
     /** Stretch slots to fill the available height ("fill" mode only). */
     expandRows: boolean;
     nowIndicator: boolean;
     selectMirror: boolean;
     slotEventOverlap: boolean;
+    overlapStackThreshold?: number;
     /** Minimum item height in px in time grids. */
     eventMinHeight: number;
     /** Max side-by-side items in a time-grid cluster before "+N". 0 = unlimited. */
@@ -392,6 +396,8 @@ export interface CalendarOptions<D = unknown> {
     selected: string | readonly string[] | null;
     onRangeChange?: (view: ViewInfo) => void;
     onViewChange?: (view: ViewInfo) => void;
+    /** A pinch settled on a new `slotHeight`, whole pixels. Store it to keep the scale across reloads. */
+    onSlotHeightChange?: (slotHeight: number) => void;
     onItemClick?: (arg: ItemPointerArg<D>) => void;
     onItemDoubleClick?: (arg: ItemPointerArg<D>) => void;
     onItemContextMenu?: (arg: ItemPointerArg<D>) => void;

package/dist/types/dom/options.d.ts

@@ -340,6 +340,7 @@ export interface CalendarOptions<D = unknown> {
     firstDay: number | undefined;
     /** undefined = locale default. */
     hour12: boolean | undefined;
+    formatTime?: (minute: number) => string;
     weekNumbers: boolean;
     weekends: boolean;
     hiddenDays: number[];
@@ -356,11 +357,14 @@ export interface CalendarOptions<D = unknown> {
     scrollTime: string | number;
     /** Pixel height of one slot. */
     slotHeight: number;
+    /** A two-finger pinch on a time grid rescales `slotHeight`. False leaves the pinch to the browser. */
+    pinchZoom: boolean;
     /** Stretch slots to fill the available height ("fill" mode only). */
     expandRows: boolean;
     nowIndicator: boolean;
     selectMirror: boolean;
     slotEventOverlap: boolean;
+    overlapStackThreshold?: number;
     /** Minimum item height in px in time grids. */
     eventMinHeight: number;
     /** Max side-by-side items in a time-grid cluster before "+N". 0 = unlimited. */
@@ -392,6 +396,8 @@ export interface CalendarOptions<D = unknown> {
     selected: string | readonly string[] | null;
     onRangeChange?: (view: ViewInfo) => void;
     onViewChange?: (view: ViewInfo) => void;
+    /** A pinch settled on a new `slotHeight`, whole pixels. Store it to keep the scale across reloads. */
+    onSlotHeightChange?: (slotHeight: number) => void;
     onItemClick?: (arg: ItemPointerArg<D>) => void;
     onItemDoubleClick?: (arg: ItemPointerArg<D>) => void;
     onItemContextMenu?: (arg: ItemPointerArg<D>) => void;

package/dist/types/dom/views/daygrid.d.cts

@@ -14,10 +14,12 @@ export declare class DayGridView<D> implements View {
     private topPx;
     private lastHeights;
     private dotsMode;
+    private dragPreviews;
     constructor(ctx: ViewContext<D>);
     private daysPerWeek;
     private sizeKey;
     render(_change: StoreChange | null): void;
+    private clearDragPreviews;
     /** Height of a "+N more" link as the host styles it (`--tnc-more-h`, or a taller min-height). */
     private measureMore;
     private limitFor;

package/dist/types/dom/views/daygrid.d.ts

@@ -14,10 +14,12 @@ export declare class DayGridView<D> implements View {
     private topPx;
     private lastHeights;
     private dotsMode;
+    private dragPreviews;
     constructor(ctx: ViewContext<D>);
     private daysPerWeek;
     private sizeKey;
     render(_change: StoreChange | null): void;
+    private clearDragPreviews;
     /** Height of a "+N more" link as the host styles it (`--tnc-more-h`, or a taller min-height). */
     private measureMore;
     private limitFor;

package/dist/types/dom/views/list.d.cts

@@ -22,6 +22,7 @@ export declare class ListView<D> implements View {
     private frame;
     /** A picked day stays marked until the list is scrolled by hand. */
     private pinned;
+    private pinnedTop;
     constructor(ctx: ViewContext<D>);
     private itemsOn;
     render(_change: StoreChange | null): void;

package/dist/types/dom/views/list.d.ts

@@ -22,6 +22,7 @@ export declare class ListView<D> implements View {
     private frame;
     /** A picked day stays marked until the list is scrolled by hand. */
     private pinned;
+    private pinnedTop;
     constructor(ctx: ViewContext<D>);
     private itemsOn;
     render(_change: StoreChange | null): void;

package/dist/types/dom/views/strip.d.cts

@@ -12,6 +12,7 @@ export declare class DateStrip<D> {
     private readonly pick;
     /** Called when the days on show change, so their items can be loaded. */
     private readonly onShown;
+    private readonly onPage?;
     readonly el: HTMLElement;
     private readonly title;
     private readonly dows;
@@ -31,7 +32,7 @@ export declare class DateStrip<D> {
     expanded: boolean;
     constructor(ctx: ViewContext<D>, pick: (day: Day, ev: MouseEvent | KeyboardEvent) => void, focus: Day, 
     /** Called when the days on show change, so their items can be loaded. */
-    onShown: () => void);
+    onShown: () => void, onPage?: ((day: Day) => void) | undefined);
     /** The list scrolled or the grid moved: mark the day and keep it in view. */
     setFocus(day: Day, range?: {
         start: Day;
@@ -55,6 +56,7 @@ export declare class DateStrip<D> {
     private readonly onClick;
     private readonly onKeyDown;
     private readonly onPointerDown;
+    private readonly ownTouch;
     private readonly onPointerUp;
     private readonly onPointerCancel;
     /** A swipe that ends on a day is not a pick. */

package/dist/types/dom/views/strip.d.ts

@@ -12,6 +12,7 @@ export declare class DateStrip<D> {
     private readonly pick;
     /** Called when the days on show change, so their items can be loaded. */
     private readonly onShown;
+    private readonly onPage?;
     readonly el: HTMLElement;
     private readonly title;
     private readonly dows;
@@ -31,7 +32,7 @@ export declare class DateStrip<D> {
     expanded: boolean;
     constructor(ctx: ViewContext<D>, pick: (day: Day, ev: MouseEvent | KeyboardEvent) => void, focus: Day, 
     /** Called when the days on show change, so their items can be loaded. */
-    onShown: () => void);
+    onShown: () => void, onPage?: ((day: Day) => void) | undefined);
     /** The list scrolled or the grid moved: mark the day and keep it in view. */
     setFocus(day: Day, range?: {
         start: Day;
@@ -55,6 +56,7 @@ export declare class DateStrip<D> {
     private readonly onClick;
     private readonly onKeyDown;
     private readonly onPointerDown;
+    private readonly ownTouch;
     private readonly onPointerUp;
     private readonly onPointerCancel;
     /** A swipe that ends on a day is not a pick. */

package/dist/types/dom/views/timegrid.d.cts

@@ -26,7 +26,10 @@ export declare class TimeGridView<D> implements View {
     private get minutes();
     private build;
     private buildGutter;
-    private applyScale;
+    /** Slot height as drawn, which `expandRows` can stretch past the option. */
+    get drawnSlotHeight(): number;
+    /** Applies `slotHeight`. Items are placed in percentages, so they follow without a render. */
+    applyScale(): void;
     /** In fill mode with expandRows, stretches slots so the grid fills the height. */
     private fitRows;
     render(change: StoreChange | null): void;

package/dist/types/dom/views/timegrid.d.ts

@@ -26,7 +26,10 @@ export declare class TimeGridView<D> implements View {
     private get minutes();
     private build;
     private buildGutter;
-    private applyScale;
+    /** Slot height as drawn, which `expandRows` can stretch past the option. */
+    get drawnSlotHeight(): number;
+    /** Applies `slotHeight`. Items are placed in percentages, so they follow without a render. */
+    applyScale(): void;
     /** In fill mode with expandRows, stretches slots so the grid fills the height. */
     private fitRows;
     render(change: StoreChange | null): void;

package/dist/types/tasknotes/bases.d.cts

@@ -24,6 +24,8 @@ export interface BasesCalendarLayout {
     slotDuration?: string | null;
     snapDuration?: string | null;
     scrollTime?: string | null;
+    slotHeight?: number | null;
+    pinchZoom?: boolean | null;
     nowIndicator?: boolean | null;
     showTimeGrid?: boolean | null;
     selectMirror?: boolean | null;

package/dist/types/tasknotes/bases.d.ts

@@ -24,6 +24,8 @@ export interface BasesCalendarLayout {
     slotDuration?: string | null;
     snapDuration?: string | null;
     scrollTime?: string | null;
+    slotHeight?: number | null;
+    pinchZoom?: boolean | null;
     nowIndicator?: boolean | null;
     showTimeGrid?: boolean | null;
     selectMirror?: boolean | null;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tasknotes/calendar",
-	"version": "0.1.8",
+	"version": "0.1.11",
 	"description": "Task-native calendar engine for TaskNotes: incremental layout, time grid, month, list, year and timeline views.",
 	"license": "MIT",
 	"type": "module",