@vonage/vivid 5.15.1 → 5.17.0

package/date-time-picker/definition.cjs

@@ -1,285 +1,6 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const popup_definition = require('../unbundled/definition5.cjs');
-const button_definition = require('../unbundled/definition2.cjs');
-const textField_definition = require('../text-field/definition.cjs');
-const divider_definition = require('../divider/definition.cjs');
-const pickerField_template = require('../unbundled/picker-field.template.cjs');
-const calendarPicker_template = require('../unbundled/calendar-picker.template.cjs');
-const vividElement = require('../unbundled/vivid-element.cjs');
-const timeSelectionPicker_template = require('../unbundled/time-selection-picker.template.cjs');
-const visuallyHidden_definition = require('../visually-hidden/definition.cjs');
-const fastElement = require('@microsoft/fast-element');
-const singleValuePicker = require('../unbundled/single-value-picker.cjs');
-const singleDatePicker = require('../unbundled/single-date-picker.cjs');
-
-const styles = ".date-time-picker{display:flex;gap:28px;padding-inline-start:12px}.time-picker{padding-block:4px 12px}";
-
-const extractDatePart = (dateTimeStr) => dateTimeStr.split("T")[0] || "";
-const extractTimePart = (dateTimeStr) => dateTimeStr.split("T")[1] || "";
-const isValidDateTimeStr = (string) => {
-  const [dateStr = "", timeStr = ""] = string.split("T");
-  return calendarPicker_template.isValidDateStr(dateStr) && timeSelectionPicker_template.isValidTimeStr(timeStr);
-};
-
-const formatPresentationDateTime = (dateTimeStr, locale, includeSeconds, use12HourClock) => {
-  const [dateStr, timeStr] = dateTimeStr.split("T");
-  return `${calendarPicker_template.formatPresentationDate(dateStr, locale)} ${timeSelectionPicker_template.formatPresentationTime(
-    timeStr,
-    includeSeconds,
-    use12HourClock
-  )}`;
-};
-const parsePresentationDateTime = (presentationDateTime, locale, use12HourClock) => {
-  const [datePart, ...timeParts] = presentationDateTime.split(" ");
-  const dateStr = calendarPicker_template.parsePresentationDate(datePart, locale);
-  const timeStr = timeSelectionPicker_template.parsePresentationTime(timeParts.join(" "), use12HourClock);
-  return `${dateStr}T${timeStr}`;
-};
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-const ValidDateTimeFilter = {
-  fromView: (value) => {
-    if (value && isValidDateTimeStr(value)) {
-      return value;
-    }
-    return "";
-  },
-  toView(value) {
-    return value;
-  }
-};
-class DateTimePicker extends timeSelectionPicker_template.TimeSelectionPicker(
-  singleDatePicker.SingleDatePickerMixin(singleValuePicker.SingleValuePicker(calendarPicker_template.CalendarPicker(pickerField_template.PickerField)))
-) {
-  constructor() {
-    super();
-    /**
-     * @internal
-     */
-    this._isValidValue = isValidDateTimeStr;
-    /**
-     * @internal
-     */
-    this._textFieldSize = "30";
-    this.proxy.type = "datetime-local";
-    this.proxy.step = "1";
-    this.min = "";
-    this.minDate = "";
-    this.minTime = "";
-    this.max = "";
-    this.maxDate = "";
-    this.maxTime = "";
-  }
-  get _resolvedMinDate() {
-    return this.minDate || extractDatePart(this.min);
-  }
-  get _resolvedMaxDate() {
-    return this.maxDate || extractDatePart(this.max);
-  }
-  get _resolvedMinTime() {
-    return this.minTime || this.min && extractDatePart(this.min) === this._dateValue() && extractTimePart(this.min) || "";
-  }
-  get _resolvedMaxTime() {
-    return this.maxTime || this.max && extractDatePart(this.max) === this._dateValue() && extractTimePart(this.max) || "";
-  }
-  /**
-   * @internal
-   */
-  _toPresentationValue(value) {
-    return formatPresentationDateTime(
-      value,
-      this.locale.calendarPicker,
-      this._displaySeconds,
-      this._use12hClock
-    );
-  }
-  /**
-   * @internal
-   */
-  _parsePresentationValue(presentationValue) {
-    return parsePresentationDateTime(
-      presentationValue,
-      this.locale.calendarPicker,
-      this._use12hClock
-    );
-  }
-  /**
-   * @internal
-   */
-  _dateValue() {
-    return extractDatePart(this.value);
-  }
-  /**
-   * @internal
-   */
-  _withUpdatedDate(dateStr) {
-    return `${dateStr}T${extractTimePart(this.value) || "00:00:00"}`;
-  }
-  /**
-   * @internal
-   */
-  get _timeValue() {
-    return extractTimePart(this.value);
-  }
-  /**
-   * @internal
-   */
-  _withUpdatedTime(timeStr) {
-    return `${extractDatePart(this.value) || calendarPicker_template.currentDateStr()}T${timeStr}`;
-  }
-  /**
-   * @internal
-   */
-  _getCustomValidationError() {
-    if (this._isPresentationValueInvalid()) {
-      return this.locale.dateTimePicker.invalidDateTimeError;
-    }
-    if (this._dateValue() && this._resolvedMinDate && calendarPicker_template.compareDateStr(this._dateValue(), this._resolvedMinDate) < 0) {
-      return this.locale.dateTimePicker.dateBeforeMinDateError(
-        calendarPicker_template.formatPresentationDate(
-          this._resolvedMinDate,
-          this.locale.calendarPicker
-        )
-      );
-    }
-    if (this._dateValue() && this._resolvedMaxDate && calendarPicker_template.compareDateStr(this._dateValue(), this._resolvedMaxDate) > 0) {
-      return this.locale.dateTimePicker.dateAfterMaxDateError(
-        calendarPicker_template.formatPresentationDate(
-          this._resolvedMaxDate,
-          this.locale.calendarPicker
-        )
-      );
-    }
-    if (this._timeValue && this._resolvedMinTime && timeSelectionPicker_template.compareTimeStr(this._timeValue, this._resolvedMinTime) < 0) {
-      return this.locale.dateTimePicker.timeBeforeMinTimeError(
-        timeSelectionPicker_template.formatPresentationTime(
-          this._resolvedMinTime,
-          this._displaySeconds,
-          this._use12hClock
-        )
-      );
-    }
-    if (this._timeValue && this._resolvedMaxTime && timeSelectionPicker_template.compareTimeStr(this._timeValue, this._resolvedMaxTime) > 0) {
-      return this.locale.dateTimePicker.timeAfterMaxTimeError(
-        timeSelectionPicker_template.formatPresentationTime(
-          this._resolvedMaxTime,
-          this._displaySeconds,
-          this._use12hClock
-        )
-      );
-    }
-    return null;
-  }
-  /**
-   * @internal
-   */
-  get _textFieldPlaceholder() {
-    return `${this.locale.calendarPicker.dateFormatPlaceholder} ${this._timePlaceholder}`;
-  }
-  /**
-   * @internal
-   */
-  get _pickerButtonLabel() {
-    if (this.value) {
-      return this.locale.dateTimePicker.changeDateTimeLabel(
-        this._toPresentationValue(this.value)
-      );
-    } else {
-      return this.locale.dateTimePicker.chooseDateTimeLabel;
-    }
-  }
-  /**
-   * @internal
-   */
-  _focusableElsWithinDialog() {
-    return this._dialogEl.querySelectorAll(
-      "#inline-time-picker, button, .vwc-button"
-    );
-  }
-  /**
-   * @internal
-   */
-  get _pickerButtonIcon() {
-    return "calendar-clock-line";
-  }
-  /**
-   * @internal
-   */
-  get _dialogLabel() {
-    return this.locale.dateTimePicker.chooseDateTimeLabel;
-  }
-}
-__decorateClass([
-  fastElement.attr({ converter: ValidDateTimeFilter })
-], DateTimePicker.prototype, "min");
-__decorateClass([
-  fastElement.attr({ converter: timeSelectionPicker_template.ValidTimeFilter, attribute: "min-time" })
-], DateTimePicker.prototype, "minTime");
-__decorateClass([
-  fastElement.attr({ converter: calendarPicker_template.ValidDateFilter, attribute: "min-date" })
-], DateTimePicker.prototype, "minDate");
-__decorateClass([
-  fastElement.attr({ converter: ValidDateTimeFilter })
-], DateTimePicker.prototype, "max");
-__decorateClass([
-  fastElement.attr({ converter: timeSelectionPicker_template.ValidTimeFilter, attribute: "max-time" })
-], DateTimePicker.prototype, "maxTime");
-__decorateClass([
-  fastElement.attr({ converter: calendarPicker_template.ValidDateFilter, attribute: "max-date" })
-], DateTimePicker.prototype, "maxDate");
-
-const DateTimePickerTemplate = (context) => {
-  return pickerField_template.PickerFieldTemplate(
-    context,
-    fastElement.html`
-			<div class="date-time-picker">
-				${() => calendarPicker_template.CalendarPickerTemplate(context)}
-				<div class="time-picker">
-					${() => timeSelectionPicker_template.TimeSelectionPickerTemplate(context, 9)}
-				</div>
-			</div>
-		`,
-    {
-      withSeparator: false,
-      padded: false
-    }
-  );
-};
-
-const dateTimePickerDefinition = vividElement.defineVividComponent(
-  "date-time-picker",
-  DateTimePicker,
-  DateTimePickerTemplate,
-  [
-    button_definition.buttonDefinition,
-    popup_definition.popupDefinition,
-    textField_definition.textFieldDefinition,
-    divider_definition.dividerDefinition,
-    timeSelectionPicker_template.inlineTimePickerDefinition,
-    visuallyHidden_definition.visuallyHiddenDefinition
-  ],
-  {
-    styles: [pickerField_template.pickerFieldStyles, calendarPicker_template.calendarStyles, styles],
-    shadowOptions: {
-      delegatesFocus: true
-    }
-  }
-);
-const registerDateTimePicker = vividElement.createRegisterFunction(
-  dateTimePickerDefinition
-);
-
-exports.VwcDateTimePickerElement = DateTimePicker;
-exports.dateTimePickerDefinition = dateTimePickerDefinition;
-exports.registerDateTimePicker = registerDateTimePicker;
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../unbundled/definition2.cjs");
+const require_definition$1 = require("../unbundled/definition37.cjs");
+exports.VwcDateTimePickerElement = require_definition$1.DateTimePicker;
+exports.dateTimePickerDefinition = require_definition$1.dateTimePickerDefinition;
+exports.registerDateTimePicker = require_definition$1.registerDateTimePicker;

