@ui5/webcomponents 2.11.0 → 2.12.0-rc.1

package/dist/DynamicDateRange.d.ts

@@ -19,9 +19,6 @@ type DynamicDateRangeValue = {
      */
     values?: Date[] | number[];
 };
-type DynamicDateRangeChangeEventDetail = {
-    value: DynamicDateRangeValue | undefined;
-};
 /**
  * Represents a dynamic date range option used by the `ui5-dynamic-date-range` component.
  *
@@ -44,7 +41,7 @@ type DynamicDateRangeChangeEventDetail = {
  * - `isValidString(value: string): boolean`: Validates whether a given string is a valid representation of the dynamic date range value.
  *
  * @public
- * @since 2.10.0
+ * @since 2.11.0
  */
 interface IDynamicDateRangeOption {
     icon: string;
@@ -58,12 +55,42 @@ interface IDynamicDateRangeOption {
     isValidString: (value: string) => boolean;
 }
 /**
- * Fired when the input operation has finished by pressing Enter or on focusout or a value is selected in the popover.
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-dynamic-date-range` component provides a flexible interface to define date ranges using a combination of absolute dates, relative intervals, and preset ranges (e.g., "Today", "Yesterday", etc.).
+ * It allows users to select a date range from a predefined set of options or enter custom dates.
+ *
+ * ### Usage
+ *
+ * The component is typically used in scenarios where users need to filter data based on date ranges, such as in reports, dashboards, or data analysis tools.
+ * It can be used with the predefined options or extended with custom options to suit specific requirements. You can create your own options by extending the `IDynamicDateRangeOption` interface.
+ * Every option should be registered using the `DynamicDateRange.register` method.
+ *
+ * If needed, you can also create a range of dates based on specific option using the `toDates` method.
+ *
+ * ### Standard Options
+ *
+ * The component comes with a set of standard options, including:
+ * - "TODAY" - Represents the current date. An example value is `{ operator: "TODAY"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Today.js";`
+ * - "YESTERDAY" - Represents the previous date. An example value is `{ operator: "YESTERDAY"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Yesterday.js";`
+ * - "TOMORROW" - Represents the next date. An example value is `{ operator: "TOMORROW"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Tomorrow.js";`
+ * - "DATE" - Represents a single date. An example value is `{ operator: "DATE", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/SingleDate.js";`
+ * - "DATERANGE" - Represents a range of dates. An example value is `{ operator: "DATERANGE", values: [new Date(), new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/DateRange.js";`
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/DynamicDateRange.js";`
+ *
+ * @constructor
+ * @extends UI5Element
  * @public
+ * @since 2.11.0
  */
 declare class DynamicDateRange extends UI5Element {
     eventDetails: {
-        change: DynamicDateRangeChangeEventDetail;
+        change: void;
     };
     static i18nBundle: I18nBundle;
     /**
@@ -107,6 +134,8 @@ declare class DynamicDateRange extends UI5Element {
     /**
      * Converts a `value` into concrete `startDate` and `endDate` JavaScript `Date` objects.
      *
+     * @public
+     * @param value The option to convert into an array of date ranges
      * @returns An array of two `Date` objects representing the start and end dates.
      */
     toDates(value: DynamicDateRangeValue): Date[];
@@ -130,4 +159,4 @@ declare class DynamicDateRange extends UI5Element {
     static getOptionClass(operator: string): (new () => IDynamicDateRangeOption) | undefined;
 }
 export default DynamicDateRange;
-export type { DynamicDateRangeValue, IDynamicDateRangeOption, DynamicDateRangeChangeEventDetail, };
+export type { DynamicDateRangeValue, IDynamicDateRangeOption, };

package/dist/DynamicDateRange.js

@@ -24,8 +24,38 @@ import dynamicDateRangeCss from "./generated/themes/DynamicDateRange.css.js";
 import dynamicDateRangePopoverCss from "./generated/themes/DynamicDateRangePopover.css.js";
 import ResponsivePopoverCommonCss from "./generated/themes/ResponsivePopoverCommon.css.js";
 /**
- * Fired when the input operation has finished by pressing Enter or on focusout or a value is selected in the popover.
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-dynamic-date-range` component provides a flexible interface to define date ranges using a combination of absolute dates, relative intervals, and preset ranges (e.g., "Today", "Yesterday", etc.).
+ * It allows users to select a date range from a predefined set of options or enter custom dates.
+ *
+ * ### Usage
+ *
+ * The component is typically used in scenarios where users need to filter data based on date ranges, such as in reports, dashboards, or data analysis tools.
+ * It can be used with the predefined options or extended with custom options to suit specific requirements. You can create your own options by extending the `IDynamicDateRangeOption` interface.
+ * Every option should be registered using the `DynamicDateRange.register` method.
+ *
+ * If needed, you can also create a range of dates based on specific option using the `toDates` method.
+ *
+ * ### Standard Options
+ *
+ * The component comes with a set of standard options, including:
+ * - "TODAY" - Represents the current date. An example value is `{ operator: "TODAY"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Today.js";`
+ * - "YESTERDAY" - Represents the previous date. An example value is `{ operator: "YESTERDAY"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Yesterday.js";`
+ * - "TOMORROW" - Represents the next date. An example value is `{ operator: "TOMORROW"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Tomorrow.js";`
+ * - "DATE" - Represents a single date. An example value is `{ operator: "DATE", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/SingleDate.js";`
+ * - "DATERANGE" - Represents a range of dates. An example value is `{ operator: "DATERANGE", values: [new Date(), new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/DateRange.js";`
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/DynamicDateRange.js";`
+ *
+ * @constructor
+ * @extends UI5Element
  * @public
+ * @since 2.11.0
  */
 let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5Element {
     constructor() {
@@ -110,13 +140,13 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
         const value = e.target?.value;
         if (!value) {
             this.value = undefined;
-            this.fireDecoratorEvent("change", { value: undefined });
+            this.fireDecoratorEvent("change");
             return;
         }
         const currentOption = this.optionsObjects.find(option => option.isValidString(value));
         this.value = currentOption ? this.getOption(currentOption.operator)?.parse(value) : undefined;
         if (this.value) {
-            this.fireDecoratorEvent("change", { value: this.value });
+            this.fireDecoratorEvent("change");
         }
     }
     onButtonBackClick() {
@@ -125,6 +155,8 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
     /**
      * Converts a `value` into concrete `startDate` and `endDate` JavaScript `Date` objects.
      *
+     * @public
+     * @param value The option to convert into an array of date ranges
      * @returns An array of two `Date` objects representing the start and end dates.
      */
     toDates(value) {
@@ -140,7 +172,7 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
         }
         if (this._currentOption?.isValidString(stringValue)) {
             this.value = this.currentValue;
-            this.fireDecoratorEvent("change", { value: this.value });
+            this.fireDecoratorEvent("change");
         }
         else {
             this.value = undefined;
@@ -236,44 +268,6 @@ __decorate([
     i18n("@ui5/webcomponents")
 ], DynamicDateRange, "i18nBundle", void 0);
 DynamicDateRange = DynamicDateRange_1 = __decorate([
-    event("change", {
-        bubbles: true,
-        cancelable: true,
-    })
-    /**
-     * @class
-     *
-     * ### Overview
-     *
-     * The `ui5-dynamic-date-range` component provides a flexible interface to define date ranges using a combination of absolute dates, relative intervals, and preset ranges (e.g., "Today", "Yesterday", etc.).
-     * It allows users to select a date range from a predefined set of options or enter custom dates.
-     *
-     * ### Usage
-     *
-     * The component is typically used in scenarios where users need to filter data based on date ranges, such as in reports, dashboards, or data analysis tools.
-     * It can be used with the predefined options or extended with custom options to suit specific requirements. You can create your own options by extending the `IDynamicDateRangeOption` interface.
-     * Every option should be registered using the `DynamicDateRange.register` method.
-     *
-     * If needed, you can also create a range of dates based on specific option using the `toDates` method.
-     *
-     * ### Standard Options
-     *
-     * The component comes with a set of standard options, including:
-     * - "TODAY" - Represents the current date. An example value is `{ operator: "TODAY"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Today.js";`
-     * - "YESTERDAY" - Represents the previous date. An example value is `{ operator: "YESTERDAY"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Yesterday.js";`
-     * - "TOMORROW" - Represents the next date. An example value is `{ operator: "TOMORROW"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Tomorrow.js";`
-     * - "DATE" - Represents a single date. An example value is `{ operator: "DATE", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/SingleDate.js";`
-     * - "DATERANGE" - Represents a range of dates. An example value is `{ operator: "DATERANGE", values: [new Date(), new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/DateRange.js";`
-     *
-     * ### ES6 Module Import
-     *
-     * `import "@ui5/webcomponents/dist/DynamicDateRange.js";`
-     *
-     * @constructor
-     * @extends UI5Element
-     * @public
-     */
-    ,
     customElement({
         tag: "ui5-dynamic-date-range",
         languageAware: true,
@@ -285,6 +279,15 @@ DynamicDateRange = DynamicDateRange_1 = __decorate([
             dynamicDateRangePopoverCss,
         ],
     })
+    /**
+     * Fired when the input operation has finished by pressing Enter or on focusout or a value is selected in the popover.
+     * @public
+     */
+    ,
+    event("change", {
+        bubbles: true,
+        cancelable: true,
+    })
 ], DynamicDateRange);
 DynamicDateRange.define();
 export default DynamicDateRange;

package/dist/DynamicDateRange.js.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicDateRange.js","sourceRoot":"","sources":["../src/DynamicDateRange.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport query from \"@ui5/webcomponents-base/dist/decorators/query.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type { JsxTemplate } from \"@ui5/webcomponents-base\";\nimport { isF4, isShow } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport DynamicDateRangeTemplate from \"./DynamicDateRangeTemplate.js\";\nimport IconMode from \"./types/IconMode.js\";\nimport type Input from \"./Input.js\";\nimport {\n\tDYNAMIC_DATE_RANGE_SELECTED_TEXT,\n\tDYNAMIC_DATE_RANGE_EMPTY_SELECTED_TEXT,\n\tDYNAMIC_DATE_RANGE_NAVIGATION_ICON_TOOLTIP,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// default calendar for bundling\nimport \"@ui5/webcomponents-localization/dist/features/calendar/Gregorian.js\";\n\n// Styles\nimport dynamicDateRangeCss from \"./generated/themes/DynamicDateRange.css.js\";\nimport dynamicDateRangePopoverCss from \"./generated/themes/DynamicDateRangePopover.css.js\";\nimport ResponsivePopoverCommonCss from \"./generated/themes/ResponsivePopoverCommon.css.js\";\nimport type List from \"./List.js\";\nimport type ListItem from \"./ListItem.js\";\n\ntype DynamicDateRangeValue = {\n\t/**\n\t * The key of the option.\n\t * @default \"\"\n\t * @public\n\t */\n\toperator: string;\n\n    /**\n     * Values of the dynamic date range.\n     * @default []\n     * @public\n     */\n    values?: Date[] | number[];\n}\n\ntype DynamicDateRangeChangeEventDetail = {\n\tvalue: DynamicDateRangeValue | undefined,\n}\n\n/**\n * Represents a dynamic date range option used by the `ui5-dynamic-date-range` component.\n *\n * Represents a dynamic date range option used for handling dynamic date ranges.\n * This interface defines the structure and behavior required for implementing\n * dynamic date range options, including formatting, parsing, validation, and\n * conversion of date range values.\n *\n *  * Properties:\n * - `icon`: The icon associated with the dynamic date range option, typically used for UI representation.\n * - `operator`: A unique operator identifying the dynamic date range option.\n * - `text`: The display text for the dynamic date range option.\n * - `template` (optional): A JSX template for rendering the dynamic date range option.\n *\n * Methods:\n * - `format(value: DynamicDateRangeValue): string`: Formats the given dynamic date range value into a string representation.\n * - `parse(value: string): DynamicDateRangeValue | undefined`: Parses a string into a dynamic date range value.\n * - `toDates(value: DynamicDateRangeValue): Date[]`: Converts a dynamic date range value into an array of `Date` objects.\n * - `handleSelectionChange?(event: CustomEvent): DynamicDateRangeValue | undefined`: (Optional) Handles selection changes in the UI of the dynamic date range option.\n * - `isValidString(value: string): boolean`: Validates whether a given string is a valid representation of the dynamic date range value.\n *\n * @public\n * @since 2.10.0\n */\ninterface IDynamicDateRangeOption {\n\ticon: string;\n\toperator: string;\n\ttext: string;\n\tformat: (value: DynamicDateRangeValue) => string;\n\tparse: (value: string) => DynamicDateRangeValue | undefined;\n\ttoDates: (value: DynamicDateRangeValue) => Date[];\n\thandleSelectionChange?: (event: CustomEvent) => DynamicDateRangeValue | undefined;\n\ttemplate?: JsxTemplate;\n\tisValidString: (value: string) => boolean;\n}\n\n/**\n * Fired when the input operation has finished by pressing Enter or on focusout or a value is selected in the popover.\n * @public\n */\n@event(\"change\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-dynamic-date-range` component provides a flexible interface to define date ranges using a combination of absolute dates, relative intervals, and preset ranges (e.g., \"Today\", \"Yesterday\", etc.).\n * It allows users to select a date range from a predefined set of options or enter custom dates.\n *\n * ### Usage\n *\n * The component is typically used in scenarios where users need to filter data based on date ranges, such as in reports, dashboards, or data analysis tools.\n * It can be used with the predefined options or extended with custom options to suit specific requirements. You can create your own options by extending the `IDynamicDateRangeOption` interface.\n * Every option should be registered using the `DynamicDateRange.register` method.\n *\n * If needed, you can also create a range of dates based on specific option using the `toDates` method.\n *\n * ### Standard Options\n *\n * The component comes with a set of standard options, including:\n * - \"TODAY\" - Represents the current date. An example value is `{ operator: \"TODAY\"}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/Today.js\";`\n * - \"YESTERDAY\" - Represents the previous date. An example value is `{ operator: \"YESTERDAY\"}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/Yesterday.js\";`\n * - \"TOMORROW\" - Represents the next date. An example value is `{ operator: \"TOMORROW\"}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/Tomorrow.js\";`\n * - \"DATE\" - Represents a single date. An example value is `{ operator: \"DATE\", values: [new Date()]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/SingleDate.js\";`\n * - \"DATERANGE\" - Represents a range of dates. An example value is `{ operator: \"DATERANGE\", values: [new Date(), new Date()]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/DateRange.js\";`\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/DynamicDateRange.js\";`\n *\n * @constructor\n * @extends UI5Element\n * @public\n */\n\n@customElement({\n\ttag: \"ui5-dynamic-date-range\",\n\tlanguageAware: true,\n\ttemplate: DynamicDateRangeTemplate,\n\trenderer: jsxRenderer,\n\tstyles: [\n\t\tdynamicDateRangeCss,\n\t\tResponsivePopoverCommonCss,\n\t\tdynamicDateRangePopoverCss,\n\t],\n})\n\nclass DynamicDateRange extends UI5Element {\n\teventDetails!: {\n\t\tchange: DynamicDateRangeChangeEventDetail,\n\t}\n\n    @i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/**\n\t * Defines the value object.\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ noAttribute: true })\n\tvalue?: DynamicDateRangeValue;\n\n\t/**\n\t * Defines the options listed as a string, separated by commas and using capital case.\n\t * Example: \"TODAY, YESTERDAY, DATERANGE\"\n\t * @public\n\t * @default \"\"\n\t */\n\t@property({ type: String })\n\toptions = \"\";\n\n\t/**\n\t * Defines the open or closed state of the popover.\n\t * @private\n\t * @default false\n\t */\n\t@property({ type: Boolean })\n\topen = false;\n\n    @property({ type: Object })\n    _currentOption?: IDynamicDateRangeOption;\n\n\t@property({ type: Object })\n    currentValue?: DynamicDateRangeValue;\n\n\toptionsObjects: IDynamicDateRangeOption[] = [];\n\n\tstatic optionsClasses: Map<string, new () => IDynamicDateRangeOption> = new Map();\n\n\t@query(\"[ui5-input]\")\n\t_input?: Input;\n\n\t@query(\"[ui5-list]\")\n\t_list?: List;\n\n\tonBeforeRendering() {\n\t\tconst optionKeys = this.options.split(\",\").map(option => option.trim());\n\n\t\tthis.optionsObjects = optionKeys.map(option => {\n\t\t\tconst OptionClass = DynamicDateRange.getOptionClass(option);\n\t\t\tlet optionObject;\n\n\t\t\tif (OptionClass) {\n\t\t\t\toptionObject = new OptionClass();\n\t\t\t}\n\n\t\t\treturn optionObject;\n\t\t}).filter(optionObject => optionObject !== undefined);\n\n\t\tif (this.value) {\n\t\t\tconst selectedItem = this._list?.items.find(item => {\n\t\t\t\tconst option = this.optionsObjects.find(x => x.operator === this.value?.operator);\n\t\t\t\treturn option && item.textContent === option.text;\n\t\t\t}) as ListItem;\n\n\t\t\tthis._list?.focusItem(selectedItem);\n\t\t}\n\t}\n\n\tget _optionsTitles(): Array<string> {\n\t\treturn this.optionsObjects.map(option => option.text);\n\t}\n\n\t/**\n\t * Defines whether the value help icon is hidden\n\t * @private\n\t */\n\tget _iconMode() {\n\t\treturn isDesktop() ? IconMode.Decorative : IconMode.Interactive;\n\t}\n\n\tget tooltipNavigationIcon() {\n\t\treturn DynamicDateRange.i18nBundle.getText(DYNAMIC_DATE_RANGE_NAVIGATION_ICON_TOOLTIP);\n\t}\n\n\t_togglePicker(): void {\n\t\tif (this.open) {\n\t\t\tthis.open = false;\n\t\t} else {\n\t\t\tthis.open = true;\n\t\t}\n\t}\n\n\t_selectOption(e: CustomEvent): void {\n\t\tthis._currentOption = this.optionsObjects.find(option => option.text === e.detail.item.textContent);\n\t\tif (!this._currentOption?.template) {\n\t\t\tthis.currentValue = this._currentOption?.parse(this._currentOption.text);\n\t\t\tthis._submitValue();\n\t\t}\n\n\t\tif (this._currentOption?.operator === this.value?.operator) {\n\t\t\tthis.currentValue = this.value;\n\t\t}\n\t}\n\n\tgetOption(operator: string) {\n\t\tconst resultOption = this.optionsObjects.find(option => option.operator === operator);\n\n\t\tif (!resultOption) {\n\t\t\tconst OptionClass = DynamicDateRange.getOptionClass(operator);\n\n\t\t\tif (OptionClass) {\n\t\t\t\tconst optionObject = new OptionClass();\n\t\t\t\tthis.optionsObjects.push(optionObject);\n\n\t\t\t\treturn optionObject;\n\t\t\t}\n\t\t}\n\n\t\treturn resultOption;\n\t}\n\n\tonInputChange(e: Event): void {\n\t\tconst value = (e.target as Input)?.value;\n\n\t\tif (!value) {\n\t\t\tthis.value = undefined;\n\t\t\tthis.fireDecoratorEvent(\"change\", { value: undefined });\n\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentOption = this.optionsObjects.find(option => option.isValidString(value));\n\n\t\tthis.value = currentOption ? this.getOption(currentOption.operator)?.parse(value) : undefined;\n\n\t\tif (this.value) {\n\t\t\tthis.fireDecoratorEvent(\"change\", {\tvalue: this.value });\n\t\t}\n\t}\n\n\tonButtonBackClick() {\n\t\tthis._currentOption = undefined;\n\t}\n\n\t/**\n\t * Converts a `value` into concrete `startDate` and `endDate` JavaScript `Date` objects.\n\t *\n\t * @returns An array of two `Date` objects representing the start and end dates.\n\t */\n\ttoDates(value: DynamicDateRangeValue): Date[] {\n\t\treturn this.getOption(value.operator)?.toDates(value) as Date[];\n\t}\n\n\tget _hasCurrentOptionTemplate(): boolean {\n\t\treturn !!this._currentOption?.template;\n\t}\n\n\t_submitValue() {\n\t\tconst stringValue = this._currentOption?.format(this.currentValue!) as string;\n\n\t\tif (this._input) {\n\t\t\tthis._input.value = stringValue;\n\t\t}\n\n\t\tif (this._currentOption?.isValidString(stringValue)) {\n\t\t\tthis.value = this.currentValue as DynamicDateRangeValue;\n\t\t\tthis.fireDecoratorEvent(\"change\", { value: this.value });\n\t\t} else {\n\t\t\tthis.value = undefined;\n\t\t}\n\n\t\tthis._currentOption = undefined;\n\t\tthis.open = false;\n\t}\n\n\t_close() {\n\t\tthis._currentOption = undefined;\n\t\tthis.open = false;\n\t}\n\n\tonPopoverOpen() {\n\t\tif (this.currentValue !== this.value) {\n\t\t\tthis.currentValue = this.value;\n\t\t}\n\t}\n\n\tonPopoverClose() {\n\t\tthis._close();\n\t}\n\n\tget currentValueText() {\n\t\tif (this.currentValue && this.currentValue.operator === this._currentOption?.operator) {\n\t\t\treturn `${DynamicDateRange.i18nBundle.getText(DYNAMIC_DATE_RANGE_SELECTED_TEXT)}: ${this._currentOption?.format(this.currentValue)}`;\n\t\t}\n\n\t\treturn DynamicDateRange.i18nBundle.getText(DYNAMIC_DATE_RANGE_EMPTY_SELECTED_TEXT);\n\t}\n\n\thandleSelectionChange(e: CustomEvent) {\n\t\tthis.currentValue = this._currentOption?.handleSelectionChange && this._currentOption?.handleSelectionChange(e) as DynamicDateRangeValue;\n\t}\n\n\tonInputKeyDown(e: KeyboardEvent) {\n\t\tif (isShow(e)) {\n\t\t\te.preventDefault();\n\t\t\tif (this.open) {\n\t\t\t\tif (!isF4(e)) {\n\t\t\t\t\tthis._toggleAndFocusInput();\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tthis._toggleAndFocusInput();\n\t\t\t}\n\t\t}\n\t}\n\n\t_toggleAndFocusInput() {\n\t\tthis._togglePicker();\n\t\tif (this.open) {\n\t\t\tthis._input?.focus();\n\t\t}\n\t}\n\n\tonKeyDownPopover(e: KeyboardEvent) {\n\t\tif (isShow(e)) {\n\t\t\te.preventDefault(); // Prevent scroll on Alt/Option + Arrow Up/Down\n\t\t\tthis._toggleAndFocusInput();\n\t\t}\n\t}\n\n\t/**\n\t * Registers a new dynamic date range option with a unique key.\n\t *\n\t * Example:\n\t * DynamicDateRange.register(\"LASTWEEK\", LastWeek);\n\t */\n\tstatic register(operator: string, option: new () => IDynamicDateRangeOption): void {\n\t\toperator = operator.toUpperCase();\n\n\t\tif (!this.optionsClasses.has(operator)) {\n\t\t\tthis.optionsClasses.set(operator, option);\n\t\t}\n\t}\n\n\tstatic getOptionClass(operator: string): (new () => IDynamicDateRangeOption) | undefined {\n\t\treturn this.optionsClasses.get(operator);\n\t}\n}\n\nDynamicDateRange.define();\n\nexport default DynamicDateRange;\n\nexport type {\n\tDynamicDateRangeValue,\n\tIDynamicDateRangeOption,\n\tDynamicDateRangeChangeEventDetail,\n};\n"]}
+{"version":3,"file":"DynamicDateRange.js","sourceRoot":"","sources":["../src/DynamicDateRange.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport query from \"@ui5/webcomponents-base/dist/decorators/query.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type { JsxTemplate } from \"@ui5/webcomponents-base\";\nimport { isF4, isShow } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport DynamicDateRangeTemplate from \"./DynamicDateRangeTemplate.js\";\nimport IconMode from \"./types/IconMode.js\";\nimport type Input from \"./Input.js\";\nimport {\n\tDYNAMIC_DATE_RANGE_SELECTED_TEXT,\n\tDYNAMIC_DATE_RANGE_EMPTY_SELECTED_TEXT,\n\tDYNAMIC_DATE_RANGE_NAVIGATION_ICON_TOOLTIP,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// default calendar for bundling\nimport \"@ui5/webcomponents-localization/dist/features/calendar/Gregorian.js\";\n\n// Styles\nimport dynamicDateRangeCss from \"./generated/themes/DynamicDateRange.css.js\";\nimport dynamicDateRangePopoverCss from \"./generated/themes/DynamicDateRangePopover.css.js\";\nimport ResponsivePopoverCommonCss from \"./generated/themes/ResponsivePopoverCommon.css.js\";\nimport type List from \"./List.js\";\nimport type ListItem from \"./ListItem.js\";\n\ntype DynamicDateRangeValue = {\n\t/**\n\t * The key of the option.\n\t * @default \"\"\n\t * @public\n\t */\n\toperator: string;\n\n\t/**\n\t * Values of the dynamic date range.\n\t * @default []\n\t * @public\n\t */\n\tvalues?: Date[] | number[];\n}\n\n/**\n * Represents a dynamic date range option used by the `ui5-dynamic-date-range` component.\n *\n * Represents a dynamic date range option used for handling dynamic date ranges.\n * This interface defines the structure and behavior required for implementing\n * dynamic date range options, including formatting, parsing, validation, and\n * conversion of date range values.\n *\n *  * Properties:\n * - `icon`: The icon associated with the dynamic date range option, typically used for UI representation.\n * - `operator`: A unique operator identifying the dynamic date range option.\n * - `text`: The display text for the dynamic date range option.\n * - `template` (optional): A JSX template for rendering the dynamic date range option.\n *\n * Methods:\n * - `format(value: DynamicDateRangeValue): string`: Formats the given dynamic date range value into a string representation.\n * - `parse(value: string): DynamicDateRangeValue | undefined`: Parses a string into a dynamic date range value.\n * - `toDates(value: DynamicDateRangeValue): Date[]`: Converts a dynamic date range value into an array of `Date` objects.\n * - `handleSelectionChange?(event: CustomEvent): DynamicDateRangeValue | undefined`: (Optional) Handles selection changes in the UI of the dynamic date range option.\n * - `isValidString(value: string): boolean`: Validates whether a given string is a valid representation of the dynamic date range value.\n *\n * @public\n * @since 2.11.0\n */\ninterface IDynamicDateRangeOption {\n\ticon: string;\n\toperator: string;\n\ttext: string;\n\tformat: (value: DynamicDateRangeValue) => string;\n\tparse: (value: string) => DynamicDateRangeValue | undefined;\n\ttoDates: (value: DynamicDateRangeValue) => Date[];\n\thandleSelectionChange?: (event: CustomEvent) => DynamicDateRangeValue | undefined;\n\ttemplate?: JsxTemplate;\n\tisValidString: (value: string) => boolean;\n}\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-dynamic-date-range` component provides a flexible interface to define date ranges using a combination of absolute dates, relative intervals, and preset ranges (e.g., \"Today\", \"Yesterday\", etc.).\n * It allows users to select a date range from a predefined set of options or enter custom dates.\n *\n * ### Usage\n *\n * The component is typically used in scenarios where users need to filter data based on date ranges, such as in reports, dashboards, or data analysis tools.\n * It can be used with the predefined options or extended with custom options to suit specific requirements. You can create your own options by extending the `IDynamicDateRangeOption` interface.\n * Every option should be registered using the `DynamicDateRange.register` method.\n *\n * If needed, you can also create a range of dates based on specific option using the `toDates` method.\n *\n * ### Standard Options\n *\n * The component comes with a set of standard options, including:\n * - \"TODAY\" - Represents the current date. An example value is `{ operator: \"TODAY\"}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/Today.js\";`\n * - \"YESTERDAY\" - Represents the previous date. An example value is `{ operator: \"YESTERDAY\"}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/Yesterday.js\";`\n * - \"TOMORROW\" - Represents the next date. An example value is `{ operator: \"TOMORROW\"}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/Tomorrow.js\";`\n * - \"DATE\" - Represents a single date. An example value is `{ operator: \"DATE\", values: [new Date()]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/SingleDate.js\";`\n * - \"DATERANGE\" - Represents a range of dates. An example value is `{ operator: \"DATERANGE\", values: [new Date(), new Date()]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/DateRange.js\";`\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/DynamicDateRange.js\";`\n *\n * @constructor\n * @extends UI5Element\n * @public\n * @since 2.11.0\n */\n@customElement({\n\ttag: \"ui5-dynamic-date-range\",\n\tlanguageAware: true,\n\ttemplate: DynamicDateRangeTemplate,\n\trenderer: jsxRenderer,\n\tstyles: [\n\t\tdynamicDateRangeCss,\n\t\tResponsivePopoverCommonCss,\n\t\tdynamicDateRangePopoverCss,\n\t],\n})\n\n/**\n * Fired when the input operation has finished by pressing Enter or on focusout or a value is selected in the popover.\n * @public\n */\n@event(\"change\", {\n\tbubbles: true,\n\tcancelable: true,\n})\nclass DynamicDateRange extends UI5Element {\n\teventDetails!: {\n\t\tchange: void,\n\t}\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/**\n\t * Defines the value object.\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ noAttribute: true })\n\tvalue?: DynamicDateRangeValue;\n\n\t/**\n\t * Defines the options listed as a string, separated by commas and using capital case.\n\t * Example: \"TODAY, YESTERDAY, DATERANGE\"\n\t * @public\n\t * @default \"\"\n\t */\n\t@property({ type: String })\n\toptions = \"\";\n\n\t/**\n\t * Defines the open or closed state of the popover.\n\t * @private\n\t * @default false\n\t */\n\t@property({ type: Boolean })\n\topen = false;\n\n\t@property({ type: Object })\n\t_currentOption?: IDynamicDateRangeOption;\n\n\t@property({ type: Object })\n\tcurrentValue?: DynamicDateRangeValue;\n\n\toptionsObjects: IDynamicDateRangeOption[] = [];\n\n\tstatic optionsClasses: Map<string, new () => IDynamicDateRangeOption> = new Map();\n\n\t@query(\"[ui5-input]\")\n\t_input?: Input;\n\n\t@query(\"[ui5-list]\")\n\t_list?: List;\n\n\tonBeforeRendering() {\n\t\tconst optionKeys = this.options.split(\",\").map(option => option.trim());\n\n\t\tthis.optionsObjects = optionKeys.map(option => {\n\t\t\tconst OptionClass = DynamicDateRange.getOptionClass(option);\n\t\t\tlet optionObject;\n\n\t\t\tif (OptionClass) {\n\t\t\t\toptionObject = new OptionClass();\n\t\t\t}\n\n\t\t\treturn optionObject;\n\t\t}).filter(optionObject => optionObject !== undefined);\n\n\t\tif (this.value) {\n\t\t\tconst selectedItem = this._list?.items.find(item => {\n\t\t\t\tconst option = this.optionsObjects.find(x => x.operator === this.value?.operator);\n\t\t\t\treturn option && item.textContent === option.text;\n\t\t\t}) as ListItem;\n\n\t\t\tthis._list?.focusItem(selectedItem);\n\t\t}\n\t}\n\n\tget _optionsTitles(): Array<string> {\n\t\treturn this.optionsObjects.map(option => option.text);\n\t}\n\n\t/**\n\t * Defines whether the value help icon is hidden\n\t * @private\n\t */\n\tget _iconMode() {\n\t\treturn isDesktop() ? IconMode.Decorative : IconMode.Interactive;\n\t}\n\n\tget tooltipNavigationIcon() {\n\t\treturn DynamicDateRange.i18nBundle.getText(DYNAMIC_DATE_RANGE_NAVIGATION_ICON_TOOLTIP);\n\t}\n\n\t_togglePicker(): void {\n\t\tif (this.open) {\n\t\t\tthis.open = false;\n\t\t} else {\n\t\t\tthis.open = true;\n\t\t}\n\t}\n\n\t_selectOption(e: CustomEvent): void {\n\t\tthis._currentOption = this.optionsObjects.find(option => option.text === e.detail.item.textContent);\n\t\tif (!this._currentOption?.template) {\n\t\t\tthis.currentValue = this._currentOption?.parse(this._currentOption.text);\n\t\t\tthis._submitValue();\n\t\t}\n\n\t\tif (this._currentOption?.operator === this.value?.operator) {\n\t\t\tthis.currentValue = this.value;\n\t\t}\n\t}\n\n\tgetOption(operator: string) {\n\t\tconst resultOption = this.optionsObjects.find(option => option.operator === operator);\n\n\t\tif (!resultOption) {\n\t\t\tconst OptionClass = DynamicDateRange.getOptionClass(operator);\n\n\t\t\tif (OptionClass) {\n\t\t\t\tconst optionObject = new OptionClass();\n\t\t\t\tthis.optionsObjects.push(optionObject);\n\n\t\t\t\treturn optionObject;\n\t\t\t}\n\t\t}\n\n\t\treturn resultOption;\n\t}\n\n\tonInputChange(e: Event): void {\n\t\tconst value = (e.target as Input)?.value;\n\n\t\tif (!value) {\n\t\t\tthis.value = undefined;\n\t\t\tthis.fireDecoratorEvent(\"change\");\n\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentOption = this.optionsObjects.find(option => option.isValidString(value));\n\n\t\tthis.value = currentOption ? this.getOption(currentOption.operator)?.parse(value) : undefined;\n\n\t\tif (this.value) {\n\t\t\tthis.fireDecoratorEvent(\"change\");\n\t\t}\n\t}\n\n\tonButtonBackClick() {\n\t\tthis._currentOption = undefined;\n\t}\n\n\t/**\n\t * Converts a `value` into concrete `startDate` and `endDate` JavaScript `Date` objects.\n\t *\n\t * @public\n\t * @param value The option to convert into an array of date ranges\n\t * @returns An array of two `Date` objects representing the start and end dates.\n\t */\n\ttoDates(value: DynamicDateRangeValue): Date[] {\n\t\treturn this.getOption(value.operator)?.toDates(value) as Date[];\n\t}\n\n\tget _hasCurrentOptionTemplate(): boolean {\n\t\treturn !!this._currentOption?.template;\n\t}\n\n\t_submitValue() {\n\t\tconst stringValue = this._currentOption?.format(this.currentValue!) as string;\n\n\t\tif (this._input) {\n\t\t\tthis._input.value = stringValue;\n\t\t}\n\n\t\tif (this._currentOption?.isValidString(stringValue)) {\n\t\t\tthis.value = this.currentValue as DynamicDateRangeValue;\n\t\t\tthis.fireDecoratorEvent(\"change\");\n\t\t} else {\n\t\t\tthis.value = undefined;\n\t\t}\n\n\t\tthis._currentOption = undefined;\n\t\tthis.open = false;\n\t}\n\n\t_close() {\n\t\tthis._currentOption = undefined;\n\t\tthis.open = false;\n\t}\n\n\tonPopoverOpen() {\n\t\tif (this.currentValue !== this.value) {\n\t\t\tthis.currentValue = this.value;\n\t\t}\n\t}\n\n\tonPopoverClose() {\n\t\tthis._close();\n\t}\n\n\tget currentValueText() {\n\t\tif (this.currentValue && this.currentValue.operator === this._currentOption?.operator) {\n\t\t\treturn `${DynamicDateRange.i18nBundle.getText(DYNAMIC_DATE_RANGE_SELECTED_TEXT)}: ${this._currentOption?.format(this.currentValue)}`;\n\t\t}\n\n\t\treturn DynamicDateRange.i18nBundle.getText(DYNAMIC_DATE_RANGE_EMPTY_SELECTED_TEXT);\n\t}\n\n\thandleSelectionChange(e: CustomEvent) {\n\t\tthis.currentValue = this._currentOption?.handleSelectionChange && this._currentOption?.handleSelectionChange(e) as DynamicDateRangeValue;\n\t}\n\n\tonInputKeyDown(e: KeyboardEvent) {\n\t\tif (isShow(e)) {\n\t\t\te.preventDefault();\n\t\t\tif (this.open) {\n\t\t\t\tif (!isF4(e)) {\n\t\t\t\t\tthis._toggleAndFocusInput();\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tthis._toggleAndFocusInput();\n\t\t\t}\n\t\t}\n\t}\n\n\t_toggleAndFocusInput() {\n\t\tthis._togglePicker();\n\t\tif (this.open) {\n\t\t\tthis._input?.focus();\n\t\t}\n\t}\n\n\tonKeyDownPopover(e: KeyboardEvent) {\n\t\tif (isShow(e)) {\n\t\t\te.preventDefault(); // Prevent scroll on Alt/Option + Arrow Up/Down\n\t\t\tthis._toggleAndFocusInput();\n\t\t}\n\t}\n\n\t/**\n\t * Registers a new dynamic date range option with a unique key.\n\t *\n\t * Example:\n\t * DynamicDateRange.register(\"LASTWEEK\", LastWeek);\n\t */\n\tstatic register(operator: string, option: new () => IDynamicDateRangeOption): void {\n\t\toperator = operator.toUpperCase();\n\n\t\tif (!this.optionsClasses.has(operator)) {\n\t\t\tthis.optionsClasses.set(operator, option);\n\t\t}\n\t}\n\n\tstatic getOptionClass(operator: string): (new () => IDynamicDateRangeOption) | undefined {\n\t\treturn this.optionsClasses.get(operator);\n\t}\n}\n\nDynamicDateRange.define();\n\nexport default DynamicDateRange;\n\nexport type {\n\tDynamicDateRangeValue,\n\tIDynamicDateRangeOption,\n};\n"]}

package/dist/InputTemplate.js

@@ -6,7 +6,7 @@ export default function InputTemplate(hooks) {
     const suggestionsList = hooks?.suggestionsList;
     const preContent = hooks?.preContent || defaultPreContent;
     const postContent = hooks?.postContent || defaultPostContent;
-    return (_jsxs(_Fragment, { children: [_jsx("div", { class: "ui5-input-root ui5-input-focusable-element", part: "root", onFocusIn: this._onfocusin, onFocusOut: this._onfocusout, children: _jsxs("div", { class: "ui5-input-content", children: [preContent.call(this), _jsx("input", { id: "inner", part: "input", class: "ui5-input-inner", style: this.styles.innerInput, type: this.inputNativeType, "inner-input": true, "inner-input-with-icon": this.icon.length, disabled: this.disabled, readonly: this._readonly, value: this._innerValue, placeholder: this._placeholder, maxlength: this.maxlength, role: this.accInfo.role, enterkeyhint: this.hint, "aria-controls": this.accInfo.ariaControls, "aria-invalid": this.accInfo.ariaInvalid, "aria-haspopup": this.accInfo.ariaHasPopup, "aria-describedby": this.accInfo.ariaDescribedBy, "aria-roledescription": this.accInfo.ariaRoledescription, "aria-autocomplete": this.accInfo.ariaAutoComplete, "aria-expanded": this.accInfo.ariaExpanded, "aria-label": this.accInfo.ariaLabel, "aria-required": this.required, autocomplete: "off", "data-sap-focus-ref": true, step: this.nativeInputAttributes.step, min: this.nativeInputAttributes.min, max: this.nativeInputAttributes.max, onInput: this._handleNativeInput, onChange: this._handleChange, onSelect: this._handleSelect, onKeyDown: this._onkeydown, onKeyUp: this._onkeyup, onClick: this._click, onFocusIn: this.innerFocusIn }), this._effectiveShowClearIcon &&
+    return (_jsxs(_Fragment, { children: [_jsx("div", { class: "ui5-input-root ui5-input-focusable-element", part: "root", onFocusIn: this._onfocusin, onFocusOut: this._onfocusout, children: _jsxs("div", { class: "ui5-input-content", children: [preContent.call(this), _jsx("input", { id: "inner", part: "input", class: "ui5-input-inner", style: this.styles.innerInput, type: this.inputNativeType, "inner-input": true, "inner-input-with-icon": !!this.icon.length, disabled: this.disabled, readonly: this._readonly, value: this._innerValue, placeholder: this._placeholder, maxlength: this.maxlength, role: this.accInfo.role, enterkeyhint: this.hint, "aria-controls": this.accInfo.ariaControls, "aria-invalid": this.accInfo.ariaInvalid, "aria-haspopup": this.accInfo.ariaHasPopup, "aria-describedby": this.accInfo.ariaDescribedBy, "aria-roledescription": this.accInfo.ariaRoledescription, "aria-autocomplete": this.accInfo.ariaAutoComplete, "aria-expanded": this.accInfo.ariaExpanded, "aria-label": this.accInfo.ariaLabel, "aria-required": this.required, autocomplete: "off", "data-sap-focus-ref": true, step: this.nativeInputAttributes.step, min: this.nativeInputAttributes.min, max: this.nativeInputAttributes.max, onInput: this._handleNativeInput, onChange: this._handleChange, onSelect: this._handleSelect, onKeyDown: this._onkeydown, onKeyUp: this._onkeyup, onClick: this._click, onFocusIn: this.innerFocusIn }), this._effectiveShowClearIcon &&
                             _jsx("div", { tabindex: -1, class: "ui5-input-clear-icon-wrapper inputIcon", part: "clear-icon-wrapper", onClick: this._clear, onMouseDown: this._iconMouseDown, children: _jsx(Icon, { part: "clear-icon", class: "ui5-input-clear-icon", name: decline, tabindex: -1, accessibleName: this.clearIconAccessibleName }) }), this.icon.length > 0 &&
                             _jsx("div", { class: "ui5-input-icon-root", tabindex: -1, children: _jsx("slot", { name: "icon" }) }), _jsx("div", { class: "ui5-input-value-state-icon", children: this._valueStateInputIcon }), postContent.call(this), this._effectiveShowSuggestions &&
                             _jsxs(_Fragment, { children: [_jsx("span", { id: "suggestionsText", class: "ui5-hidden-text", children: this.suggestionsText }), _jsx("span", { id: "selectionText", class: "ui5-hidden-text", "aria-live": "polite", role: "status" }), _jsx("span", { id: "suggestionsCount", class: "ui5-hidden-text", "aria-live": "polite", children: this.availableSuggestionsCount })] }), this.accInfo.ariaDescription &&

package/dist/InputTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputTemplate.js","sourceRoot":"","sources":["../src/InputTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type Input from \"./Input.js\";\nimport type { JsxTemplateResult } from \"@ui5/webcomponents-base/dist/index.js\";\nimport Icon from \"./Icon.js\";\nimport decline from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport InputPopoverTemplate from \"./InputPopoverTemplate.js\";\n\ntype TemplateHook = () => JsxTemplateResult;\n\nexport default function InputTemplate(this: Input, hooks?: { preContent: TemplateHook, postContent: TemplateHook, suggestionsList?: TemplateHook }) {\n\tconst suggestionsList = hooks?.suggestionsList;\n\tconst preContent = hooks?.preContent || defaultPreContent;\n\tconst postContent = hooks?.postContent || defaultPostContent;\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tclass=\"ui5-input-root ui5-input-focusable-element\"\n\t\t\t\tpart=\"root\"\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t>\n\t\t\t\t<div class=\"ui5-input-content\">\n\t\t\t\t\t{ preContent.call(this) }\n\n\t\t\t\t\t<input\n\t\t\t\t\t\tid=\"inner\"\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\tclass=\"ui5-input-inner\"\n\t\t\t\t\t\tstyle={this.styles.innerInput}\n\t\t\t\t\t\ttype={this.inputNativeType}\n\t\t\t\t\t\tinner-input\n\t\t\t\t\t\tinner-input-with-icon={this.icon.length}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\treadonly={this._readonly}\n\t\t\t\t\t\tvalue={this._innerValue}\n\t\t\t\t\t\tplaceholder={this._placeholder}\n\t\t\t\t\t\tmaxlength={this.maxlength}\n\t\t\t\t\t\trole={this.accInfo.role}\n\t\t\t\t\t\tenterkeyhint={this.hint}\n\t\t\t\t\t\taria-controls={this.accInfo.ariaControls}\n\t\t\t\t\t\taria-invalid={this.accInfo.ariaInvalid}\n\t\t\t\t\t\taria-haspopup={this.accInfo.ariaHasPopup}\n\t\t\t\t\t\taria-describedby={this.accInfo.ariaDescribedBy}\n\t\t\t\t\t\taria-roledescription={this.accInfo.ariaRoledescription}\n\t\t\t\t\t\taria-autocomplete={this.accInfo.ariaAutoComplete}\n\t\t\t\t\t\taria-expanded={this.accInfo.ariaExpanded}\n\t\t\t\t\t\taria-label={this.accInfo.ariaLabel}\n\t\t\t\t\t\taria-required={this.required}\n\t\t\t\t\t\tautocomplete=\"off\"\n\t\t\t\t\t\tdata-sap-focus-ref\n\t\t\t\t\t\tstep={this.nativeInputAttributes.step}\n\t\t\t\t\t\tmin={this.nativeInputAttributes.min}\n\t\t\t\t\t\tmax={this.nativeInputAttributes.max}\n\t\t\t\t\t\tonInput={this._handleNativeInput}\n\t\t\t\t\t\tonChange={this._handleChange}\n\t\t\t\t\t\tonSelect={this._handleSelect}\n\t\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\t\tonKeyUp={this._onkeyup}\n\t\t\t\t\t\tonClick={this._click}\n\t\t\t\t\t\tonFocusIn={this.innerFocusIn}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{this._effectiveShowClearIcon &&\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\ttabindex={-1}\n\t\t\t\t\t\t\tclass=\"ui5-input-clear-icon-wrapper inputIcon\"\n\t\t\t\t\t\t\tpart=\"clear-icon-wrapper\"\n\t\t\t\t\t\t\tonClick={this._clear}\n\t\t\t\t\t\t\tonMouseDown={this._iconMouseDown}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\tpart=\"clear-icon\"\n\t\t\t\t\t\t\t\tclass=\"ui5-input-clear-icon\"\n\t\t\t\t\t\t\t\tname={decline}\n\t\t\t\t\t\t\t\ttabindex={-1}\n\t\t\t\t\t\t\t\taccessibleName={this.clearIconAccessibleName}>\n\t\t\t\t\t\t\t</Icon>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.icon.length > 0 &&\n\t\t\t\t\t\t<div class=\"ui5-input-icon-root\"\n\t\t\t\t\t\t\ttabindex={-1}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot name=\"icon\"></slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t}\n\n\t\t\t\t\t<div class=\"ui5-input-value-state-icon\">\n\t\t\t\t\t\t{this._valueStateInputIcon}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{ postContent.call(this) }\n\n\t\t\t\t\t{this._effectiveShowSuggestions &&\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<span id=\"suggestionsText\" class=\"ui5-hidden-text\">{this.suggestionsText}</span>\n\t\t\t\t\t\t\t<span id=\"selectionText\" class=\"ui5-hidden-text\" aria-live=\"polite\" role=\"status\"></span>\n\t\t\t\t\t\t\t<span id=\"suggestionsCount\" class=\"ui5-hidden-text\" aria-live=\"polite\">{this.availableSuggestionsCount}</span>\n\t\t\t\t\t\t</>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.accInfo.ariaDescription &&\n\t\t\t\t\t\t<span id=\"descr\" class=\"ui5-hidden-text\">{this.accInfo.ariaDescription}</span>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.accInfo.accessibleDescription &&\n\t\t\t\t\t\t<span id=\"accessibleDescription\" class=\"ui5-hidden-text\">{this.accInfo.accessibleDescription}</span>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.hasValueState &&\n\t\t\t\t\t\t<span id=\"valueStateDesc\" class=\"ui5-hidden-text\">{this.ariaValueStateHiddenText}</span>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t{ InputPopoverTemplate.call(this, { suggestionsList }) }\n\t\t</>\n\t);\n}\n\nfunction defaultPreContent() {}\n\nfunction defaultPostContent() {}\n"]}
+{"version":3,"file":"InputTemplate.js","sourceRoot":"","sources":["../src/InputTemplate.tsx"],"names":[],"mappings":";AAEA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,OAAO,MAAM,0CAA0C,CAAC;AAC/D,OAAO,oBAAoB,MAAM,2BAA2B,CAAC;AAI7D,MAAM,CAAC,OAAO,UAAU,aAAa,CAAc,KAA+F;IACjJ,MAAM,eAAe,GAAG,KAAK,EAAE,eAAe,CAAC;IAC/C,MAAM,UAAU,GAAG,KAAK,EAAE,UAAU,IAAI,iBAAiB,CAAC;IAC1D,MAAM,WAAW,GAAG,KAAK,EAAE,WAAW,IAAI,kBAAkB,CAAC;IAE7D,OAAO,CACN,8BACC,cACC,KAAK,EAAC,4CAA4C,EAClD,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,YAE5B,eAAK,KAAK,EAAC,mBAAmB,aAC3B,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAEvB,gBACC,EAAE,EAAC,OAAO,EACV,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,iBAAiB,EACvB,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,EAC7B,IAAI,EAAE,IAAI,CAAC,eAAe,gDAEH,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EACzC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,KAAK,EAAE,IAAI,CAAC,WAAW,EACvB,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,EACvB,YAAY,EAAE,IAAI,CAAC,IAAI,mBACR,IAAI,CAAC,OAAO,CAAC,YAAY,kBAC1B,IAAI,CAAC,OAAO,CAAC,WAAW,mBACvB,IAAI,CAAC,OAAO,CAAC,YAAY,sBACtB,IAAI,CAAC,OAAO,CAAC,eAAe,0BACxB,IAAI,CAAC,OAAO,CAAC,mBAAmB,uBACnC,IAAI,CAAC,OAAO,CAAC,gBAAgB,mBACjC,IAAI,CAAC,OAAO,CAAC,YAAY,gBAC5B,IAAI,CAAC,OAAO,CAAC,SAAS,mBACnB,IAAI,CAAC,QAAQ,EAC5B,YAAY,EAAC,KAAK,8BAElB,IAAI,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,EACrC,GAAG,EAAE,IAAI,CAAC,qBAAqB,CAAC,GAAG,EACnC,GAAG,EAAE,IAAI,CAAC,qBAAqB,CAAC,GAAG,EACnC,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAChC,QAAQ,EAAE,IAAI,CAAC,aAAa,EAC5B,QAAQ,EAAE,IAAI,CAAC,aAAa,EAC5B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,MAAM,EACpB,SAAS,EAAE,IAAI,CAAC,YAAY,GAC3B,EAED,IAAI,CAAC,uBAAuB;4BAC5B,cACC,QAAQ,EAAE,CAAC,CAAC,EACZ,KAAK,EAAC,wCAAwC,EAC9C,IAAI,EAAC,oBAAoB,EACzB,OAAO,EAAE,IAAI,CAAC,MAAM,EACpB,WAAW,EAAE,IAAI,CAAC,cAAc,YAEhC,KAAC,IAAI,IACJ,IAAI,EAAC,YAAY,EACjB,KAAK,EAAC,sBAAsB,EAC5B,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,CAAC,CAAC,EACZ,cAAc,EAAE,IAAI,CAAC,uBAAuB,GACtC,GACF,EAGN,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC;4BACpB,cAAK,KAAK,EAAC,qBAAqB,EAC/B,QAAQ,EAAE,CAAC,CAAC,YAEZ,eAAM,IAAI,EAAC,MAAM,GAAQ,GACpB,EAGP,cAAK,KAAK,EAAC,4BAA4B,YACrC,IAAI,CAAC,oBAAoB,GACrB,EAEJ,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAEvB,IAAI,CAAC,yBAAyB;4BAC9B,8BACC,eAAM,EAAE,EAAC,iBAAiB,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,eAAe,GAAQ,EAChF,eAAM,EAAE,EAAC,eAAe,EAAC,KAAK,EAAC,iBAAiB,eAAW,QAAQ,EAAC,IAAI,EAAC,QAAQ,GAAQ,EACzF,eAAM,EAAE,EAAC,kBAAkB,EAAC,KAAK,EAAC,iBAAiB,eAAW,QAAQ,YAAE,IAAI,CAAC,yBAAyB,GAAQ,IAC5G,EAGH,IAAI,CAAC,OAAO,CAAC,eAAe;4BAC5B,eAAM,EAAE,EAAC,OAAO,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,OAAO,CAAC,eAAe,GAAQ,EAG9E,IAAI,CAAC,OAAO,CAAC,qBAAqB;4BAClC,eAAM,EAAE,EAAC,uBAAuB,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,OAAO,CAAC,qBAAqB,GAAQ,EAGpG,IAAI,CAAC,aAAa;4BAClB,eAAM,EAAE,EAAC,gBAAgB,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,wBAAwB,GAAQ,IAEpF,GACD,EAEJ,oBAAoB,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,eAAe,EAAE,CAAC,IACpD,CACH,CAAC;AACH,CAAC;AAED,SAAS,iBAAiB,KAAI,CAAC;AAE/B,SAAS,kBAAkB,KAAI,CAAC","sourcesContent":["import type Input from \"./Input.js\";\nimport type { JsxTemplateResult } from \"@ui5/webcomponents-base/dist/index.js\";\nimport Icon from \"./Icon.js\";\nimport decline from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport InputPopoverTemplate from \"./InputPopoverTemplate.js\";\n\ntype TemplateHook = () => JsxTemplateResult;\n\nexport default function InputTemplate(this: Input, hooks?: { preContent: TemplateHook, postContent: TemplateHook, suggestionsList?: TemplateHook }) {\n\tconst suggestionsList = hooks?.suggestionsList;\n\tconst preContent = hooks?.preContent || defaultPreContent;\n\tconst postContent = hooks?.postContent || defaultPostContent;\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tclass=\"ui5-input-root ui5-input-focusable-element\"\n\t\t\t\tpart=\"root\"\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t>\n\t\t\t\t<div class=\"ui5-input-content\">\n\t\t\t\t\t{ preContent.call(this) }\n\n\t\t\t\t\t<input\n\t\t\t\t\t\tid=\"inner\"\n\t\t\t\t\t\tpart=\"input\"\n\t\t\t\t\t\tclass=\"ui5-input-inner\"\n\t\t\t\t\t\tstyle={this.styles.innerInput}\n\t\t\t\t\t\ttype={this.inputNativeType}\n\t\t\t\t\t\tinner-input\n\t\t\t\t\t\tinner-input-with-icon={!!this.icon.length}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\treadonly={this._readonly}\n\t\t\t\t\t\tvalue={this._innerValue}\n\t\t\t\t\t\tplaceholder={this._placeholder}\n\t\t\t\t\t\tmaxlength={this.maxlength}\n\t\t\t\t\t\trole={this.accInfo.role}\n\t\t\t\t\t\tenterkeyhint={this.hint}\n\t\t\t\t\t\taria-controls={this.accInfo.ariaControls}\n\t\t\t\t\t\taria-invalid={this.accInfo.ariaInvalid}\n\t\t\t\t\t\taria-haspopup={this.accInfo.ariaHasPopup}\n\t\t\t\t\t\taria-describedby={this.accInfo.ariaDescribedBy}\n\t\t\t\t\t\taria-roledescription={this.accInfo.ariaRoledescription}\n\t\t\t\t\t\taria-autocomplete={this.accInfo.ariaAutoComplete}\n\t\t\t\t\t\taria-expanded={this.accInfo.ariaExpanded}\n\t\t\t\t\t\taria-label={this.accInfo.ariaLabel}\n\t\t\t\t\t\taria-required={this.required}\n\t\t\t\t\t\tautocomplete=\"off\"\n\t\t\t\t\t\tdata-sap-focus-ref\n\t\t\t\t\t\tstep={this.nativeInputAttributes.step}\n\t\t\t\t\t\tmin={this.nativeInputAttributes.min}\n\t\t\t\t\t\tmax={this.nativeInputAttributes.max}\n\t\t\t\t\t\tonInput={this._handleNativeInput}\n\t\t\t\t\t\tonChange={this._handleChange}\n\t\t\t\t\t\tonSelect={this._handleSelect}\n\t\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\t\tonKeyUp={this._onkeyup}\n\t\t\t\t\t\tonClick={this._click}\n\t\t\t\t\t\tonFocusIn={this.innerFocusIn}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{this._effectiveShowClearIcon &&\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\ttabindex={-1}\n\t\t\t\t\t\t\tclass=\"ui5-input-clear-icon-wrapper inputIcon\"\n\t\t\t\t\t\t\tpart=\"clear-icon-wrapper\"\n\t\t\t\t\t\t\tonClick={this._clear}\n\t\t\t\t\t\t\tonMouseDown={this._iconMouseDown}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\tpart=\"clear-icon\"\n\t\t\t\t\t\t\t\tclass=\"ui5-input-clear-icon\"\n\t\t\t\t\t\t\t\tname={decline}\n\t\t\t\t\t\t\t\ttabindex={-1}\n\t\t\t\t\t\t\t\taccessibleName={this.clearIconAccessibleName}>\n\t\t\t\t\t\t\t</Icon>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.icon.length > 0 &&\n\t\t\t\t\t\t<div class=\"ui5-input-icon-root\"\n\t\t\t\t\t\t\ttabindex={-1}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot name=\"icon\"></slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t}\n\n\t\t\t\t\t<div class=\"ui5-input-value-state-icon\">\n\t\t\t\t\t\t{this._valueStateInputIcon}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{ postContent.call(this) }\n\n\t\t\t\t\t{this._effectiveShowSuggestions &&\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<span id=\"suggestionsText\" class=\"ui5-hidden-text\">{this.suggestionsText}</span>\n\t\t\t\t\t\t\t<span id=\"selectionText\" class=\"ui5-hidden-text\" aria-live=\"polite\" role=\"status\"></span>\n\t\t\t\t\t\t\t<span id=\"suggestionsCount\" class=\"ui5-hidden-text\" aria-live=\"polite\">{this.availableSuggestionsCount}</span>\n\t\t\t\t\t\t</>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.accInfo.ariaDescription &&\n\t\t\t\t\t\t<span id=\"descr\" class=\"ui5-hidden-text\">{this.accInfo.ariaDescription}</span>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.accInfo.accessibleDescription &&\n\t\t\t\t\t\t<span id=\"accessibleDescription\" class=\"ui5-hidden-text\">{this.accInfo.accessibleDescription}</span>\n\t\t\t\t\t}\n\n\t\t\t\t\t{this.hasValueState &&\n\t\t\t\t\t\t<span id=\"valueStateDesc\" class=\"ui5-hidden-text\">{this.ariaValueStateHiddenText}</span>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t{ InputPopoverTemplate.call(this, { suggestionsList }) }\n\t\t</>\n\t);\n}\n\nfunction defaultPreContent() {}\n\nfunction defaultPostContent() {}\n"]}

package/dist/MonthPickerTemplate.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
 export default function MonthPickerTemplate() {
-    return (_jsx("div", { class: "ui5-mp-root", role: "grid", "aria-roledescription": this.roleDescription, "aria-readonly": "false", "aria-multiselectable": "false", onMouseOver: this._onmouseover, onKeyDown: this._onkeydown, onKeyUp: this._onkeyup, onClick: this._selectMonth, children: this._monthsInterval.map(months => _jsx("div", { role: "row", class: "ui5-mp-quarter", children: months.map(month => _jsxs("div", { "data-sap-timestamp": month.timestamp, tabindex: month._tabIndex, "data-sap-focus-ref": month.focusRef ? "true" : undefined, class: month.classes, part: month.parts, role: "gridcell", "aria-selected": month.ariaSelected, "aria-disabled": month.ariaDisabled, children: [_jsx("span", { class: "ui5-dp-monthtext", children: month.name }), month.nameInSecType &&
+    return (_jsx("div", { class: "ui5-mp-root", part: "month-picker-root", role: "grid", "aria-roledescription": this.roleDescription, "aria-readonly": "false", "aria-multiselectable": "false", onMouseOver: this._onmouseover, onKeyDown: this._onkeydown, onKeyUp: this._onkeyup, onClick: this._selectMonth, children: this._monthsInterval.map(months => _jsx("div", { role: "row", class: "ui5-mp-quarter", children: months.map(month => _jsxs("div", { "data-sap-timestamp": month.timestamp, tabindex: month._tabIndex, "data-sap-focus-ref": month.focusRef ? "true" : undefined, class: month.classes, part: month.parts, role: "gridcell", "aria-selected": month.ariaSelected, "aria-disabled": month.ariaDisabled, children: [_jsx("span", { class: "ui5-dp-monthtext", children: month.name }), month.nameInSecType &&
                         _jsx("span", { class: "ui5-dp-monthtext ui5-dp-monthsectext", children: month.nameInSecType })] })) })) }));
 }
 //# sourceMappingURL=MonthPickerTemplate.js.map

package/dist/MonthPickerTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"MonthPickerTemplate.js","sourceRoot":"","sources":["../src/MonthPickerTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,mBAAmB;IAC1C,OAAO,CACN,cACC,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,MAAM,0BACW,IAAI,CAAC,eAAe,mBAC5B,OAAO,0BACA,OAAO,EAC5B,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,YAAY,YAEzB,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAClC,cAAK,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,gBAAgB,YAEpC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CACnB,qCACqB,KAAK,CAAC,SAAS,EACnC,QAAQ,EAAE,KAAK,CAAC,SAAS,wBACL,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EACvD,KAAK,EAAE,KAAK,CAAC,OAAO,EACpB,IAAI,EAAE,KAAK,CAAC,KAAK,EACjB,IAAI,EAAC,UAAU,mBACA,KAAK,CAAC,YAAY,mBAClB,KAAK,CAAC,YAAY,aAEjC,eAAM,KAAK,EAAC,kBAAkB,YAC5B,KAAK,CAAC,IAAI,GACL,EAEN,KAAK,CAAC,aAAa;wBACrB,eAAM,KAAK,EAAC,sCAAsC,YAChD,KAAK,CAAC,aAAa,GACd,IAED,CACN,GACI,CACN,GACI,CAAC,CAAC;AACV,CAAC","sourcesContent":["import type MonthPicker from \"./MonthPicker.js\";\n\nexport default function MonthPickerTemplate(this: MonthPicker) {\n\treturn (\n\t\t<div\n\t\t\tclass=\"ui5-mp-root\"\n\t\t\trole=\"grid\"\n\t\t\taria-roledescription={this.roleDescription}\n\t\t\taria-readonly=\"false\"\n\t\t\taria-multiselectable=\"false\"\n\t\t\tonMouseOver={this._onmouseover}\n\t\t\tonKeyDown={this._onkeydown}\n\t\t\tonKeyUp={this._onkeyup}\n\t\t\tonClick={this._selectMonth}\n\t\t>\n\t\t\t{this._monthsInterval.map(months =>\n\t\t\t\t<div role=\"row\" class=\"ui5-mp-quarter\">\n\n\t\t\t\t\t{months.map(month =>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tdata-sap-timestamp={month.timestamp}\n\t\t\t\t\t\t\ttabindex={month._tabIndex}\n\t\t\t\t\t\t\tdata-sap-focus-ref={month.focusRef ? \"true\" : undefined}\n\t\t\t\t\t\t\tclass={month.classes}\n\t\t\t\t\t\t\tpart={month.parts}\n\t\t\t\t\t\t\trole=\"gridcell\"\n\t\t\t\t\t\t\taria-selected={month.ariaSelected}\n\t\t\t\t\t\t\taria-disabled={month.ariaDisabled}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span class=\"ui5-dp-monthtext\">\n\t\t\t\t\t\t\t\t{month.name}\n\t\t\t\t\t\t\t</span>\n\n\t\t\t\t\t\t\t{month.nameInSecType &&\n\t\t\t\t\t\t<span class=\"ui5-dp-monthtext ui5-dp-monthsectext\">\n\t\t\t\t\t\t\t{month.nameInSecType}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>);\n}\n"]}
+{"version":3,"file":"MonthPickerTemplate.js","sourceRoot":"","sources":["../src/MonthPickerTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,mBAAmB;IAC1C,OAAO,CACN,cACC,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,mBAAmB,EACxB,IAAI,EAAC,MAAM,0BACW,IAAI,CAAC,eAAe,mBAC5B,OAAO,0BACA,OAAO,EAC5B,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,YAAY,YAEzB,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAClC,cAAK,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,gBAAgB,YAEpC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CACnB,qCACqB,KAAK,CAAC,SAAS,EACnC,QAAQ,EAAE,KAAK,CAAC,SAAS,wBACL,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EACvD,KAAK,EAAE,KAAK,CAAC,OAAO,EACpB,IAAI,EAAE,KAAK,CAAC,KAAK,EACjB,IAAI,EAAC,UAAU,mBACA,KAAK,CAAC,YAAY,mBAClB,KAAK,CAAC,YAAY,aAEjC,eAAM,KAAK,EAAC,kBAAkB,YAC5B,KAAK,CAAC,IAAI,GACL,EAEN,KAAK,CAAC,aAAa;wBACrB,eAAM,KAAK,EAAC,sCAAsC,YAChD,KAAK,CAAC,aAAa,GACd,IAED,CACN,GACI,CACN,GACI,CAAC,CAAC;AACV,CAAC","sourcesContent":["import type MonthPicker from \"./MonthPicker.js\";\n\nexport default function MonthPickerTemplate(this: MonthPicker) {\n\treturn (\n\t\t<div\n\t\t\tclass=\"ui5-mp-root\"\n\t\t\tpart=\"month-picker-root\"\n\t\t\trole=\"grid\"\n\t\t\taria-roledescription={this.roleDescription}\n\t\t\taria-readonly=\"false\"\n\t\t\taria-multiselectable=\"false\"\n\t\t\tonMouseOver={this._onmouseover}\n\t\t\tonKeyDown={this._onkeydown}\n\t\t\tonKeyUp={this._onkeyup}\n\t\t\tonClick={this._selectMonth}\n\t\t>\n\t\t\t{this._monthsInterval.map(months =>\n\t\t\t\t<div role=\"row\" class=\"ui5-mp-quarter\">\n\n\t\t\t\t\t{months.map(month =>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tdata-sap-timestamp={month.timestamp}\n\t\t\t\t\t\t\ttabindex={month._tabIndex}\n\t\t\t\t\t\t\tdata-sap-focus-ref={month.focusRef ? \"true\" : undefined}\n\t\t\t\t\t\t\tclass={month.classes}\n\t\t\t\t\t\t\tpart={month.parts}\n\t\t\t\t\t\t\trole=\"gridcell\"\n\t\t\t\t\t\t\taria-selected={month.ariaSelected}\n\t\t\t\t\t\t\taria-disabled={month.ariaDisabled}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span class=\"ui5-dp-monthtext\">\n\t\t\t\t\t\t\t\t{month.name}\n\t\t\t\t\t\t\t</span>\n\n\t\t\t\t\t\t\t{month.nameInSecType &&\n\t\t\t\t\t\t<span class=\"ui5-dp-monthtext ui5-dp-monthsectext\">\n\t\t\t\t\t\t\t{month.nameInSecType}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>);\n}\n"]}

package/dist/Popover.d.ts

@@ -179,7 +179,7 @@ declare class Popover extends Popup {
      * @returns The adjusted top in px.
      */
     _adjustForIOSKeyboard(top: number): number;
-    getPopoverSize(): PopoverSize;
+    getPopoverSize(calcScrollHeight?: boolean): PopoverSize;
     _showOutsideViewport(): void;
     _isUI5AbstractElement(el: HTMLElement): el is UI5Element;
     get arrowDOM(): Element;
@@ -209,7 +209,7 @@ declare class Popover extends Popup {
      * @private
      */
     fallbackPlacement(clientWidth: number, clientHeight: number, targetRect: DOMRect, popoverSize: PopoverSize): PopoverPlacement | undefined;
-    getActualPlacement(targetRect: DOMRect, popoverSize: PopoverSize): `${PopoverPlacement}`;
+    getActualPlacement(targetRect: DOMRect): `${PopoverPlacement}`;
     getVerticalLeft(targetRect: DOMRect, popoverSize: PopoverSize): number;
     getHorizontalTop(targetRect: DOMRect, popoverSize: PopoverSize): number;
     get isModal(): boolean;

package/dist/Popover.js

@@ -320,8 +320,22 @@ let Popover = Popover_1 = class Popover extends Popup {
         const actualTop = Math.ceil(this.getBoundingClientRect().top);
         return top + (Number.parseInt(this.style.top || "0") - actualTop);
     }
-    getPopoverSize() {
-        const rect = this.getBoundingClientRect(), width = rect.width, height = rect.height;
+    getPopoverSize(calcScrollHeight = false) {
+        const rect = this.getBoundingClientRect();
+        const width = rect.width;
+        let height;
+        const domRef = this.getDomRef();
+        if (calcScrollHeight && domRef) {
+            const header = domRef.querySelector(".ui5-popup-header-root");
+            const content = domRef.querySelector(".ui5-popup-content");
+            const footer = domRef.querySelector(".ui5-popup-footer-root");
+            height = content?.scrollHeight || 0;
+            height += header?.scrollHeight || 0;
+            height += footer?.scrollHeight || 0;
+        }
+        else {
+            height = rect.height;
+        }
         return { width, height };
     }
     _showOutsideViewport() {
@@ -353,7 +367,7 @@ let Popover = Popover_1 = class Popover extends Popup {
         const clientHeight = document.documentElement.clientHeight;
         let maxHeight = clientHeight;
         let maxWidth = clientWidth;
-        const placement = this.getActualPlacement(targetRect, popoverSize);
+        const placement = this.getActualPlacement(targetRect);
         this._preventRepositionAndClose = this.shouldCloseDueToNoOpener(targetRect) || this.shouldCloseDueToOverflow(placement, targetRect);
         const isVertical = placement === PopoverPlacement.Top
             || placement === PopoverPlacement.Bottom;
@@ -498,20 +512,28 @@ let Popover = Popover_1 = class Popover extends Popup {
             return PopoverPlacement.Top;
         }
     }
-    getActualPlacement(targetRect, popoverSize) {
+    getActualPlacement(targetRect) {
         const placement = this.placement;
         let actualPlacement = placement;
+        const isVertical = placement === PopoverPlacement.Top
+            || placement === PopoverPlacement.Bottom;
+        const popoverSize = this.getPopoverSize(!this.allowTargetOverlap);
         const clientWidth = document.documentElement.clientWidth;
-        const clientHeight = document.documentElement.clientHeight;
+        let clientHeight = document.documentElement.clientHeight;
+        let popoverHeight = popoverSize.height;
+        if (isVertical) {
+            popoverHeight += this.hideArrow ? 0 : ARROW_SIZE;
+            clientHeight -= Popover_1.VIEWPORT_MARGIN;
+        }
         switch (placement) {
             case PopoverPlacement.Top:
-                if (targetRect.top < popoverSize.height
+                if (targetRect.top < popoverHeight
                     && targetRect.top < clientHeight - targetRect.bottom) {
                     actualPlacement = PopoverPlacement.Bottom;
                 }
                 break;
             case PopoverPlacement.Bottom:
-                if (clientHeight - targetRect.bottom < popoverSize.height
+                if (clientHeight - targetRect.bottom < popoverHeight
                     && clientHeight - targetRect.bottom < targetRect.top) {
                     actualPlacement = PopoverPlacement.Top;
                 }