@3mo/date-time-fields 0.14.0 → 0.14.2

package/dist/FieldDate.d.ts

@@ -2,12 +2,9 @@ import { FieldDateTime } from './FieldDateTime.js';
 import { FieldDateTimePrecision } from './FieldDateTimePrecision.js';
 /**
  * @element mo-field-date
- *
- * @i18n "Date"
  */
 export declare class FieldDate extends FieldDateTime {
     precision: FieldDateTimePrecision;
-    label: string;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/FieldDate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldDate.d.ts","sourceRoot":"","sources":["../FieldDate.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAClD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAMpE;;;;GAIG;AACH,qBACa,SAAU,SAAQ,aAAa;IAClC,SAAS,yBAA6B;IACtC,KAAK,SAAY;CAC1B;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,aAAa,CAAA;KAC9B;CACD"}
+{"version":3,"file":"FieldDate.d.ts","sourceRoot":"","sources":["../FieldDate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAClD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAEpE;;GAEG;AACH,qBACa,SAAU,SAAQ,aAAa;IAClC,SAAS,yBAA6B;CAC/C;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,aAAa,CAAA;KAC9B;CACD"}

package/dist/FieldDate.js

@@ -1,21 +1,14 @@
 import { __decorate } from "tslib";
 import { component } from '@a11d/lit';
-import { Localizer } from '@3mo/localization';
 import { FieldDateTime } from './FieldDateTime.js';
 import { FieldDateTimePrecision } from './FieldDateTimePrecision.js';
-Localizer.dictionaries.add('de', {
-    'Date': 'Datum',
-});
 /**
  * @element mo-field-date
- *
- * @i18n "Date"
  */
 let FieldDate = class FieldDate extends FieldDateTime {
     constructor() {
         super(...arguments);
         this.precision = FieldDateTimePrecision.Day;
-        this.label = t('Date');
     }
 };
 FieldDate = __decorate([

package/dist/FieldDateTime.d.ts

@@ -5,6 +5,10 @@ import { FieldDateTimePrecision } from './FieldDateTimePrecision.js';
  * @element mo-field-date-time
  *
  * @i18n "Date & Time"
+ * @i18n "Date"
+ * @i18n "Year"
+ * @i18n "Month"
+ * @i18n "Week"
  * @i18n "Today"
  * @i18n "Yesterday"
  * @i18n "Tomorrow"
@@ -17,7 +21,8 @@ import { FieldDateTimePrecision } from './FieldDateTimePrecision.js';
  */
 export declare class FieldDateTime extends FieldDateTimeBase<Date | undefined> {
     protected get selectedDate(): import("@3mo/date-time/DateTime.js").DateTime | undefined;
-    label: string;
+    protected get _label(): string;
+    private get defaultLabel();
     value?: Date;
     protected get placeholder(): string;
     protected resetNavigationDate(): void;

package/dist/FieldDateTime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldDateTime.d.ts","sourceRoot":"","sources":["../FieldDateTime.ts"],"names":[],"mappings":"AACA,OAAO,EAAmC,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAA;AAEpF,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAgBpE;;;;;;;;;;;;;GAaG;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;IAED,cAAuB,eAAe,IAcoB,kBAAkB,CAC3E;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":"AACA,OAAO,EAAmC,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAA;AAEpF,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAmBpE;;;;;;;;;;;;;;;;;GAiBG;AACH,qBACa,aAAc,SAAQ,iBAAiB,CAAC,IAAI,GAAG,SAAS,CAAC;IACrE,SAAS,KAAK,YAAY,8DAQzB;IAED,cAAuB,MAAM,WAE5B;IAED,OAAO,KAAK,YAAY,GAQvB;IAE2B,KAAK,CAAC,EAAE,IAAI,CAAA;IAExC,cACuB,WAAW,WAEjC;IAED,SAAS,CAAC,mBAAmB;IAI7B,SAAS,KAAK,aAAa,4DAE1B;IAED,cAAuB,eAAe,IAcoB,kBAAkB,CAC3E;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

@@ -6,6 +6,9 @@ import { FieldDateTimePrecision } from './FieldDateTimePrecision.js';
 import { Memoize as memoize } from 'typescript-memoize';
 Localizer.dictionaries.add('de', {
     'Date & Time': 'Datum & Uhrzeit',
+    'Date': 'Datum',
+    'Year': 'Jahr',
+    'Month': 'Monat',
     'Today': 'Heute',
     'Yesterday': 'Gestern',
     'Tomorrow': 'Morgen',
@@ -20,6 +23,10 @@ Localizer.dictionaries.add('de', {
  * @element mo-field-date-time
  *
  * @i18n "Date & Time"
+ * @i18n "Date"
+ * @i18n "Year"
+ * @i18n "Month"
+ * @i18n "Week"
  * @i18n "Today"
  * @i18n "Yesterday"
  * @i18n "Tomorrow"
@@ -31,10 +38,6 @@ Localizer.dictionaries.add('de', {
  * @i18n "Year end"
  */
 let FieldDateTime = class FieldDateTime extends FieldDateTimeBase {
-    constructor() {
-        super(...arguments);
-        this.label = t('Date & Time');
-    }
     get selectedDate() {
         if (!this.value) {
             return undefined;
@@ -44,6 +47,18 @@ let FieldDateTime = class FieldDateTime extends FieldDateTimeBase {
         }
         return this.value;
     }
+    get _label() {
+        return super._label || this.defaultLabel;
+    }
+    get defaultLabel() {
+        switch (this.precision) {
+            case FieldDateTimePrecision.Year: return t('Year');
+            case FieldDateTimePrecision.Month: return t('Month');
+            case FieldDateTimePrecision.Week: return t('Week');
+            case FieldDateTimePrecision.Day: return t('Date');
+            default: return t('Date & Time');
+        }
+    }
     get placeholder() {
         return new DateTime().format(this.formatOptions);
     }
@@ -82,9 +97,6 @@ let FieldDateTime = class FieldDateTime extends FieldDateTimeBase {
         return value ? DateTime.parseAsDateTime(value, this.shortcutReferenceDate) : undefined;
     }
 };
-__decorate([
-    property()
-], FieldDateTime.prototype, "label", void 0);
 __decorate([
     property({ type: Object })
 ], FieldDateTime.prototype, "value", void 0);

package/dist/FieldDateTimeBase.js

@@ -63,86 +63,86 @@ export class FieldDateTimeBase extends InputFieldComponent {
         return '';
     }
     static get styles() {
-        return css `
-			${super.styles}
-
-			:host {
-				position: relative;
-			}
-
-			:host([disabled]) {
-				pointer-events: none;
-			}
-
-			mo-field {
-				anchor-name: --mo-field-date-time;
-			}
-
-			mo-popover {
-				position-anchor: --mo-field-date-time;
-				position-visibility: anchors-visible;
-				background: var(--mo-color-background);
-				box-shadow: var(--mo-shadow);
-				border-radius: var(--mo-border-radius);
-				color: var(--mo-color-foreground);
-				font-size: 0.875em;
-			}
-
-			#selector {
-				min-height: 175px;
-			}
-
-			.timezone {
-				padding: 0.4rem;
-				font-size: small;
-				text-align: center;
-				font-weight: 500;
-				color: var(--mo-color-gray);
-			}
-
-			input::placeholder {
-				color: transparent;
-			}
-
-			mo-field[active]:not([dense]) input::placeholder {
-				color: var(--mo-color-gray);
-			}
-
-			#presets {
-				background-color: var(--mo-color-transparent-gray-1);
-				mo-list-item {
-					padding-block: 0.5rem;
-					min-height: auto;
-					opacity: 0.9;
-				}
-			}
+        return css `
+			${super.styles}
+
+			:host {
+				position: relative;
+			}
+
+			:host([disabled]) {
+				pointer-events: none;
+			}
+
+			mo-field {
+				anchor-name: --mo-field-date-time;
+			}
+
+			mo-popover {
+				position-anchor: --mo-field-date-time;
+				position-visibility: anchors-visible;
+				background: var(--mo-color-background);
+				box-shadow: var(--mo-shadow);
+				border-radius: var(--mo-border-radius);
+				color: var(--mo-color-foreground);
+				font-size: 0.875em;
+			}
+
+			#selector {
+				min-height: 175px;
+			}
+
+			.timezone {
+				padding: 0.4rem;
+				font-size: small;
+				text-align: center;
+				font-weight: 500;
+				color: var(--mo-color-gray);
+			}
+
+			input::placeholder {
+				color: transparent;
+			}
+
+			mo-field[active]:not([dense]) input::placeholder {
+				color: var(--mo-color-gray);
+			}
+
+			#presets {
+				background-color: var(--mo-color-transparent-gray-1);
+				mo-list-item {
+					padding-block: 0.5rem;
+					min-height: auto;
+					opacity: 0.9;
+				}
+			}
 		`;
     }
     get template() {
-        return html `
-			${super.template}
-			${this.popoverTemplate}
+        return html `
+			${super.template}
+			${this.popoverTemplate}
 		`;
     }
     get endSlotTemplate() {
-        return html `
-			${super.endSlotTemplate}
-			${this.clearIconButtonTemplate}
-			${this.calendarIconButtonTemplate}
+        return html `
+			${super.endSlotTemplate}
+			${this.clearIconButtonTemplate}
+			${this.calendarIconButtonTemplate}
 		`;
     }
     get inputTemplate() {
-        return html `
-			<input
-				part='input'
-				?readonly=${this.readonly}
-				?required=${this.required}
-				?disabled=${this.disabled}
-				placeholder=${this.placeholder}
-				.value=${live(this.inputStringValue || '')}
-				@input=${(e) => this.handleInput(this.inputValueToValue(this.inputElement.value || ''), e)}
-				@change=${(e) => this.handleChange(this.inputValueToValue(this.inputElement.value || ''), e)}
-			>
+        return html `
+			<input
+				part='input'
+				?readonly=${this.readonly}
+				?required=${this.required}
+				?disabled=${this.disabled}
+				placeholder=${this.placeholder}
+				.value=${live(this.inputStringValue || '')}
+				@input=${(e) => this.handleInput(this.inputValueToValue(this.inputElement.value || ''), e)}
+				@change=${(e) => this.handleChange(this.inputValueToValue(this.inputElement.value || ''), e)}
+			>
 		`;
     }
     get clearIconButtonTemplate() {
@@ -151,46 +151,46 @@ export class FieldDateTimeBase extends InputFieldComponent {
             this.handleInput(undefined);
             this.handleChange(undefined);
         };
-        return !this.value || !this.focusController.focused ? html.nothing : html `
-			<mo-icon-button tabindex='-1' dense slot='end' icon='cancel'
-				@click=${clear}
-				${style({ color: 'var(--mo-color-gray)', fontSize: '20px', cursor: 'pointer', userSelect: 'none', marginBlockStart: '2.75px', marginInlineEnd: '5px' })}
-			></mo-icon-button>
+        return !this.value || !this.focusController.focused ? html.nothing : html `
+			<mo-icon-button tabindex='-1' dense slot='end' icon='cancel'
+				@click=${clear}
+				${style({ color: 'var(--mo-color-gray)', fontSize: '20px', cursor: 'pointer', userSelect: 'none', marginBlockStart: '2.75px', marginInlineEnd: '5px' })}
+			></mo-icon-button>
 		`;
     }
     get calendarIconButtonTemplate() {
-        return this.pickerHidden ? html.nothing : html `
-			<mo-icon tabindex='-1' slot='end'
-				icon=${this.calendarIconButtonIcon}
-				${style({ color: this.isActive ? 'var(--mo-color-accent)' : 'var(--mo-color-gray)', fontSize: '22px', marginBlockStart: '2px', cursor: 'pointer', userSelect: 'none' })}
-			></mo-icon>
+        return this.pickerHidden ? html.nothing : html `
+			<mo-icon tabindex='-1' slot='end'
+				icon=${this.calendarIconButtonIcon}
+				${style({ color: this.isActive ? 'var(--mo-color-accent)' : 'var(--mo-color-gray)', fontSize: '22px', marginBlockStart: '2px', cursor: 'pointer', userSelect: 'none' })}
+			></mo-icon>
 		`;
     }
     get popoverTemplate() {
-        return this.pickerHidden ? html.nothing : html `
-			<mo-popover tabindex='-1'
-				.anchor=${this} target='field'
-				?open=${bind(this, 'open', { sourceUpdated: () => setTimeout(() => this.calendar?.setNavigatingValue(this.navigationDate)) })}
-			>
-				${cache(!this.open ? html.nothing : html `
-					<mo-flex direction='horizontal'>
-						${this.presetsTemplate === html.nothing ? html.nothing : html `
-							<mo-flex id='presets'>
-								${this.presetsTemplate}
-							</mo-flex>
-						`}
-						${this.popoverSelectionTemplate}
-					</mo-flex>
-				`)}
-			</mo-popover>
+        return this.pickerHidden ? html.nothing : html `
+			<mo-popover tabindex='-1'
+				.anchor=${this} target='field'
+				?open=${bind(this, 'open', { sourceUpdated: () => setTimeout(() => this.calendar?.setNavigatingValue(this.navigationDate)) })}
+			>
+				${cache(!this.open ? html.nothing : html `
+					<mo-flex direction='horizontal'>
+						${this.presetsTemplate === html.nothing ? html.nothing : html `
+							<mo-flex id='presets'>
+								${this.presetsTemplate}
+							</mo-flex>
+						`}
+						${this.popoverSelectionTemplate}
+					</mo-flex>
+				`)}
+			</mo-popover>
 		`;
     }
     get popoverSelectionTemplate() {
-        return html `
-			<mo-flex id='selector' direction='horizontal' style='height: 100%; flex: 1'>
-				${this.dateTemplate}
-				${this.timeTemplate}
-			</mo-flex>
+        return html `
+			<mo-flex id='selector' direction='horizontal' style='height: 100%; flex: 1'>
+				${this.dateTemplate}
+				${this.timeTemplate}
+			</mo-flex>
 		`;
     }
     getPresetTemplate(label, value) {
@@ -217,56 +217,56 @@ export class FieldDateTimeBase extends InputFieldComponent {
         return this.calendarTemplate;
     }
     get calendarTemplate() {
-        return html `
-			<mo-calendar
-				.precision=${this.precision > FieldDateTimePrecision.Day ? FieldDateTimePrecision.Day : this.precision}
-				.value=${this.calendarValue}
-				.min=${this.min}
-				.max=${this.max}
-				.dateDisabled=${this.dateDisabled}
-				@dateClick=${(e) => this.handleSelectedDateChange(e.detail, this.precision)}
-			></mo-calendar>
+        return html `
+			<mo-calendar
+				.precision=${this.precision > FieldDateTimePrecision.Day ? FieldDateTimePrecision.Day : this.precision}
+				.value=${this.calendarValue}
+				.min=${this.min}
+				.max=${this.max}
+				.dateDisabled=${this.dateDisabled}
+				@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' style='border-inline-start: 1px solid var(--mo-color-transparent-gray-3)'>
-				<mo-flex direction='horizontal' style='flex: 1'>
-					${this.hourListTemplate}
-					${this.minuteListTemplate}
-					${this.secondListTemplate}
-				</mo-flex>
-				<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>
+        return this.precision <= FieldDateTimePrecision.Day ? html.nothing : html `
+			<mo-flex gap='0.5rem' style='border-inline-start: 1px solid var(--mo-color-transparent-gray-3)'>
+				<mo-flex direction='horizontal' style='flex: 1'>
+					${this.hourListTemplate}
+					${this.minuteListTemplate}
+					${this.secondListTemplate}
+				</mo-flex>
+				<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>
 		`;
     }
     get hourListTemplate() {
-        return this.precision < FieldDateTimePrecision.Hour ? html.nothing : html `
-			<mo-hour-list style='flex: 1'
-				.navigationDate=${bind(this, 'navigationDate')}
-				.value=${this.selectedDate}
-				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Hour)}
-			></mo-hour-list>
+        return this.precision < FieldDateTimePrecision.Hour ? html.nothing : html `
+			<mo-hour-list style='flex: 1'
+				.navigationDate=${bind(this, 'navigationDate')}
+				.value=${this.selectedDate}
+				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Hour)}
+			></mo-hour-list>
 		`;
     }
     get minuteListTemplate() {
-        return this.precision < FieldDateTimePrecision.Minute ? html.nothing : html `
-			<mo-minute-list style='flex: 1'
-				.navigationDate=${bind(this, 'navigationDate')}
-				.value=${this.selectedDate}
-				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Minute)}
-			></mo-minute-list>
+        return this.precision < FieldDateTimePrecision.Minute ? html.nothing : html `
+			<mo-minute-list style='flex: 1'
+				.navigationDate=${bind(this, 'navigationDate')}
+				.value=${this.selectedDate}
+				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Minute)}
+			></mo-minute-list>
 		`;
     }
     get secondListTemplate() {
-        return this.precision < FieldDateTimePrecision.Second ? html.nothing : html `
-			<mo-second-list style='flex: 1'
-				.navigationDate=${bind(this, 'navigationDate')}
-				.value=${this.selectedDate}
-				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Second)}
-			></mo-second-list>
+        return this.precision < FieldDateTimePrecision.Second ? html.nothing : html `
+			<mo-second-list style='flex: 1'
+				.navigationDate=${bind(this, 'navigationDate')}
+				.value=${this.selectedDate}
+				@change=${(e) => this.handleSelectedDateChange(e.detail, FieldDateTimePrecision.Second)}
+			></mo-second-list>
 		`;
     }
     handleSelectedDateChange(date, precision) {

package/dist/FieldDateTimeRange.d.ts

@@ -28,10 +28,10 @@ declare enum FieldDateRangeSelection {
  */
 export declare class FieldDateTimeRange extends FieldDateTimeBase<DateTimeRange | undefined> {
     protected get selectedDate(): import("@3mo/date-time/DateTime.js").DateTime | undefined;
-    label: string;
     selection: FieldDateRangeSelection;
     value?: DateTimeRange;
     protected resetNavigationDate(): void;
+    protected get _label(): string;
     protected get presetsTemplate(): HTMLTemplateResult;
     static get styles(): import("@a11d/lit").CSSResult;
     protected calendarIconButtonIcon: MaterialIcon;

package/dist/FieldDateTimeRange.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldDateTimeRange.d.ts","sourceRoot":"","sources":["../FieldDateTimeRange.ts"],"names":[],"mappings":"AACA,OAAO,EAA8C,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAA;AAC/F,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AAG7C,OAAO,EAAE,iBAAiB,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC/E,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAmBpE,aAAK,uBAAuB;IAC3B,KAAK,UAAU;IACf,GAAG,QAAQ;CACX;AAED;;;;;;;;;;;;;;;;;;;GAmBG;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,cAAuB,eAAe,IAoBuB,kBAAkB,CAC9E;IAED,WAAoB,MAAM,kCAezB;IAED,UAAmB,sBAAsB,EAAE,YAAY,CAAe;IAEtE,cACuB,WAAW,WAEjC;IAED,SAAS,KAAK,aAAa,wEAE1B;IAED,cAAuB,wBAAwB,uBAO9C;IAED,SAAS,KAAK,sBAAsB,uBAInC;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":"AACA,OAAO,EAA8C,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAA;AAC/F,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AAG7C,OAAO,EAAE,iBAAiB,IAAI,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC/E,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAmBpE,aAAK,uBAAuB;IAC3B,KAAK,UAAU;IACf,GAAG,QAAQ;CACX;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBACa,kBAAmB,SAAQ,iBAAiB,CAAC,aAAa,GAAG,SAAS,CAAC;IACnF,SAAS,KAAK,YAAY,8DAAoG;IAElH,SAAS,0BAAgC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAA;IAEjD,SAAS,CAAC,mBAAmB;IAM7B,cAAuB,MAAM,WAE5B;IAED,cAAuB,eAAe,IAoBuB,kBAAkB,CAC9E;IAED,WAAoB,MAAM,kCAezB;IAED,UAAmB,sBAAsB,EAAE,YAAY,CAAe;IAEtE,cACuB,WAAW,WAEjC;IAED,SAAS,KAAK,aAAa,wEAE1B;IAED,cAAuB,wBAAwB,uBAO9C;IAED,SAAS,KAAK,sBAAsB,uBAInC;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

@@ -48,7 +48,6 @@ var FieldDateRangeSelection;
 let FieldDateTimeRange = class FieldDateTimeRange extends FieldDateTimeBase {
     constructor() {
         super(...arguments);
-        this.label = t('Period');
         this.selection = FieldDateRangeSelection.Start;
         this.calendarIconButtonIcon = 'date_range';
     }
@@ -58,6 +57,9 @@ let FieldDateTimeRange = class FieldDateTimeRange extends FieldDateTimeBase {
             ? this.value?.start ?? this.navigationDate
             : this.value?.end ?? this.navigationDate;
     }
+    get _label() {
+        return super._label || t('Period');
+    }
     get presetsTemplate() {
         return join([
             this.precision < FieldDateTimePrecision.Day ? undefined : html `
@@ -146,9 +148,6 @@ let FieldDateTimeRange = class FieldDateTimeRange extends FieldDateTimeBase {
         return value ? DateRangeParser.parse(value, this.shortcutReferenceDate) : undefined;
     }
 };
-__decorate([
-    property()
-], FieldDateTimeRange.prototype, "label", void 0);
 __decorate([
     property()
 ], FieldDateTimeRange.prototype, "selection", void 0);

package/dist/custom-elements.json

@@ -65,7 +65,7 @@
 					"name": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Date')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -183,7 +183,7 @@
 					"attribute": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Date')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -316,7 +316,7 @@
 					"name": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -441,7 +441,7 @@
 					"attribute": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -574,7 +574,7 @@
 					"name": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -699,7 +699,7 @@
 					"attribute": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -826,7 +826,7 @@
 					"name": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Date & Time')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -944,7 +944,7 @@
 					"attribute": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Date & Time')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -1077,7 +1077,7 @@
 					"name": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -1202,7 +1202,7 @@
 					"attribute": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -1335,7 +1335,7 @@
 					"name": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -1460,7 +1460,7 @@
 					"attribute": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -1788,7 +1788,7 @@
 					"name": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",
@@ -1917,7 +1917,7 @@
 					"attribute": "label",
 					"description": "The field's label",
 					"type": "string",
-					"default": "\"t('Period')\""
+					"default": "\"\""
 				},
 				{
 					"name": "readonly",