package/date-time-picker/definition.js

@@ -1,279 +1,3 @@
-import { p as popupDefinition } from '../unbundled/definition5.js';
-import { b as buttonDefinition } from '../unbundled/definition2.js';
-import { textFieldDefinition } from '../text-field/definition.js';
-import { dividerDefinition } from '../divider/definition.js';
-import { a as PickerField, P as PickerFieldTemplate, p as pickerFieldStyles } from '../unbundled/picker-field.template.js';
-import { i as isValidDateStr, f as formatPresentationDate, p as parsePresentationDate, C as CalendarPicker, d as currentDateStr, b as compareDateStr, V as ValidDateFilter, a as CalendarPickerTemplate, c as calendarStyles } from '../unbundled/calendar-picker.template.js';
-import { d as defineVividComponent, c as createRegisterFunction } from '../unbundled/vivid-element.js';
-import { b as isValidTimeStr, f as formatPresentationTime, p as parsePresentationTime, c as TimeSelectionPicker, d as compareTimeStr, V as ValidTimeFilter, a as TimeSelectionPickerTemplate, i as inlineTimePickerDefinition } from '../unbundled/time-selection-picker.template.js';
-import { visuallyHiddenDefinition } from '../visually-hidden/definition.js';
-import { attr, html } from '@microsoft/fast-element';
-import { S as SingleValuePicker } from '../unbundled/single-value-picker.js';
-import { S as SingleDatePickerMixin } from '../unbundled/single-date-picker.js';
-
-const styles = ".date-time-picker{display:flex;gap:28px;padding-inline-start:12px}.time-picker{padding-block:4px 12px}";
-
-const extractDatePart = (dateTimeStr) => dateTimeStr.split("T")[0] || "";
-const extractTimePart = (dateTimeStr) => dateTimeStr.split("T")[1] || "";
-const isValidDateTimeStr = (string) => {
-  const [dateStr = "", timeStr = ""] = string.split("T");
-  return isValidDateStr(dateStr) && isValidTimeStr(timeStr);
-};
-
-const formatPresentationDateTime = (dateTimeStr, locale, includeSeconds, use12HourClock) => {
-  const [dateStr, timeStr] = dateTimeStr.split("T");
-  return `${formatPresentationDate(dateStr, locale)} ${formatPresentationTime(
-    timeStr,
-    includeSeconds,
-    use12HourClock
-  )}`;
-};
-const parsePresentationDateTime = (presentationDateTime, locale, use12HourClock) => {
-  const [datePart, ...timeParts] = presentationDateTime.split(" ");
-  const dateStr = parsePresentationDate(datePart, locale);
-  const timeStr = parsePresentationTime(timeParts.join(" "), use12HourClock);
-  return `${dateStr}T${timeStr}`;
-};
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-const ValidDateTimeFilter = {
-  fromView: (value) => {
-    if (value && isValidDateTimeStr(value)) {
-      return value;
-    }
-    return "";
-  },
-  toView(value) {
-    return value;
-  }
-};
-class DateTimePicker extends TimeSelectionPicker(
-  SingleDatePickerMixin(SingleValuePicker(CalendarPicker(PickerField)))
-) {
-  constructor() {
-    super();
-    /**
-     * @internal
-     */
-    this._isValidValue = isValidDateTimeStr;
-    /**
-     * @internal
-     */
-    this._textFieldSize = "30";
-    this.proxy.type = "datetime-local";
-    this.proxy.step = "1";
-    this.min = "";
-    this.minDate = "";
-    this.minTime = "";
-    this.max = "";
-    this.maxDate = "";
-    this.maxTime = "";
-  }
-  get _resolvedMinDate() {
-    return this.minDate || extractDatePart(this.min);
-  }
-  get _resolvedMaxDate() {
-    return this.maxDate || extractDatePart(this.max);
-  }
-  get _resolvedMinTime() {
-    return this.minTime || this.min && extractDatePart(this.min) === this._dateValue() && extractTimePart(this.min) || "";
-  }
-  get _resolvedMaxTime() {
-    return this.maxTime || this.max && extractDatePart(this.max) === this._dateValue() && extractTimePart(this.max) || "";
-  }
-  /**
-   * @internal
-   */
-  _toPresentationValue(value) {
-    return formatPresentationDateTime(
-      value,
-      this.locale.calendarPicker,
-      this._displaySeconds,
-      this._use12hClock
-    );
-  }
-  /**
-   * @internal
-   */
-  _parsePresentationValue(presentationValue) {
-    return parsePresentationDateTime(
-      presentationValue,
-      this.locale.calendarPicker,
-      this._use12hClock
-    );
-  }
-  /**
-   * @internal
-   */
-  _dateValue() {
-    return extractDatePart(this.value);
-  }
-  /**
-   * @internal
-   */
-  _withUpdatedDate(dateStr) {
-    return `${dateStr}T${extractTimePart(this.value) || "00:00:00"}`;
-  }
-  /**
-   * @internal
-   */
-  get _timeValue() {
-    return extractTimePart(this.value);
-  }
-  /**
-   * @internal
-   */
-  _withUpdatedTime(timeStr) {
-    return `${extractDatePart(this.value) || currentDateStr()}T${timeStr}`;
-  }
-  /**
-   * @internal
-   */
-  _getCustomValidationError() {
-    if (this._isPresentationValueInvalid()) {
-      return this.locale.dateTimePicker.invalidDateTimeError;
-    }
-    if (this._dateValue() && this._resolvedMinDate && compareDateStr(this._dateValue(), this._resolvedMinDate) < 0) {
-      return this.locale.dateTimePicker.dateBeforeMinDateError(
-        formatPresentationDate(
-          this._resolvedMinDate,
-          this.locale.calendarPicker
-        )
-      );
-    }
-    if (this._dateValue() && this._resolvedMaxDate && compareDateStr(this._dateValue(), this._resolvedMaxDate) > 0) {
-      return this.locale.dateTimePicker.dateAfterMaxDateError(
-        formatPresentationDate(
-          this._resolvedMaxDate,
-          this.locale.calendarPicker
-        )
-      );
-    }
-    if (this._timeValue && this._resolvedMinTime && compareTimeStr(this._timeValue, this._resolvedMinTime) < 0) {
-      return this.locale.dateTimePicker.timeBeforeMinTimeError(
-        formatPresentationTime(
-          this._resolvedMinTime,
-          this._displaySeconds,
-          this._use12hClock
-        )
-      );
-    }
-    if (this._timeValue && this._resolvedMaxTime && compareTimeStr(this._timeValue, this._resolvedMaxTime) > 0) {
-      return this.locale.dateTimePicker.timeAfterMaxTimeError(
-        formatPresentationTime(
-          this._resolvedMaxTime,
-          this._displaySeconds,
-          this._use12hClock
-        )
-      );
-    }
-    return null;
-  }
-  /**
-   * @internal
-   */
-  get _textFieldPlaceholder() {
-    return `${this.locale.calendarPicker.dateFormatPlaceholder} ${this._timePlaceholder}`;
-  }
-  /**
-   * @internal
-   */
-  get _pickerButtonLabel() {
-    if (this.value) {
-      return this.locale.dateTimePicker.changeDateTimeLabel(
-        this._toPresentationValue(this.value)
-      );
-    } else {
-      return this.locale.dateTimePicker.chooseDateTimeLabel;
-    }
-  }
-  /**
-   * @internal
-   */
-  _focusableElsWithinDialog() {
-    return this._dialogEl.querySelectorAll(
-      "#inline-time-picker, button, .vwc-button"
-    );
-  }
-  /**
-   * @internal
-   */
-  get _pickerButtonIcon() {
-    return "calendar-clock-line";
-  }
-  /**
-   * @internal
-   */
-  get _dialogLabel() {
-    return this.locale.dateTimePicker.chooseDateTimeLabel;
-  }
-}
-__decorateClass([
-  attr({ converter: ValidDateTimeFilter })
-], DateTimePicker.prototype, "min");
-__decorateClass([
-  attr({ converter: ValidTimeFilter, attribute: "min-time" })
-], DateTimePicker.prototype, "minTime");
-__decorateClass([
-  attr({ converter: ValidDateFilter, attribute: "min-date" })
-], DateTimePicker.prototype, "minDate");
-__decorateClass([
-  attr({ converter: ValidDateTimeFilter })
-], DateTimePicker.prototype, "max");
-__decorateClass([
-  attr({ converter: ValidTimeFilter, attribute: "max-time" })
-], DateTimePicker.prototype, "maxTime");
-__decorateClass([
-  attr({ converter: ValidDateFilter, attribute: "max-date" })
-], DateTimePicker.prototype, "maxDate");
-
-const DateTimePickerTemplate = (context) => {
-  return PickerFieldTemplate(
-    context,
-    html`
-			<div class="date-time-picker">
-				${() => CalendarPickerTemplate(context)}
-				<div class="time-picker">
-					${() => TimeSelectionPickerTemplate(context, 9)}
-				</div>
-			</div>
-		`,
-    {
-      withSeparator: false,
-      padded: false
-    }
-  );
-};
-
-const dateTimePickerDefinition = defineVividComponent(
-  "date-time-picker",
-  DateTimePicker,
-  DateTimePickerTemplate,
-  [
-    buttonDefinition,
-    popupDefinition,
-    textFieldDefinition,
-    dividerDefinition,
-    inlineTimePickerDefinition,
-    visuallyHiddenDefinition
-  ],
-  {
-    styles: [pickerFieldStyles, calendarStyles, styles],
-    shadowOptions: {
-      delegatesFocus: true
-    }
-  }
-);
-const registerDateTimePicker = createRegisterFunction(
-  dateTimePickerDefinition
-);
-
+import "../unbundled/definition2.js";
+import { n as registerDateTimePicker, r as DateTimePicker, t as dateTimePickerDefinition } from "../unbundled/definition37.js";
 export { DateTimePicker as VwcDateTimePickerElement, dateTimePickerDefinition, registerDateTimePicker };

