@3mo/date-time-fields 0.11.0-preview.0 → 0.11.0-preview.2

package/dist/FieldDateTime.d.ts

@@ -10,8 +10,8 @@ export declare class FieldDateTime extends FieldDateTimeBase<Date | undefined> {
     label: string;
     value?: Date;
     protected get placeholder(): string;
-    protected resetNavigatingDate(): void;
-    protected get calendarTemplate(): import("lit-html").HTMLTemplateResult;
+    protected resetNavigationDate(): void;
+    protected get calendarValue(): import("@3mo/date-time/DateTimeRange.js").DateTimeRange;
     protected handleSelectedDateChange(date: DateTime, precision: FieldDateTimePrecision): void;
     protected valueToInputValue(value: Date | undefined): string;
     protected inputValueToValue(value: string): import("@3mo/date-time/DateTime.js").DateTime | undefined;

package/dist/FieldDateTime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldDateTime.d.ts","sourceRoot":"","sources":["../FieldDateTime.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAOzE;;;;GAIG;AACH,qBACa,aAAc,SAAQ,iBAAiB,CAAC,IAAI,GAAG,SAAS,CAAC;IACrE,SAAS,KAAK,YAAY,8DAQzB;IAEoB,KAAK,SAAmB;IACjB,KAAK,CAAC,EAAE,IAAI,CAAA;IAExC,cACuB,WAAW,WAEjC;IAED,SAAS,CAAC,mBAAmB;IAI7B,SAAS,KAAK,gBAAgB,0CAQ7B;cAEkB,wBAAwB,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,sBAAsB;IAO7F,SAAS,CAAC,iBAAiB,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS;IAInD,SAAS,CAAC,iBAAiB,CAAC,KAAK,EAAE,MAAM;CAGzC;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,oBAAoB,EAAE,aAAa,CAAA;KACnC;CACD"}
+{"version":3,"file":"FieldDateTime.d.ts","sourceRoot":"","sources":["../FieldDateTime.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAOzE;;;;GAIG;AACH,qBACa,aAAc,SAAQ,iBAAiB,CAAC,IAAI,GAAG,SAAS,CAAC;IACrE,SAAS,KAAK,YAAY,8DAQzB;IAEoB,KAAK,SAAmB;IACjB,KAAK,CAAC,EAAE,IAAI,CAAA;IAExC,cACuB,WAAW,WAEjC;IAED,SAAS,CAAC,mBAAmB;IAI7B,SAAS,KAAK,aAAa,4DAE1B;cAEkB,wBAAwB,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,sBAAsB;IAO7F,SAAS,CAAC,iBAAiB,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS;IAInD,SAAS,CAAC,iBAAiB,CAAC,KAAK,EAAE,MAAM;CAGzC;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,oBAAoB,EAAE,aAAa,CAAA;KACnC;CACD"}

package/dist/FieldDateTime.js

@@ -1,5 +1,5 @@
 import { __decorate } from "tslib";
-import { component, html, property } from '@a11d/lit';
+import { component, property } from '@a11d/lit';
 import { Localizer } from '@3mo/localization';
 import { FieldDateTimeBase } from './FieldDateTimeBase.js';
 import { Memoize as memoize } from 'typescript-memoize';
@@ -28,20 +28,14 @@ let FieldDateTime = class FieldDateTime extends FieldDateTimeBase {
     get placeholder() {
         return new DateTime().format(this.formatOptions);
     }
-    resetNavigatingDate() {
-        this.navigatingDate = this.selectedDate ?? new DateTime();
+    resetNavigationDate() {
+        this.navigationDate = this.selectedDate ?? new DateTime();
     }
-    get calendarTemplate() {
-        return html `
-			<mo-calendar
-				precision=${this.precision.key}
-				.value=${new DateTimeRange(this.selectedDate, this.selectedDate)}
-				@dateClick=${(e) => this.handleSelectedDateChange(e.detail, this.precision)}
-			></mo-calendar>
-		`;
+    get calendarValue() {
+        return new DateTimeRange(this.selectedDate, this.selectedDate);
     }
     handleSelectedDateChange(date, precision) {
-        const { hour, minute, second } = this.navigatingDate;
+        const { hour, minute, second } = this.navigationDate;
         date = date.with({ hour, minute, second });
         this.value = !date ? undefined : this.precision.getRange(date).start;
         super.handleSelectedDateChange(date, precision);

package/dist/FieldDateTimeBase.d.ts

@@ -1,4 +1,3 @@
-import { type HTMLTemplateResult } from '@a11d/lit';
 import { InputFieldComponent } from '@3mo/field';
 import { type MaterialIcon } from '@3mo/icon';
 import { FieldDateTimePrecision } from './FieldDateTimePrecision.js';
@@ -14,7 +13,7 @@ export declare abstract class FieldDateTimeBase<T> extends InputFieldComponent<T
     pickerHidden: boolean;
     shortcutReferenceDate: import("@3mo/date-time/DateTime.js").DateTime;
     precision: FieldDateTimePrecision;
-    navigatingDate: import("@3mo/date-time/DateTime.js").DateTime;
+    navigationDate: import("@3mo/date-time/DateTime.js").DateTime;
     protected readonly calendar?: Calendar;
     protected connected(): void;
     protected disconnected(): void;
@@ -23,22 +22,23 @@ export declare abstract class FieldDateTimeBase<T> extends InputFieldComponent<T
     protected abstract get selectedDate(): DateTime | undefined;
     protected get formatOptions(): Intl.DateTimeFormatOptions;
     protected valueUpdated(): void;
-    protected abstract resetNavigatingDate(): void;
+    protected abstract resetNavigationDate(): void;
     protected handleChange(value?: T, e?: Event): void;
     protected get isActive(): boolean;
     protected get placeholder(): string;
     static get styles(): import("@a11d/lit").CSSResult;
-    protected get template(): HTMLTemplateResult;
-    protected get endSlotTemplate(): HTMLTemplateResult;
-    protected get inputTemplate(): HTMLTemplateResult;
+    protected get template(): import("lit-html").HTMLTemplateResult;
+    protected get endSlotTemplate(): import("lit-html").HTMLTemplateResult;
+    protected get inputTemplate(): import("lit-html").HTMLTemplateResult;
     protected abstract inputValueToValue(value: string): T | undefined;
     protected abstract valueToInputValue(value: T | undefined): string;
     private get clearIconButtonTemplate();
-    protected get calendarIconButtonTemplate(): HTMLTemplateResult;
-    protected get popoverTemplate(): HTMLTemplateResult;
-    protected get popoverContentTemplate(): HTMLTemplateResult;
-    protected get dateTemplate(): HTMLTemplateResult;
-    protected abstract get calendarTemplate(): HTMLTemplateResult;
+    protected get calendarIconButtonTemplate(): import("lit-html").HTMLTemplateResult;
+    protected get popoverTemplate(): import("lit-html").HTMLTemplateResult;
+    protected get popoverContentTemplate(): import("lit-html").HTMLTemplateResult;
+    protected get dateTemplate(): import("lit-html").HTMLTemplateResult;
+    protected get calendarTemplate(): import("lit-html").HTMLTemplateResult;
+    protected abstract get calendarValue(): DateTimeRange | undefined;
     private get timeTemplate();
     private get hourListTemplate();
     private get minuteListTemplate();

package/dist/FieldDateTimeBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldDateTimeBase.d.ts","sourceRoot":"","sources":["../FieldDateTimeBase.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,kBAAkB,EAA0E,MAAM,WAAW,CAAA;AAC3H,OAAO,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AACpE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAEpD;;;;;GAKG;AACH,8BAAsB,iBAAiB,CAAC,CAAC,CAAE,SAAQ,mBAAmB,CAAC,CAAC,CAAC;IAC5B,IAAI,UAAQ;IAC3B,YAAY,UAAQ;IACrB,qBAAqB,gDAAe;IACkC,SAAS,yBAAgC;IAElI,cAAc,gDAAiB;IAElB,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,QAAQ,CAAA;cAEzC,SAAS;cAIT,YAAY;IAI/B,OAAO,CAAC,oBAAoB,CAE3B;IAED,SAAS,CAAC,QAAQ,CAAC,sBAAsB,EAAE,YAAY,CAAU;IAEjE,SAAS,CAAC,QAAQ,KAAK,YAAY,IAAI,QAAQ,GAAG,SAAS,CAAA;IAE3D,SAAS,KAAK,aAAa,IAAI,IAAI,CAAC,qBAAqB,CAMxD;cAEkB,YAAY;IAK/B,SAAS,CAAC,QAAQ,CAAC,mBAAmB,IAAI,IAAI;cAE3B,YAAY,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK;IAKpD,cAAuB,QAAQ,YAE9B;IAED,SAAS,KAAK,WAAW,WAExB;IAED,WAAoB,MAAM,kCA8CzB;IAED,cAAuB,QAAQ,uBAK9B;IAED,cAAuB,eAAe,uBAMrC;IAED,cAAuB,aAAa,uBAanC;IAED,SAAS,CAAC,QAAQ,CAAC,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,GAAG,SAAS;uBACtC,iBAAiB,CAAC,KAAK,EAAE,CAAC,GAAG,SAAS,GAAG,MAAM;IAE3E,OAAO,KAAK,uBAAuB,GAYlC;IAED,SAAS,KAAK,0BAA0B,uBAOvC;IAED,SAAS,KAAK,eAAe,uBAS5B;IAED,SAAS,KAAK,sBAAsB,uBAOnC;IAED,SAAS,KAAK,YAAY,uBAEzB;IAED,SAAS,CAAC,QAAQ,KAAK,gBAAgB,IAAI,kBAAkB,CAAA;IAE7D,OAAO,KAAK,YAAY,GAavB;IAED,OAAO,KAAK,gBAAgB,GAQ3B;IAED,OAAO,KAAK,kBAAkB,GAQ7B;IAED,OAAO,KAAK,kBAAkB,GAQ7B;IAED,SAAS,CAAC,wBAAwB,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,sBAAsB;CAMpF"}
+{"version":3,"file":"FieldDateTimeBase.d.ts","sourceRoot":"","sources":["../FieldDateTimeBase.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AACpE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAEpD;;;;;GAKG;AACH,8BAAsB,iBAAiB,CAAC,CAAC,CAAE,SAAQ,mBAAmB,CAAC,CAAC,CAAC;IAC5B,IAAI,UAAQ;IAC3B,YAAY,UAAQ;IACrB,qBAAqB,gDAAe;IACkC,SAAS,yBAAgC;IAElI,cAAc,gDAAiB;IAElB,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,QAAQ,CAAA;cAEzC,SAAS;cAIT,YAAY;IAI/B,OAAO,CAAC,oBAAoB,CAE3B;IAED,SAAS,CAAC,QAAQ,CAAC,sBAAsB,EAAE,YAAY,CAAU;IAEjE,SAAS,CAAC,QAAQ,KAAK,YAAY,IAAI,QAAQ,GAAG,SAAS,CAAA;IAE3D,SAAS,KAAK,aAAa,IAAI,IAAI,CAAC,qBAAqB,CAMxD;cAEkB,YAAY;IAK/B,SAAS,CAAC,QAAQ,CAAC,mBAAmB,IAAI,IAAI;cAE3B,YAAY,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK;IAKpD,cAAuB,QAAQ,YAE9B;IAED,SAAS,KAAK,WAAW,WAExB;IAED,WAAoB,MAAM,kCA8CzB;IAED,cAAuB,QAAQ,0CAK9B;IAED,cAAuB,eAAe,0CAMrC;IAED,cAAuB,aAAa,0CAanC;IAED,SAAS,CAAC,QAAQ,CAAC,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,GAAG,SAAS;uBACtC,iBAAiB,CAAC,KAAK,EAAE,CAAC,GAAG,SAAS,GAAG,MAAM;IAE3E,OAAO,KAAK,uBAAuB,GAYlC;IAED,SAAS,KAAK,0BAA0B,0CAOvC;IAED,SAAS,KAAK,eAAe,0CAS5B;IAED,SAAS,KAAK,sBAAsB,0CAOnC;IAED,SAAS,KAAK,YAAY,0CAEzB;IAED,SAAS,KAAK,gBAAgB,0CAQ7B;IAED,SAAS,CAAC,QAAQ,KAAK,aAAa,IAAI,aAAa,GAAG,SAAS,CAAA;IAEjE,OAAO,KAAK,YAAY,GAavB;IAED,OAAO,KAAK,gBAAgB,GAQ3B;IAED,OAAO,KAAK,kBAAkB,GAQ7B;IAED,OAAO,KAAK,kBAAkB,GAQ7B;IAED,SAAS,CAAC,wBAAwB,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,sBAAsB;CAMpF"}

package/dist/FieldDateTimeBase.js

@@ -15,9 +15,9 @@ export class FieldDateTimeBase extends InputFieldComponent {
         this.pickerHidden = false;
         this.shortcutReferenceDate = new DateTime;
         this.precision = FieldDateTimePrecision.Minute;
-        this.navigatingDate = new DateTime();
+        this.navigationDate = new DateTime();
         this.handleLanguageChange = () => {
-            this.navigatingDate = new DateTime(this.navigatingDate);
+            this.navigationDate = new DateTime(this.navigationDate);
         };
         this.calendarIconButtonIcon = 'today';
     }
@@ -36,7 +36,7 @@ export class FieldDateTimeBase extends InputFieldComponent {
     }
     valueUpdated() {
         super.valueUpdated();
-        this.resetNavigatingDate();
+        this.resetNavigationDate();
     }
     handleChange(value, e) {
         super.handleChange(value, e);
@@ -147,7 +147,7 @@ export class FieldDateTimeBase extends InputFieldComponent {
         return this.pickerHidden ? html.nothing : html `
 			<mo-popover tabindex='-1'
 				.anchor=${this} target='field'
-				?open=${bind(this, 'open', { sourceUpdated: () => setTimeout(() => this.calendar?.scrollToNavigatingItem()) })}
+				?open=${bind(this, 'open', { sourceUpdated: () => setTimeout(() => this.calendar?.setNavigatingValue(this.navigationDate)) })}
 			>
 				${cache(!this.open ? html.nothing : this.popoverContentTemplate)}
 			</mo-popover>
@@ -164,6 +164,15 @@ export class FieldDateTimeBase extends InputFieldComponent {
     get dateTemplate() {
         return this.calendarTemplate;
     }
+    get calendarTemplate() {
+        return html `
+			<mo-calendar
+				.precision=${this.precision > FieldDateTimePrecision.Day ? FieldDateTimePrecision.Day : this.precision}
+				.value=${this.calendarValue}
+				@dateClick=${(e) => this.handleSelectedDateChange(e.detail, this.precision)}
+			></mo-calendar>
+		`;
+    }
     get timeTemplate() {
         return this.precision <= FieldDateTimePrecision.Day ? html.nothing : html `
 			<mo-flex gap='0.5rem'>
@@ -172,8 +181,8 @@ export class FieldDateTimeBase extends InputFieldComponent {
 					${this.minuteListTemplate}
 					${this.secondListTemplate}
 				</mo-flex>
-				<div class='timezone' title=${ifDefined(this.navigatingDate?.formatToParts({ timeZoneName: 'long' }).find(x => x.type === 'timeZoneName')?.value)}>
-					${this.navigatingDate?.formatToParts({ timeZoneName: 'shortOffset' }).find(x => x.type === 'timeZoneName')?.value}
+				<div class='timezone' title=${ifDefined(this.navigationDate?.formatToParts({ timeZoneName: 'long' }).find(x => x.type === 'timeZoneName')?.value)}>
+					${this.navigationDate?.formatToParts({ timeZoneName: 'shortOffset' }).find(x => x.type === 'timeZoneName')?.value}
 				</div>
 			</mo-flex>
 		`;
@@ -181,7 +190,7 @@ export class FieldDateTimeBase extends InputFieldComponent {
     get hourListTemplate() {
         return this.precision < FieldDateTimePrecision.Hour ? html.nothing : html `
 			<mo-hour-list style='flex: 1'
-				.navigatingValue=${bind(this, 'navigatingDate')}
+				.navigationDate=${bind(this, 'navigationDate')}
 				.value=${this.selectedDate}
 				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Hour)}
 			></mo-hour-list>
@@ -190,7 +199,7 @@ export class FieldDateTimeBase extends InputFieldComponent {
     get minuteListTemplate() {
         return this.precision < FieldDateTimePrecision.Minute ? html.nothing : html `
 			<mo-minute-list style='flex: 1'
-				.navigatingValue=${bind(this, 'navigatingDate')}
+				.navigationDate=${bind(this, 'navigationDate')}
 				.value=${this.selectedDate}
 				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Minute)}
 			></mo-minute-list>
@@ -199,7 +208,7 @@ export class FieldDateTimeBase extends InputFieldComponent {
     get secondListTemplate() {
         return this.precision < FieldDateTimePrecision.Second ? html.nothing : html `
 			<mo-second-list style='flex: 1'
-				.navigatingValue=${bind(this, 'navigatingDate')}
+				.navigationDate=${bind(this, 'navigationDate')}
 				.value=${this.selectedDate}
 				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Second)}
 			></mo-second-list>
@@ -226,7 +235,7 @@ __decorate([
 ], FieldDateTimeBase.prototype, "precision", void 0);
 __decorate([
     state()
-], FieldDateTimeBase.prototype, "navigatingDate", void 0);
+], FieldDateTimeBase.prototype, "navigationDate", void 0);
 __decorate([
     query('mo-calendar')
 ], FieldDateTimeBase.prototype, "calendar", void 0);

package/dist/FieldDateTimeRange.d.ts

@@ -20,11 +20,11 @@ export declare class FieldDateTimeRange extends FieldDateTimeBase<DateTimeRange
     label: string;
     selection: FieldDateRangeSelection;
     value?: DateTimeRange;
-    protected resetNavigatingDate(): void;
+    protected resetNavigationDate(): void;
     static get styles(): import("@a11d/lit").CSSResult;
     protected calendarIconButtonIcon: MaterialIcon;
     protected get placeholder(): string;
-    protected get calendarTemplate(): import("lit-html").HTMLTemplateResult;
+    protected get calendarValue(): import("@3mo/date-time/DateTimeRange.js").DateTimeRange | undefined;
     protected get popoverContentTemplate(): import("lit-html").HTMLTemplateResult;
     protected get popoverToolbarTemplate(): import("lit-html").HTMLTemplateResult;
     private get startEndTabBarTemplate();

package/dist/FieldDateTimeRange.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldDateTimeRange.d.ts","sourceRoot":"","sources":["../FieldDateTimeRange.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AAG7C,OAAO,EAAE,iBAAiB,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC/E,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AASzE,aAAK,uBAAuB;IAC3B,KAAK,UAAU;IACf,GAAG,QAAQ;CACX;AAED;;;;;;;;;GASG;AACH,qBACa,kBAAmB,SAAQ,iBAAiB,CAAC,aAAa,GAAG,SAAS,CAAC;IACnF,SAAS,KAAK,YAAY,8DAAoG;IAEzG,KAAK,SAAc;IAC5B,SAAS,0BAAgC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAA;IAEjD,SAAS,CAAC,mBAAmB;IAM7B,WAAoB,MAAM,kCAezB;IAED,UAAmB,sBAAsB,EAAE,YAAY,CAAe;IAEtE,cACuB,WAAW,WAEjC;IAED,SAAS,KAAK,gBAAgB,0CAQ7B;IAED,cAAuB,sBAAsB,0CAK5C;IAED,SAAS,KAAK,sBAAsB,0CAInC;IAED,OAAO,KAAK,sBAAsB,GASjC;IAEQ,wBAAwB,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,sBAAsB;IAiBnF,SAAS,CAAC,iBAAiB,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS;cAIzC,iBAAiB,CAAC,KAAK,EAAE,MAAM;CAGlD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,0BAA0B,EAAE,kBAAkB,CAAA;KAC9C;CACD"}
+{"version":3,"file":"FieldDateTimeRange.d.ts","sourceRoot":"","sources":["../FieldDateTimeRange.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AAG7C,OAAO,EAAE,iBAAiB,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC/E,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AASzE,aAAK,uBAAuB;IAC3B,KAAK,UAAU;IACf,GAAG,QAAQ;CACX;AAED;;;;;;;;;GASG;AACH,qBACa,kBAAmB,SAAQ,iBAAiB,CAAC,aAAa,GAAG,SAAS,CAAC;IACnF,SAAS,KAAK,YAAY,8DAAoG;IAEzG,KAAK,SAAc;IAC5B,SAAS,0BAAgC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAA;IAEjD,SAAS,CAAC,mBAAmB;IAM7B,WAAoB,MAAM,kCAezB;IAED,UAAmB,sBAAsB,EAAE,YAAY,CAAe;IAEtE,cACuB,WAAW,WAEjC;IAED,SAAS,KAAK,aAAa,wEAE1B;IAED,cAAuB,sBAAsB,0CAK5C;IAED,SAAS,KAAK,sBAAsB,0CAInC;IAED,OAAO,KAAK,sBAAsB,GASjC;IAEQ,wBAAwB,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,sBAAsB;IAiBnF,SAAS,CAAC,iBAAiB,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS;cAIzC,iBAAiB,CAAC,KAAK,EAAE,MAAM;CAGlD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,0BAA0B,EAAE,kBAAkB,CAAA;KAC9C;CACD"}

package/dist/FieldDateTimeRange.js

@@ -32,10 +32,10 @@ let FieldDateTimeRange = class FieldDateTimeRange extends FieldDateTimeBase {
         this.calendarIconButtonIcon = 'date_range';
     }
     get selectedDate() { return this.selection === FieldDateRangeSelection.Start ? this.value?.start : this.value?.end; }
-    resetNavigatingDate() {
-        this.navigatingDate = this.selection === FieldDateRangeSelection.Start
-            ? this.value?.start ?? this.navigatingDate
-            : this.value?.end ?? this.navigatingDate;
+    resetNavigationDate() {
+        this.navigationDate = this.selection === FieldDateRangeSelection.Start
+            ? this.value?.start ?? this.navigationDate
+            : this.value?.end ?? this.navigationDate;
     }
     static get styles() {
         return css `
@@ -56,14 +56,8 @@ let FieldDateTimeRange = class FieldDateTimeRange extends FieldDateTimeBase {
     get placeholder() {
         return new DateTimeRange(new DateTime().subtract({ years: 1 }), new DateTime()).format(this.formatOptions);
     }
-    get calendarTemplate() {
-        return html `
-			<mo-calendar
-				precision=${this.precision.key}
-				.value=${this.value}
-				@dateClick=${(e) => this.handleSelectedDateChange(e.detail, this.precision)}
-			></mo-calendar>
-		`;
+    get calendarValue() {
+        return this.value;
     }
     get popoverContentTemplate() {
         return html `
@@ -79,7 +73,7 @@ let FieldDateTimeRange = class FieldDateTimeRange extends FieldDateTimeBase {
     get startEndTabBarTemplate() {
         return html `
 			<mo-flex>
-				<mo-tab-bar ${bind(this, 'selection', { sourceUpdated: () => this.resetNavigatingDate() })}>
+				<mo-tab-bar ${bind(this, 'selection', { sourceUpdated: () => this.resetNavigationDate() })}>
 					<mo-tab value=${FieldDateRangeSelection.Start}>${t('Start')}</mo-tab>
 					<mo-tab value=${FieldDateRangeSelection.End}>${t('End')}</mo-tab>
 				</mo-tab-bar>
@@ -87,7 +81,7 @@ let FieldDateTimeRange = class FieldDateTimeRange extends FieldDateTimeBase {
 		`;
     }
     handleSelectedDateChange(date, precision) {
-        const { hour, minute, second } = this.navigatingDate;
+        const { hour, minute, second } = this.navigationDate;
         date = date.with({ hour, minute, second });
         const { start, end } = this.precision.getRange(date);
         this.value = this.selection === FieldDateRangeSelection.Start

package/dist/custom-elements.json

@@ -73,7 +73,7 @@
 			],
 			"properties": [
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime",
 					"default": "\"new DateTime()\""
 				},
@@ -298,7 +298,7 @@
 					"default": "\"start\""
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime",
 					"default": "\"new DateTime()\""
 				},
@@ -523,7 +523,7 @@
 					"default": "\"start\""
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime",
 					"default": "\"new DateTime()\""
 				},
@@ -735,7 +735,7 @@
 			],
 			"properties": [
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime",
 					"default": "\"new DateTime()\""
 				},
@@ -960,7 +960,7 @@
 					"default": "\"start\""
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime",
 					"default": "\"new DateTime()\""
 				},
@@ -1185,7 +1185,7 @@
 					"default": "\"start\""
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime",
 					"default": "\"new DateTime()\""
 				},
@@ -1609,7 +1609,7 @@
 					"default": "\"start\""
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime",
 					"default": "\"new DateTime()\""
 				},
@@ -1817,7 +1817,7 @@
 			],
 			"properties": [
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -2031,7 +2031,7 @@
 					"type": "FieldDateRangeSelection"
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -2245,7 +2245,7 @@
 					"type": "FieldDateRangeSelection"
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -2448,7 +2448,7 @@
 			],
 			"properties": [
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -2662,7 +2662,7 @@
 					"type": "FieldDateRangeSelection"
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -2876,7 +2876,7 @@
 					"type": "FieldDateRangeSelection"
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3289,7 +3289,7 @@
 					"type": "FieldDateRangeSelection"
 				},
 				{
-					"name": "navigatingDate",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3438,7 +3438,7 @@
 				},
 				{
 					"name": "precision",
-					"type": "DatePrecision"
+					"type": "FieldDateTimePrecision"
 				},
 				{
 					"name": "includeWeek",
@@ -3446,7 +3446,7 @@
 				},
 				{
 					"name": "view",
-					"type": "DatePrecision"
+					"type": "FieldDateTimePrecision"
 				},
 				{
 					"name": "navigationDate",
@@ -3474,7 +3474,7 @@
 					"type": "EventDispatcher<DateTime>"
 				},
 				{
-					"name": "navigatingValue",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3504,7 +3504,7 @@
 					"type": "EventDispatcher<DateTime>"
 				},
 				{
-					"name": "navigatingValue",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3534,7 +3534,7 @@
 					"type": "EventDispatcher<DateTime>"
 				},
 				{
-					"name": "navigatingValue",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3561,7 +3561,7 @@
 				},
 				{
 					"name": "precision",
-					"type": "DatePrecision"
+					"type": "FieldDateTimePrecision"
 				},
 				{
 					"name": "includeWeek",
@@ -3582,7 +3582,7 @@
 				{
 					"name": "precision",
 					"attribute": "precision",
-					"type": "DatePrecision"
+					"type": "FieldDateTimePrecision"
 				},
 				{
 					"name": "includeWeek",
@@ -3592,8 +3592,8 @@
 				},
 				{
 					"name": "view",
-					"type": "DatePrecision",
-					"default": "\"day\""
+					"type": "FieldDateTimePrecision",
+					"default": "\"Day\""
 				},
 				{
 					"name": "navigationDate",
@@ -3613,7 +3613,7 @@
 			"path": ".\\packages\\DateTimeFields\\selection\\HourList.ts",
 			"attributes": [
 				{
-					"name": "navigatingValue",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3631,8 +3631,8 @@
 					"type": "EventDispatcher<DateTime>"
 				},
 				{
-					"name": "navigatingValue",
-					"attribute": "navigatingValue",
+					"name": "navigationDate",
+					"attribute": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3661,7 +3661,7 @@
 			"path": ".\\packages\\DateTimeFields\\selection\\MinuteList.ts",
 			"attributes": [
 				{
-					"name": "navigatingValue",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3679,8 +3679,8 @@
 					"type": "EventDispatcher<DateTime>"
 				},
 				{
-					"name": "navigatingValue",
-					"attribute": "navigatingValue",
+					"name": "navigationDate",
+					"attribute": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3709,7 +3709,7 @@
 			"path": ".\\packages\\DateTimeFields\\selection\\SecondList.ts",
 			"attributes": [
 				{
-					"name": "navigatingValue",
+					"name": "navigationDate",
 					"type": "DateTime"
 				},
 				{
@@ -3727,8 +3727,8 @@
 					"type": "EventDispatcher<DateTime>"
 				},
 				{
-					"name": "navigatingValue",
-					"attribute": "navigatingValue",
+					"name": "navigationDate",
+					"attribute": "navigationDate",
 					"type": "DateTime"
 				},
 				{

package/dist/selection/Calendar.d.ts

@@ -1,20 +1,18 @@
 import { Component } from '@a11d/lit';
-import type { FieldDateTimePrecisionKey } from '../FieldDateTimePrecision.js';
-export type DatePrecision = Exclude<FieldDateTimePrecisionKey, 'hour' | 'minute' | 'second'>;
+import { FieldDateTimePrecision } from '../FieldDateTimePrecision.js';
 /**
  * @fires dateClick - Dispatched when a date is clicked, with the clicked date as detail.
  */
 export declare class Calendar extends Component {
     readonly dateClick: EventDispatcher<DateTime>;
     value?: DateTimeRange;
-    precision: DatePrecision;
+    precision: FieldDateTimePrecision;
     includeWeek: boolean;
-    view: DatePrecision;
+    view: FieldDateTimePrecision;
     private readonly datesController;
     get navigationDate(): import("@3mo/date-time/DateTime.js").DateTime;
     setNavigatingValue(date: DateTime, behavior?: 'instant' | 'smooth'): Promise<void>;
-    scrollToNavigatingItem(behavior?: 'instant' | 'smooth'): void;
-    setView(view: DatePrecision, navigatingDate?: import("@3mo/date-time/DateTime.js").DateTime): void;
+    setView(view: FieldDateTimePrecision, navigationDate?: import("@3mo/date-time/DateTime.js").DateTime): void;
     static get styles(): import("@a11d/lit").CSSResult;
     private get columns();
     private getColumnName;

package/dist/selection/Calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../selection/Calendar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAwD,MAAM,WAAW,CAAA;AAE3F,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,8BAA8B,CAAA;AAE7E,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC,yBAAyB,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC,CAAA;AAE5F;;GAEG;AACH,qBACa,QAAS,SAAQ,SAAS;IAC7B,QAAQ,CAAC,SAAS,EAAG,eAAe,CAAC,QAAQ,CAAC,CAAA;IAE3B,KAAK,CAAC,EAAE,aAAa,CAAA;IACuB,SAAS,EAAG,aAAa,CAAA;IACrD,WAAW,UAAQ;IAEtD,IAAI,EAAE,aAAa,CAAQ;IAEpC,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAoC;IAEpE,IAAI,cAAc,kDAAiD;IAE7D,kBAAkB,CAAC,IAAI,EAAE,QAAQ,EAAE,QAAQ,GAAE,SAAS,GAAG,QAAoB;IAMnF,sBAAsB,CAAC,QAAQ,GAAE,SAAS,GAAG,QAAoB;IAMjE,OAAO,CAAC,IAAI,EAAE,aAAa,EAAE,cAAc,gDAAsC;IAKjF,WAAoB,MAAM,kCAyJzB;IAED,OAAO,KAAK,OAAO,GAKlB;IAED,OAAO,CAAC,aAAa;IAIrB,cAAuB,QAAQ,0CAS9B;IAED,OAAO,CAAC,eAAe;IAiBvB,OAAO,CAAC,MAAM,KAAK,gBAAgB,GAiBlC;IAED,OAAO,CAAC,gBAAgB;IAuBxB,OAAO,CAAC,cAAc;IAmBtB,OAAO,CAAC,eAAe,CAgBtB;IAED,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,OAAO;IAMf,OAAO,CAAC,OAAO;IAMf,OAAO,CAAC,KAAK;IAIb,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,KAAK;IAIb,OAAO,CAAC,SAAS;CAKjB;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,aAAa,EAAE,QAAQ,CAAA;KACvB;CACD"}
+{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../selection/Calendar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAmE,MAAM,WAAW,CAAA;AAEtG,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAA;AAErE;;GAEG;AACH,qBACa,QAAS,SAAQ,SAAS;IAC7B,QAAQ,CAAC,SAAS,EAAG,eAAe,CAAC,QAAQ,CAAC,CAAA;IAE3B,KAAK,CAAC,EAAE,aAAa,CAAA;IACqC,SAAS,EAAG,sBAAsB,CAAA;IAC5E,WAAW,UAAQ;IAEtD,IAAI,yBAA6B;IAE1C,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAoC;IAEpE,IAAI,cAAc,kDAAiD;IAC7D,kBAAkB,CAAC,IAAI,EAAE,QAAQ,EAAE,QAAQ,GAAE,SAAS,GAAG,QAAoB;IAWnF,OAAO,CAAC,IAAI,EAAE,sBAAsB,EAAE,cAAc,gDAAsC;IAK1F,WAAoB,MAAM,kCA2JzB;IAED,OAAO,KAAK,OAAO,GAKlB;IAED,OAAO,CAAC,aAAa;IAIrB,cAAuB,QAAQ,0CAS9B;IAED,OAAO,CAAC,eAAe;IAiBvB,OAAO,CAAC,MAAM,KAAK,gBAAgB,GAiBlC;IAED,OAAO,CAAC,gBAAgB;IAuBxB,OAAO,CAAC,cAAc;IAmBtB,OAAO,CAAC,eAAe,CAgBtB;IAED,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,OAAO;IAMf,OAAO,CAAC,OAAO;IAMf,OAAO,CAAC,KAAK;IAIb,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,KAAK;IAIb,OAAO,CAAC,SAAS;CAKjB;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,aAAa,EAAE,QAAQ,CAAA;KACvB;CACD"}