@ui5/webcomponents 2.27.0-rc.0 → 2.27.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/dist/.tsbuildinfo +1 -1
  3. package/dist/DatePicker.d.ts +4 -4
  4. package/dist/DatePicker.js +4 -4
  5. package/dist/DatePicker.js.map +1 -1
  6. package/dist/DayPicker.d.ts +1 -0
  7. package/dist/DayPicker.js +4 -1
  8. package/dist/DayPicker.js.map +1 -1
  9. package/dist/DayPickerTemplate.js +1 -1
  10. package/dist/DayPickerTemplate.js.map +1 -1
  11. package/dist/Icon.js +3 -0
  12. package/dist/Icon.js.map +1 -1
  13. package/dist/List.js +1 -1
  14. package/dist/List.js.map +1 -1
  15. package/dist/ListItem.d.ts +4 -2
  16. package/dist/ListItem.js +5 -9
  17. package/dist/ListItem.js.map +1 -1
  18. package/dist/ListItemGroup.d.ts +7 -23
  19. package/dist/ListItemGroup.js +4 -21
  20. package/dist/ListItemGroup.js.map +1 -1
  21. package/dist/ListItemGroupBase.d.ts +41 -0
  22. package/dist/ListItemGroupBase.js +54 -0
  23. package/dist/ListItemGroupBase.js.map +1 -0
  24. package/dist/ListItemStandardTemplate.js +1 -1
  25. package/dist/ListItemStandardTemplate.js.map +1 -1
  26. package/dist/OptionGroup.d.ts +4 -4
  27. package/dist/OptionGroup.js +3 -3
  28. package/dist/OptionGroup.js.map +1 -1
  29. package/dist/Popover.js +5 -3
  30. package/dist/Popover.js.map +1 -1
  31. package/dist/SplitButton.d.ts +7 -3
  32. package/dist/SplitButton.js +4 -4
  33. package/dist/SplitButton.js.map +1 -1
  34. package/dist/SplitButtonTemplate.js +1 -1
  35. package/dist/SplitButtonTemplate.js.map +1 -1
  36. package/dist/ToolbarButton.d.ts +18 -0
  37. package/dist/ToolbarButton.js +16 -0
  38. package/dist/ToolbarButton.js.map +1 -1
  39. package/dist/ToolbarButtonTemplate.js +1 -1
  40. package/dist/ToolbarButtonTemplate.js.map +1 -1
  41. package/dist/custom-elements-internal.json +153 -182
  42. package/dist/custom-elements.json +136 -124
  43. package/dist/generated/assets/i18n/messagebundle_en.json +1 -1
  44. package/dist/generated/assets/i18n/messagebundle_en_US_saprigi.json +1 -1
  45. package/dist/generated/i18n/i18n-defaults.d.ts +2 -1
  46. package/dist/generated/i18n/i18n-defaults.js +2 -1
  47. package/dist/generated/i18n/i18n-defaults.js.map +1 -1
  48. package/dist/vscode.html-custom-data.json +25 -25
  49. package/dist/web-types.json +54 -84
  50. package/package.json +9 -9
  51. package/src/DayPickerTemplate.tsx +1 -1
  52. package/src/ListItemStandardTemplate.tsx +1 -1
  53. package/src/SplitButtonTemplate.tsx +1 -2
  54. package/src/ToolbarButtonTemplate.tsx +2 -0
  55. package/src/i18n/messagebundle.properties +3 -0
  56. package/src/i18n/messagebundle_en.properties +2 -0
  57. package/src/i18n/messagebundle_en_US_saprigi.properties +7 -6
@@ -1,11 +1,9 @@
1
- import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
2
- import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js";
1
+ import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js";
3
2
  import DragAndDropHandler from "./delegate/DragAndDropHandler.js";
4
3
  import MovePlacement from "@ui5/webcomponents-base/dist/types/MovePlacement.js";
5
4
  import type DropIndicator from "./DropIndicator.js";
6
5
  import type ListItemBase from "./ListItemBase.js";
7
- import type { ListItemBaseClickEventDetail } from "./ListItemBase.js";
8
- import type ListItemGroupHeader from "./ListItemGroupHeader.js";
6
+ import ListItemGroupBase from "./ListItemGroupBase.js";
9
7
  import WrappingType from "./types/WrappingType.js";