package/date-time-picker/index.cjs

@@ -1,8 +1,8 @@
-"use strict";const P=require("../bundled/definition9.cjs"),D=require("../bundled/definition3.cjs"),k=require("../bundled/definition10.cjs"),v=require("../bundled/definition15.cjs"),p=require("../bundled/picker-field.template.cjs"),i=require("../bundled/calendar-picker.template.cjs"),s=require("../bundled/vivid-element.cjs"),r=require("../bundled/time-selection-picker.template.cjs"),f=require("../bundled/definition14.cjs"),x=require("../bundled/single-value-picker.cjs"),V=require("../bundled/single-date-picker.cjs"),S=".date-time-picker{display:flex;gap:28px;padding-inline-start:12px}.time-picker{padding-block:4px 12px}",c=e=>e.split("T")[0]||"",u=e=>e.split("T")[1]||"",T=e=>{const[t="",n=""]=e.split("T");return i.isValidDateStr(t)&&r.isValidTimeStr(n)},g=(e,t,n,d)=>{const[a,l]=e.split("T");return`${i.formatPresentationDate(a,t)} ${r.formatPresentationTime(l,n,d)}`},M=(e,t,n)=>{const[d,...a]=e.split(" "),l=i.parsePresentationDate(d,t),h=r.parsePresentationTime(a.join(" "),n);return`${l}T${h}`};var y=Object.defineProperty,m=(e,t,n,d)=>{for(var a=void 0,l=e.length-1,h;l>=0;l--)(h=e[l])&&(a=h(t,n,a)||a);return a&&y(t,n,a),a};const _={fromView:e=>e&&T(e)?e:"",toView(e){return e}};class o extends r.TimeSelectionPicker(V.SingleDatePickerMixin(x.SingleValuePicker(i.CalendarPicker(p.PickerField)))){constructor(){super(),this._isValidValue=T,this._textFieldSize="30",this.proxy.type="datetime-local",this.proxy.step="1",this.min="",this.minDate="",this.minTime="",this.max="",this.maxDate="",this.maxTime=""}get _resolvedMinDate(){return this.minDate||c(this.min)}get _resolvedMaxDate(){return this.maxDate||c(this.max)}get _resolvedMinTime(){return this.minTime||this.min&&c(this.min)===this._dateValue()&&u(this.min)||""}get _resolvedMaxTime(){return this.maxTime||this.max&&c(this.max)===this._dateValue()&&u(this.max)||""}_toPresentationValue(t){return g(t,this.locale.calendarPicker,this._displaySeconds,this._use12hClock)}_parsePresentationValue(t){return M(t,this.locale.calendarPicker,this._use12hClock)}_dateValue(){return c(this.value)}_withUpdatedDate(t){return`${t}T${u(this.value)||"00:00:00"}`}get _timeValue(){return u(this.value)}_withUpdatedTime(t){return`${c(this.value)||i.currentDateStr()}T${t}`}_getCustomValidationError(){return this._isPresentationValueInvalid()?this.locale.dateTimePicker.invalidDateTimeError:this._dateValue()&&this._resolvedMinDate&&i.compareDateStr(this._dateValue(),this._resolvedMinDate)<0?this.locale.dateTimePicker.dateBeforeMinDateError(i.formatPresentationDate(this._resolvedMinDate,this.locale.calendarPicker)):this._dateValue()&&this._resolvedMaxDate&&i.compareDateStr(this._dateValue(),this._resolvedMaxDate)>0?this.locale.dateTimePicker.dateAfterMaxDateError(i.formatPresentationDate(this._resolvedMaxDate,this.locale.calendarPicker)):this._timeValue&&this._resolvedMinTime&&r.compareTimeStr(this._timeValue,this._resolvedMinTime)<0?this.locale.dateTimePicker.timeBeforeMinTimeError(r.formatPresentationTime(this._resolvedMinTime,this._displaySeconds,this._use12hClock)):this._timeValue&&this._resolvedMaxTime&&r.compareTimeStr(this._timeValue,this._resolvedMaxTime)>0?this.locale.dateTimePicker.timeAfterMaxTimeError(r.formatPresentationTime(this._resolvedMaxTime,this._displaySeconds,this._use12hClock)):null}get _textFieldPlaceholder(){return`${this.locale.calendarPicker.dateFormatPlaceholder} ${this._timePlaceholder}`}get _pickerButtonLabel(){return this.value?this.locale.dateTimePicker.changeDateTimeLabel(this._toPresentationValue(this.value)):this.locale.dateTimePicker.chooseDateTimeLabel}_focusableElsWithinDialog(){return this._dialogEl.querySelectorAll("#inline-time-picker, button, .vwc-button")}get _pickerButtonIcon(){return"calendar-clock-line"}get _dialogLabel(){return this.locale.dateTimePicker.chooseDateTimeLabel}}m([s.attr({converter:_})],o.prototype,"min");m([s.attr({converter:r.ValidTimeFilter,attribute:"min-time"})],o.prototype,"minTime");m([s.attr({converter:i.ValidDateFilter,attribute:"min-date"})],o.prototype,"minDate");m([s.attr({converter:_})],o.prototype,"max");m([s.attr({converter:r.ValidTimeFilter,attribute:"max-time"})],o.prototype,"maxTime");m([s.attr({converter:i.ValidDateFilter,attribute:"max-date"})],o.prototype,"maxDate");const $=e=>p.PickerFieldTemplate(e,s.html`
+const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/definition.cjs`);require(`../bundled/definition2.cjs`);const n=require(`../bundled/decorate.cjs`),r=require(`../bundled/definition6.cjs`),i=require(`../bundled/definition8.cjs`),a=require(`../bundled/definition12.cjs`),o=require(`../bundled/picker-field.template.cjs`),s=require(`../bundled/time-selection-picker.template.cjs`),c=require(`../bundled/single-value-picker.cjs`),l=require(`../bundled/definition19.cjs`),u=require(`../bundled/calendar-picker.template.cjs`),d=require(`../bundled/single-date-picker.cjs`);var f=`.date-time-picker{gap:28px;padding-inline-start:12px;display:flex}.time-picker{padding-block:4px 12px}`,p=e=>e.split(`T`)[0]||``,m=e=>e.split(`T`)[1]||``,h=e=>{let[t=``,n=``]=e.split(`T`);return u.l(t)&&s.l(n)},g=(e,t,n,r)=>{let[i,a]=e.split(`T`);return`${u.a(i,t)} ${s.i(a,n,r)}`},_=(e,t,n)=>{let[r,...i]=e.split(` `);return`${u.o(r,t)}T${s.a(i.join(` `),n)}`},v={fromView:e=>e&&h(e)?e:``,toView(e){return e}},y=class extends s.o(d.t(c.t(u.i(o.n)))){get _resolvedMinDate(){return this.minDate||p(this.min)}get _resolvedMaxDate(){return this.maxDate||p(this.max)}get _resolvedMinTime(){return this.minTime||this.min&&p(this.min)===this._dateValue()&&m(this.min)||``}get _resolvedMaxTime(){return this.maxTime||this.max&&p(this.max)===this._dateValue()&&m(this.max)||``}_toPresentationValue(e){return g(e,this.locale.calendarPicker,this._displaySeconds,this._use12hClock)}_parsePresentationValue(e){return _(e,this.locale.calendarPicker,this._use12hClock)}_dateValue(){return p(this.value)}_withUpdatedDate(e){return`${e}T${m(this.value)||`00:00:00`}`}get _timeValue(){return m(this.value)}_withUpdatedTime(e){return`${p(this.value)||u.c()}T${e}`}constructor(){super(),this._isValidValue=h,this._textFieldSize=`30`,this.proxy.type=`datetime-local`,this.proxy.step=`1`,this.min=``,this.minDate=``,this.minTime=``,this.max=``,this.maxDate=``,this.maxTime=``}_getCustomValidationError(){return this._isPresentationValueInvalid()?this.locale.dateTimePicker.invalidDateTimeError:this._dateValue()&&this._resolvedMinDate&&u.s(this._dateValue(),this._resolvedMinDate)<0?this.locale.dateTimePicker.dateBeforeMinDateError(u.a(this._resolvedMinDate,this.locale.calendarPicker)):this._dateValue()&&this._resolvedMaxDate&&u.s(this._dateValue(),this._resolvedMaxDate)>0?this.locale.dateTimePicker.dateAfterMaxDateError(u.a(this._resolvedMaxDate,this.locale.calendarPicker)):this._timeValue&&this._resolvedMinTime&&s.c(this._timeValue,this._resolvedMinTime)<0?this.locale.dateTimePicker.timeBeforeMinTimeError(s.i(this._resolvedMinTime,this._displaySeconds,this._use12hClock)):this._timeValue&&this._resolvedMaxTime&&s.c(this._timeValue,this._resolvedMaxTime)>0?this.locale.dateTimePicker.timeAfterMaxTimeError(s.i(this._resolvedMaxTime,this._displaySeconds,this._use12hClock)):null}get _textFieldPlaceholder(){return`${this.locale.calendarPicker.dateFormatPlaceholder} ${this._timePlaceholder}`}get _pickerButtonLabel(){return this.value?this.locale.dateTimePicker.changeDateTimeLabel(this._toPresentationValue(this.value)):this.locale.dateTimePicker.chooseDateTimeLabel}_focusableElsWithinDialog(){return this._dialogEl.querySelectorAll(`#inline-time-picker, button, .vwc-button`)}get _pickerButtonIcon(){return`calendar-clock-line`}get _dialogLabel(){return this.locale.dateTimePicker.chooseDateTimeLabel}};n.t([e.l({converter:v})],y.prototype,`min`,void 0),n.t([e.l({converter:s.r,attribute:`min-time`})],y.prototype,`minTime`,void 0),n.t([e.l({converter:u.r,attribute:`min-date`})],y.prototype,`minDate`,void 0),n.t([e.l({converter:v})],y.prototype,`max`,void 0),n.t([e.l({converter:s.r,attribute:`max-time`})],y.prototype,`maxTime`,void 0),n.t([e.l({converter:u.r,attribute:`max-date`})],y.prototype,`maxDate`,void 0);var b=e.o(`date-time-picker`,y,t=>o.t(t,e.d`
 			<div class="date-time-picker">
-				${()=>i.CalendarPickerTemplate(e)}
+				${()=>u.t(t)}
 				<div class="time-picker">
-					${()=>r.TimeSelectionPickerTemplate(e,9)}
+					${()=>s.t(t,9)}
 				</div>
 			</div>
-		`,{withSeparator:!1,padded:!1}),b=s.defineVividComponent("date-time-picker",o,$,[D.buttonDefinition,P.popupDefinition,k.textFieldDefinition,v.dividerDefinition,r.inlineTimePickerDefinition,f.visuallyHiddenDefinition],{styles:[p.pickerFieldStyles,i.calendarStyles,S],shadowOptions:{delegatesFocus:!0}}),F=s.createRegisterFunction(b);F();
+		`,{withSeparator:!1,padded:!1}),[r.t,i.t,a.n,l.t,s.s,t.n],{styles:[o.r,u.u,f],shadowOptions:{delegatesFocus:!0}});e.s(b)();