@ui5/webcomponents 2.5.0 → 2.6.0-rc.0

package/dist/DatePickerInputTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePickerInputTemplate.js","sourceRoot":"","sources":["../src/DatePickerInputTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,KAAK,MAAM,YAAY,CAAC;AAE/B,MAAM,CAAC,OAAO,UAAU,uBAAuB;IAC9C,OAAO,CACN,cACC,KAAK,EAAC,sBAAsB,EAC5B,KAAK,EAAE;YACN,KAAK,EAAE,MAAM;SACb,YAED,MAAC,KAAK,gCAEL,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,EACvB,KAAK,EAAC,uBAAuB,EAC7B,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAE,IAAI,CAAC,OAAO,EAC3B,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,SAAS,EAAE,IAAI,CAAC,UAAU,aAGzB,IAAI,CAAC,iBAAiB,CAAC,MAAM,GAAG,CAAC;oBACjC,eAAM,IAAI,EAAC,mBAAmB,EAAC,IAAI,EAAC,mBAAmB,GAAQ,EAG/D,CAAC,IAAI,CAAC,QAAQ;oBACd,KAAC,IAAI,IACJ,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,aAAa,EAC5B,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,IAAI,CAAC,YAAY,EACvB,QAAQ,EAAE,CAAC,CAAC,EACZ,cAAc,EAAE,IAAI,CAAC,aAAa,EAClC,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,WAAW,EAAE,IAAI,EACjB,KAAK,EAAE;4BACN,WAAW,EAAE,IAAI;4BACjB,oBAAoB,EAAE,IAAI,CAAC,IAAI;yBAC/B,EACD,OAAO,EAAE,IAAI,CAAC,aAAa,GAC1B,IAEI,GACH,CACN,CAAC;AACH,CAAC","sourcesContent":["import type DatePicker from \"./DatePicker.js\";\nimport Icon from \"./Icon.js\";\nimport Input from \"./Input.js\";\n\nexport default function DatePickerInputTemplate(this: DatePicker) {\n\treturn (\n\t\t<div\n\t\t\tclass=\"ui5-date-picker-root\"\n\t\t\tstyle={{\n\t\t\t\twidth: \"100%\",\n\t\t\t}}\n\t\t>\n\t\t\t<Input\n\t\t\t\tdata-sap-focus-ref\n\t\t\t\tid={`${this._id}-inner`}\n\t\t\t\tclass=\"ui5-date-picker-input\"\n\t\t\t\tplaceholder={this._placeholder}\n\t\t\t\ttype={this.type}\n\t\t\t\tvalue={this.value}\n\t\t\t\tdisabled={this.disabled}\n\t\t\t\trequired={this.required}\n\t\t\t\treadonly={this.readonly}\n\t\t\t\tvalueState={this.valueState}\n\t\t\t\t_inputAccInfo={this.accInfo}\n\t\t\t\tonChange={this._onInputChange}\n\t\t\t\tonInput={this._onInputInput}\n\t\t\t\tonSubmit={this._onInputSubmit}\n\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t>\n\n\t\t\t\t{this.valueStateMessage.length > 0 &&\n\t\t\t\t\t<slot name=\"valueStateMessage\" slot=\"valueStateMessage\"></slot>\n\t\t\t\t}\n\n\t\t\t\t{!this.readonly &&\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tid={`${this._id}-value-help`}\n\t\t\t\t\t\tslot=\"icon\"\n\t\t\t\t\t\tname={this.openIconName}\n\t\t\t\t\t\ttabindex={-1}\n\t\t\t\t\t\taccessibleName={this.openIconTitle}\n\t\t\t\t\t\tmode={this._iconMode}\n\t\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\"inputIcon\": true,\n\t\t\t\t\t\t\t\"inputIcon--pressed\": this.open,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={this._togglePicker}\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t</Input>\n\t\t</div>\n\t);\n}\n"]}

package/dist/DatePickerPopoverTemplate.d.ts

@@ -0,0 +1,8 @@
+import type DatePicker from "./DatePicker.js";
+type TemplateHook = () => void;
+export default function DatePickerPopoverTemplate(this: DatePicker, hooks?: {
+    header?: TemplateHook;
+    content?: TemplateHook;
+    footer?: TemplateHook;
+}): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;
+export {};

package/dist/DatePickerPopoverTemplate.js

@@ -0,0 +1,20 @@
+import { jsxs as _jsxs, jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+import Button from "./Button.js";
+import Calendar from "./Calendar.js";
+import CalendarDate from "./CalendarDate.js";
+import ResponsivePopover from "./ResponsivePopover.js";
+import decline from "@ui5/webcomponents-icons/dist/decline.js";
+export default function DatePickerPopoverTemplate(hooks) {
+    const header = hooks?.header || defaultHeader;
+    const content = hooks?.content || defaultContent;
+    const footer = hooks?.footer || defaultFooter;
+    return (_jsxs(ResponsivePopover, { id: `${this._id}-responsive-popover`, opener: this, open: this.open, allowTargetOverlap: true, placement: "Bottom", horizontalAlign: "Start", accessibleName: this.pickerAccessibleName, hideArrow: true, _hideHeader: this._shouldHideHeader, onKeyDown: this._onkeydown, onClose: this.onResponsivePopoverAfterClose, onOpen: this.onResponsivePopoverAfterOpen, onBeforeOpen: this.onResponsivePopoverBeforeOpen, children: [this.showHeader && header.call(this), content.call(this), this.showFooter && footer.call(this)] }));
+}
+function defaultHeader() {
+    return (_jsx("div", { slot: "header", class: "ui5-responsive-popover-header", children: _jsxs("div", { class: "row", children: [_jsx("span", { children: this._headerTitleText }), _jsx(Button, { class: "ui5-responsive-popover-close-btn", icon: decline, design: "Transparent", onClick: this._togglePicker })] }) }));
+}
+function defaultContent() {
+    return (_jsx(Calendar, { id: `${this._id}-calendar`, primaryCalendarType: this._primaryCalendarType, secondaryCalendarType: this.secondaryCalendarType, formatPattern: this._formatPattern, selectionMode: this._calendarSelectionMode, minDate: this.minDate, maxDate: this.maxDate, calendarWeekNumbering: this.calendarWeekNumbering, onSelectionChange: this.onSelectedDatesChange, onShowMonthView: this.onHeaderShowMonthPress, onShowYearView: this.onHeaderShowYearPress, hideWeekNumbers: this.hideWeekNumbers, _currentPicker: this._calendarCurrentPicker, _pickersMode: this._calendarPickersMode, children: this._calendarSelectedDates.map(date => _jsx(CalendarDate, { value: date })) }));
+}
+function defaultFooter() { }
+//# sourceMappingURL=DatePickerPopoverTemplate.js.map

package/dist/DatePickerPopoverTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePickerPopoverTemplate.js","sourceRoot":"","sources":["../src/DatePickerPopoverTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,QAAQ,MAAM,eAAe,CAAC;AACrC,OAAO,YAAY,MAAM,mBAAmB,CAAC;AAC7C,OAAO,iBAAiB,MAAM,wBAAwB,CAAC;AACvD,OAAO,OAAO,MAAM,0CAA0C,CAAC;AAI/D,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAmB,KAAgF;IACnJ,MAAM,MAAM,GAAG,KAAK,EAAE,MAAM,IAAI,aAAa,CAAC;IAC9C,MAAM,OAAO,GAAG,KAAK,EAAE,OAAO,IAAI,cAAc,CAAC;IACjD,MAAM,MAAM,GAAG,KAAK,EAAE,MAAM,IAAI,aAAa,CAAC;IAE9C,OAAO,CACN,MAAC,iBAAiB,IACjB,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,qBAAqB,EACpC,MAAM,EAAE,IAAI,EACZ,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,kBAAkB,QAClB,SAAS,EAAC,QAAQ,EAClB,eAAe,EAAC,OAAO,EACvB,cAAc,EAAE,IAAI,CAAC,oBAAoB,EACzC,SAAS,EAAE,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,iBAAiB,EACnC,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,6BAA6B,EAC3C,MAAM,EAAE,IAAI,CAAC,4BAA4B,EACzC,YAAY,EAAE,IAAI,CAAC,6BAA6B,aAE9C,IAAI,CAAC,UAAU,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAEpC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,EAElB,IAAI,CAAC,UAAU,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,IACnB,CACpB,CAAC;AACH,CAAC;AAED,SAAS,aAAa;IACrB,OAAO,CACN,cAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,+BAA+B,YACvD,eAAK,KAAK,EAAC,KAAK,aACf,yBAAO,IAAI,CAAC,gBAAgB,GAAQ,EACpC,KAAC,MAAM,IACN,KAAK,EAAC,kCAAkC,EACxC,IAAI,EAAE,OAAO,EACb,MAAM,EAAC,aAAa,EACpB,OAAO,EAAE,IAAI,CAAC,aAAa,GAEnB,IACJ,GACD,CACN,CAAC;AACH,CAAC;AAED,SAAS,cAAc;IACtB,OAAO,CACN,KAAC,QAAQ,IACR,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,WAAW,EAC1B,mBAAmB,EAAE,IAAI,CAAC,oBAAoB,EAC9C,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,aAAa,EAAE,IAAI,CAAC,cAAc,EAClC,aAAa,EAAE,IAAI,CAAC,sBAAsB,EAC1C,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,iBAAiB,EAAE,IAAI,CAAC,qBAAqB,EAC7C,eAAe,EAAE,IAAI,CAAC,sBAAsB,EAC5C,cAAc,EAAE,IAAI,CAAC,qBAAqB,EAC1C,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,cAAc,EAAE,IAAI,CAAC,sBAAsB,EAC3C,YAAY,EAAE,IAAI,CAAC,oBAAoB,YAErC,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,KAAC,YAAY,IAAC,KAAK,EAAE,IAAI,GAAG,CAAC,GAC7D,CACX,CAAC;AACH,CAAC;AAED,SAAS,aAAa,KAAI,CAAC","sourcesContent":["import type DatePicker from \"./DatePicker.js\";\nimport Button from \"./Button.js\";\nimport Calendar from \"./Calendar.js\";\nimport CalendarDate from \"./CalendarDate.js\";\nimport ResponsivePopover from \"./ResponsivePopover.js\";\nimport decline from \"@ui5/webcomponents-icons/dist/decline.js\";\n\ntype TemplateHook = () => void;\n\nexport default function DatePickerPopoverTemplate(this: DatePicker, hooks?: { header?: TemplateHook, content?: TemplateHook, footer?: TemplateHook }) {\n\tconst header = hooks?.header || defaultHeader;\n\tconst content = hooks?.content || defaultContent;\n\tconst footer = hooks?.footer || defaultFooter;\n\n\treturn (\n\t\t<ResponsivePopover\n\t\t\tid={`${this._id}-responsive-popover`}\n\t\t\topener={this}\n\t\t\topen={this.open}\n\t\t\tallowTargetOverlap\n\t\t\tplacement=\"Bottom\"\n\t\t\thorizontalAlign=\"Start\"\n\t\t\taccessibleName={this.pickerAccessibleName}\n\t\t\thideArrow={true}\n\t\t\t_hideHeader={this._shouldHideHeader}\n\t\t\tonKeyDown={this._onkeydown}\n\t\t\tonClose={this.onResponsivePopoverAfterClose}\n\t\t\tonOpen={this.onResponsivePopoverAfterOpen}\n\t\t\tonBeforeOpen={this.onResponsivePopoverBeforeOpen}\n\t\t>\n\t\t\t{ this.showHeader && header.call(this) }\n\n\t\t\t{ content.call(this) }\n\n\t\t\t{ this.showFooter && footer.call(this) }\n\t\t</ResponsivePopover>\n\t);\n}\n\nfunction defaultHeader(this: DatePicker) {\n\treturn (\n\t\t<div slot=\"header\" class=\"ui5-responsive-popover-header\">\n\t\t\t<div class=\"row\">\n\t\t\t\t<span>{this._headerTitleText}</span>\n\t\t\t\t<Button\n\t\t\t\t\tclass=\"ui5-responsive-popover-close-btn\"\n\t\t\t\t\ticon={decline}\n\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\tonClick={this._togglePicker}\n\t\t\t\t>\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction defaultContent(this: DatePicker) {\n\treturn (\n\t\t<Calendar\n\t\t\tid={`${this._id}-calendar`}\n\t\t\tprimaryCalendarType={this._primaryCalendarType}\n\t\t\tsecondaryCalendarType={this.secondaryCalendarType}\n\t\t\tformatPattern={this._formatPattern}\n\t\t\tselectionMode={this._calendarSelectionMode}\n\t\t\tminDate={this.minDate}\n\t\t\tmaxDate={this.maxDate}\n\t\t\tcalendarWeekNumbering={this.calendarWeekNumbering}\n\t\t\tonSelectionChange={this.onSelectedDatesChange}\n\t\t\tonShowMonthView={this.onHeaderShowMonthPress}\n\t\t\tonShowYearView={this.onHeaderShowYearPress}\n\t\t\thideWeekNumbers={this.hideWeekNumbers}\n\t\t\t_currentPicker={this._calendarCurrentPicker}\n\t\t\t_pickersMode={this._calendarPickersMode}\n\t\t>\n\t\t\t{ this._calendarSelectedDates.map(date => <CalendarDate value={date}/>)}\n\t\t</Calendar>\n\t);\n}\n\nfunction defaultFooter() {}\n"]}