10
8
  type ListItemGroupMoveEventDetail = {
11
9
  source: {
@@ -28,33 +26,21 @@ type ListItemGroupMoveEventDetail = {
28
26
  * @csspart header - Used to style the header item of the group
29
27
  * @csspart title - Used to style the title of the group header
30
28
  * @constructor
31
- * @extends UI5Element
29
+ * @extends ListItemGroupBase
32
30
  * @public
33
31
  * @since 2.0.0
34
32
  */
35
- declare class ListItemGroup extends UI5Element {
36
- eventDetails: {
37
- "click"?: ListItemBaseClickEventDetail;
33
+ declare class ListItemGroup extends ListItemGroupBase {
34
+ eventDetails: ListItemGroupBase["eventDetails"] & {
38
35
  "move-over": ListItemGroupMoveEventDetail;
39
36
  "move": ListItemGroupMoveEventDetail;
40
37
  };
41
- /**
42
- * Defines the header text of the <code>ui5-li-group</code>.
43
- * @public
44
- * @default undefined
45
- */
46
- headerText?: string;
47
38
  /**
48
39
  * Defines the accessible name of the header.
49
40
  * @public
50
41
  * @default undefined
51
42
  */
52
43
  headerAccessibleName?: string;
53
- /**
54
- * Defines the items of the <code>ui5-li-group</code>.
55
- * @public
56
- */
57
- items: DefaultSlot<ListItemBase>;
58
44
  /**
59
45
  * Defines if the text of the component should wrap when it's too long.
60
46
  * When set to "Normal", the content (title, description) will be wrapped
@@ -87,19 +73,17 @@ declare class ListItemGroup extends UI5Element {
87
73
  header: Slot<ListItemBase>;
88
74
  _dragAndDropHandler: DragAndDropHandler;
89
75
  constructor();
90
- get groupHeaderItem(): ListItemGroupHeader;
91
76
  get hasHeader(): boolean;
92
77
  get hasFormattedHeader(): boolean;
93
- get isListItemGroup(): boolean;
94
78
  get dropIndicatorDOM(): DropIndicator | null;
95
79
  _ondragenter(e: DragEvent): void;
96
80
  _ondragleave(e: DragEvent): void;
97
81
  _ondragover(e: DragEvent): void;
98
82
  _ondrop(e: DragEvent): void;
99
83
  _filterPlacements(placements: MovePlacement[], draggedElement: HTMLElement, targetElement: HTMLElement): MovePlacement[];
100
- getFocusDomRef(): ListItemGroupHeader;
84
+ getFocusDomRef(): import("./ListItemGroupHeader.js").default;
101
85
  getGroupHeaderWrapping(): WrappingType;
102
86
  }
103
87
  export default ListItemGroup;
104
- export declare const isInstanceOfListItemGroup: (object: any) => object is ListItemGroup;
88
+ export { isInstanceOfListItemGroup } from "./ListItemGroupBase.js";
105
89
  export type { ListItemGroupMoveEventDetail };
@@ -9,15 +9,14 @@ import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
9
9
  import property from "@ui5/webcomponents-base/dist/decorators/property.js";
10
10
  import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
11
11
  import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
12
- import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
13
12
  import DragAndDropHandler from "./delegate/DragAndDropHandler.js";
14
13
  import MovePlacement from "@ui5/webcomponents-base/dist/types/MovePlacement.js";
14
+ import ListItemGroupBase from "./ListItemGroupBase.js";
15
15
  // Template
16
16
  import ListItemGroupTemplate from "./ListItemGroupTemplate.js";
17
17
  // Styles
18
18
  import ListItemGroupCss from "./generated/themes/ListItemGroup.css.js";
19
19
  import WrappingType from "./types/WrappingType.js";
20
- import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js";
21
20
  /**
22
21
  * @class
23
22
  * ### Overview
@@ -30,11 +29,11 @@ import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInsta
30
29
  * @csspart header - Used to style the header item of the group
31
30
  * @csspart title - Used to style the title of the group header
32
31
  * @constructor
33
- * @extends UI5Element
32
+ * @extends ListItemGroupBase
34
33
  * @public
35
34
  * @since 2.0.0
36
35
  */
37
- let ListItemGroup = class ListItemGroup extends UI5Element {
36
+ let ListItemGroup = class ListItemGroup extends ListItemGroupBase {
38
37
  constructor() {
39
38
  super();
40
39
  /**
@@ -68,18 +67,12 @@ let ListItemGroup = class ListItemGroup extends UI5Element {
68
67
  filterPlacements: this._filterPlacements.bind(this),
69
68
  });
70
69
  }
71
- get groupHeaderItem() {
72
- return this.shadowRoot.querySelector("[ui5-li-group-header]");
73
- }
74
70
  get hasHeader() {
75
71
  return !!this.headerText || this.hasFormattedHeader;
76
72
  }
77
73
  get hasFormattedHeader() {
78
74
  return !!this.header.length;
79
75
  }
80
- get isListItemGroup() {
81
- return true;
82
- }
83
76
  get dropIndicatorDOM() {
84
77
  return this.shadowRoot.querySelector("[ui5-drop-indicator]");
85
78
  }
@@ -107,19 +100,9 @@ let ListItemGroup = class ListItemGroup extends UI5Element {
107
100
  }
108
101
  getGroupHeaderWrapping() { return WrappingType.None; }
109
102
  };
110
- __decorate([
111
- property()
112
- ], ListItemGroup.prototype, "headerText", void 0);
113
103
  __decorate([
114
104
  property()
115
105
  ], ListItemGroup.prototype, "headerAccessibleName", void 0);
116
- __decorate([
117
- slot({
118
- "default": true,
119
- invalidateOnChildChange: true,
120
- type: HTMLElement,
121
- })
122
- ], ListItemGroup.prototype, "items", void 0);
123
106
  __decorate([
124
107
  property()
125
108
  ], ListItemGroup.prototype, "wrappingType", void 0);
@@ -167,5 +150,5 @@ ListItemGroup = __decorate([
167
150
  ], ListItemGroup);
168
151
  ListItemGroup.define();
169
152
  export default ListItemGroup;
170
- export const isInstanceOfListItemGroup = createInstanceChecker("isListItemGroup");
153
+ export { isInstanceOfListItemGroup } from "./ListItemGroupBase.js";
171
154
  //# sourceMappingURL=ListItemGroup.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemGroup.js","sourceRoot":"","sources":["../src/ListItemGroup.ts"],"names":[],"mappings":"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","sourcesContent":["import slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot, DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport DragAndDropHandler from \"./delegate/DragAndDropHandler.js\";\nimport MovePlacement from \"@ui5/webcomponents-base/dist/types/MovePlacement.js\";\nimport type DropIndicator from \"./DropIndicator.js\";\nimport type ListItemBase from \"./ListItemBase.js\";\nimport type { ListItemBaseClickEventDetail } from \"./ListItemBase.js\";\n\n// Template\nimport ListItemGroupTemplate from \"./ListItemGroupTemplate.js\";\n\n// Styles\nimport ListItemGroupCss from \"./generated/themes/ListItemGroup.css.js\";\nimport type ListItemGroupHeader from \"./ListItemGroupHeader.js\";\nimport WrappingType from \"./types/WrappingType.js\";\nimport createInstanceChecker from \"@ui5/webcomponents-base/dist/util/createInstanceChecker.js\";\n\ntype ListItemGroupMoveEventDetail = {\n\tsource: {\n\t\telement: HTMLElement,\n\t},\n\tdestination: {\n\t\telement: HTMLElement,\n\t\tplacement: `${MovePlacement}`,\n\t}\n}\n\n/**\n * @class\n * ### Overview\n * The `ui5-li-group` is a special list item, used only to create groups of list items.\n *\n * This is the item to use inside a `ui5-list`.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/ListItemGroup.js\";`\n * @csspart header - Used to style the header item of the group\n * @csspart title - Used to style the title of the group header\n * @constructor\n * @extends UI5Element\n * @public\n * @since 2.0.0\n */\n@customElement({\n\ttag: \"ui5-li-group\",\n\trenderer: jsxRenderer,\n\tlanguageAware: true,\n\ttemplate: ListItemGroupTemplate,\n\tstyles: [ListItemGroupCss],\n})\n\n/**\n * Fired when a movable list item is moved over a potential drop target during a dragging operation.\n *\n * If the new position is valid, prevent the default action of the event using `preventDefault()`.\n * @param {object} source Contains information about the moved element under `element` property.\n * @param {object} destination Contains information about the destination of the moved element. Has `element` and `placement` properties.\n * @public\n * @since 2.1.0\n */\n\n@event(\"move-over\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n\n/**\n * Fired when a movable list item is dropped onto a drop target.\n *\n * **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.\n * @param {object} source Contains information about the moved element under `element` property.\n * @param {object} destination Contains information about the destination of the moved element. Has `element` and `placement` properties.\n * @public\n * @since 2.1.0\n */\n@event(\"move\", {\n\tbubbles: true,\n})\n\nclass ListItemGroup extends UI5Element {\n\teventDetails!: {\n\t\t\"click\"?: ListItemBaseClickEventDetail,\n\t\t\"move-over\": ListItemGroupMoveEventDetail,\n\t\t\"move\": ListItemGroupMoveEventDetail,\n\t}\n\t/**\n\t * Defines the header text of the <code>ui5-li-group</code>.\n\t * @public\n\t * @default undefined\n\t */\n\t@property()\n\theaderText?: string;\n\n\t/**\n\t * Defines the accessible name of the header.\n\t * @public\n\t * @default undefined\n\t */\n\t@property()\n\theaderAccessibleName?: string;\n\n\t/**\n\t * Defines the items of the <code>ui5-li-group</code>.\n\t * @public\n\t */\n\t@slot({\n\t\t\"default\": true,\n\t\tinvalidateOnChildChange: true,\n\t\ttype: HTMLElement,\n\t})\n\titems!: DefaultSlot<ListItemBase>;\n\n\t/**\n\t * Defines if the text of the component should wrap when it's too long.\n\t * When set to \"Normal\", the content (title, description) will be wrapped\n\t * using the `ui5-expandable-text` component.<br/>\n\t *\n\t * The text can wrap up to 100 characters on small screens (size S) and\n\t * up to 300 characters on larger screens (size M and above). When text exceeds\n\t * these limits, it truncates with an ellipsis followed by a text expansion trigger.\n\t *\n\t * Available options are:\n\t * - `None` (default) - The text will truncate with an ellipsis.\n\t * - `Normal` - The text will wrap (without truncation).\n\t *\n\t * @default \"None\"\n\t * @public\n\t * @since 2.15.0\n\t */\n\t@property()\n\twrappingType: `${WrappingType}` = \"None\";\n\n\t/**\n\t * Indicates whether the header is focused\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tfocused = false;\n\n\t/**\n\t* Defines the header of the component.\n\t*\n\t* **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.\n\t* @public\n\t*/\n\t@slot()\n\theader!: Slot<ListItemBase>;\n\n\t_dragAndDropHandler: DragAndDropHandler;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\t// Initialize the DragAndDropHandler with the necessary configurations\n\t\t// The handler will manage the drag and drop operations for the list items.\n\t\tthis._dragAndDropHandler = new DragAndDropHandler(this, {\n\t\t\tgetItems: () => this.items,\n\t\t\tgetDropIndicator: () => this.dropIndicatorDOM,\n\t\t\tfilterPlacements: this._filterPlacements.bind(this),\n\t\t});\n\t}\n\n\tget groupHeaderItem() {\n\t\treturn this.shadowRoot!.querySelector<ListItemGroupHeader>(\"[ui5-li-group-header]\")!;\n\t}\n\n\tget hasHeader(): boolean {\n\t\treturn !!this.headerText || this.hasFormattedHeader;\n\t}\n\n\tget hasFormattedHeader(): boolean {\n\t\treturn !!this.header.length;\n\t}\n\n\tget isListItemGroup() {\n\t\treturn true;\n\t}\n\n\tget dropIndicatorDOM(): DropIndicator | null {\n\t\treturn this.shadowRoot!.querySelector(\"[ui5-drop-indicator]\");\n\t}\n\n\t_ondragenter(e: DragEvent) {\n\t\tthis._dragAndDropHandler.ondragenter(e);\n\t}\n\n\t_ondragleave(e: DragEvent) {\n\t\tthis._dragAndDropHandler.ondragleave(e);\n\t}\n\n\t_ondragover(e: DragEvent) {\n\t\tthis._dragAndDropHandler.ondragover(e);\n\t}\n\n\t_ondrop(e: DragEvent) {\n\t\tthis._dragAndDropHandler.ondrop(e);\n\t}\n\n\t_filterPlacements(placements: MovePlacement[], draggedElement: HTMLElement, targetElement: HTMLElement): MovePlacement[] {\n\t\t// Filter out MovePlacement.On when dragged element is the same as target\n\t\tif (targetElement === draggedElement) {\n\t\t\treturn placements.filter(placement => placement !== MovePlacement.On);\n\t\t}\n\t\treturn placements;\n\t}\n\n\tgetFocusDomRef() {\n\t\treturn this.groupHeaderItem || this.items.at(0);\n\t}\n\n\tgetGroupHeaderWrapping(): WrappingType { return WrappingType.None; }\n}\n\nListItemGroup.define();\n\nexport default ListItemGroup;\nexport const isInstanceOfListItemGroup = createInstanceChecker<ListItemGroup>(\"isListItemGroup\");\nexport type { ListItemGroupMoveEventDetail };\n"]}
1
+ {"version":3,"file":"ListItemGroup.js","sourceRoot":"","sources":["../src/ListItemGroup.ts"],"names":[],"mappings":"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","sourcesContent":["import slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport DragAndDropHandler from \"./delegate/DragAndDropHandler.js\";\nimport MovePlacement from \"@ui5/webcomponents-base/dist/types/MovePlacement.js\";\nimport type DropIndicator from \"./DropIndicator.js\";\nimport type ListItemBase from \"./ListItemBase.js\";\nimport ListItemGroupBase from \"./ListItemGroupBase.js\";\n\n// Template\nimport ListItemGroupTemplate from \"./ListItemGroupTemplate.js\";\n\n// Styles\nimport ListItemGroupCss from \"./generated/themes/ListItemGroup.css.js\";\nimport WrappingType from \"./types/WrappingType.js\";\n\ntype ListItemGroupMoveEventDetail = {\n\tsource: {\n\t\telement: HTMLElement,\n\t},\n\tdestination: {\n\t\telement: HTMLElement,\n\t\tplacement: `${MovePlacement}`,\n\t}\n}\n\n/**\n * @class\n * ### Overview\n * The `ui5-li-group` is a special list item, used only to create groups of list items.\n *\n * This is the item to use inside a `ui5-list`.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/ListItemGroup.js\";`\n * @csspart header - Used to style the header item of the group\n * @csspart title - Used to style the title of the group header\n * @constructor\n * @extends ListItemGroupBase\n * @public\n * @since 2.0.0\n */\n@customElement({\n\ttag: \"ui5-li-group\",\n\trenderer: jsxRenderer,\n\tlanguageAware: true,\n\ttemplate: ListItemGroupTemplate,\n\tstyles: [ListItemGroupCss],\n})\n\n/**\n * Fired when a movable list item is moved over a potential drop target during a dragging operation.\n *\n * If the new position is valid, prevent the default action of the event using `preventDefault()`.\n * @param {object} source Contains information about the moved element under `element` property.\n * @param {object} destination Contains information about the destination of the moved element. Has `element` and `placement` properties.\n * @public\n * @since 2.1.0\n */\n\n@event(\"move-over\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n\n/**\n * Fired when a movable list item is dropped onto a drop target.\n *\n * **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.\n * @param {object} source Contains information about the moved element under `element` property.\n * @param {object} destination Contains information about the destination of the moved element. Has `element` and `placement` properties.\n * @public\n * @since 2.1.0\n */\n@event(\"move\", {\n\tbubbles: true,\n})\n\nclass ListItemGroup extends ListItemGroupBase {\n\teventDetails!: ListItemGroupBase[\"eventDetails\"] & {\n\t\t\"move-over\": ListItemGroupMoveEventDetail,\n\t\t\"move\": ListItemGroupMoveEventDetail,\n\t}\n\n\t/**\n\t * Defines the accessible name of the header.\n\t * @public\n\t * @default undefined\n\t */\n\t@property()\n\theaderAccessibleName?: string;\n\n\t/**\n\t * Defines if the text of the component should wrap when it's too long.\n\t * When set to \"Normal\", the content (title, description) will be wrapped\n\t * using the `ui5-expandable-text` component.<br/>\n\t *\n\t * The text can wrap up to 100 characters on small screens (size S) and\n\t * up to 300 characters on larger screens (size M and above). When text exceeds\n\t * these limits, it truncates with an ellipsis followed by a text expansion trigger.\n\t *\n\t * Available options are:\n\t * - `None` (default) - The text will truncate with an ellipsis.\n\t * - `Normal` - The text will wrap (without truncation).\n\t *\n\t * @default \"None\"\n\t * @public\n\t * @since 2.15.0\n\t */\n\t@property()\n\twrappingType: `${WrappingType}` = \"None\";\n\n\t/**\n\t * Indicates whether the header is focused\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tfocused = false;\n\n\t/**\n\t* Defines the header of the component.\n\t*\n\t* **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.\n\t* @public\n\t*/\n\t@slot()\n\theader!: Slot<ListItemBase>;\n\n\t_dragAndDropHandler: DragAndDropHandler;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\t// Initialize the DragAndDropHandler with the necessary configurations\n\t\t// The handler will manage the drag and drop operations for the list items.\n\t\tthis._dragAndDropHandler = new DragAndDropHandler(this, {\n\t\t\tgetItems: () => this.items,\n\t\t\tgetDropIndicator: () => this.dropIndicatorDOM,\n\t\t\tfilterPlacements: this._filterPlacements.bind(this),\n\t\t});\n\t}\n\n\tget hasHeader(): boolean {\n\t\treturn !!this.headerText || this.hasFormattedHeader;\n\t}\n\n\tget hasFormattedHeader(): boolean {\n\t\treturn !!this.header.length;\n\t}\n\n\tget dropIndicatorDOM(): DropIndicator | null {\n\t\treturn this.shadowRoot!.querySelector(\"[ui5-drop-indicator]\");\n\t}\n\n\t_ondragenter(e: DragEvent) {\n\t\tthis._dragAndDropHandler.ondragenter(e);\n\t}\n\n\t_ondragleave(e: DragEvent) {\n\t\tthis._dragAndDropHandler.ondragleave(e);\n\t}\n\n\t_ondragover(e: DragEvent) {\n\t\tthis._dragAndDropHandler.ondragover(e);\n\t}\n\n\t_ondrop(e: DragEvent) {\n\t\tthis._dragAndDropHandler.ondrop(e);\n\t}\n\n\t_filterPlacements(placements: MovePlacement[], draggedElement: HTMLElement, targetElement: HTMLElement): MovePlacement[] {\n\t\t// Filter out MovePlacement.On when dragged element is the same as target\n\t\tif (targetElement === draggedElement) {\n\t\t\treturn placements.filter(placement => placement !== MovePlacement.On);\n\t\t}\n\t\treturn placements;\n\t}\n\n\tgetFocusDomRef() {\n\t\treturn this.groupHeaderItem || this.items.at(0);\n\t}\n\n\tgetGroupHeaderWrapping(): WrappingType { return WrappingType.None; }\n}\n\nListItemGroup.define();\n\nexport default ListItemGroup;\nexport { isInstanceOfListItemGroup } from \"./ListItemGroupBase.js\";\nexport type { ListItemGroupMoveEventDetail };\n"]}
@@ -0,0 +1,41 @@
1
+ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
2
+ import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js";
3
+ import type ListItemBase from "./ListItemBase.js";
4
+ import type { ListItemBaseClickEventDetail } from "./ListItemBase.js";
5
+ import type ListItemGroupHeader from "./ListItemGroupHeader.js";
6
+ /**
7
+ * @class
8
+ *
9
+ * ### Overview
10
+ *
11
+ * `ListItemGroupBase` is the abstract base for grouping components. It provides the minimal
12
+ * "group" contract shared by `ui5-li-group` and `ui5-option-group`: a header text, the default
13
+ * items slot, and the plumbing the internal `ui5-list` relies on to flatten grouped items.
14
+ *
15
+ * Concrete group components extend this class and add only the public API that is relevant to them.
16
+ * @constructor
17
+ * @abstract
18
+ * @extends UI5Element
19
+ * @public
20
+ * @since 2.26.0
21
+ */
22
+ declare class ListItemGroupBase extends UI5Element {
23
+ eventDetails: {
24
+ "click"?: ListItemBaseClickEventDetail;
25
+ };
26
+ /**
27
+ * Defines the header text of the group.
28
+ * @public
29
+ * @default undefined
30
+ */
31
+ headerText?: string;
32
+ /**
33
+ * Defines the items of the group.
34
+ * @public
35
+ */
36
+ items: DefaultSlot<ListItemBase>;
37
+ get groupHeaderItem(): ListItemGroupHeader;
38
+ get isListItemGroup(): boolean;
39
+ }
40
+ export default ListItemGroupBase;
41
+ export declare const isInstanceOfListItemGroup: (object: any) => object is ListItemGroupBase;
@@ -0,0 +1,54 @@
1
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
+ else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
6
+ };
7
+ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
8
+ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
9
+ import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
10
+ import property from "@ui5/webcomponents-base/dist/decorators/property.js";
11
+ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js";
12
+ import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js";
13
+ /**
14
+ * @class
15
+ *
16
+ * ### Overview
17
+ *
18
+ * `ListItemGroupBase` is the abstract base for grouping components. It provides the minimal
19
+ * "group" contract shared by `ui5-li-group` and `ui5-option-group`: a header text, the default
20
+ * items slot, and the plumbing the internal `ui5-list` relies on to flatten grouped items.
21
+ *
22
+ * Concrete group components extend this class and add only the public API that is relevant to them.
23
+ * @constructor
24
+ * @abstract
25
+ * @extends UI5Element
26
+ * @public
27
+ * @since 2.26.0
28
+ */
29
+ let ListItemGroupBase = class ListItemGroupBase extends UI5Element {
30
+ get groupHeaderItem() {
31
+ return this.shadowRoot.querySelector("[ui5-li-group-header]");
32
+ }
33
+ get isListItemGroup() {
34
+ return true;
35
+ }
36
+ };
37
+ __decorate([
38
+ property()
39
+ ], ListItemGroupBase.prototype, "headerText", void 0);
40
+ __decorate([
41
+ slot({
42
+ "default": true,
43
+ invalidateOnChildChange: true,
44
+ type: HTMLElement,
45
+ })
46
+ ], ListItemGroupBase.prototype, "items", void 0);
47
+ ListItemGroupBase = __decorate([
48
+ customElement({
49
+ renderer: jsxRenderer,
50
+ })
51
+ ], ListItemGroupBase);
52
+ export default ListItemGroupBase;
53
+ export const isInstanceOfListItemGroup = createInstanceChecker("isListItemGroup");
54
+ //# sourceMappingURL=ListItemGroupBase.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ListItemGroupBase.js","sourceRoot":"","sources":["../src/ListItemGroupBase.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAC/E,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,wDAAwD,CAAC;AAE1E,OAAO,qBAAqB,MAAM,4DAA4D,CAAC;AAK/F;;;;;;;;;;;;;;;GAeG;AAIH,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,UAAU;IAwBzC,IAAI,eAAe;QAClB,OAAO,IAAI,CAAC,UAAW,CAAC,aAAa,CAAsB,uBAAuB,CAAE,CAAC;IACtF,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,IAAI,CAAC;IACb,CAAC;CACD,CAAA;AApBA;IADC,QAAQ,EAAE;qDACS;AAWpB;IALC,IAAI,CAAC;QACL,SAAS,EAAE,IAAI;QACf,uBAAuB,EAAE,IAAI;QAC7B,IAAI,EAAE,WAAW;KACjB,CAAC;gDACgC;AAtB7B,iBAAiB;IAHtB,aAAa,CAAC;QACd,QAAQ,EAAE,WAAW;KACrB,CAAC;GACI,iBAAiB,CA+BtB;AAED,eAAe,iBAAiB,CAAC;AACjC,MAAM,CAAC,MAAM,yBAAyB,GAAG,qBAAqB,CAAoB,iBAAiB,CAAC,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport type { DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport createInstanceChecker from \"@ui5/webcomponents-base/dist/util/createInstanceChecker.js\";\nimport type ListItemBase from \"./ListItemBase.js\";\nimport type { ListItemBaseClickEventDetail } from \"./ListItemBase.js\";\nimport type ListItemGroupHeader from \"./ListItemGroupHeader.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * `ListItemGroupBase` is the abstract base for grouping components. It provides the minimal\n * \"group\" contract shared by `ui5-li-group` and `ui5-option-group`: a header text, the default\n * items slot, and the plumbing the internal `ui5-list` relies on to flatten grouped items.\n *\n * Concrete group components extend this class and add only the public API that is relevant to them.\n * @constructor\n * @abstract\n * @extends UI5Element\n * @public\n * @since 2.26.0\n */\n@customElement({\n\trenderer: jsxRenderer,\n})\nclass ListItemGroupBase extends UI5Element {\n\teventDetails!: {\n\t\t\"click\"?: ListItemBaseClickEventDetail,\n\t}\n\n\t/**\n\t * Defines the header text of the group.\n\t * @public\n\t * @default undefined\n\t */\n\t@property()\n\theaderText?: string;\n\n\t/**\n\t * Defines the items of the group.\n\t * @public\n\t */\n\t@slot({\n\t\t\"default\": true,\n\t\tinvalidateOnChildChange: true,\n\t\ttype: HTMLElement,\n\t})\n\titems!: DefaultSlot<ListItemBase>;\n\n\tget groupHeaderItem() {\n\t\treturn this.shadowRoot!.querySelector<ListItemGroupHeader>(\"[ui5-li-group-header]\")!;\n\t}\n\n\tget isListItemGroup() {\n\t\treturn true;\n\t}\n}\n\nexport default ListItemGroupBase;\nexport const isInstanceOfListItemGroup = createInstanceChecker<ListItemGroupBase>(\"isListItemGroup\");\n"]}
@@ -13,7 +13,7 @@ export default function ListItemStandardTemplate(hooks) {
13
13
  return ListItemTemplate.call(this, currentHooks);
14
14
  }
15
15
  function listItemContent() {
16
- return _jsxs(_Fragment, { children: [_jsxs("div", { class: "ui5-li-text-wrapper", children: [renderTitle.call(this), renderDescription.call(this), !this.typeActive && _jsx("span", { class: "ui5-hidden-text", children: this.type })] }), !this.description && renderAdditionalText.call(this)] });
16
+ return _jsxs(_Fragment, { children: [_jsxs("div", { class: "ui5-li-text-wrapper", children: [renderTitle.call(this), renderDescription.call(this), !this.typeActive && !this.isInactiveSelectable && _jsx("span", { class: "ui5-hidden-text", children: this.type })] }), !this.description && renderAdditionalText.call(this)] });
17
17
  }
18
18
  function renderTitle() {
19
19
  if (this.wrappingType === WrappingType.Normal) {
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemStandardTemplate.js","sourceRoot":"","sources":["../src/ListItemStandardTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import Icon from \"./Icon.js\";\nimport type ListItemStandard from \"./ListItemStandard.js\";\nimport ListItemTemplate from \"./ListItemTemplate.js\";\nimport type { ListItemHooks } from \"./ListItemTemplate.js\";\nimport WrappingType from \"./types/WrappingType.js\";\n\nconst predefinedHooks: Partial<ListItemHooks> = {\n\timageBegin,\n\ticonBegin,\n\ticonEnd,\n\tlistItemContent\n};\n\nexport default function ListItemStandardTemplate(this: ListItemStandard, hooks?: Partial<ListItemHooks>) {\n\tconst currentHooks = { ...predefinedHooks, ...hooks };\n\n\treturn ListItemTemplate.call(this, currentHooks);\n}\n\nfunction listItemContent(this: ListItemStandard) {\n\treturn <>\n\t\t<div class=\"ui5-li-text-wrapper\">\n\t\t\t{renderTitle.call(this)}\n\t\t\t{renderDescription.call(this)}\n\n\t\t\t{!this.typeActive && <span class=\"ui5-hidden-text\">{this.type}</span>}\n\t\t</div>\n\n\t\t{!this.description && renderAdditionalText.call(this)}\n\t</>;\n}\n\nfunction renderTitle(this: ListItemStandard) {\n\tif (this.wrappingType === WrappingType.Normal) {\n\t\treturn this.expandableTextTemplate?.call(this, {\n\t\t\tclassName: \"ui5-li-title\",\n\t\t\ttext: this._textContent,\n\t\t\tmaxCharacters: this._maxCharacters,\n\t\t\tpart: \"title\",\n\t\t});\n\t}\n\n\treturn (\n\t\t<span part=\"title\" class=\"ui5-li-title\">\n\t\t\t{this.text ? this.text : <slot></slot>}\n\t\t</span>\n\t);\n}\n\nfunction renderDescription(this: ListItemStandard) {\n\tif (!this.description) {\n\t\treturn null;\n\t}\n\n\tif (this.wrappingType === WrappingType.Normal) {\n\t\treturn (\n\t\t\t<div class=\"ui5-li-description-info-wrapper\">\n\t\t\t\t{this.expandableTextTemplate?.call(this, {\n\t\t\t\t\tclassName: \"ui5-li-desc\",\n\t\t\t\t\ttext: this.description,\n\t\t\t\t\tmaxCharacters: this._maxCharacters,\n\t\t\t\t\tpart: \"description\",\n\t\t\t\t})}\n\t\t\t\t{renderAdditionalText.call(this)}\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div class=\"ui5-li-description-info-wrapper\">\n\t\t\t<span part=\"description\" class=\"ui5-li-desc\">{this.description}</span>\n\t\t\t{renderAdditionalText.call(this)}\n\t\t</div>\n\t);\n}\n\nfunction renderAdditionalText(this: ListItemStandard) {\n\tif (!this.additionalText) {\n\t\treturn null;\n\t}\n\treturn <span part=\"additional-text\" class=\"ui5-li-additional-text\">{this.additionalText}</span>;\n}\n\nfunction imageBegin(this: ListItemStandard) {\n\tif (this.hasImage) {\n\t\treturn <div class=\"ui5-li-image\">\n\t\t\t<slot name=\"image\"></slot>\n\t\t</div>;\n\t}\n}\n\nfunction iconBegin(this: ListItemStandard) {\n\tif (this.displayIconBegin) {\n\t\treturn <Icon\n\t\t\tpart=\"icon\"\n\t\t\tname={this.icon}\n\t\t\tclass=\"ui5-li-icon\"\n\t\t\tmode=\"Decorative\" />;\n\t}\n}\n\nfunction iconEnd(this: ListItemStandard) {\n\tif (this.displayIconEnd) {\n\t\treturn <Icon\n\t\t\tpart=\"icon\"\n\t\t\tname={this.icon}\n\t\t\tclass=\"ui5-li-icon\"\n\t\t\tmode=\"Decorative\" />;\n\t}\n}\n"]}
1
+ {"version":3,"file":"ListItemStandardTemplate.js","sourceRoot":"","sources":["../src/ListItemStandardTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import Icon from \"./Icon.js\";\nimport type ListItemStandard from \"./ListItemStandard.js\";\nimport ListItemTemplate from \"./ListItemTemplate.js\";\nimport type { ListItemHooks } from \"./ListItemTemplate.js\";\nimport WrappingType from \"./types/WrappingType.js\";\n\nconst predefinedHooks: Partial<ListItemHooks> = {\n\timageBegin,\n\ticonBegin,\n\ticonEnd,\n\tlistItemContent\n};\n\nexport default function ListItemStandardTemplate(this: ListItemStandard, hooks?: Partial<ListItemHooks>) {\n\tconst currentHooks = { ...predefinedHooks, ...hooks };\n\n\treturn ListItemTemplate.call(this, currentHooks);\n}\n\nfunction listItemContent(this: ListItemStandard) {\n\treturn <>\n\t\t<div class=\"ui5-li-text-wrapper\">\n\t\t\t{renderTitle.call(this)}\n\t\t\t{renderDescription.call(this)}\n\n\t\t\t{!this.typeActive && !this.isInactiveSelectable && <span class=\"ui5-hidden-text\">{this.type}</span>}\n\t\t</div>\n\n\t\t{!this.description && renderAdditionalText.call(this)}\n\t</>;\n}\n\nfunction renderTitle(this: ListItemStandard) {\n\tif (this.wrappingType === WrappingType.Normal) {\n\t\treturn this.expandableTextTemplate?.call(this, {\n\t\t\tclassName: \"ui5-li-title\",\n\t\t\ttext: this._textContent,\n\t\t\tmaxCharacters: this._maxCharacters,\n\t\t\tpart: \"title\",\n\t\t});\n\t}\n\n\treturn (\n\t\t<span part=\"title\" class=\"ui5-li-title\">\n\t\t\t{this.text ? this.text : <slot></slot>}\n\t\t</span>\n\t);\n}\n\nfunction renderDescription(this: ListItemStandard) {\n\tif (!this.description) {\n\t\treturn null;\n\t}\n\n\tif (this.wrappingType === WrappingType.Normal) {\n\t\treturn (\n\t\t\t<div class=\"ui5-li-description-info-wrapper\">\n\t\t\t\t{this.expandableTextTemplate?.call(this, {\n\t\t\t\t\tclassName: \"ui5-li-desc\",\n\t\t\t\t\ttext: this.description,\n\t\t\t\t\tmaxCharacters: this._maxCharacters,\n\t\t\t\t\tpart: \"description\",\n\t\t\t\t})}\n\t\t\t\t{renderAdditionalText.call(this)}\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div class=\"ui5-li-description-info-wrapper\">\n\t\t\t<span part=\"description\" class=\"ui5-li-desc\">{this.description}</span>\n\t\t\t{renderAdditionalText.call(this)}\n\t\t</div>\n\t);\n}\n\nfunction renderAdditionalText(this: ListItemStandard) {\n\tif (!this.additionalText) {\n\t\treturn null;\n\t}\n\treturn <span part=\"additional-text\" class=\"ui5-li-additional-text\">{this.additionalText}</span>;\n}\n\nfunction imageBegin(this: ListItemStandard) {\n\tif (this.hasImage) {\n\t\treturn <div class=\"ui5-li-image\">\n\t\t\t<slot name=\"image\"></slot>\n\t\t</div>;\n\t}\n}\n\nfunction iconBegin(this: ListItemStandard) {\n\tif (this.displayIconBegin) {\n\t\treturn <Icon\n\t\t\tpart=\"icon\"\n\t\t\tname={this.icon}\n\t\t\tclass=\"ui5-li-icon\"\n\t\t\tmode=\"Decorative\" />;\n\t}\n}\n\nfunction iconEnd(this: ListItemStandard) {\n\tif (this.displayIconEnd) {\n\t\treturn <Icon\n\t\t\tpart=\"icon\"\n\t\t\tname={this.icon}\n\t\t\tclass=\"ui5-li-icon\"\n\t\t\tmode=\"Decorative\" />;\n\t}\n}\n"]}
@@ -1,6 +1,6 @@
1
1
  import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
2
2
  import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js";
3
- import ListItemGroup from "./ListItemGroup.js";
3
+ import ListItemGroupBase from "./ListItemGroupBase.js";
4
4
  import type Option from "./Option.js";
5
5
  /**
6
6
  * @class
@@ -13,12 +13,12 @@ import type Option from "./Option.js";
13
13
  *
14
14
  * `import "@ui5/webcomponents/dist/OptionGroup.js";`
15
15
  * @constructor
16
- * @extends ListItemGroup
16
+ * @extends ListItemGroupBase
17
17
  * @public
18
18
  * @since 2.26.0
19
19
  */
20
- declare class OptionGroup extends ListItemGroup {
21
- eventDetails: ListItemGroup["eventDetails"];
20
+ declare class OptionGroup extends ListItemGroupBase {
21
+ eventDetails: ListItemGroupBase["eventDetails"];
22
22
  static i18nBundle: I18nBundle;
23
23
  /**
24
24
  * Defines the options of the group.
@@ -9,7 +9,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement
9
9
  import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js";
10
10
  import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
11
11
  import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js";
12
- import ListItemGroup from "./ListItemGroup.js";
12
+ import ListItemGroupBase from "./ListItemGroupBase.js";
13
13
  import OptionGroupTemplate from "./OptionGroupTemplate.js";
14
14
  import { LIST_ITEM_GROUP_HEADER } from "./generated/i18n/i18n-defaults.js";
15
15
  import OptionGroupCss from "./generated/themes/OptionGroup.css.js";
@@ -24,11 +24,11 @@ import OptionGroupCss from "./generated/themes/OptionGroup.css.js";
24
24
  *
25
25
  * `import "@ui5/webcomponents/dist/OptionGroup.js";`
26
26
  * @constructor
27
- * @extends ListItemGroup
27
+ * @extends ListItemGroupBase
28
28
  * @public
29
29
  * @since 2.26.0
30
30
  */
31
- let OptionGroup = OptionGroup_1 = class OptionGroup extends ListItemGroup {
31
+ let OptionGroup = OptionGroup_1 = class OptionGroup extends ListItemGroupBase {
32
32
  get isOptionGroup() {
33
33
  return true;
34
34
  }
@@ -1 +1 @@
1
- {"version":3,"file":"OptionGroup.js","sourceRoot":"","sources":["../src/OptionGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,IAAI,MAAM,wDAAwD,CAAC;AAC1E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAGnE,OAAO,qBAAqB,MAAM,4DAA4D,CAAC;AAC/F,OAAO,aAAa,MAAM,oBAAoB,CAAC;AAE/C,OAAO,mBAAmB,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAC;AAC3E,OAAO,cAAc,MAAM,uCAAuC,CAAC;AAEnE;;;;;;;;;;;;;;GAcG;AAOH,IAAM,WAAW,mBAAjB,MAAM,WAAY,SAAQ,aAAa;IAoBtC,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,2BAA2B;QAC9B,OAAO,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,sBAAsB,CAAC,CAAC;IAC/D,CAAC;CACD,CAAA;AATA;IANC,IAAI,CAAC;QACL,SAAS,EAAE,IAAI;QACf,uBAAuB,EAAE,IAAI;QAC7B,eAAe,EAAE,IAAI;QACrB,IAAI,EAAE,WAAW;KACjB,CAAC;0CAC0B;AAdrB;IADN,IAAI,CAAC,oBAAoB,CAAC;qCACG;AAJzB,WAAW;IANhB,aAAa,CAAC;QACd,GAAG,EAAE,kBAAkB;QACvB,aAAa,EAAE,IAAI;QACnB,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE,CAAC,cAAc,CAAC;KACxB,CAAC;GACI,WAAW,CA2BhB;AAED,WAAW,CAAC,MAAM,EAAE,CAAC;AAErB,MAAM,CAAC,MAAM,uBAAuB,GAAG,qBAAqB,CAAc,eAAe,CAAC,CAAC;AAC3F,eAAe,WAAW,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport createInstanceChecker from \"@ui5/webcomponents-base/dist/util/createInstanceChecker.js\";\nimport ListItemGroup from \"./ListItemGroup.js\";\nimport type Option from \"./Option.js\";\nimport OptionGroupTemplate from \"./OptionGroupTemplate.js\";\nimport { LIST_ITEM_GROUP_HEADER } from \"./generated/i18n/i18n-defaults.js\";\nimport OptionGroupCss from \"./generated/themes/OptionGroup.css.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-option-group` component is used to group options within a `ui5-select`.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/OptionGroup.js\";`\n * @constructor\n * @extends ListItemGroup\n * @public\n * @since 2.26.0\n */\n@customElement({\n\ttag: \"ui5-option-group\",\n\tlanguageAware: true,\n\ttemplate: OptionGroupTemplate,\n\tstyles: [OptionGroupCss],\n})\nclass OptionGroup extends ListItemGroup {\n\teventDetails!: ListItemGroup[\"eventDetails\"];\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/**\n\t * Defines the options of the group.\n\t *\n\t * **Note:** Use the `ui5-option` component to define the desired options.\n\t * @public\n\t */\n\t@slot({\n\t\t\"default\": true,\n\t\tinvalidateOnChildChange: true,\n\t\tindividualSlots: true,\n\t\ttype: HTMLElement,\n\t})\n\titems!: DefaultSlot<Option>;\n\n\tget isOptionGroup(): boolean {\n\t\treturn true;\n\t}\n\n\tget _groupHeaderRoleDescription(): string {\n\t\treturn OptionGroup.i18nBundle.getText(LIST_ITEM_GROUP_HEADER);\n\t}\n}\n\nOptionGroup.define();\n\nexport const isInstanceOfOptionGroup = createInstanceChecker<OptionGroup>(\"isOptionGroup\");\nexport default OptionGroup;\n"]}
1
+ {"version":3,"file":"OptionGroup.js","sourceRoot":"","sources":["../src/OptionGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,IAAI,MAAM,wDAAwD,CAAC;AAC1E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAGnE,OAAO,qBAAqB,MAAM,4DAA4D,CAAC;AAC/F,OAAO,iBAAiB,MAAM,wBAAwB,CAAC;AAEvD,OAAO,mBAAmB,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAC;AAC3E,OAAO,cAAc,MAAM,uCAAuC,CAAC;AAEnE;;;;;;;;;;;;;;GAcG;AAOH,IAAM,WAAW,mBAAjB,MAAM,WAAY,SAAQ,iBAAiB;IAoB1C,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,2BAA2B;QAC9B,OAAO,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,sBAAsB,CAAC,CAAC;IAC/D,CAAC;CACD,CAAA;AATA;IANC,IAAI,CAAC;QACL,SAAS,EAAE,IAAI;QACf,uBAAuB,EAAE,IAAI;QAC7B,eAAe,EAAE,IAAI;QACrB,IAAI,EAAE,WAAW;KACjB,CAAC;0CAC0B;AAdrB;IADN,IAAI,CAAC,oBAAoB,CAAC;qCACG;AAJzB,WAAW;IANhB,aAAa,CAAC;QACd,GAAG,EAAE,kBAAkB;QACvB,aAAa,EAAE,IAAI;QACnB,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE,CAAC,cAAc,CAAC;KACxB,CAAC;GACI,WAAW,CA2BhB;AAED,WAAW,CAAC,MAAM,EAAE,CAAC;AAErB,MAAM,CAAC,MAAM,uBAAuB,GAAG,qBAAqB,CAAc,eAAe,CAAC,CAAC;AAC3F,eAAe,WAAW,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport createInstanceChecker from \"@ui5/webcomponents-base/dist/util/createInstanceChecker.js\";\nimport ListItemGroupBase from \"./ListItemGroupBase.js\";\nimport type Option from \"./Option.js\";\nimport OptionGroupTemplate from \"./OptionGroupTemplate.js\";\nimport { LIST_ITEM_GROUP_HEADER } from \"./generated/i18n/i18n-defaults.js\";\nimport OptionGroupCss from \"./generated/themes/OptionGroup.css.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-option-group` component is used to group options within a `ui5-select`.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/OptionGroup.js\";`\n * @constructor\n * @extends ListItemGroupBase\n * @public\n * @since 2.26.0\n */\n@customElement({\n\ttag: \"ui5-option-group\",\n\tlanguageAware: true,\n\ttemplate: OptionGroupTemplate,\n\tstyles: [OptionGroupCss],\n})\nclass OptionGroup extends ListItemGroupBase {\n\teventDetails!: ListItemGroupBase[\"eventDetails\"];\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/**\n\t * Defines the options of the group.\n\t *\n\t * **Note:** Use the `ui5-option` component to define the desired options.\n\t * @public\n\t */\n\t@slot({\n\t\t\"default\": true,\n\t\tinvalidateOnChildChange: true,\n\t\tindividualSlots: true,\n\t\ttype: HTMLElement,\n\t})\n\titems!: DefaultSlot<Option>;\n\n\tget isOptionGroup(): boolean {\n\t\treturn true;\n\t}\n\n\tget _groupHeaderRoleDescription(): string {\n\t\treturn OptionGroup.i18nBundle.getText(LIST_ITEM_GROUP_HEADER);\n\t}\n}\n\nOptionGroup.define();\n\nexport const isInstanceOfOptionGroup = createInstanceChecker<OptionGroup>(\"isOptionGroup\");\nexport default OptionGroup;\n"]}
package/dist/Popover.js CHANGED
@@ -538,15 +538,17 @@ let Popover = Popover_1 = class Popover extends Popup {
538
538
  }
539
539
  this._maxHeight = Math.round(maxHeight - Popover_1.VIEWPORT_MARGIN);
540
540
  this._maxWidth = Math.round(maxWidth - Popover_1.VIEWPORT_MARGIN);
541
+ const borderRadius = Number.parseInt(window.getComputedStyle(this).getPropertyValue("border-radius"));
542
+ const arrowPos = this.getArrowPosition(targetRect, popoverSize, left, top, isVertical, borderRadius);
543
+ // Apply the RTL correction before the dead-band check so it is baked into `this._left`
544
+ // once. Adding it after would re-apply it every reposition, causing the position to drift.
545
+ left += this.getRTLCorrectionLeft();
541
546
  if (this._left === undefined || Math.abs(this._left - left) > 1.5) {
542
547
  this._left = Math.round(left);
543
548
  }
544
549
  if (this._top === undefined || Math.abs(this._top - top) > 1.5) {
545
550
  this._top = Math.round(top);
546
551
  }
547
- const borderRadius = Number.parseInt(window.getComputedStyle(this).getPropertyValue("border-radius"));
548
- const arrowPos = this.getArrowPosition(targetRect, popoverSize, left, top, isVertical, borderRadius);
549
- this._left += this.getRTLCorrectionLeft();
550
552
  return {
551
553
  arrow: arrowPos,
552
554
  top: this._top,