@ui5/webcomponents 2.13.2 → 2.14.0-rc.1

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\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"]}
+{"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 type List from \"./List.js\";\nimport type ListItem from \"./ListItem.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\";\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?: Array<Date> | Array<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): Array<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) => Array<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 * - \"LASTDAYS\" - Represents Last X Days from today. An example value is `{ operator: \"LASTDAYS\", values: [2]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js\";`\n * - \"LASTWEEKS\" - Represents Last X Weeks from today. An example value is `{ operator: \"LASTWEEKS\", values: [3]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js\";`\n * - \"LASTMONTHS\" - Represents Last X Months from today. An example value is `{ operator: \"LASTMONTHS\", values: [6]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js\";`\n * - \"LASTQUARTERS\" - Represents Last X Quarters from today. An example value is `{ operator: \"LASTQUARTERS\", values: [2]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js\";`\n * - \"LASTYEARS\" - Represents Last X Years from today. An example value is `{ operator: \"LASTYEARS\", values: [1]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js\";`\n * - \"NEXTDAYS\" - Represents Next X Days from today. An example value is `{ operator: \"NEXTDAYS\", values: [2]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/NextOptions.js\";`\n * - \"NEXTWEEKS\" - Represents Next X Weeks from today. An example value is `{ operator: \"NEXTWEEKS\", values: [3]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/NextOptions.js\";`\n * - \"NEXTMONTHS\" - Represents Next X Months from today. An example value is `{ operator: \"NEXTMONTHS\", values: [6]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/NextOptions.js\";`\n * - \"NEXTQUARTERS\" - Represents Next X Quarters from today. An example value is `{ operator: \"NEXTQUARTERS\", values: [2]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/NextOptions.js\";`\n * - \"NEXTYEARS\" - Represents Next X Years from today. An example value is `{ operator: \"NEXTYEARS\", values: [1]}`. Import: `import \"@ui5/webcomponents/dist/dynamic-date-range-options/NextOptions.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: Array<IDynamicDateRangeOption> = [];\n\n\tstatic optionsClasses: Map<string, new (operators?: Array<string>) => 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\tthis.optionsObjects = this._createNormalizedOptions();\n\t\tthis._focusSelectedItem();\n\t}\n\n\t/**\n\t * Creates and normalizes options from the options string\n\t */\n\t_createNormalizedOptions(): Array<IDynamicDateRangeOption> {\n\t\tif (!this.optionsObjects.length) { // initialize options on first use\n\t\t\tconst optionKeys = this.splitOptions(this.options).filter(Boolean);\n\t\t\tconst createdOptions: Array<IDynamicDateRangeOption> = [];\n\t\t\tconst classToOperators = new Map<new(operators?: Array<string>) => IDynamicDateRangeOption, Array<string>>();\n\n\t\t\t// Group operators by their class\n\t\t\toptionKeys.forEach(option => {\n\t\t\t\tconst OptionClass = DynamicDateRange.getOptionClass(option);\n\t\t\t\tif (OptionClass) {\n\t\t\t\t\tconst operators = classToOperators.get(OptionClass) || [];\n\t\t\t\t\toperators.push(option);\n\t\t\t\t\tclassToOperators.set(OptionClass, operators);\n\t\t\t\t}\n\t\t\t});\n\n\t\t\tclassToOperators.forEach((operators, OptionClass) => {\n\t\t\t\tcreatedOptions.push(new OptionClass(operators));\n\t\t\t});\n\n\t\t\treturn createdOptions;\n\t\t}\n\t\treturn this.optionsObjects;\n\t}\n\n\tsplitOptions(options: string): Array<string> {\n\t\treturn options.split(\",\").map(s => s.trim());\n\t}\n\n\t_focusSelectedItem() {\n\t\tif (!this.value) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst listItem = this._list?.items.find(item => (item as ListItem).selected === true);\n\t\tif (listItem) {\n\t\t\tthis._list?.focusItem(listItem as ListItem);\n\t\t}\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\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} else if (!this.currentValue || this.currentValue.operator !== this._currentOption.operator) {\n\t\t\tthis.currentValue = undefined;\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\tif (!operator) {\n\t\t\treturn this._currentOption;\n\t\t}\n\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 existingOption = this.optionsObjects.find(option => option.constructor === OptionClass);\n\n\t\t\t\tif (existingOption) {\n\t\t\t\t\texistingOption.operator = operator;\n\t\t\t\t\treturn existingOption;\n\t\t\t\t}\n\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): Array<Date> {\n\t\treturn this.getOption(value.operator)?.toDates(value) as Array<Date>;\n\t}\n\n\tget _hasCurrentOptionTemplate(): boolean {\n\t\treturn !!this._currentOption?.template;\n\t}\n\n\t_submitValue() {\n\t\tconst valueToSubmit = this.currentValue || { operator: this._currentOption?.operator || \"\", values: [] };\n\t\tconst displayString = this._currentOption?.format(valueToSubmit) || \"\";\n\n\t\tif (this._input) {\n\t\t\tthis._input.value = displayString;\n\t\t}\n\n\t\tif (!this._currentOption || !valueToSubmit.operator) {\n\t\t\tthis.value = undefined;\n\t\t} else if (this._currentOption.isValidString(displayString)) {\n\t\t\tthis.value = valueToSubmit;\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) {\n\t\t\tconst correctOption = this.getOption(this.currentValue.operator);\n\t\t\tif (correctOption) {\n\t\t\t\tconst dates = correctOption.toDates(this.currentValue);\n\t\t\t\tconst displayValue = { ...this.currentValue, values: dates };\n\t\t\t\tconst displayText = correctOption.format(displayValue);\n\t\t\t\treturn `${DynamicDateRange.i18nBundle.getText(DYNAMIC_DATE_RANGE_SELECTED_TEXT)}: ${displayText}`;\n\t\t\t}\n\t\t}\n\n\t\tif (this._currentOption) {\n\t\t\tconst emptyValue = { operator: this._currentOption.operator, values: [] };\n\t\t\tconst displayText = this._currentOption.format(emptyValue);\n\t\t\tif (displayText && displayText.trim()) {\n\t\t\t\treturn `${DynamicDateRange.i18nBundle.getText(DYNAMIC_DATE_RANGE_SELECTED_TEXT)}: ${displayText}`;\n\t\t\t}\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\n\t\t// Update _currentOption if the operator changed\n\t\tif (this.currentValue && this.currentValue.operator !== this._currentOption?.operator) {\n\t\t\tthis._currentOption = this.getOption(this.currentValue.operator);\n\t\t}\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/DynamicDateRangeInputTemplate.js

@@ -3,9 +3,7 @@ import Icon from "./Icon.js";
 import Input from "./Input.js";
 import appointment from "@ui5/webcomponents-icons/dist/appointment-2.js";
 export default function DynamicDateRangeInputTemplate() {
-    return (_jsx("div", { class: "ui5-dynamic-date-range-root", style: {
-            width: "100%",
-        }, children: _jsx(Input, { "data-sap-focus-ref": true, id: `${this._id}-inner`, class: "ui5-dynamic-date-range-input", value: this.value && this.getOption(this.value?.operator)?.format(this.value), onChange: this.onInputChange, onKeyDown: this.onInputKeyDown, children: _jsx(Icon, { id: `${this._id}-value-help`, slot: "icon", name: appointment, tabindex: -1, mode: this._iconMode, onClick: this._togglePicker, class: {
+    return (_jsx("div", { class: "ui5-dynamic-date-range-root", children: _jsx(Input, { "data-sap-focus-ref": true, id: `${this._id}-inner`, class: "ui5-dynamic-date-range-input", value: this.value && this.getOption(this.value?.operator)?.format(this.value), onChange: this.onInputChange, onKeyDown: this.onInputKeyDown, children: _jsx(Icon, { id: `${this._id}-value-help`, slot: "icon", name: appointment, tabindex: -1, mode: this._iconMode, onClick: this._togglePicker, class: {
                     "inputIcon": true,
                     "inputIcon--pressed": this.open,
                 } }) }) }));

package/dist/DynamicDateRangeInputTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicDateRangeInputTemplate.js","sourceRoot":"","sources":["../src/DynamicDateRangeInputTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,WAAW,MAAM,gDAAgD,CAAC;AAEzE,MAAM,CAAC,OAAO,UAAU,6BAA6B;IACpD,OAAO,CACN,cACC,KAAK,EAAC,6BAA6B,EACnC,KAAK,EAAE;YACN,KAAK,EAAE,MAAM;SACb,YAED,KAAC,KAAK,gCAEL,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,EACvB,KAAK,EAAC,8BAA8B,EACpC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAC7E,QAAQ,EAAE,IAAI,CAAC,aAAa,EAC5B,SAAS,EAAE,IAAI,CAAC,cAAc,YAE9B,KAAC,IAAI,IACJ,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,aAAa,EAC5B,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,WAAW,EACjB,QAAQ,EAAE,CAAC,CAAC,EACZ,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,KAAK,EAAE;oBACN,WAAW,EAAE,IAAI;oBACjB,oBAAoB,EAAE,IAAI,CAAC,IAAI;iBAC/B,GACA,GAEK,GACH,CACN,CAAC;AACH,CAAC","sourcesContent":["import type DynamicDateRange from \"./DynamicDateRange.js\";\nimport Icon from \"./Icon.js\";\nimport Input from \"./Input.js\";\nimport appointment from \"@ui5/webcomponents-icons/dist/appointment-2.js\";\n\nexport default function DynamicDateRangeInputTemplate(this: DynamicDateRange) {\n\treturn (\n\t\t<div\n\t\t\tclass=\"ui5-dynamic-date-range-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-dynamic-date-range-input\"\n\t\t\t\tvalue={this.value && this.getOption(this.value?.operator)?.format(this.value)}\n\t\t\t\tonChange={this.onInputChange}\n\t\t\t\tonKeyDown={this.onInputKeyDown}\n\t\t\t>\n\t\t\t\t<Icon\n\t\t\t\t\tid={`${this._id}-value-help`}\n\t\t\t\t\tslot=\"icon\"\n\t\t\t\t\tname={appointment}\n\t\t\t\t\ttabindex={-1}\n\t\t\t\t\tmode={this._iconMode}\n\t\t\t\t\tonClick={this._togglePicker}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t\"inputIcon\": true,\n\t\t\t\t\t\t\"inputIcon--pressed\": this.open,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\n\t\t\t</Input>\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"file":"DynamicDateRangeInputTemplate.js","sourceRoot":"","sources":["../src/DynamicDateRangeInputTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,WAAW,MAAM,gDAAgD,CAAC;AAEzE,MAAM,CAAC,OAAO,UAAU,6BAA6B;IACpD,OAAO,CACN,cAAK,KAAK,EAAC,6BAA6B,YACvC,KAAC,KAAK,gCAEL,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,EACvB,KAAK,EAAC,8BAA8B,EACpC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAC7E,QAAQ,EAAE,IAAI,CAAC,aAAa,EAC5B,SAAS,EAAE,IAAI,CAAC,cAAc,YAE9B,KAAC,IAAI,IACJ,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,aAAa,EAC5B,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,WAAW,EACjB,QAAQ,EAAE,CAAC,CAAC,EACZ,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,KAAK,EAAE;oBACN,WAAW,EAAE,IAAI;oBACjB,oBAAoB,EAAE,IAAI,CAAC,IAAI;iBAC/B,GACA,GAEK,GACH,CACN,CAAC;AACH,CAAC","sourcesContent":["import type DynamicDateRange from \"./DynamicDateRange.js\";\nimport Icon from \"./Icon.js\";\nimport Input from \"./Input.js\";\nimport appointment from \"@ui5/webcomponents-icons/dist/appointment-2.js\";\n\nexport default function DynamicDateRangeInputTemplate(this: DynamicDateRange) {\n\treturn (\n\t\t<div class=\"ui5-dynamic-date-range-root\">\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-dynamic-date-range-input\"\n\t\t\t\tvalue={this.value && this.getOption(this.value?.operator)?.format(this.value)}\n\t\t\t\tonChange={this.onInputChange}\n\t\t\t\tonKeyDown={this.onInputKeyDown}\n\t\t\t>\n\t\t\t\t<Icon\n\t\t\t\t\tid={`${this._id}-value-help`}\n\t\t\t\t\tslot=\"icon\"\n\t\t\t\t\tname={appointment}\n\t\t\t\t\ttabindex={-1}\n\t\t\t\t\tmode={this._iconMode}\n\t\t\t\t\tonClick={this._togglePicker}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t\"inputIcon\": true,\n\t\t\t\t\t\t\"inputIcon--pressed\": this.open,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\n\t\t\t</Input>\n\t\t</div>\n\t);\n}\n"]}

package/dist/DynamicDateRangePopoverTemplate.js

@@ -8,9 +8,7 @@ import slimArrowLeft from "@ui5/webcomponents-icons/dist/slim-arrow-left.js";
 import ListItemType from "./types/ListItemType.js";
 export default function DynamicDateRangePopoverTemplate() {
     return (_jsxs(ResponsivePopover, { id: `${this._id}-responsive-popover`, opener: this, open: this.open, allowTargetOverlap: true, placement: "Bottom", horizontalAlign: "Start", hideArrow: true, _hideHeader: true, onClose: this.onPopoverClose, onOpen: this.onPopoverOpen, onKeyDown: this.onKeyDownPopover, children: [this._hasCurrentOptionTemplate &&
-                _jsxs("div", { slot: "header", class: "ui5-ddr-header", children: [_jsx(Button, { iconOnly: true, icon: slimArrowLeft, design: "Transparent", onClick: this.onButtonBackClick, tooltip: this.tooltipNavigationIcon }), _jsx(Title, { children: this._currentOption?.text })] }), !this._hasCurrentOptionTemplate ? _jsx("div", { class: "ui5-dynamic-date-range-options", children: _jsx(List, { class: "ui5-dynamic-date-range-options-list", separators: "None", selectionMode: "Single", onItemClick: this._selectOption, children: this.optionsObjects.map(option => {
-                        return _jsx(ListItemStandard, { selected: option.operator === this.value?.operator, iconEnd: true, icon: option.icon, type: !option.template ? ListItemType.Active : ListItemType.Navigation, children: option.text });
-                    }) }) })
+                _jsxs("div", { slot: "header", class: "ui5-ddr-header", children: [_jsx(Button, { iconOnly: true, icon: slimArrowLeft, design: "Transparent", onClick: this.onButtonBackClick, tooltip: this.tooltipNavigationIcon }), _jsx(Title, { children: this._currentOption?.text })] }), !this._hasCurrentOptionTemplate ? _jsx("div", { class: "ui5-dynamic-date-range-options", children: _jsx(List, { class: "ui5-dynamic-date-range-options-list", separators: "None", selectionMode: "Single", onItemClick: this._selectOption, children: this.optionsObjects.map(option => (_jsx(ListItemStandard, { selected: option.operator === this.value?.operator, iconEnd: true, icon: option.icon, wrappingType: "Normal", type: option.template ? ListItemType.Navigation : ListItemType.Active, children: option.text }))) }) })
                 :
                     _jsxs("div", { class: "ui5-dynamic-date-range-option-container", children: [this._currentOption?.template?.call(this), _jsx("div", { class: "ui5-ddr-current-value", children: this.currentValueText })] }), this._hasCurrentOptionTemplate &&
                 _jsxs("div", { slot: "footer", children: [_jsx(Button, { design: "Emphasized", onClick: this._submitValue, children: "Submit" }), _jsx(Button, { design: "Transparent", onClick: this._close, children: "Close" })] })] }));

package/dist/DynamicDateRangePopoverTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicDateRangePopoverTemplate.js","sourceRoot":"","sources":["../src/DynamicDateRangePopoverTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,iBAAiB,MAAM,wBAAwB,CAAC;AACvD,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AACrD,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,aAAa,MAAM,kDAAkD,CAAC;AAC7E,OAAO,YAAY,MAAM,yBAAyB,CAAC;AAEnD,MAAM,CAAC,OAAO,UAAU,+BAA+B;IACtD,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,SAAS,EAAE,IAAI,EACf,WAAW,EAAE,IAAI,EACjB,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,MAAM,EAAE,IAAI,CAAC,aAAa,EAC1B,SAAS,EAAE,IAAI,CAAC,gBAAgB,aAE/B,IAAI,CAAC,yBAAyB;gBAC9B,eAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,gBAAgB,aACxC,KAAC,MAAM,IACN,QAAQ,EAAE,IAAI,EACd,IAAI,EAAE,aAAa,EACnB,MAAM,EAAC,aAAa,EACpB,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,OAAO,EAAE,IAAI,CAAC,qBAAqB,GAC3B,EACT,KAAC,KAAK,cAAE,IAAI,CAAC,cAAc,EAAE,IAAI,GAAS,IACrC,EAEN,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC,CAAC,cAAK,KAAK,EAAC,gCAAgC,YAC7E,KAAC,IAAI,IACJ,KAAK,EAAC,qCAAqC,EAC3C,UAAU,EAAC,MAAM,EACjB,aAAa,EAAC,QAAQ,EACtB,WAAW,EAAE,IAAI,CAAC,aAAa,YAE9B,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;wBACjC,OAAO,KAAC,gBAAgB,IACvB,QAAQ,EAAE,MAAM,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK,EAAE,QAAQ,EAClD,OAAO,EAAE,IAAI,EACb,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,IAAI,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,YACrE,MAAM,CAAC,IAAI,GACM,CAAC;oBACrB,CAAC,CAAC,GACI,GACF;gBACL,CAAC;oBACD,eAAK,KAAK,EAAC,yCAAyC,aAClD,IAAI,CAAC,cAAc,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,EAC1C,cAAK,KAAK,EAAC,uBAAuB,YAAE,IAAI,CAAC,gBAAgB,GAAO,IAC3D,EAEN,IAAI,CAAC,yBAAyB;gBAC9B,eAAK,IAAI,EAAC,QAAQ,aACjB,KAAC,MAAM,IACN,MAAM,EAAC,YAAY,EACnB,OAAO,EAAE,IAAI,CAAC,YAAY,uBACX,EAChB,KAAC,MAAM,IACN,MAAM,EAAC,aAAa,EACpB,OAAO,EAAE,IAAI,CAAC,MAAM,sBACN,IACV,IAEY,CACpB,CAAC;AACH,CAAC","sourcesContent":["import type DynamicDateRange from \"./DynamicDateRange.js\";\nimport ResponsivePopover from \"./ResponsivePopover.js\";\nimport List from \"./List.js\";\nimport ListItemStandard from \"./ListItemStandard.js\";\nimport Button from \"./Button.js\";\nimport Title from \"./Title.js\";\nimport slimArrowLeft from \"@ui5/webcomponents-icons/dist/slim-arrow-left.js\";\nimport ListItemType from \"./types/ListItemType.js\";\n\nexport default function DynamicDateRangePopoverTemplate(this: DynamicDateRange) {\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\thideArrow={true}\n\t\t\t_hideHeader={true}\n\t\t\tonClose={this.onPopoverClose}\n\t\t\tonOpen={this.onPopoverOpen}\n\t\t\tonKeyDown={this.onKeyDownPopover}\n\t\t>\n\t\t\t{this._hasCurrentOptionTemplate &&\n\t\t\t\t<div slot=\"header\" class=\"ui5-ddr-header\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\ticon={slimArrowLeft}\n\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\tonClick={this.onButtonBackClick}\n\t\t\t\t\t\ttooltip={this.tooltipNavigationIcon}>\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Title>{this._currentOption?.text}</Title>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t{!this._hasCurrentOptionTemplate ? <div class=\"ui5-dynamic-date-range-options\">\n\t\t\t\t<List\n\t\t\t\t\tclass=\"ui5-dynamic-date-range-options-list\"\n\t\t\t\t\tseparators=\"None\"\n\t\t\t\t\tselectionMode=\"Single\"\n\t\t\t\t\tonItemClick={this._selectOption}\n\t\t\t\t>\n\t\t\t\t\t{this.optionsObjects.map(option => {\n\t\t\t\t\t\treturn <ListItemStandard\n\t\t\t\t\t\t\tselected={option.operator === this.value?.operator}\n\t\t\t\t\t\t\ticonEnd={true}\n\t\t\t\t\t\t\ticon={option.icon}\n\t\t\t\t\t\t\ttype={!option.template ? ListItemType.Active : ListItemType.Navigation}>\n\t\t\t\t\t\t\t{option.text}\n\t\t\t\t\t\t</ListItemStandard>;\n\t\t\t\t\t})}\n\t\t\t\t</List>\n\t\t\t</div>\n\t\t\t\t:\n\t\t\t\t<div class=\"ui5-dynamic-date-range-option-container\">\n\t\t\t\t\t{this._currentOption?.template?.call(this)}\n\t\t\t\t\t<div class=\"ui5-ddr-current-value\">{this.currentValueText}</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t{this._hasCurrentOptionTemplate &&\n\t\t\t\t<div slot=\"footer\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdesign=\"Emphasized\"\n\t\t\t\t\t\tonClick={this._submitValue}\n\t\t\t\t\t>Submit</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\tonClick={this._close}\n\t\t\t\t\t>Close</Button>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</ResponsivePopover>\n\t);\n}\n"]}
+{"version":3,"file":"DynamicDateRangePopoverTemplate.js","sourceRoot":"","sources":["../src/DynamicDateRangePopoverTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,iBAAiB,MAAM,wBAAwB,CAAC;AACvD,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AACrD,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,aAAa,MAAM,kDAAkD,CAAC;AAC7E,OAAO,YAAY,MAAM,yBAAyB,CAAC;AAEnD,MAAM,CAAC,OAAO,UAAU,+BAA+B;IACtD,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,SAAS,EAAE,IAAI,EACf,WAAW,EAAE,IAAI,EACjB,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,MAAM,EAAE,IAAI,CAAC,aAAa,EAC1B,SAAS,EAAE,IAAI,CAAC,gBAAgB,aAE/B,IAAI,CAAC,yBAAyB;gBAC9B,eAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,gBAAgB,aACxC,KAAC,MAAM,IACN,QAAQ,EAAE,IAAI,EACd,IAAI,EAAE,aAAa,EACnB,MAAM,EAAC,aAAa,EACpB,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,OAAO,EAAE,IAAI,CAAC,qBAAqB,GAC3B,EACT,KAAC,KAAK,cAAE,IAAI,CAAC,cAAc,EAAE,IAAI,GAAS,IACrC,EAEN,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC,CAAC,cAAK,KAAK,EAAC,gCAAgC,YAC7E,KAAC,IAAI,IACJ,KAAK,EAAC,qCAAqC,EAC3C,UAAU,EAAC,MAAM,EACjB,aAAa,EAAC,QAAQ,EACtB,WAAW,EAAE,IAAI,CAAC,aAAa,YAE9B,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAClC,KAAC,gBAAgB,IAChB,QAAQ,EAAE,MAAM,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK,EAAE,QAAQ,EAClD,OAAO,EAAE,IAAI,EACb,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,YAAY,EAAC,QAAQ,EACrB,IAAI,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,YAEpE,MAAM,CAAC,IAAI,GACM,CACnB,CAAC,GACI,GACF;gBACL,CAAC;oBACD,eAAK,KAAK,EAAC,yCAAyC,aAClD,IAAI,CAAC,cAAc,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,EAC1C,cAAK,KAAK,EAAC,uBAAuB,YAAE,IAAI,CAAC,gBAAgB,GAAO,IAC3D,EAEN,IAAI,CAAC,yBAAyB;gBAC9B,eAAK,IAAI,EAAC,QAAQ,aACjB,KAAC,MAAM,IACN,MAAM,EAAC,YAAY,EACnB,OAAO,EAAE,IAAI,CAAC,YAAY,uBACX,EAChB,KAAC,MAAM,IACN,MAAM,EAAC,aAAa,EACpB,OAAO,EAAE,IAAI,CAAC,MAAM,sBACN,IACV,IAEY,CACpB,CAAC;AACH,CAAC","sourcesContent":["import type DynamicDateRange from \"./DynamicDateRange.js\";\nimport ResponsivePopover from \"./ResponsivePopover.js\";\nimport List from \"./List.js\";\nimport ListItemStandard from \"./ListItemStandard.js\";\nimport Button from \"./Button.js\";\nimport Title from \"./Title.js\";\nimport slimArrowLeft from \"@ui5/webcomponents-icons/dist/slim-arrow-left.js\";\nimport ListItemType from \"./types/ListItemType.js\";\n\nexport default function DynamicDateRangePopoverTemplate(this: DynamicDateRange) {\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\thideArrow={true}\n\t\t\t_hideHeader={true}\n\t\t\tonClose={this.onPopoverClose}\n\t\t\tonOpen={this.onPopoverOpen}\n\t\t\tonKeyDown={this.onKeyDownPopover}\n\t\t>\n\t\t\t{this._hasCurrentOptionTemplate &&\n\t\t\t\t<div slot=\"header\" class=\"ui5-ddr-header\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\ticon={slimArrowLeft}\n\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\tonClick={this.onButtonBackClick}\n\t\t\t\t\t\ttooltip={this.tooltipNavigationIcon}>\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Title>{this._currentOption?.text}</Title>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t{!this._hasCurrentOptionTemplate ? <div class=\"ui5-dynamic-date-range-options\">\n\t\t\t\t<List\n\t\t\t\t\tclass=\"ui5-dynamic-date-range-options-list\"\n\t\t\t\t\tseparators=\"None\"\n\t\t\t\t\tselectionMode=\"Single\"\n\t\t\t\t\tonItemClick={this._selectOption}\n\t\t\t\t>\n\t\t\t\t\t{this.optionsObjects.map(option => (\n\t\t\t\t\t\t<ListItemStandard\n\t\t\t\t\t\t\tselected={option.operator === this.value?.operator}\n\t\t\t\t\t\t\ticonEnd={true}\n\t\t\t\t\t\t\ticon={option.icon}\n\t\t\t\t\t\t\twrappingType=\"Normal\"\n\t\t\t\t\t\t\ttype={option.template ? ListItemType.Navigation : ListItemType.Active}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{option.text}\n\t\t\t\t\t\t</ListItemStandard>\n\t\t\t\t\t))}\n\t\t\t\t</List>\n\t\t\t</div>\n\t\t\t\t:\n\t\t\t\t<div class=\"ui5-dynamic-date-range-option-container\">\n\t\t\t\t\t{this._currentOption?.template?.call(this)}\n\t\t\t\t\t<div class=\"ui5-ddr-current-value\">{this.currentValueText}</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t{this._hasCurrentOptionTemplate &&\n\t\t\t\t<div slot=\"footer\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdesign=\"Emphasized\"\n\t\t\t\t\t\tonClick={this._submitValue}\n\t\t\t\t\t>Submit</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\tonClick={this._close}\n\t\t\t\t\t>Close</Button>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</ResponsivePopover>\n\t);\n}\n"]}

package/dist/List.d.ts

@@ -2,6 +2,7 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
 import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
 import type { ClassMap } from "@ui5/webcomponents-base/dist/types.js";
+import DragAndDropHandler from "./delegate/DragAndDropHandler.js";
 import type { MoveEventDetail } from "@ui5/webcomponents-base/dist/util/dragAndDrop/DragRegistry.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import ListSelectionMode from "./types/ListSelectionMode.js";
@@ -294,6 +295,7 @@ declare class List extends UI5Element {
     onForwardAfterBound: (e: CustomEvent) => void;
     onForwardBeforeBound: (e: CustomEvent) => void;
     onItemTabIndexChangeBound: (e: CustomEvent) => void;
+    _dragAndDropHandler: DragAndDropHandler;
     constructor();
     /**
      * Returns an array containing the list item instances without the groups in a flat structure.

package/dist/List.js

@@ -17,11 +17,9 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js";
 import { isTabNext, isSpace, isEnter, isTabPrevious, isCtrl, isEnd, isHome, isDown, isUp, } from "@ui5/webcomponents-base/dist/Keys.js";
-import handleDragOver from "@ui5/webcomponents-base/dist/util/dragAndDrop/handleDragOver.js";
-import handleDrop from "@ui5/webcomponents-base/dist/util/dragAndDrop/handleDrop.js";
-import Orientation from "@ui5/webcomponents-base/dist/types/Orientation.js";
 import DragRegistry from "@ui5/webcomponents-base/dist/util/dragAndDrop/DragRegistry.js";
-import { findClosestPosition, findClosestPositionsByKey } from "@ui5/webcomponents-base/dist/util/dragAndDrop/findClosestPosition.js";
+import DragAndDropHandler from "./delegate/DragAndDropHandler.js";
+import { findClosestPositionsByKey } from "@ui5/webcomponents-base/dist/util/dragAndDrop/findClosestPosition.js";
 import NavigationMode from "@ui5/webcomponents-base/dist/types/NavigationMode.js";
 import { getAllAccessibleDescriptionRefTexts, getEffectiveAriaDescriptionText, getEffectiveAriaLabelText, registerUI5Element, deregisterUI5Element, getAllAccessibleNameRefTexts, } from "@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js";
 import getNormalizedTarget from "@ui5/webcomponents-base/dist/util/getNormalizedTarget.js";
@@ -206,6 +204,13 @@ let List = List_1 = class List extends UI5Element {
         this.onForwardAfterBound = this.onForwardAfter.bind(this);
         this.onForwardBeforeBound = this.onForwardBefore.bind(this);
         this.onItemTabIndexChangeBound = this.onItemTabIndexChange.bind(this);
+        // Initialize the DragAndDropHandler with the necessary configurations
+        // The handler will manage the drag and drop operations for the list items.
+        this._dragAndDropHandler = new DragAndDropHandler(this, {
+            getItems: () => this.items,
+            getDropIndicator: () => this.dropIndicatorDOM,
+            useOriginalEvent: true,
+        });
     }
     /**
      * Returns an array containing the list item instances without the groups in a flat structure.
@@ -718,34 +723,16 @@ let List = List_1 = class List extends UI5Element {
         this.setForwardingFocus(false);
     }
     _ondragenter(e) {
-        e.preventDefault();
+        this._dragAndDropHandler.ondragenter(e);
     }
     _ondragleave(e) {
-        if (e.relatedTarget instanceof Node && this.shadowRoot.contains(e.relatedTarget)) {
-            return;
-        }
-        this.dropIndicatorDOM.targetReference = null;
+        this._dragAndDropHandler.ondragleave(e);
     }
     _ondragover(e) {
-        if (!(e.target instanceof HTMLElement)) {
-            return;
-        }
-        const closestPosition = findClosestPosition(this.items, e.clientY, Orientation.Vertical);
-        if (!closestPosition) {
-            this.dropIndicatorDOM.targetReference = null;
-            return;
-        }
-        const { targetReference, placement } = handleDragOver(e, this, closestPosition, closestPosition.element, { originalEvent: true });
-        this.dropIndicatorDOM.targetReference = targetReference;
-        this.dropIndicatorDOM.placement = placement;
+        this._dragAndDropHandler.ondragover(e);
     }
     _ondrop(e) {
-        if (!this.dropIndicatorDOM?.targetReference || !this.dropIndicatorDOM?.placement) {
-            e.preventDefault();
-            return;
-        }
-        handleDrop(e, this, this.dropIndicatorDOM.targetReference, this.dropIndicatorDOM.placement, { originalEvent: true });
-        this.dropIndicatorDOM.targetReference = null;
+        this._dragAndDropHandler.ondrop(e);
     }
     isForwardElement(element) {
         const elementId = element.id;