package/dist/DatePickerTemplate.d.ts

@@ -0,0 +1,2 @@
+import type DatePicker from "./DatePicker.js";
+export default function DatePickerTemplate(this: DatePicker): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element[];

package/dist/DatePickerTemplate.js

@@ -0,0 +1,9 @@
+import DatePickerInputTemplate from "./DatePickerInputTemplate.js";
+import DatePickerPopoverTemplate from "./DatePickerPopoverTemplate.js";
+export default function DatePickerTemplate() {
+    return [
+        DatePickerInputTemplate.call(this),
+        DatePickerPopoverTemplate.call(this),
+    ];
+}
+//# sourceMappingURL=DatePickerTemplate.js.map

package/dist/DatePickerTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePickerTemplate.js","sourceRoot":"","sources":["../src/DatePickerTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AACnE,OAAO,yBAAyB,MAAM,gCAAgC,CAAC;AAIvE,MAAM,CAAC,OAAO,UAAU,kBAAkB;IACzC,OAAO;QACN,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;QAClC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC;KACpC,CAAC;AACH,CAAC","sourcesContent":["import DatePickerInputTemplate from \"./DatePickerInputTemplate.js\";\nimport DatePickerPopoverTemplate from \"./DatePickerPopoverTemplate.js\";\n\nimport type DatePicker from \"./DatePicker.js\";\n\nexport default function DatePickerTemplate(this: DatePicker) {\n\treturn [\n\t\tDatePickerInputTemplate.call(this),\n\t\tDatePickerPopoverTemplate.call(this),\n\t];\n}\n"]}

package/dist/DateRangePicker.d.ts

@@ -2,6 +2,7 @@ import type { IFormInputElement } from "@ui5/webcomponents-base/dist/features/In
 import DatePicker from "./DatePicker.js";
 import type { DatePickerChangeEventDetail as DateRangePickerChangeEventDetail, DatePickerInputEventDetail as DateRangePickerInputEventDetail } from "./DatePicker.js";
 import type { CalendarSelectionChangeEventDetail } from "./Calendar.js";
+import type CalendarSelectionMode from "./types/CalendarSelectionMode.js";
 /**
  * @class
  *
@@ -69,7 +70,7 @@ declare class DateRangePicker extends DatePicker implements IFormInputElement {
      * Required by DatePicker.js
      * @override
      */
-    get _calendarSelectionMode(): string;
+    get _calendarSelectionMode(): `${CalendarSelectionMode}`;
     /**
      * Required by DatePicker.js - set the calendar focus on the first selected date (or today if not set)
      * @override

package/dist/DateRangePicker.js

@@ -12,7 +12,7 @@ import CalendarDate from "@ui5/webcomponents-localization/dist/dates/CalendarDat
 import modifyDateBy from "@ui5/webcomponents-localization/dist/dates/modifyDateBy.js";
 import getTodayUTCTimestamp from "@ui5/webcomponents-localization/dist/dates/getTodayUTCTimestamp.js";
 import { DATERANGE_DESCRIPTION, DATERANGEPICKER_POPOVER_ACCESSIBLE_NAME, } from "./generated/i18n/i18n-defaults.js";
-import DateRangePickerTemplate from "./generated/templates/DateRangePickerTemplate.lit.js";
+import DateRangePickerTemplate from "./DateRangePickerTemplate.js";
 // Styles
 import DateRangePickerCss from "./generated/themes/DateRangePicker.css.js";
 import DatePicker from "./DatePicker.js";

package/dist/DateRangePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangePicker.js","sourceRoot":"","sources":["../src/DateRangePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport CalendarDate from \"@ui5/webcomponents-localization/dist/dates/CalendarDate.js\";\nimport modifyDateBy from \"@ui5/webcomponents-localization/dist/dates/modifyDateBy.js\";\nimport getTodayUTCTimestamp from \"@ui5/webcomponents-localization/dist/dates/getTodayUTCTimestamp.js\";\nimport {\n\tDATERANGE_DESCRIPTION,\n\tDATERANGEPICKER_POPOVER_ACCESSIBLE_NAME,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport DateRangePickerTemplate from \"./generated/templates/DateRangePickerTemplate.lit.js\";\n\n// Styles\nimport DateRangePickerCss from \"./generated/themes/DateRangePicker.css.js\";\nimport DatePicker from \"./DatePicker.js\";\nimport CalendarDateRange from \"./CalendarDateRange.js\";\n\nimport type {\n\tDatePickerChangeEventDetail as DateRangePickerChangeEventDetail,\n\tDatePickerInputEventDetail as DateRangePickerInputEventDetail,\n} from \"./DatePicker.js\";\nimport type { CalendarSelectionChangeEventDetail } from \"./Calendar.js\";\n\nconst DEFAULT_DELIMITER = \"-\";\n\n/**\n * @class\n *\n * ### Overview\n * The DateRangePicker enables the users to enter a localized date range using touch, mouse, keyboard input, or by selecting a date range in the calendar.\n *\n * ### Usage\n * The user can enter a date by:\n * Using the calendar that opens in a popup or typing it in directly in the input field (not available for mobile devices).\n * For the `ui5-daterange-picker`\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/DateRangePicker.js\";`\n *\n * ### Keyboard Handling\n * The `ui5-daterange-picker` provides advanced keyboard handling.\n *\n * When the `ui5-daterange-picker` input field is focused the user can\n * increment or decrement respectively the range start or end date, depending on where the cursor is.\n * The following shortcuts are available:\n *\n * - [Page Down] - Decrements the corresponding day of the month by one\n * - [Shift] + [Page Down] - Decrements the corresponding month by one\n * - [Shift] + [Ctrl] + [Page Down] - Decrements the corresponding year by one\n * - [Page Up] - Increments the corresponding day of the month by one\n * - [Shift] + [Page Up] - Increments the corresponding month by one\n * - [Shift] + [Ctrl] + [Page Up] - Increments the corresponding year by one\n * @constructor\n * @extends DatePicker\n * @since 1.0.0-rc.8\n * @public\n */\n@customElement({\n\ttag: \"ui5-daterange-picker\",\n\tstyles: [DatePicker.styles, DateRangePickerCss],\n\ttemplate: DateRangePickerTemplate,\n\tdependencies: [...DatePicker.dependencies, CalendarDateRange],\n})\nclass DateRangePicker extends DatePicker implements IFormInputElement {\n\t /**\n\t * Determines the symbol which separates the dates.\n\t * If not supplied, the default time interval delimiter for the current locale will be used.\n\t * @default \"-\"\n\t * @public\n\t */\n\t@property()\n\tdelimiter = \"-\";\n\n\t /**\n\t * The first date in the range during selection (this is a temporary value, not the first date in the value range)\n\t * @private\n\t */\n\t@property()\n\t_tempValue?: string;\n\n\tprivate _prevDelimiter: string | null;\n\n\tget formFormattedValue() {\n\t\tconst values = this._splitValueByDelimiter(this.value || \"\").filter(Boolean);\n\n\t\tif (values.length && this.name) {\n\t\t\tconst formData = new FormData();\n\n\t\t\tfor (let i = 0; i < values.length; i++) {\n\t\t\t\tformData.append(this.name, values[i]);\n\t\t\t}\n\n\t\t\treturn formData;\n\t\t}\n\n\t\treturn this.value;\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._prevDelimiter = null;\n\t}\n\n\t/**\n\t * **Note:** The getter method is inherited and not supported. If called it will return an empty value.\n\t * @public\n\t * @default null\n\t */\n\tget dateValue(): Date | null {\n\t\treturn null;\n\t}\n\n\t/**\n\t * **Note:** The getter method is inherited and not supported. If called it will return an empty value.\n\t * @public\n\t * @default null\n\t */\n\tget dateValueUTC(): Date | null {\n\t\treturn null;\n\t}\n\n\tget _startDateTimestamp() {\n\t\treturn this._extractFirstTimestamp(this.value);\n\t}\n\n\tget _endDateTimestamp() {\n\t\treturn this._extractLastTimestamp(this.value);\n\t}\n\n\tget _tempTimestamp() {\n\t\treturn this._tempValue && (this.getFormat().parse(this._tempValue, true) as Date).getTime() / 1000;\n\t}\n\n\t/**\n\t * Required by DatePicker.js\n\t * @override\n\t */\n\tget _calendarSelectionMode() {\n\t\treturn \"Range\";\n\t}\n\n\t/**\n\t * Required by DatePicker.js - set the calendar focus on the first selected date (or today if not set)\n\t * @override\n\t */\n\tget _calendarTimestamp() {\n\t\treturn this._tempTimestamp || this._startDateTimestamp || getTodayUTCTimestamp(this._primaryCalendarType);\n\t}\n\n\t/**\n\t * Required by DatePicker.js\n\t * @override\n\t */\n\tget _calendarSelectedDates() {\n\t\tif (this._tempValue) {\n\t\t\treturn [this._tempValue];\n\t\t}\n\t\tif (this.value && this._checkValueValidity(this.value)) {\n\t\t\treturn this._splitValueByDelimiter(this.value);\n\t\t}\n\t\treturn [];\n\t}\n\n\t/**\n\t * Returns the start date of the currently selected range as JavaScript Date instance.\n\t * @public\n\t * @default null\n\t */\n\tget startDateValue(): Date | null {\n\t\treturn CalendarDate.fromTimestamp(this._startDateTimestamp! * 1000).toLocalJSDate();\n\t}\n\n\t/**\n\t * Returns the end date of the currently selected range as JavaScript Date instance.\n\t * @public\n\t * @default null\n\t */\n\tget endDateValue(): Date | null {\n\t\treturn CalendarDate.fromTimestamp(this._endDateTimestamp! * 1000).toLocalJSDate();\n\t}\n\n\tget startValue(): string {\n\t\treturn this._calendarSelectedDates[0] || \"\";\n\t}\n\n\tget endValue(): string {\n\t\treturn this._calendarSelectedDates[1] || \"\";\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget _placeholder() {\n\t\treturn this.placeholder !== undefined ? this.placeholder : `${this._displayFormat} ${this._effectiveDelimiter} ${this._displayFormat}`;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget dateAriaDescription() {\n\t\treturn DateRangePicker.i18nBundle.getText(DATERANGE_DESCRIPTION);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget pickerAccessibleName() {\n\t\treturn DateRangePicker.i18nBundle.getText(DATERANGEPICKER_POPOVER_ACCESSIBLE_NAME);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tasync _onInputSubmit() {\n\t\tconst input = this._getInput();\n\t\tconst caretPos = input.getCaretPosition();\n\t\tawait renderFinished();\n\t\tinput.setCaretPosition(caretPos); // Return the caret on the previous position after rendering\n\t}\n\n\t/**\n\t * @override\n\t */\n\t onResponsivePopoverAfterClose() {\n\t\tthis._tempValue = \"\"; // reset _tempValue on popover close\n\t\tsuper.onResponsivePopoverAfterClose();\n\t}\n\n\t/**\n\t * @override\n\t */\n\tisValid(value: string): boolean {\n\t\tconst parts = this._splitValueByDelimiter(value);\n\t\treturn parts.length <= 2 && parts.every(dateString => super.isValid(dateString)); // must be at most 2 dates and each must be valid\n\t}\n\n\t/**\n\t * @override\n\t */\n\tisInValidRange(value: string): boolean {\n\t\treturn this._splitValueByDelimiter(value).every(dateString => super.isInValidRange(dateString));\n\t}\n\n\t/**\n\t * Extract both dates as timestamps, flip if necessary, and build (which will use the desired format so we enforce the format too)\n\t * @override\n\t */\n\tnormalizeValue(value: string) {\n\t\tconst firstDateTimestamp = this._extractFirstTimestamp(value);\n\t\tconst lastDateTimestamp = this._extractLastTimestamp(value);\n\t\tif (firstDateTimestamp && lastDateTimestamp && firstDateTimestamp > lastDateTimestamp) { // if both are timestamps (not undefined), flip if necessary\n\t\t\treturn this._buildValue(lastDateTimestamp, firstDateTimestamp);\n\t\t}\n\t\treturn this._buildValue(firstDateTimestamp, lastDateTimestamp);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tonSelectedDatesChange(event: CustomEvent<CalendarSelectionChangeEventDetail>) {\n\t\tevent.preventDefault(); // never let the calendar update its own dates, the parent component controls them\n\t\tconst values = event.detail.selectedValues;\n\n\t\tif (values.length === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (values.length === 1) { // Do nothing until the user selects 2 dates, we don't change any state at all for one date\n\t\t\tthis._tempValue = values[0];\n\t\t\treturn;\n\t\t}\n\t\tconst newValue = this._buildValue(event.detail.selectedDates[0], event.detail.selectedDates[1]); // the value will be normalized so we don't need to order them here\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * @override\n\t */\n\tasync _modifyDateValue(amount: number, unit: string, preserveDate?: boolean) {\n\t\tif (!this._endDateTimestamp) { // If empty or only one date -> treat as datepicker entirely\n\t\t\treturn super._modifyDateValue(amount, unit, preserveDate);\n\t\t}\n\n\t\tconst input = this._getInput();\n\t\tlet caretPos: number = input.getCaretPosition()!; // caret position is always number for input of type text;\n\t\tlet newValue: string;\n\n\t\tif (caretPos <= this.value.indexOf(this._effectiveDelimiter)) { // The user is focusing the first date -> change it and keep the second date\n\t\t\tconst startDateModified = modifyDateBy(CalendarDate.fromTimestamp(this._startDateTimestamp! * 1000), amount, unit, preserveDate, this._minDate, this._maxDate);\n\t\t\tconst newStartDateTimestamp = startDateModified.valueOf() / 1000;\n\t\t\tif (newStartDateTimestamp > this._endDateTimestamp) { // dates flipped -> move the caret to the same position but on the last date\n\t\t\t\tcaretPos += Math.ceil(this.value.length / 2);\n\t\t\t}\n\t\t\tnewValue = this._buildValue(newStartDateTimestamp, this._endDateTimestamp); // the value will be normalized so we don't try to order them here\n\t\t} else {\n\t\t\tconst endDateModified = modifyDateBy(CalendarDate.fromTimestamp(this._endDateTimestamp * 1000), amount, unit, preserveDate, this._minDate, this._maxDate);\n\t\t\tconst newEndDateTimestamp = endDateModified.valueOf() / 1000;\n\t\t\tnewValue = this._buildValue(this._startDateTimestamp, newEndDateTimestamp); // the value will be normalized so we don't try to order them here\n\t\t\tif (newEndDateTimestamp < this._startDateTimestamp!) { // dates flipped -> move the caret to the same position but on the first date\n\t\t\t\tcaretPos -= Math.ceil(this.value.length / 2);\n\t\t\t}\n\t\t}\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\n\t\tawait renderFinished();\n\t\tinput.setCaretPosition(caretPos); // Return the caret to the previous (or the adjusted, if dates flipped) position after rendering\n\t}\n\n\tget _effectiveDelimiter(): string {\n\t\treturn this.delimiter || DEFAULT_DELIMITER;\n\t}\n\n\t_splitValueByDelimiter(value: string) {\n\t\tconst valuesArray: Array<string> = [];\n\t\tconst partsArray = value.split(this._prevDelimiter || this._effectiveDelimiter);\n\n\t\t// if format successfully parse the value, the value contains only single date\n\t\tif (this.getFormat().parse(value)) {\n\t\t\tvaluesArray[0] = partsArray.join(this._effectiveDelimiter);\n\t\t\tvaluesArray[1] = \"\";\n\t\t} else {\n\t\t\tvaluesArray[0] = partsArray.slice(0, partsArray.length / 2).join(this._effectiveDelimiter);\n\t\t\tvaluesArray[1] = partsArray.slice(partsArray.length / 2).join(this._effectiveDelimiter);\n\t\t}\n\n\t\treturn valuesArray;\n\t}\n\n\t/**\n\t * Returns a UTC timestamp, representing the first date in the value string or undefined if the value is empty\n\t * @private\n\t */\n\t_extractFirstTimestamp(value: string) {\n\t\tif (!value || !this._checkValueValidity(value)) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst dateStrings = this._splitValueByDelimiter(value); // at least one item guaranteed due to the checks above (non-empty and valid)\n\n\t\tconst parsedDate = this.getFormat().parse(dateStrings[0], true) as Date;\n\t\treturn parsedDate.getTime() / 1000;\n\t}\n\n\t/**\n\t * Returns a UTC timestamp, representing the last date in the value string or undefined if the value is empty or there is just one date\n\t * @private\n\t */\n\t_extractLastTimestamp(value: string) {\n\t\tif (!value || !this._checkValueValidity(value)) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst dateStrings = this._splitValueByDelimiter(value);\n\t\tif (dateStrings[1]) {\n\t\t\tconst parsedDate = this.getFormat().parse(dateStrings[1], true) as Date;\n\t\t\treturn parsedDate.getTime() / 1000;\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\t/**\n\t * Builds a string value out of two UTC timestamps - this method is the counterpart to _extractFirstTimestamp/_extractLastTimestamp\n\t * @private\n\t */\n\t_buildValue(firstDateTimestamp: number | undefined, lastDateTimestamp: number | undefined) {\n\t\tthis._prevDelimiter = this._effectiveDelimiter;\n\t\tif (firstDateTimestamp) {\n\t\t\tconst firstDateString = this._getStringFromTimestamp(firstDateTimestamp * 1000);\n\n\t\t\tif (!lastDateTimestamp) {\n\t\t\t\treturn firstDateString;\n\t\t\t}\n\n\t\t\tconst lastDateString = this._getStringFromTimestamp(lastDateTimestamp * 1000);\n\t\t\treturn `${firstDateString} ${this._effectiveDelimiter} ${lastDateString}`;\n\t\t}\n\n\t\treturn \"\";\n\t}\n}\n\nDateRangePicker.define();\n\nexport default DateRangePicker;\nexport type {\n\tDateRangePickerChangeEventDetail,\n\tDateRangePickerInputEventDetail,\n};\n"]}
+{"version":3,"file":"DateRangePicker.js","sourceRoot":"","sources":["../src/DateRangePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport CalendarDate from \"@ui5/webcomponents-localization/dist/dates/CalendarDate.js\";\nimport modifyDateBy from \"@ui5/webcomponents-localization/dist/dates/modifyDateBy.js\";\nimport getTodayUTCTimestamp from \"@ui5/webcomponents-localization/dist/dates/getTodayUTCTimestamp.js\";\nimport {\n\tDATERANGE_DESCRIPTION,\n\tDATERANGEPICKER_POPOVER_ACCESSIBLE_NAME,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport DateRangePickerTemplate from \"./DateRangePickerTemplate.js\";\n\n// Styles\nimport DateRangePickerCss from \"./generated/themes/DateRangePicker.css.js\";\nimport DatePicker from \"./DatePicker.js\";\nimport CalendarDateRange from \"./CalendarDateRange.js\";\n\nimport type {\n\tDatePickerChangeEventDetail as DateRangePickerChangeEventDetail,\n\tDatePickerInputEventDetail as DateRangePickerInputEventDetail,\n} from \"./DatePicker.js\";\nimport type { CalendarSelectionChangeEventDetail } from \"./Calendar.js\";\nimport type CalendarSelectionMode from \"./types/CalendarSelectionMode.js\";\n\nconst DEFAULT_DELIMITER = \"-\";\n\n/**\n * @class\n *\n * ### Overview\n * The DateRangePicker enables the users to enter a localized date range using touch, mouse, keyboard input, or by selecting a date range in the calendar.\n *\n * ### Usage\n * The user can enter a date by:\n * Using the calendar that opens in a popup or typing it in directly in the input field (not available for mobile devices).\n * For the `ui5-daterange-picker`\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/DateRangePicker.js\";`\n *\n * ### Keyboard Handling\n * The `ui5-daterange-picker` provides advanced keyboard handling.\n *\n * When the `ui5-daterange-picker` input field is focused the user can\n * increment or decrement respectively the range start or end date, depending on where the cursor is.\n * The following shortcuts are available:\n *\n * - [Page Down] - Decrements the corresponding day of the month by one\n * - [Shift] + [Page Down] - Decrements the corresponding month by one\n * - [Shift] + [Ctrl] + [Page Down] - Decrements the corresponding year by one\n * - [Page Up] - Increments the corresponding day of the month by one\n * - [Shift] + [Page Up] - Increments the corresponding month by one\n * - [Shift] + [Ctrl] + [Page Up] - Increments the corresponding year by one\n * @constructor\n * @extends DatePicker\n * @since 1.0.0-rc.8\n * @public\n */\n@customElement({\n\ttag: \"ui5-daterange-picker\",\n\tstyles: [DatePicker.styles, DateRangePickerCss],\n\ttemplate: DateRangePickerTemplate,\n\tdependencies: [...DatePicker.dependencies, CalendarDateRange],\n})\nclass DateRangePicker extends DatePicker implements IFormInputElement {\n\t /**\n\t * Determines the symbol which separates the dates.\n\t * If not supplied, the default time interval delimiter for the current locale will be used.\n\t * @default \"-\"\n\t * @public\n\t */\n\t@property()\n\tdelimiter = \"-\";\n\n\t /**\n\t * The first date in the range during selection (this is a temporary value, not the first date in the value range)\n\t * @private\n\t */\n\t@property()\n\t_tempValue?: string;\n\n\tprivate _prevDelimiter: string | null;\n\n\tget formFormattedValue() {\n\t\tconst values = this._splitValueByDelimiter(this.value || \"\").filter(Boolean);\n\n\t\tif (values.length && this.name) {\n\t\t\tconst formData = new FormData();\n\n\t\t\tfor (let i = 0; i < values.length; i++) {\n\t\t\t\tformData.append(this.name, values[i]);\n\t\t\t}\n\n\t\t\treturn formData;\n\t\t}\n\n\t\treturn this.value;\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._prevDelimiter = null;\n\t}\n\n\t/**\n\t * **Note:** The getter method is inherited and not supported. If called it will return an empty value.\n\t * @public\n\t * @default null\n\t */\n\tget dateValue(): Date | null {\n\t\treturn null;\n\t}\n\n\t/**\n\t * **Note:** The getter method is inherited and not supported. If called it will return an empty value.\n\t * @public\n\t * @default null\n\t */\n\tget dateValueUTC(): Date | null {\n\t\treturn null;\n\t}\n\n\tget _startDateTimestamp() {\n\t\treturn this._extractFirstTimestamp(this.value);\n\t}\n\n\tget _endDateTimestamp() {\n\t\treturn this._extractLastTimestamp(this.value);\n\t}\n\n\tget _tempTimestamp() {\n\t\treturn this._tempValue && (this.getFormat().parse(this._tempValue, true) as Date).getTime() / 1000;\n\t}\n\n\t/**\n\t * Required by DatePicker.js\n\t * @override\n\t */\n\tget _calendarSelectionMode(): `${CalendarSelectionMode}` {\n\t\treturn \"Range\";\n\t}\n\n\t/**\n\t * Required by DatePicker.js - set the calendar focus on the first selected date (or today if not set)\n\t * @override\n\t */\n\tget _calendarTimestamp() {\n\t\treturn this._tempTimestamp || this._startDateTimestamp || getTodayUTCTimestamp(this._primaryCalendarType);\n\t}\n\n\t/**\n\t * Required by DatePicker.js\n\t * @override\n\t */\n\tget _calendarSelectedDates() {\n\t\tif (this._tempValue) {\n\t\t\treturn [this._tempValue];\n\t\t}\n\t\tif (this.value && this._checkValueValidity(this.value)) {\n\t\t\treturn this._splitValueByDelimiter(this.value);\n\t\t}\n\t\treturn [];\n\t}\n\n\t/**\n\t * Returns the start date of the currently selected range as JavaScript Date instance.\n\t * @public\n\t * @default null\n\t */\n\tget startDateValue(): Date | null {\n\t\treturn CalendarDate.fromTimestamp(this._startDateTimestamp! * 1000).toLocalJSDate();\n\t}\n\n\t/**\n\t * Returns the end date of the currently selected range as JavaScript Date instance.\n\t * @public\n\t * @default null\n\t */\n\tget endDateValue(): Date | null {\n\t\treturn CalendarDate.fromTimestamp(this._endDateTimestamp! * 1000).toLocalJSDate();\n\t}\n\n\tget startValue(): string {\n\t\treturn this._calendarSelectedDates[0] || \"\";\n\t}\n\n\tget endValue(): string {\n\t\treturn this._calendarSelectedDates[1] || \"\";\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget _placeholder() {\n\t\treturn this.placeholder !== undefined ? this.placeholder : `${this._displayFormat} ${this._effectiveDelimiter} ${this._displayFormat}`;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget dateAriaDescription() {\n\t\treturn DateRangePicker.i18nBundle.getText(DATERANGE_DESCRIPTION);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget pickerAccessibleName() {\n\t\treturn DateRangePicker.i18nBundle.getText(DATERANGEPICKER_POPOVER_ACCESSIBLE_NAME);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tasync _onInputSubmit() {\n\t\tconst input = this._getInput();\n\t\tconst caretPos = input.getCaretPosition();\n\t\tawait renderFinished();\n\t\tinput.setCaretPosition(caretPos); // Return the caret on the previous position after rendering\n\t}\n\n\t/**\n\t * @override\n\t */\n\t onResponsivePopoverAfterClose() {\n\t\tthis._tempValue = \"\"; // reset _tempValue on popover close\n\t\tsuper.onResponsivePopoverAfterClose();\n\t}\n\n\t/**\n\t * @override\n\t */\n\tisValid(value: string): boolean {\n\t\tconst parts = this._splitValueByDelimiter(value);\n\t\treturn parts.length <= 2 && parts.every(dateString => super.isValid(dateString)); // must be at most 2 dates and each must be valid\n\t}\n\n\t/**\n\t * @override\n\t */\n\tisInValidRange(value: string): boolean {\n\t\treturn this._splitValueByDelimiter(value).every(dateString => super.isInValidRange(dateString));\n\t}\n\n\t/**\n\t * Extract both dates as timestamps, flip if necessary, and build (which will use the desired format so we enforce the format too)\n\t * @override\n\t */\n\tnormalizeValue(value: string) {\n\t\tconst firstDateTimestamp = this._extractFirstTimestamp(value);\n\t\tconst lastDateTimestamp = this._extractLastTimestamp(value);\n\t\tif (firstDateTimestamp && lastDateTimestamp && firstDateTimestamp > lastDateTimestamp) { // if both are timestamps (not undefined), flip if necessary\n\t\t\treturn this._buildValue(lastDateTimestamp, firstDateTimestamp);\n\t\t}\n\t\treturn this._buildValue(firstDateTimestamp, lastDateTimestamp);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tonSelectedDatesChange(event: CustomEvent<CalendarSelectionChangeEventDetail>) {\n\t\tevent.preventDefault(); // never let the calendar update its own dates, the parent component controls them\n\t\tconst values = event.detail.selectedValues;\n\n\t\tif (values.length === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (values.length === 1) { // Do nothing until the user selects 2 dates, we don't change any state at all for one date\n\t\t\tthis._tempValue = values[0];\n\t\t\treturn;\n\t\t}\n\t\tconst newValue = this._buildValue(event.detail.selectedDates[0], event.detail.selectedDates[1]); // the value will be normalized so we don't need to order them here\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * @override\n\t */\n\tasync _modifyDateValue(amount: number, unit: string, preserveDate?: boolean) {\n\t\tif (!this._endDateTimestamp) { // If empty or only one date -> treat as datepicker entirely\n\t\t\treturn super._modifyDateValue(amount, unit, preserveDate);\n\t\t}\n\n\t\tconst input = this._getInput();\n\t\tlet caretPos: number = input.getCaretPosition()!; // caret position is always number for input of type text;\n\t\tlet newValue: string;\n\n\t\tif (caretPos <= this.value.indexOf(this._effectiveDelimiter)) { // The user is focusing the first date -> change it and keep the second date\n\t\t\tconst startDateModified = modifyDateBy(CalendarDate.fromTimestamp(this._startDateTimestamp! * 1000), amount, unit, preserveDate, this._minDate, this._maxDate);\n\t\t\tconst newStartDateTimestamp = startDateModified.valueOf() / 1000;\n\t\t\tif (newStartDateTimestamp > this._endDateTimestamp) { // dates flipped -> move the caret to the same position but on the last date\n\t\t\t\tcaretPos += Math.ceil(this.value.length / 2);\n\t\t\t}\n\t\t\tnewValue = this._buildValue(newStartDateTimestamp, this._endDateTimestamp); // the value will be normalized so we don't try to order them here\n\t\t} else {\n\t\t\tconst endDateModified = modifyDateBy(CalendarDate.fromTimestamp(this._endDateTimestamp * 1000), amount, unit, preserveDate, this._minDate, this._maxDate);\n\t\t\tconst newEndDateTimestamp = endDateModified.valueOf() / 1000;\n\t\t\tnewValue = this._buildValue(this._startDateTimestamp, newEndDateTimestamp); // the value will be normalized so we don't try to order them here\n\t\t\tif (newEndDateTimestamp < this._startDateTimestamp!) { // dates flipped -> move the caret to the same position but on the first date\n\t\t\t\tcaretPos -= Math.ceil(this.value.length / 2);\n\t\t\t}\n\t\t}\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\n\t\tawait renderFinished();\n\t\tinput.setCaretPosition(caretPos); // Return the caret to the previous (or the adjusted, if dates flipped) position after rendering\n\t}\n\n\tget _effectiveDelimiter(): string {\n\t\treturn this.delimiter || DEFAULT_DELIMITER;\n\t}\n\n\t_splitValueByDelimiter(value: string) {\n\t\tconst valuesArray: Array<string> = [];\n\t\tconst partsArray = value.split(this._prevDelimiter || this._effectiveDelimiter);\n\n\t\t// if format successfully parse the value, the value contains only single date\n\t\tif (this.getFormat().parse(value)) {\n\t\t\tvaluesArray[0] = partsArray.join(this._effectiveDelimiter);\n\t\t\tvaluesArray[1] = \"\";\n\t\t} else {\n\t\t\tvaluesArray[0] = partsArray.slice(0, partsArray.length / 2).join(this._effectiveDelimiter);\n\t\t\tvaluesArray[1] = partsArray.slice(partsArray.length / 2).join(this._effectiveDelimiter);\n\t\t}\n\n\t\treturn valuesArray;\n\t}\n\n\t/**\n\t * Returns a UTC timestamp, representing the first date in the value string or undefined if the value is empty\n\t * @private\n\t */\n\t_extractFirstTimestamp(value: string) {\n\t\tif (!value || !this._checkValueValidity(value)) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst dateStrings = this._splitValueByDelimiter(value); // at least one item guaranteed due to the checks above (non-empty and valid)\n\n\t\tconst parsedDate = this.getFormat().parse(dateStrings[0], true) as Date;\n\t\treturn parsedDate.getTime() / 1000;\n\t}\n\n\t/**\n\t * Returns a UTC timestamp, representing the last date in the value string or undefined if the value is empty or there is just one date\n\t * @private\n\t */\n\t_extractLastTimestamp(value: string) {\n\t\tif (!value || !this._checkValueValidity(value)) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst dateStrings = this._splitValueByDelimiter(value);\n\t\tif (dateStrings[1]) {\n\t\t\tconst parsedDate = this.getFormat().parse(dateStrings[1], true) as Date;\n\t\t\treturn parsedDate.getTime() / 1000;\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\t/**\n\t * Builds a string value out of two UTC timestamps - this method is the counterpart to _extractFirstTimestamp/_extractLastTimestamp\n\t * @private\n\t */\n\t_buildValue(firstDateTimestamp: number | undefined, lastDateTimestamp: number | undefined) {\n\t\tthis._prevDelimiter = this._effectiveDelimiter;\n\t\tif (firstDateTimestamp) {\n\t\t\tconst firstDateString = this._getStringFromTimestamp(firstDateTimestamp * 1000);\n\n\t\t\tif (!lastDateTimestamp) {\n\t\t\t\treturn firstDateString;\n\t\t\t}\n\n\t\t\tconst lastDateString = this._getStringFromTimestamp(lastDateTimestamp * 1000);\n\t\t\treturn `${firstDateString} ${this._effectiveDelimiter} ${lastDateString}`;\n\t\t}\n\n\t\treturn \"\";\n\t}\n}\n\nDateRangePicker.define();\n\nexport default DateRangePicker;\nexport type {\n\tDateRangePickerChangeEventDetail,\n\tDateRangePickerInputEventDetail,\n};\n"]}

package/dist/DateRangePickerTemplate.d.ts

@@ -0,0 +1,2 @@
+import type DateRangePicker from "./DateRangePicker.js";
+export default function DateRangePickerTemplate(this: DateRangePicker): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element[];

package/dist/DateRangePickerTemplate.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+import Calendar from "./Calendar.js";
+import CalendarDateRange from "./CalendarDateRange.js";
+import DatePickerInputTemplate from "./DatePickerInputTemplate.js";
+import DatePickerPopoverTemplate from "./DatePickerPopoverTemplate.js";
+export default function DateRangePickerTemplate() {
+    return [
+        DatePickerInputTemplate.call(this),
+        DatePickerPopoverTemplate.call(this, { content }),
+    ];
+}
+function content() {
+    return (_jsx(Calendar, { id: `${this._id}-calendar`, primaryCalendarType: this._primaryCalendarType, secondaryCalendarType: this.secondaryCalendarType, formatPattern: this._formatPattern, selectionMode: this._calendarSelectionMode, minDate: this.minDate, maxDate: this.maxDate, calendarWeekNumbering: this.calendarWeekNumbering, onSelectionChange: this.onSelectedDatesChange, onShowMonthView: this.onHeaderShowMonthPress, onShowYearView: this.onHeaderShowYearPress, hideWeekNumbers: this.hideWeekNumbers, _currentPicker: this._calendarCurrentPicker, _pickersMode: this._calendarPickersMode, children: _jsx(CalendarDateRange, { startValue: this.startValue, endValue: this.endValue }) }));
+}
+//# sourceMappingURL=DateRangePickerTemplate.js.map

package/dist/DateRangePickerTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateRangePickerTemplate.js","sourceRoot":"","sources":["../src/DateRangePickerTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,QAAQ,MAAM,eAAe,CAAC;AACrC,OAAO,iBAAiB,MAAM,wBAAwB,CAAC;AAGvD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AACnE,OAAO,yBAAyB,MAAM,gCAAgC,CAAC;AAEvE,MAAM,CAAC,OAAO,UAAU,uBAAuB;IAC9C,OAAO;QACN,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;QAClC,yBAAyB,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC;KACjD,CAAC;AACH,CAAC;AAED,SAAS,OAAO;IACf,OAAO,CACN,KAAC,QAAQ,IACR,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,WAAW,EAC1B,mBAAmB,EAAE,IAAI,CAAC,oBAAoB,EAC9C,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,aAAa,EAAE,IAAI,CAAC,cAAc,EAClC,aAAa,EAAE,IAAI,CAAC,sBAAsB,EAC1C,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,iBAAiB,EAAE,IAAI,CAAC,qBAAqB,EAC7C,eAAe,EAAE,IAAI,CAAC,sBAAsB,EAC5C,cAAc,EAAE,IAAI,CAAC,qBAAqB,EAC1C,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,cAAc,EAAE,IAAI,CAAC,sBAAsB,EAC3C,YAAY,EAAE,IAAI,CAAC,oBAAoB,YAEvC,KAAC,iBAAiB,IAAC,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,GACjE,CACX,CAAC;AACH,CAAC","sourcesContent":["import Calendar from \"./Calendar.js\";\nimport CalendarDateRange from \"./CalendarDateRange.js\";\nimport type DateRangePicker from \"./DateRangePicker.js\";\n\nimport DatePickerInputTemplate from \"./DatePickerInputTemplate.js\";\nimport DatePickerPopoverTemplate from \"./DatePickerPopoverTemplate.js\";\n\nexport default function DateRangePickerTemplate(this: DateRangePicker) {\n\treturn [\n\t\tDatePickerInputTemplate.call(this),\n\t\tDatePickerPopoverTemplate.call(this, { content }),\n\t];\n}\n\nfunction content(this: DateRangePicker) {\n\treturn (\n\t\t<Calendar\n\t\t\tid={`${this._id}-calendar`}\n\t\t\tprimaryCalendarType={this._primaryCalendarType}\n\t\t\tsecondaryCalendarType={this.secondaryCalendarType}\n\t\t\tformatPattern={this._formatPattern}\n\t\t\tselectionMode={this._calendarSelectionMode}\n\t\t\tminDate={this.minDate}\n\t\t\tmaxDate={this.maxDate}\n\t\t\tcalendarWeekNumbering={this.calendarWeekNumbering}\n\t\t\tonSelectionChange={this.onSelectedDatesChange}\n\t\t\tonShowMonthView={this.onHeaderShowMonthPress}\n\t\t\tonShowYearView={this.onHeaderShowYearPress}\n\t\t\thideWeekNumbers={this.hideWeekNumbers}\n\t\t\t_currentPicker={this._calendarCurrentPicker}\n\t\t\t_pickersMode={this._calendarPickersMode}\n\t\t>\n\t\t\t<CalendarDateRange startValue={this.startValue} endValue={this.endValue} />\n\t\t</Calendar>\n\t);\n}\n"]}

package/dist/DateTimePicker.d.ts

@@ -2,6 +2,7 @@ import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delega
 import type { IFormInputElement } from "@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js";
 import "@ui5/webcomponents-icons/dist/date-time.js";
 import type ResponsivePopover from "./ResponsivePopover.js";
+import { type SegmentedButtonSelectionChangeEventDetail } from "./SegmentedButton.js";
 import type { CalendarSelectionChangeEventDetail } from "./Calendar.js";
 import DatePicker from "./DatePicker.js";
 import type { DatePickerChangeEventDetail as DateTimePickerChangeEventDetail, DatePickerInputEventDetail as DateTimePickerInputEventDetail } from "./DatePicker.js";
@@ -182,7 +183,7 @@ declare class DateTimePicker extends DatePicker implements IFormInputElement {
      * between the date and time views.
      * @param e
      */
-    _dateTimeSwitchChange(e: CustomEvent): void;
+    _dateTimeSwitchChange(e: CustomEvent<SegmentedButtonSelectionChangeEventDetail>): void;
     /**
      * @override
      */

package/dist/DateTimePicker.js

@@ -17,14 +17,15 @@ import UI5Date from "@ui5/webcomponents-localization/dist/dates/UI5Date.js";
 import DateFormat from "@ui5/webcomponents-localization/dist/DateFormat.js";
 import Button from "./Button.js";
 import ToggleButton from "./ToggleButton.js";
-import SegmentedButton from "./SegmentedButton.js";
+import SegmentedButton, {} from "./SegmentedButton.js";
+import SegmentedButtonItem from "./SegmentedButtonItem.js";
 import Calendar from "./Calendar.js";
 import DatePicker from "./DatePicker.js";
 import TimeSelectionClocks from "./TimeSelectionClocks.js";
 // i18n texts
 import { TIMEPICKER_SUBMIT_BUTTON, TIMEPICKER_CANCEL_BUTTON, DATETIME_DESCRIPTION, DATETIME_PICKER_DATE_BUTTON, DATETIME_PICKER_TIME_BUTTON, DATETIMEPICKER_POPOVER_ACCESSIBLE_NAME, } from "./generated/i18n/i18n-defaults.js";
 // Template
-import DateTimePickerTemplate from "./generated/templates/DateTimePickerTemplate.lit.js";
+import DateTimePickerTemplate from "./DateTimePickerTemplate.js";
 // Styles
 import DateTimePickerCss from "./generated/themes/DateTimePicker.css.js";
 import DateTimePickerPopoverCss from "./generated/themes/DateTimePickerPopover.css.js";
@@ -155,6 +156,7 @@ let DateTimePicker = DateTimePicker_1 = class DateTimePicker extends DatePicker
      */
     get classes() {
         return {
+            // Remove after deliting the hbs template, the classes are added in the jsx template
             picker: {
                 "ui5-dt-picker-content--phone": this.phone,
             },
@@ -289,8 +291,8 @@ let DateTimePicker = DateTimePicker_1 = class DateTimePicker extends DatePicker
      * @param e
      */
     _dateTimeSwitchChange(e) {
-        const target = e.target;
-        this._showTimeView = target.getAttribute("key") === "Time";
+        const selectedItem = e.detail.selectedItems[0];
+        this._showTimeView = selectedItem.getAttribute("data-ui5-key") === "Time";
     }
     /**
      * @override
@@ -364,6 +366,7 @@ DateTimePicker = DateTimePicker_1 = __decorate([
             Button,
             ToggleButton,
             SegmentedButton,
+            SegmentedButtonItem,
             TimeSelectionClocks,
         ],
     })

package/dist/DateTimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimePicker.js","sourceRoot":"","sources":["../src/DateTimePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport getLocale from \"@ui5/webcomponents-base/dist/locale/getLocale.js\";\nimport getCachedLocaleDataInstance from \"@ui5/webcomponents-localization/dist/getCachedLocaleDataInstance.js\";\nimport modifyDateBy from \"@ui5/webcomponents-localization/dist/dates/modifyDateBy.js\";\nimport CalendarDate from \"@ui5/webcomponents-localization/dist/dates/CalendarDate.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport \"@ui5/webcomponents-icons/dist/date-time.js\";\nimport UI5Date from \"@ui5/webcomponents-localization/dist/dates/UI5Date.js\";\nimport DateFormat from \"@ui5/webcomponents-localization/dist/DateFormat.js\";\nimport Button from \"./Button.js\";\nimport type ResponsivePopover from \"./ResponsivePopover.js\";\nimport ToggleButton from \"./ToggleButton.js\";\nimport SegmentedButton from \"./SegmentedButton.js\";\nimport Calendar from \"./Calendar.js\";\nimport type { CalendarSelectionChangeEventDetail } from \"./Calendar.js\";\nimport DatePicker from \"./DatePicker.js\";\nimport type {\n\tDatePickerChangeEventDetail as DateTimePickerChangeEventDetail,\n\tDatePickerInputEventDetail as DateTimePickerInputEventDetail,\n} from \"./DatePicker.js\";\nimport TimeSelectionClocks from \"./TimeSelectionClocks.js\";\nimport type { TimeSelectionChangeEventDetail } from \"./TimePickerInternals.js\";\n\n// i18n texts\nimport {\n\tTIMEPICKER_SUBMIT_BUTTON,\n\tTIMEPICKER_CANCEL_BUTTON,\n\tDATETIME_DESCRIPTION,\n\tDATETIME_PICKER_DATE_BUTTON,\n\tDATETIME_PICKER_TIME_BUTTON,\n\tDATETIMEPICKER_POPOVER_ACCESSIBLE_NAME,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport DateTimePickerTemplate from \"./generated/templates/DateTimePickerTemplate.lit.js\";\n\n// Styles\nimport DateTimePickerCss from \"./generated/themes/DateTimePicker.css.js\";\nimport DateTimePickerPopoverCss from \"./generated/themes/DateTimePickerPopover.css.js\";\nimport CalendarPickersMode from \"./types/CalendarPickersMode.js\";\n\nconst PHONE_MODE_BREAKPOINT = 640; // px\n\ntype PreviewValues = {\n\ttimeSelectionValue?: string,\n\tcalendarTimestamp?: number,\n\tcalendarValue?: string,\n}\n\n/**\n * @class\n *\n * ### Overview\n * The `DateTimePicker` component alows users to select both date (day, month and year) and time (hours, minutes and seconds)\n * and for the purpose it consists of input field and Date/Time picker.\n *\n * ### Usage\n *\n * Use the `DateTimePicker` if you need a combined date and time input component.\n * Don't use it if you want to use either date, or time value.\n * In this case, use the `DatePicker` or the `TimePicker` components instead.\n *\n * The user can set date/time by:\n *\n * - using the calendar and the time selectors\n * - typing in the input field\n *\n * Programmatically, to set date/time for the `DateTimePicker`, use the `value` property\n *\n * ### Formatting\n *\n * The value entered by typing into the input field must fit to the used date/time format.\n *\n * Supported format options are pattern-based on Unicode LDML Date Format notation.\n * For more information, see [UTS #35: Unicode Locale Data Markup Language](https://unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table).\n *\n * **Example:** the following format `dd/MM/yyyy, hh:mm:ss aa`\n * corresponds the `13/04/2020, 03:16:16 AM` value.\n *\n * The small 'h' defines \"12\" hours format and the \"aa\" symbols - \"AM/PM\" time periods.\n *\n * **Example:** the following format `dd/MM/yyyy, HH:mm:ss`\n * corresponds the `13/04/2020, 15:16:16` value.\n *\n * The capital 'H' indicates \"24\" hours format.\n *\n * **Note:** If the `formatPattern` does NOT include time,\n * the `DateTimePicker` will fallback to the default time format according to the locale.\n *\n * **Note:** If no placeholder is set to the `DateTimePicker`,\n * the current `formatPattern` is displayed as a placeholder.\n * If another placeholder is needed, it must be set or in case no placeholder is needed - it can be set to an empty string.\n *\n * **Note:** If the user input does NOT match the `formatPattern`,\n * the `DateTimePicker` makes an attempt to parse it based on the\n * locale settings.\n *\n * ### Responsive behavior\n *\n * The `DateTimePicker` is responsive and fully adapts to all devices.\n * For larger screens, such as tablet or desktop, it is displayed as a popover, while\n * on phone devices, it is displayed full screen.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/DateTimePicker.js\";`\n * @constructor\n * @extends DatePicker\n * @since 1.0.0-rc.7\n * @public\n */\n@customElement({\n\ttag: \"ui5-datetime-picker\",\n\ttemplate: DateTimePickerTemplate,\n\tstyles: [\n\t\tDatePicker.styles,\n\t\tDateTimePickerCss,\n\t\tDateTimePickerPopoverCss,\n\t],\n\tdependencies: [\n\t\t...DatePicker.dependencies,\n\t\tCalendar,\n\t\tButton,\n\t\tToggleButton,\n\t\tSegmentedButton,\n\t\tTimeSelectionClocks,\n\t],\n})\nclass DateTimePicker extends DatePicker implements IFormInputElement {\n\t/**\n\t * Defines the visibility of the time view in `phoneMode`.\n\t * For more information, see the `phoneMode` property.\n\t *\n\t * **Note:** The date view would be displayed by default.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean, noAttribute: true })\n\t_showTimeView = false\n\n\t/**\n\t * Defines if the `DateTimePicker` should be displayed in phone mode.\n\t * The phone mode turns on when the component is used on small screens or phone devices.\n\t * In phone mode the user can see either the calendar view, or the time view\n\t * and can switch between the views via toggle buttons.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_phoneMode = false;\n\n\t/**\n\t * Selected, but not yet confirmed date/time\n\t * @private\n\t */\n\t@property({ type: Object })\n\t_previewValues: PreviewValues = {};\n\n\t_handleResizeBound: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._handleResizeBound = this._handleResize.bind(this);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tonResponsivePopoverAfterClose() {\n\t\tsuper.onResponsivePopoverAfterClose();\n\t\tthis._showTimeView = false;\n\t\tthis._previewValues = {};\n\t}\n\n\t/**\n\t * LIFECYCLE METHODS\n\t */\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(document.body, this._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(document.body, this._handleResizeBound);\n\t}\n\n\t/**\n\t * @override\n\t * @private\n\t */\n\t_togglePicker() {\n\t\tsuper._togglePicker();\n\n\t\tif (this.open) {\n\t\t\tthis._previewValues = {\n\t\t\t\t...this._previewValues,\n\t\t\t\ttimeSelectionValue: this.value || this.getFormat().format(UI5Date.getInstance()),\n\t\t\t};\n\t\t}\n\t}\n\n\t/**\n\t * Read-only getters\n\t */\n\n\tget classes() {\n\t\treturn {\n\t\t\tpicker: {\n\t\t\t\t\"ui5-dt-picker-content--phone\": this.phone,\n\t\t\t},\n\t\t\tdateTimeView: {\n\t\t\t\t\"ui5-dt-cal--hidden\": this.phone && this.showTimeView,\n\t\t\t\t\"ui5-dt-time--hidden\": this.phone && this.showDateView,\n\t\t\t},\n\t\t\tfooter: {\n\t\t\t\t\"ui5-dt-picker-footer-time-hidden\": (this.phone && this.showTimeView) || (this.phone && this.showDateView),\n\t\t\t},\n\t\t};\n\t}\n\n\tget _formatPattern() {\n\t\tconst hasHours = !!(this.formatPattern || \"\").match(/H/i);\n\t\tconst fallback = !this.formatPattern || !hasHours;\n\n\t\tconst localeData = getCachedLocaleDataInstance(getLocale());\n\t\treturn fallback ? localeData.getCombinedDateTimePattern(\"medium\", \"medium\", this._primaryCalendarType) : (this.formatPattern || \"\");\n\t}\n\n\tget _calendarTimestamp() {\n\t\treturn this._previewValues.calendarTimestamp ? this._previewValues.calendarTimestamp : super._calendarTimestamp;\n\t}\n\n\tget _calendarSelectedDates() {\n\t\treturn this._previewValues.calendarValue ? [this._previewValues.calendarValue] : super._calendarSelectedDates;\n\t}\n\n\tget _timeSelectionValue() {\n\t\treturn this._previewValues.timeSelectionValue ? this._previewValues.timeSelectionValue : this.value;\n\t}\n\n\tget openIconName() {\n\t\treturn \"date-time\";\n\t}\n\n\tget btnOKLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(TIMEPICKER_SUBMIT_BUTTON);\n\t}\n\n\tget btnCancelLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(TIMEPICKER_CANCEL_BUTTON);\n\t}\n\n\tget btnDateLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PICKER_DATE_BUTTON);\n\t}\n\n\tget btnTimeLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PICKER_TIME_BUTTON);\n\t}\n\n\tget showFooter() {\n\t\treturn true;\n\t}\n\n\tget showDateView() {\n\t\treturn this.phone ? !this._showTimeView : true;\n\t}\n\n\tget showTimeView() {\n\t\treturn this.phone ? this._showTimeView : true;\n\t}\n\n\tget phone() {\n\t\treturn super.phone || this._phoneMode;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget dateAriaDescription() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_DESCRIPTION);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget pickerAccessibleName() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIMEPICKER_POPOVER_ACCESSIBLE_NAME);\n\t}\n\n\t/**\n\t * Defines whether the dialog on mobile should have header\n\t * @private\n\t */\n\tget _shouldHideHeader() {\n\t\treturn true;\n\t}\n\n\t/**\n\t * EVENT HANDLERS\n\t */\n\n\t/**\n\t * @override\n\t */\n\tonSelectedDatesChange(e: CustomEvent<CalendarSelectionChangeEventDetail>) {\n\t\te.preventDefault();\n\t\t// @ts-ignore Needed for FF\n\t\tconst dateTimePickerContent = e.path ? e.path[1] : e.composedPath()[1];\n\t\tthis._previewValues = {\n\t\t\t...this._previewValues,\n\t\t\tcalendarTimestamp: e.detail.timestamp,\n\t\t\tcalendarValue: e.detail.selectedValues[0],\n\t\t\ttimeSelectionValue: dateTimePickerContent.lastChild.value,\n\t\t};\n\t}\n\n\tonTimeSelectionChange(e: CustomEvent<TimeSelectionChangeEventDetail>) {\n\t\tthis._previewValues = {\n\t\t\t...this._previewValues,\n\t\t\ttimeSelectionValue: e.detail.value,\n\t\t};\n\t}\n\n\t/**\n\t * Handles document resize to switch between `phoneMode` and normal appearance.\n\t */\n\t_handleResize() {\n\t\tconst documentWidth = document.body.offsetWidth;\n\t\tconst toPhoneMode = documentWidth <= PHONE_MODE_BREAKPOINT;\n\t\tconst modeChange = (toPhoneMode && !this._phoneMode) || (!toPhoneMode && this._phoneMode); // XOR not allowed by lint\n\n\t\tif (modeChange) {\n\t\t\tthis._phoneMode = toPhoneMode;\n\t\t}\n\t}\n\n\tget _submitDisabled() {\n\t\treturn !this._calendarSelectedDates || !this._calendarSelectedDates.length;\n\t}\n\n\t/**\n\t * Handles clicking on the `submit` button, within the picker`s footer.\n\t */\n\t_submitClick() {\n\t\tconst selectedDate = this.getSelectedDateTime();\n\n\t\tconst value = this.getFormat().format(selectedDate);\n\t\tif (this.value !== value) {\n\t\t\tthis._updateValueAndFireEvents(value, true, [\"change\", \"value-changed\"]);\n\t\t}\n\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * Handles clicking on the `cancel` button, within the picker`s footer,\n\t * that would disregard the user selection.\n\t */\n\t_cancelClick() {\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * Handles the date/time switch available in `phoneMode` to switch\n\t * between the date and time views.\n\t * @param e\n\t */\n\t_dateTimeSwitchChange(e: CustomEvent) { // Note: fix when SegmentedButton is implemented in TS\n\t\tconst target = e.target as HTMLElement;\n\t\tthis._showTimeView = target.getAttribute(\"key\") === \"Time\";\n\t}\n\n\t/**\n\t * @override\n\t */\n\t_modifyDateValue(amount: number, unit: string, preserveDate: boolean) {\n\t\tif (!this.dateValue) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst modifiedDate = modifyDateBy(CalendarDate.fromLocalJSDate(this.dateValue), amount, unit, preserveDate, this._minDate, this._maxDate);\n\t\tconst modifiedLocalDate = modifiedDate.toLocalJSDate();\n\t\tmodifiedLocalDate.setHours(this.dateValue.getHours());\n\t\tmodifiedLocalDate.setMinutes(this.dateValue.getMinutes());\n\t\tmodifiedLocalDate.setSeconds(this.dateValue.getSeconds());\n\n\t\tconst newValue = this.formatValue(modifiedLocalDate);\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\t}\n\n\tgetPicker() {\n\t\treturn this.shadowRoot!.querySelector<ResponsivePopover>(\"[ui5-responsive-popover]\")!;\n\t}\n\n\tgetSelectedDateTime() {\n\t\tconst selectedDate = this.getFormat().parse(this._calendarSelectedDates[0]) as Date;\n\t\tconst selectedTime = this.getFormat().parse(this._timeSelectionValue) as Date;\n\t\tif (selectedTime) {\n\t\t\tselectedDate.setHours(selectedTime.getHours());\n\t\t\tselectedDate.setMinutes(selectedTime.getMinutes());\n\t\t\tselectedDate.setSeconds(selectedTime.getSeconds());\n\t\t}\n\n\t\treturn selectedDate;\n\t}\n\n\tgetFormat() {\n\t\treturn this._isPattern\n\t\t\t? DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: this._formatPattern,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t})\n\t\t\t: DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tstyle: this._formatPattern,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget _calendarPickersMode() {\n\t\treturn CalendarPickersMode.DAY_MONTH_YEAR;\n\t}\n}\n\nDateTimePicker.define();\n\nexport default DateTimePicker;\nexport type {\n\tDateTimePickerChangeEventDetail,\n\tDateTimePickerInputEventDetail,\n};\n"]}
+{"version":3,"file":"DateTimePicker.js","sourceRoot":"","sources":["../src/DateTimePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport getLocale from \"@ui5/webcomponents-base/dist/locale/getLocale.js\";\nimport getCachedLocaleDataInstance from \"@ui5/webcomponents-localization/dist/getCachedLocaleDataInstance.js\";\nimport modifyDateBy from \"@ui5/webcomponents-localization/dist/dates/modifyDateBy.js\";\nimport CalendarDate from \"@ui5/webcomponents-localization/dist/dates/CalendarDate.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport \"@ui5/webcomponents-icons/dist/date-time.js\";\nimport UI5Date from \"@ui5/webcomponents-localization/dist/dates/UI5Date.js\";\nimport DateFormat from \"@ui5/webcomponents-localization/dist/DateFormat.js\";\nimport Button from \"./Button.js\";\nimport type ResponsivePopover from \"./ResponsivePopover.js\";\nimport ToggleButton from \"./ToggleButton.js\";\nimport SegmentedButton, { type SegmentedButtonSelectionChangeEventDetail } from \"./SegmentedButton.js\";\nimport SegmentedButtonItem from \"./SegmentedButtonItem.js\";\nimport Calendar from \"./Calendar.js\";\nimport type { CalendarSelectionChangeEventDetail } from \"./Calendar.js\";\nimport DatePicker from \"./DatePicker.js\";\nimport type {\n\tDatePickerChangeEventDetail as DateTimePickerChangeEventDetail,\n\tDatePickerInputEventDetail as DateTimePickerInputEventDetail,\n} from \"./DatePicker.js\";\nimport TimeSelectionClocks from \"./TimeSelectionClocks.js\";\nimport type { TimeSelectionChangeEventDetail } from \"./TimePickerInternals.js\";\n\n// i18n texts\nimport {\n\tTIMEPICKER_SUBMIT_BUTTON,\n\tTIMEPICKER_CANCEL_BUTTON,\n\tDATETIME_DESCRIPTION,\n\tDATETIME_PICKER_DATE_BUTTON,\n\tDATETIME_PICKER_TIME_BUTTON,\n\tDATETIMEPICKER_POPOVER_ACCESSIBLE_NAME,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport DateTimePickerTemplate from \"./DateTimePickerTemplate.js\";\n\n// Styles\nimport DateTimePickerCss from \"./generated/themes/DateTimePicker.css.js\";\nimport DateTimePickerPopoverCss from \"./generated/themes/DateTimePickerPopover.css.js\";\nimport CalendarPickersMode from \"./types/CalendarPickersMode.js\";\n\nconst PHONE_MODE_BREAKPOINT = 640; // px\n\ntype PreviewValues = {\n\ttimeSelectionValue?: string,\n\tcalendarTimestamp?: number,\n\tcalendarValue?: string,\n}\n\n/**\n * @class\n *\n * ### Overview\n * The `DateTimePicker` component alows users to select both date (day, month and year) and time (hours, minutes and seconds)\n * and for the purpose it consists of input field and Date/Time picker.\n *\n * ### Usage\n *\n * Use the `DateTimePicker` if you need a combined date and time input component.\n * Don't use it if you want to use either date, or time value.\n * In this case, use the `DatePicker` or the `TimePicker` components instead.\n *\n * The user can set date/time by:\n *\n * - using the calendar and the time selectors\n * - typing in the input field\n *\n * Programmatically, to set date/time for the `DateTimePicker`, use the `value` property\n *\n * ### Formatting\n *\n * The value entered by typing into the input field must fit to the used date/time format.\n *\n * Supported format options are pattern-based on Unicode LDML Date Format notation.\n * For more information, see [UTS #35: Unicode Locale Data Markup Language](https://unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table).\n *\n * **Example:** the following format `dd/MM/yyyy, hh:mm:ss aa`\n * corresponds the `13/04/2020, 03:16:16 AM` value.\n *\n * The small 'h' defines \"12\" hours format and the \"aa\" symbols - \"AM/PM\" time periods.\n *\n * **Example:** the following format `dd/MM/yyyy, HH:mm:ss`\n * corresponds the `13/04/2020, 15:16:16` value.\n *\n * The capital 'H' indicates \"24\" hours format.\n *\n * **Note:** If the `formatPattern` does NOT include time,\n * the `DateTimePicker` will fallback to the default time format according to the locale.\n *\n * **Note:** If no placeholder is set to the `DateTimePicker`,\n * the current `formatPattern` is displayed as a placeholder.\n * If another placeholder is needed, it must be set or in case no placeholder is needed - it can be set to an empty string.\n *\n * **Note:** If the user input does NOT match the `formatPattern`,\n * the `DateTimePicker` makes an attempt to parse it based on the\n * locale settings.\n *\n * ### Responsive behavior\n *\n * The `DateTimePicker` is responsive and fully adapts to all devices.\n * For larger screens, such as tablet or desktop, it is displayed as a popover, while\n * on phone devices, it is displayed full screen.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/DateTimePicker.js\";`\n * @constructor\n * @extends DatePicker\n * @since 1.0.0-rc.7\n * @public\n */\n@customElement({\n\ttag: \"ui5-datetime-picker\",\n\ttemplate: DateTimePickerTemplate,\n\tstyles: [\n\t\tDatePicker.styles,\n\t\tDateTimePickerCss,\n\t\tDateTimePickerPopoverCss,\n\t],\n\tdependencies: [\n\t\t...DatePicker.dependencies,\n\t\tCalendar,\n\t\tButton,\n\t\tToggleButton,\n\t\tSegmentedButton,\n\t\tSegmentedButtonItem,\n\t\tTimeSelectionClocks,\n\t],\n})\nclass DateTimePicker extends DatePicker implements IFormInputElement {\n\t/**\n\t * Defines the visibility of the time view in `phoneMode`.\n\t * For more information, see the `phoneMode` property.\n\t *\n\t * **Note:** The date view would be displayed by default.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean, noAttribute: true })\n\t_showTimeView = false\n\n\t/**\n\t * Defines if the `DateTimePicker` should be displayed in phone mode.\n\t * The phone mode turns on when the component is used on small screens or phone devices.\n\t * In phone mode the user can see either the calendar view, or the time view\n\t * and can switch between the views via toggle buttons.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_phoneMode = false;\n\n\t/**\n\t * Selected, but not yet confirmed date/time\n\t * @private\n\t */\n\t@property({ type: Object })\n\t_previewValues: PreviewValues = {};\n\n\t_handleResizeBound: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._handleResizeBound = this._handleResize.bind(this);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tonResponsivePopoverAfterClose() {\n\t\tsuper.onResponsivePopoverAfterClose();\n\t\tthis._showTimeView = false;\n\t\tthis._previewValues = {};\n\t}\n\n\t/**\n\t * LIFECYCLE METHODS\n\t */\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(document.body, this._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(document.body, this._handleResizeBound);\n\t}\n\n\t/**\n\t * @override\n\t * @private\n\t */\n\t_togglePicker() {\n\t\tsuper._togglePicker();\n\n\t\tif (this.open) {\n\t\t\tthis._previewValues = {\n\t\t\t\t...this._previewValues,\n\t\t\t\ttimeSelectionValue: this.value || this.getFormat().format(UI5Date.getInstance()),\n\t\t\t};\n\t\t}\n\t}\n\n\t/**\n\t * Read-only getters\n\t */\n\n\tget classes() {\n\t\treturn {\n\t\t\t// Remove after deliting the hbs template, the classes are added in the jsx template\n\t\t\tpicker: {\n\t\t\t\t\"ui5-dt-picker-content--phone\": this.phone,\n\t\t\t},\n\t\t\tdateTimeView: {\n\t\t\t\t\"ui5-dt-cal--hidden\": this.phone && this.showTimeView,\n\t\t\t\t\"ui5-dt-time--hidden\": this.phone && this.showDateView,\n\t\t\t},\n\t\t\tfooter: {\n\t\t\t\t\"ui5-dt-picker-footer-time-hidden\": (this.phone && this.showTimeView) || (this.phone && this.showDateView),\n\t\t\t},\n\t\t};\n\t}\n\n\tget _formatPattern() {\n\t\tconst hasHours = !!(this.formatPattern || \"\").match(/H/i);\n\t\tconst fallback = !this.formatPattern || !hasHours;\n\n\t\tconst localeData = getCachedLocaleDataInstance(getLocale());\n\t\treturn fallback ? localeData.getCombinedDateTimePattern(\"medium\", \"medium\", this._primaryCalendarType) : (this.formatPattern || \"\");\n\t}\n\n\tget _calendarTimestamp() {\n\t\treturn this._previewValues.calendarTimestamp ? this._previewValues.calendarTimestamp : super._calendarTimestamp;\n\t}\n\n\tget _calendarSelectedDates() {\n\t\treturn this._previewValues.calendarValue ? [this._previewValues.calendarValue] : super._calendarSelectedDates;\n\t}\n\n\tget _timeSelectionValue() {\n\t\treturn this._previewValues.timeSelectionValue ? this._previewValues.timeSelectionValue : this.value;\n\t}\n\n\tget openIconName() {\n\t\treturn \"date-time\";\n\t}\n\n\tget btnOKLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(TIMEPICKER_SUBMIT_BUTTON);\n\t}\n\n\tget btnCancelLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(TIMEPICKER_CANCEL_BUTTON);\n\t}\n\n\tget btnDateLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PICKER_DATE_BUTTON);\n\t}\n\n\tget btnTimeLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PICKER_TIME_BUTTON);\n\t}\n\n\tget showFooter() {\n\t\treturn true;\n\t}\n\n\tget showDateView() {\n\t\treturn this.phone ? !this._showTimeView : true;\n\t}\n\n\tget showTimeView() {\n\t\treturn this.phone ? this._showTimeView : true;\n\t}\n\n\tget phone() {\n\t\treturn super.phone || this._phoneMode;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget dateAriaDescription() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_DESCRIPTION);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget pickerAccessibleName() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIMEPICKER_POPOVER_ACCESSIBLE_NAME);\n\t}\n\n\t/**\n\t * Defines whether the dialog on mobile should have header\n\t * @private\n\t */\n\tget _shouldHideHeader() {\n\t\treturn true;\n\t}\n\n\t/**\n\t * EVENT HANDLERS\n\t */\n\n\t/**\n\t * @override\n\t */\n\tonSelectedDatesChange(e: CustomEvent<CalendarSelectionChangeEventDetail>) {\n\t\te.preventDefault();\n\t\t// @ts-ignore Needed for FF\n\t\tconst dateTimePickerContent = e.path ? e.path[1] : e.composedPath()[1];\n\t\tthis._previewValues = {\n\t\t\t...this._previewValues,\n\t\t\tcalendarTimestamp: e.detail.timestamp,\n\t\t\tcalendarValue: e.detail.selectedValues[0],\n\t\t\ttimeSelectionValue: dateTimePickerContent.lastChild.value,\n\t\t};\n\t}\n\n\tonTimeSelectionChange(e: CustomEvent<TimeSelectionChangeEventDetail>) {\n\t\tthis._previewValues = {\n\t\t\t...this._previewValues,\n\t\t\ttimeSelectionValue: e.detail.value,\n\t\t};\n\t}\n\n\t/**\n\t * Handles document resize to switch between `phoneMode` and normal appearance.\n\t */\n\t_handleResize() {\n\t\tconst documentWidth = document.body.offsetWidth;\n\t\tconst toPhoneMode = documentWidth <= PHONE_MODE_BREAKPOINT;\n\t\tconst modeChange = (toPhoneMode && !this._phoneMode) || (!toPhoneMode && this._phoneMode); // XOR not allowed by lint\n\n\t\tif (modeChange) {\n\t\t\tthis._phoneMode = toPhoneMode;\n\t\t}\n\t}\n\n\tget _submitDisabled() {\n\t\treturn !this._calendarSelectedDates || !this._calendarSelectedDates.length;\n\t}\n\n\t/**\n\t * Handles clicking on the `submit` button, within the picker`s footer.\n\t */\n\t_submitClick() {\n\t\tconst selectedDate = this.getSelectedDateTime();\n\n\t\tconst value = this.getFormat().format(selectedDate);\n\t\tif (this.value !== value) {\n\t\t\tthis._updateValueAndFireEvents(value, true, [\"change\", \"value-changed\"]);\n\t\t}\n\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * Handles clicking on the `cancel` button, within the picker`s footer,\n\t * that would disregard the user selection.\n\t */\n\t_cancelClick() {\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * Handles the date/time switch available in `phoneMode` to switch\n\t * between the date and time views.\n\t * @param e\n\t */\n\t_dateTimeSwitchChange(e: CustomEvent<SegmentedButtonSelectionChangeEventDetail>) { // Note: fix when SegmentedButton is implemented in TS\n\t\tconst selectedItem = e.detail.selectedItems[0];\n\t\tthis._showTimeView = selectedItem.getAttribute(\"data-ui5-key\") === \"Time\";\n\t}\n\n\t/**\n\t * @override\n\t */\n\t_modifyDateValue(amount: number, unit: string, preserveDate: boolean) {\n\t\tif (!this.dateValue) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst modifiedDate = modifyDateBy(CalendarDate.fromLocalJSDate(this.dateValue), amount, unit, preserveDate, this._minDate, this._maxDate);\n\t\tconst modifiedLocalDate = modifiedDate.toLocalJSDate();\n\t\tmodifiedLocalDate.setHours(this.dateValue.getHours());\n\t\tmodifiedLocalDate.setMinutes(this.dateValue.getMinutes());\n\t\tmodifiedLocalDate.setSeconds(this.dateValue.getSeconds());\n\n\t\tconst newValue = this.formatValue(modifiedLocalDate);\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\t}\n\n\tgetPicker() {\n\t\treturn this.shadowRoot!.querySelector<ResponsivePopover>(\"[ui5-responsive-popover]\")!;\n\t}\n\n\tgetSelectedDateTime() {\n\t\tconst selectedDate = this.getFormat().parse(this._calendarSelectedDates[0]) as Date;\n\t\tconst selectedTime = this.getFormat().parse(this._timeSelectionValue) as Date;\n\t\tif (selectedTime) {\n\t\t\tselectedDate.setHours(selectedTime.getHours());\n\t\t\tselectedDate.setMinutes(selectedTime.getMinutes());\n\t\t\tselectedDate.setSeconds(selectedTime.getSeconds());\n\t\t}\n\n\t\treturn selectedDate;\n\t}\n\n\tgetFormat() {\n\t\treturn this._isPattern\n\t\t\t? DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: this._formatPattern,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t})\n\t\t\t: DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tstyle: this._formatPattern,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget _calendarPickersMode() {\n\t\treturn CalendarPickersMode.DAY_MONTH_YEAR;\n\t}\n}\n\nDateTimePicker.define();\n\nexport default DateTimePicker;\nexport type {\n\tDateTimePickerChangeEventDetail,\n\tDateTimePickerInputEventDetail,\n};\n"]}

package/dist/DateTimePickerTemplate.d.ts

@@ -0,0 +1,2 @@
+import type DateTimePicker from "./DateTimePicker.js";
+export default function DateTimePickerTemplate(this: DateTimePicker): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element[];

package/dist/DateTimePickerTemplate.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ui5/webcomponents-base/jsx-runtime";
+import DatePickerInputTemplate from "./DatePickerInputTemplate.js";
+import DatePickerPopoverTemplate from "./DatePickerPopoverTemplate.js";
+import Button from "./Button.js";
+import Calendar from "./Calendar.js";
+import CalendarDate from "./CalendarDate.js";
+import SegmentedButton from "./SegmentedButton.js";
+import SegmentedButtonItem from "./SegmentedButtonItem.js";
+import TimeSelectionClocks from "./TimeSelectionClocks.js";
+export default function DateTimePickerTemplate() {
+    return [
+        DatePickerInputTemplate.call(this),
+        DatePickerPopoverTemplate.call(this, { header, content, footer }),
+    ];
+}
+function header() {
+    return (_jsx(_Fragment, { children: this.phone &&
+            _jsx("div", { class: "ui5-dt-picker-header", children: _jsxs(SegmentedButton, { class: "ui5-dt-picker-toggle-button", onSelectionChange: this._dateTimeSwitchChange, children: [_jsx(SegmentedButtonItem, { "data-ui5-key": "Date", selected: this.showDateView, children: this.btnDateLabel }), _jsx(SegmentedButtonItem, { "data-ui5-key": "Time", selected: this.showTimeView, children: this.btnTimeLabel })] }) }) }));
+}
+function content() {
+    return (_jsxs("div", { class: {
+            "ui5-dt-picker-content": true,
+            "ui5-dt-picker-content--phone": this.phone,
+        }, children: [_jsx(Calendar, { class: {
+                    "ui5-dt-cal": true,
+                    "ui5-dt-cal--hidden": this.phone && this.showTimeView,
+                    "ui5-dt-time--hidden": this.phone && this.showDateView,
+                }, id: `${this._id}-calendar`, primaryCalendarType: this._primaryCalendarType, secondaryCalendarType: this.secondaryCalendarType, formatPattern: this._formatPattern, selectionMode: this._calendarSelectionMode, minDate: this.minDate, maxDate: this.maxDate, calendarWeekNumbering: this.calendarWeekNumbering, onSelectionChange: this.onSelectedDatesChange, onShowMonthView: this.onHeaderShowMonthPress, onShowYearView: this.onHeaderShowYearPress, hideWeekNumbers: this.hideWeekNumbers, _currentPicker: this._calendarCurrentPicker, children: this._calendarSelectedDates.map(date => _jsx(CalendarDate, { value: date })) }), !this.phone && _jsx("span", { class: "ui5-dt-picker-separator" }), this.showTimeView &&
+                _jsx(TimeSelectionClocks, { id: `${this._id}-time-sel`, class: {
+                        "ui5-dt-time": true,
+                        ...this.classes.dateTimeView,
+                    }, formatPattern: this._formatPattern, value: this._timeSelectionValue, onChange: this.onTimeSelectionChange, _calendarType: this._primaryCalendarType })] }));
+}
+function footer() {
+    return (_jsxs("div", { slot: "footer", class: {
+            "ui5-dt-picker-footer": true,
+            "ui5-dt-picker-footer-time-hidden": (this.phone && this.showTimeView) || (this.phone && this.showDateView)
+        }, children: [_jsx(Button, { id: "ok", class: "ui5-dt-picker-action", design: "Emphasized", disabled: this._submitDisabled, onClick: this._submitClick, children: this.btnOKLabel }), _jsx(Button, { id: "cancel", class: "ui5-dt-picker-action", design: "Transparent", onClick: this._cancelClick, children: this.btnCancelLabel })] }));
+}
+//# sourceMappingURL=DateTimePickerTemplate.js.map

package/dist/DateTimePickerTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimePickerTemplate.js","sourceRoot":"","sources":["../src/DateTimePickerTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import DatePickerInputTemplate from \"./DatePickerInputTemplate.js\";\nimport DatePickerPopoverTemplate from \"./DatePickerPopoverTemplate.js\";\n\nimport type DateTimePicker from \"./DateTimePicker.js\";\nimport Button from \"./Button.js\";\nimport Calendar from \"./Calendar.js\";\nimport CalendarDate from \"./CalendarDate.js\";\nimport SegmentedButton from \"./SegmentedButton.js\";\nimport SegmentedButtonItem from \"./SegmentedButtonItem.js\";\nimport TimeSelectionClocks from \"./TimeSelectionClocks.js\";\n\nexport default function DateTimePickerTemplate(this: DateTimePicker) {\n\treturn [\n\t\tDatePickerInputTemplate.call(this),\n\t\tDatePickerPopoverTemplate.call(this, { header, content, footer }),\n\t];\n}\n\nfunction header(this: DateTimePicker) {\n\treturn (\n\t\t<>\n\t\t\t{ this.phone &&\n\t\t\t\t<div class=\"ui5-dt-picker-header\">\n\t\t\t\t\t<SegmentedButton class=\"ui5-dt-picker-toggle-button\" onSelectionChange={this._dateTimeSwitchChange}>\n\t\t\t\t\t\t<SegmentedButtonItem data-ui5-key=\"Date\" selected={this.showDateView}>{this.btnDateLabel}</SegmentedButtonItem>\n\t\t\t\t\t\t<SegmentedButtonItem data-ui5-key=\"Time\" selected={this.showTimeView}>{this.btnTimeLabel}</SegmentedButtonItem>\n\t\t\t\t\t</SegmentedButton>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</>\n\t);\n}\n\nfunction content(this: DateTimePicker) {\n\treturn (\n\t\t<div class={{\n\t\t\t\"ui5-dt-picker-content\": true,\n\t\t\t\"ui5-dt-picker-content--phone\": this.phone,\n\t\t}}>\n\t\t\t<Calendar\n\t\t\t\tclass={{\n\t\t\t\t\t\"ui5-dt-cal\": true,\n\t\t\t\t\t\"ui5-dt-cal--hidden\": this.phone && this.showTimeView,\n\t\t\t\t\t\"ui5-dt-time--hidden\": this.phone && this.showDateView,\n\t\t\t\t}}\n\t\t\t\tid={`${this._id}-calendar`}\n\t\t\t\tprimaryCalendarType={this._primaryCalendarType}\n\t\t\t\tsecondaryCalendarType={this.secondaryCalendarType}\n\t\t\t\tformatPattern={this._formatPattern}\n\t\t\t\tselectionMode={this._calendarSelectionMode}\n\t\t\t\tminDate={this.minDate}\n\t\t\t\tmaxDate={this.maxDate}\n\t\t\t\tcalendarWeekNumbering={this.calendarWeekNumbering}\n\t\t\t\tonSelectionChange={this.onSelectedDatesChange}\n\t\t\t\tonShowMonthView={this.onHeaderShowMonthPress}\n\t\t\t\tonShowYearView={this.onHeaderShowYearPress}\n\t\t\t\thideWeekNumbers={this.hideWeekNumbers}\n\t\t\t\t_currentPicker={this._calendarCurrentPicker}\n\t\t\t>\n\t\t\t\t{this._calendarSelectedDates.map(date =>\n\t\t\t\t\t<CalendarDate value={date} />\n\t\t\t\t)}\n\t\t\t</Calendar>\n\n\t\t\t{ !this.phone && <span class=\"ui5-dt-picker-separator\"></span> }\n\n\t\t\t{ this.showTimeView &&\n\t\t\t\t<TimeSelectionClocks\n\t\t\t\t\tid={`${this._id}-time-sel`}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t\"ui5-dt-time\": true,\n\t\t\t\t\t\t...this.classes.dateTimeView,\n\t\t\t\t\t}}\n\t\t\t\t\tformatPattern={this._formatPattern}\n\t\t\t\t\tvalue={this._timeSelectionValue}\n\t\t\t\t\tonChange={this.onTimeSelectionChange}\n\t\t\t\t\t_calendarType={this._primaryCalendarType}\n\t\t\t\t/>\n\t\t\t}\n\t\t</div>\n\t);\n}\n\nfunction footer(this: DateTimePicker) {\n\treturn (\n\t\t<div\n\t\t\tslot=\"footer\"\n\t\t\tclass={{\n\t\t\t\t\"ui5-dt-picker-footer\": true,\n\t\t\t\t\"ui5-dt-picker-footer-time-hidden\": (this.phone && this.showTimeView) || (this.phone && this.showDateView)\n\t\t\t}}>\n\t\t\t<Button\n\t\t\t\tid=\"ok\"\n\t\t\t\tclass=\"ui5-dt-picker-action\"\n\t\t\t\tdesign=\"Emphasized\"\n\t\t\t\tdisabled={this._submitDisabled}\n\t\t\t\tonClick={this._submitClick}\n\t\t\t>\n\t\t\t\t{this.btnOKLabel}\n\t\t\t</Button>\n\n\t\t\t<Button\n\t\t\t\tid=\"cancel\"\n\t\t\t\tclass=\"ui5-dt-picker-action\"\n\t\t\t\tdesign=\"Transparent\"\n\t\t\t\tonClick={this._cancelClick}\n\t\t\t>\n\t\t\t\t{this.btnCancelLabel}\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n"]}

package/dist/DayPicker.d.ts

@@ -13,13 +13,13 @@ type Day = {
     timestamp: string;
     day: number;
     focusRef: boolean;
-    _tabIndex: string;
+    _tabIndex: number;
     selected: boolean;
     _isSecondaryCalendarType: boolean;
     classes: string;
     ariaLabel: string;
-    ariaSelected: string;
-    ariaDisabled: string | undefined;
+    ariaSelected: boolean;
+    ariaDisabled: boolean | undefined;
     disabled: boolean;
     secondDay?: number;
     weekNum?: number;
@@ -48,7 +48,7 @@ type DayPickerNavigateEventDetail = {
  * @private
  */
 declare class DayPicker extends CalendarPart implements ICalendarPicker {
-    eventDetails: {
+    eventDetails: CalendarPart["eventDetails"] & {
         "change": DayPickerChangeEventDetail;
         "navigate": DayPickerNavigateEventDetail;
     };
@@ -218,12 +218,6 @@ declare class DayPicker extends CalendarPart implements ICalendarPicker {
     _updateSecondTimestamp(): void;
     get _specialCalendarDates(): SpecialCalendarDateT[];
     get shouldHideWeekNumbers(): boolean;
-    get classes(): {
-        root: {
-            "ui5-dp-root": boolean;
-            "ui5-dp-twocalendartypes": boolean;
-        };
-    };
     _isWeekend(oDate: CalendarDate): boolean;
     _isDayPressed(target: HTMLElement): boolean;
     _getSecondaryDay(tempDate: CalendarDate): CalendarDate;

package/dist/DayPicker.js

@@ -23,7 +23,7 @@ import CalendarSelectionMode from "./types/CalendarSelectionMode.js";
 import CalendarPart from "./CalendarPart.js";
 import { DAY_PICKER_WEEK_NUMBER_TEXT, DAY_PICKER_NON_WORKING_DAY, DAY_PICKER_TODAY, LIST_ITEM_SELECTED, } from "./generated/i18n/i18n-defaults.js";
 // Template
-import DayPickerTemplate from "./generated/templates/DayPickerTemplate.lit.js";
+import DayPickerTemplate from "./DayPickerTemplate.js";
 // Styles
 import dayPickerCSS from "./generated/themes/DayPicker.css.js";
 const isBetween = (x, num1, num2) => x > Math.min(num1, num2) && x < Math.max(num1, num2);
@@ -134,15 +134,15 @@ let DayPicker = DayPicker_1 = class DayPicker extends CalendarPart {
             const day = {
                 timestamp: timestamp.toString(),
                 focusRef: isFocused,
-                _tabIndex: isFocused ? "0" : "-1",
+                _tabIndex: isFocused ? 0 : -1,
                 selected: isSelected || isSelectedBetween,
                 day: tempDate.getDate(),
                 secondDay: this.hasSecondaryCalendarType ? tempSecondDate.getDate() : undefined,
                 _isSecondaryCalendarType: this.hasSecondaryCalendarType,
                 classes: `ui5-dp-item ui5-dp-wday${dayOfTheWeek}`,
                 ariaLabel,
-                ariaSelected: String(isSelected || isSelectedBetween),
-                ariaDisabled: isDisabled || isOtherMonth ? "true" : undefined,
+                ariaSelected: isSelected || isSelectedBetween,
+                ariaDisabled: isDisabled || isOtherMonth,
                 disabled: isDisabled,
                 type: specialDayType,
                 parts: "day-cell",
@@ -592,14 +592,6 @@ let DayPicker = DayPicker_1 = class DayPicker extends CalendarPart {
         }
         return this.hideWeekNumbers;
     }
-    get classes() {
-        return {
-            root: {
-                "ui5-dp-root": true,
-                "ui5-dp-twocalendartypes": this.hasSecondaryCalendarType,
-            },
-        };
-    }
     _isWeekend(oDate) {
         const localeData = getCachedLocaleDataInstance(getLocale());
         const iWeekDay = oDate.getDay(), iWeekendStart = localeData.getWeekendStart(), iWeekendEnd = localeData.getWeekendEnd();