From ce5dcea3165f47e1ab6c4ae0b10e26c2e9c24ad8 Mon Sep 17 00:00:00 2001 From: ilhan007 Date: Tue, 27 Jan 2026 15:28:02 +0200 Subject: [PATCH 01/14] refactor: mark decorated slots with Slot, DefaultSlot types --- docs/4-development/04-slots.md | 25 +++---- .../11-deep-dive-and-best-practices.md | 21 +++--- packages/ai/src/Button.ts | 6 +- packages/ai/src/Input.ts | 5 +- packages/ai/src/PromptInput.ts | 7 +- packages/ai/src/TextArea.ts | 5 +- packages/base/src/UI5Element.ts | 17 ++++- packages/base/src/decorators.ts | 2 + packages/base/src/decorators/slot-strict.ts | 48 ++++++++++++++ packages/base/src/decorators/slot-strict2.ts | 65 +++++++++++++++++++ packages/base/src/index.ts | 2 + packages/base/test/test-elements/Generic.tsx | 14 ++-- .../base/test/test-elements/GenericExt.tsx | 5 +- packages/base/test/test-elements/Parent.tsx | 8 +-- packages/compat/src/Table.ts | 8 +-- packages/compat/src/TableCell.ts | 6 +- packages/compat/src/TableRow.ts | 6 +- packages/fiori/src/BarcodeScannerDialog.ts | 7 +- packages/fiori/src/DynamicPage.ts | 12 ++-- packages/fiori/src/DynamicPageHeader.ts | 5 +- packages/fiori/src/DynamicPageTitle.ts | 21 +++--- packages/fiori/src/DynamicSideContent.ts | 6 +- packages/fiori/src/FilterItem.ts | 6 +- packages/fiori/src/FlexibleColumnLayout.ts | 10 +-- packages/fiori/src/IllustratedMessage.ts | 10 +-- packages/fiori/src/MediaGallery.ts | 6 +- packages/fiori/src/MediaGalleryItem.ts | 7 +- packages/fiori/src/NavigationLayout.ts | 9 +-- packages/fiori/src/NavigationMenu.ts | 5 +- packages/fiori/src/NavigationMenuItem.ts | 1 + packages/fiori/src/NotificationList.ts | 6 +- .../fiori/src/NotificationListGroupItem.ts | 5 +- packages/fiori/src/NotificationListItem.ts | 11 ++-- packages/fiori/src/Page.ts | 9 +-- packages/fiori/src/ProductSwitch.ts | 8 +-- packages/fiori/src/ProductSwitchItem.ts | 6 +- packages/fiori/src/Search.ts | 11 ++-- packages/fiori/src/SearchField.ts | 8 +-- packages/fiori/src/SearchItem.ts | 7 +- packages/fiori/src/SearchItemGroup.ts | 1 + packages/fiori/src/ShellBar.ts | 24 +++---- packages/fiori/src/ShellBarBranding.ts | 8 +-- packages/fiori/src/SideNavigation.ts | 52 ++++++++------- packages/fiori/src/SideNavigationGroup.ts | 5 +- packages/fiori/src/SideNavigationItem.ts | 5 +- packages/fiori/src/Timeline.ts | 6 +- packages/fiori/src/TimelineGroupItem.ts | 6 +- packages/fiori/src/TimelineItem.ts | 6 +- packages/fiori/src/UploadCollection.ts | 8 +-- packages/fiori/src/UploadCollectionItem.ts | 5 +- packages/fiori/src/UserMenu.ts | 8 +-- packages/fiori/src/UserMenuItem.ts | 5 +- packages/fiori/src/UserSettingsAccountView.ts | 5 +- .../fiori/src/UserSettingsAppearanceView.ts | 7 +- .../src/UserSettingsAppearanceViewGroup.ts | 5 +- packages/fiori/src/UserSettingsDialog.ts | 8 +-- packages/fiori/src/UserSettingsItem.ts | 8 +-- packages/fiori/src/UserSettingsView.ts | 6 +- packages/fiori/src/ViewSettingsDialog.ts | 10 +-- packages/fiori/src/Wizard.ts | 6 +- packages/main/src/Avatar.ts | 8 +-- packages/main/src/AvatarGroup.ts | 23 +++++-- packages/main/src/Bar.ts | 16 ++--- packages/main/src/Breadcrumbs.ts | 6 +- packages/main/src/BreadcrumbsItem.ts | 6 +- packages/main/src/Button.ts | 8 +-- packages/main/src/Calendar.ts | 11 ++-- packages/main/src/CalendarLegend.ts | 6 +- packages/main/src/Card.ts | 8 +-- packages/main/src/CardHeader.ts | 8 +-- packages/main/src/Carousel.ts | 6 +- packages/main/src/ColorPalette.ts | 12 ++-- packages/main/src/ColorPalettePopover.ts | 6 +- packages/main/src/ComboBox.ts | 10 +-- packages/main/src/ComboBoxItemGroup.ts | 5 +- packages/main/src/DatePicker.ts | 7 +- packages/main/src/Dialog.ts | 23 ++++++- packages/main/src/FileUploader.ts | 8 +-- packages/main/src/Form.ts | 10 +-- packages/main/src/FormGroup.ts | 6 +- packages/main/src/FormItem.ts | 8 +-- packages/main/src/Input.ts | 10 +-- packages/main/src/List.ts | 8 +-- packages/main/src/ListItem.ts | 5 +- packages/main/src/ListItemGroup.ts | 10 +-- packages/main/src/ListItemGroupHeader.ts | 5 +- packages/main/src/ListItemStandard.ts | 7 +- packages/main/src/Menu.ts | 6 +- packages/main/src/MenuItem.ts | 9 +-- packages/main/src/MenuItemGroup.ts | 6 +- packages/main/src/MessageStrip.ts | 6 +- packages/main/src/MultiComboBox.ts | 10 +-- packages/main/src/MultiComboBoxItemGroup.ts | 5 +- packages/main/src/MultiInput.ts | 5 +- packages/main/src/Option.ts | 5 +- packages/main/src/OptionCustom.ts | 5 +- packages/main/src/Panel.ts | 6 +- packages/main/src/Popover.ts | 12 ++-- packages/main/src/Popup.ts | 6 +- packages/main/src/SegmentedButton.ts | 6 +- packages/main/src/SegmentedButtonItem.ts | 6 +- packages/main/src/Select.ts | 10 +-- packages/main/src/SplitButton.ts | 6 +- packages/main/src/StepInput.ts | 6 +- packages/main/src/SuggestionItemCustom.ts | 5 +- packages/main/src/SuggestionItemGroup.ts | 5 +- packages/main/src/SuggestionListItem.ts | 9 +-- packages/main/src/Tab.ts | 8 +-- packages/main/src/TabContainer.ts | 24 ++++--- packages/main/src/Table.ts | 12 ++-- packages/main/src/TableCellBase.ts | 6 +- packages/main/src/TableHeaderCell.ts | 5 +- packages/main/src/TableHeaderRow.ts | 5 +- packages/main/src/TableRow.ts | 7 +- packages/main/src/Tag.ts | 8 +-- packages/main/src/Text.ts | 6 +- packages/main/src/TextArea.ts | 6 +- packages/main/src/TimePicker.ts | 6 +- packages/main/src/Token.ts | 6 +- packages/main/src/Tokenizer.ts | 6 +- packages/main/src/Toolbar.ts | 6 +- packages/main/src/ToolbarSelect.ts | 7 +- packages/main/src/ToolbarSelectOption.ts | 6 +- packages/main/src/Tree.ts | 8 +-- packages/main/src/TreeItemBase.ts | 7 +- packages/main/src/TreeItemCustom.ts | 5 +- 126 files changed, 679 insertions(+), 465 deletions(-) create mode 100644 packages/base/src/decorators/slot-strict.ts create mode 100644 packages/base/src/decorators/slot-strict2.ts diff --git a/docs/4-development/04-slots.md b/docs/4-development/04-slots.md index aa16f1ece1f8..bf2ac822baef 100644 --- a/docs/4-development/04-slots.md +++ b/docs/4-development/04-slots.md @@ -44,14 +44,15 @@ Defining a slot with the `slot` decorator means that this slot will be managed b - The library will invalidate this UI5 Web Component whenever its children are added, removed, or rearranged (and additionally when invalidated, if `invalidateOnChildChange` is set). ```ts +import type { Slot} from "@ui5/webcomponents-base/dist/UI5Element.js" import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot() - mySlot!: Array; + mySlot!: Slot>; } ``` @@ -63,12 +64,12 @@ The `type` option accepts a type constructor (e.g., `HTMLElement`, `Node`) and i ```ts import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement }) - mySlot!: Array; + mySlot!: Slot>;; } ``` @@ -90,12 +91,12 @@ The `"default"` option accepts a boolean value and is used to define whether thi ```ts import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, "default": true }) - mySlot!: Array; + mySlot!: Slot>;; } ``` @@ -106,12 +107,12 @@ The `individualSlots` option accepts a boolean value and determines whether each ```ts import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, individualSlots: true }) - mySlot!: Array; + mySlot!: Slot>;; } ``` @@ -138,17 +139,17 @@ The `invalidateOnChildChange` option accepts a boolean value or an object litera ```ts import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, invalidateOnChildChange: true }) - mySlot!: Array; + mySlot!: Slot>;; @slot({ type: HTMLElement, invalidateOnChildChange: { properties: true, slots: false }}) - mySlot2!: Array; + mySlot2!: Slot>;; @slot({ type: HTMLElement, invalidateOnChildChange: { properties: ["myProp"], slots: ["anotherSlot"] }}) - mySlot3!: Array; + mySlot3!: Slot>;; } ``` \ No newline at end of file diff --git a/docs/4-development/11-deep-dive-and-best-practices.md b/docs/4-development/11-deep-dive-and-best-practices.md index 0d91b5acb5ec..aa246dfaf93c 100644 --- a/docs/4-development/11-deep-dive-and-best-practices.md +++ b/docs/4-development/11-deep-dive-and-best-practices.md @@ -436,12 +436,13 @@ class MyComponent extends UI5Element {} We can define our slots as class members via the `@slot` decorator as follows: ```ts -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import type { Slot} from "@ui5/webcomponents-base/dist/UI5Element.js" +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @slot() - items!: Array; + items!: Slot>;; } ``` @@ -540,7 +541,7 @@ export default function () { All slots are named if you simply use the `@slot` decorator without any settings, while the default slots must be explicitly marked as such with the `"default"` setting: ```ts -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @@ -554,7 +555,7 @@ class MyComponent extends UI5Element { Simply use the `@slot` decorator without any settings: ```ts -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @@ -592,7 +593,7 @@ export default function MyComponentTemplate() { ``` ```ts -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @@ -614,7 +615,7 @@ The `@slot` decorator provides an option called `individualSlots`, which is of b First, enable `individualSlots` by setting it to `true`: ```ts -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @@ -637,7 +638,7 @@ export default function MyComponentTemplate() { Here is an example using the `Carousel` web component, which leverages `individualSlots` to wrap each slotted child within the content slot to achieve a specific design: ```ts -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("ui5-carousel") class Carousel extends UI5Element { @@ -680,7 +681,7 @@ The simplest way to use this option is to set `invalidateOnChildChange` to `"tru ```ts -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @@ -692,7 +693,7 @@ class MyComponent extends UI5Element { For more specific scenarios, you can use a more detailed configuration. The following example demonstrates how to invalidate the `"my-component"` web component only when certain properties or slots of the slotted UI5Element instances change. In this case, the component will be invalidated if the "myProp" property or the "mySlot" slot of the child elements are modified. ```ts -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @@ -920,7 +921,7 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement({ tag: "my-component", diff --git a/packages/ai/src/Button.ts b/packages/ai/src/Button.ts index 0c0a0e4cc404..963bae502486 100644 --- a/packages/ai/src/Button.ts +++ b/packages/ai/src/Button.ts @@ -1,10 +1,10 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import { i18n } from "@ui5/webcomponents-base/dist/decorators.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type SplitButton from "@ui5/webcomponents/dist/SplitButton.js"; @@ -183,7 +183,7 @@ class Button extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - states!: Array; + states!: DefaultSlot>; @query("[ui5-split-button]") _splitButton?: SplitButton; diff --git a/packages/ai/src/Input.ts b/packages/ai/src/Input.ts index 08379a1c36c9..ce1eb65deaf7 100644 --- a/packages/ai/src/Input.ts +++ b/packages/ai/src/Input.ts @@ -1,7 +1,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { isEscape, @@ -26,6 +26,7 @@ import { INPUT_WRITING_ASSISTANT_BUTTON_TOOLTIP, WRITING_ASSISTANT_GENERATING_ANNOUNCEMENT, } from "./generated/i18n/i18n-defaults.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; type InputVersionChangeEventDetail = { backwards: boolean, @@ -164,7 +165,7 @@ class Input extends BaseInput { type: HTMLElement, invalidateOnChildChange: true, }) - actions!: Array; + actions!: Slot>; _previousCurrentStep = 0; _previousTotalSteps = 0; diff --git a/packages/ai/src/PromptInput.ts b/packages/ai/src/PromptInput.ts index 756faca199d9..36537e3983e3 100644 --- a/packages/ai/src/PromptInput.ts +++ b/packages/ai/src/PromptInput.ts @@ -2,7 +2,7 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -22,6 +22,7 @@ import PromptInputTemplate from "./PromptInputTemplate.js"; // Styles import PromptInputCss from "./generated/themes/PromptInput.css.js"; import type { UI5CustomEvent } from "@ui5/webcomponents-base/dist/index.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -202,7 +203,7 @@ class PromptInput extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - suggestionItems!: Array; + suggestionItems!: DefaultSlot>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -220,7 +221,7 @@ class PromptInput extends UI5Element { type: HTMLElement, invalidateOnChildChange: true, }) - valueStateMessage!: Array; + valueStateMessage!: Slot>; @i18n("@ui5/webcomponents-ai") static i18nBundle: I18nBundle; diff --git a/packages/ai/src/TextArea.ts b/packages/ai/src/TextArea.ts index b797bb1d6dc3..c75a3b2743b9 100644 --- a/packages/ai/src/TextArea.ts +++ b/packages/ai/src/TextArea.ts @@ -1,6 +1,6 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -17,6 +17,7 @@ import valueStateMessageStyles from "@ui5/webcomponents/dist/generated/themes/Va // Templates import TextAreaTemplate from "./TextAreaTemplate.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; type TextAreaVersionChangeEventDetail = { backwards: boolean, @@ -131,7 +132,7 @@ class TextArea extends BaseTextArea { focused = false; @slot({ type: HTMLElement }) - menu!: Array; + menu!: Slot>; static i18nBundle: I18nBundle; diff --git a/packages/base/src/UI5Element.ts b/packages/base/src/UI5Element.ts index 36f31b62b81c..a70ceecc79b6 100644 --- a/packages/base/src/UI5Element.ts +++ b/packages/base/src/UI5Element.ts @@ -5,7 +5,7 @@ import merge from "./thirdparty/merge.js"; import { boot } from "./Boot.js"; import UI5ElementMetadata from "./UI5ElementMetadata.js"; import type { - Slot, + Slot as SlotMetadata, SlotValue, State, PropertyValue, @@ -169,6 +169,17 @@ type TargetedEventHandler = { }["asMethod"]; type Convert = { [Property in keyof T as `on${KebabToPascal}`]: IsAny> } + +// Create a unique symbol as a marker +declare const SlotMarker: unique symbol; +declare const DefaultSlotMarker: unique symbol; + +export type Slot = T & { [SlotMarker]: true }; +export type DefaultSlot = T & { [DefaultSlotMarker]: true }; + +export type IsSlot = T extends { [SlotMarker]: true } ? true : T extends { [DefaultSlotMarker]: true } ? true : false; +export type IsDefaultSlot = T extends { [DefaultSlotMarker]: true } ? true : false; + /** * @class * Base class for all UI5 Web Components @@ -182,6 +193,8 @@ abstract class UI5Element extends HTMLElement { }; _jsxEvents!: Omit, keyof Convert | "onClose" | "onToggle" | "onChange" | "onSelect" | "onInput"> & Convert; _jsxProps!: Pick, GlobalHTMLAttributeNames> & ElementProps & Partial & { key?: any }; + // _jsxSlots!: NotEqual extends true ? Exclude, undefined> : string; + __id?: string; _suppressInvalidation: boolean; _changedState: Array; @@ -557,7 +570,7 @@ abstract class UI5Element extends HTMLElement { * Removes all children from the slot and detaches listeners, if any * @private */ - _clearSlot(slotName: string, slotData: Slot) { + _clearSlot(slotName: string, slotData: SlotMetadata) { const propertyName = slotData.propertyName || slotName; const children = this._state[propertyName] as Array; diff --git a/packages/base/src/decorators.ts b/packages/base/src/decorators.ts index 3f09d0e53a60..abae176c7ef2 100644 --- a/packages/base/src/decorators.ts +++ b/packages/base/src/decorators.ts @@ -3,6 +3,7 @@ import event from "./decorators/event.js"; import eventStrict from "./decorators/event-strict.js"; import property from "./decorators/property.js"; import slot from "./decorators/slot.js"; +import slotStrict from "./decorators/slot-strict.js"; import bound from "./decorators/bound.js"; import i18n from "./decorators/i18n.js"; @@ -12,6 +13,7 @@ export { eventStrict, property, slot, + slotStrict, bound, i18n, }; diff --git a/packages/base/src/decorators/slot-strict.ts b/packages/base/src/decorators/slot-strict.ts new file mode 100644 index 000000000000..bd4fb4c5dc85 --- /dev/null +++ b/packages/base/src/decorators/slot-strict.ts @@ -0,0 +1,48 @@ +import type UI5Element from "../UI5Element.js"; +import type { Slot, DefaultSlot, IsSlot } from "../UI5Element.js"; +import type { Slot as SlotMetadata } from "../UI5ElementMetadata.js"; + +function slot< + T extends Record | DefaultSlot>, + K extends string +>(slotData?: SlotMetadata): (target: T, prop: K) => void { + + return (target: any, slotKey: string | symbol) => { + const ctor = target.constructor as typeof UI5Element; + + if (!Object.prototype.hasOwnProperty.call(ctor, "metadata")) { + ctor.metadata = {}; + } + + const metadata = ctor.metadata; + if (!metadata.slots) { + metadata.slots = {}; + } + + const slotMetadata = metadata.slots; + + if (slotData && slotData.default && slotMetadata.default) { + throw new Error("Only one slot can be the default slot."); + } + + const key = slotData && slotData.default ? "default" : (slotKey as string); + slotData = slotData || { type: HTMLElement }; + + if (!slotData.type) { + slotData.type = HTMLElement; + } + + if (!slotMetadata[key]) { + slotMetadata[key] = slotData; + } + + if (slotData.default) { + delete slotMetadata.default.default; + slotMetadata.default.propertyName = slotKey as string; + } + + ctor.metadata.managedSlots = true; + }; +} + +export default slot; \ No newline at end of file diff --git a/packages/base/src/decorators/slot-strict2.ts b/packages/base/src/decorators/slot-strict2.ts new file mode 100644 index 000000000000..897e67578d39 --- /dev/null +++ b/packages/base/src/decorators/slot-strict2.ts @@ -0,0 +1,65 @@ +import type UI5Element from "../UI5Element.js"; +import type { Slot } from "../UI5ElementMetadata.js"; + +type HasSlotDetails = { slotDetails: Record }; + +// Helper type that produces a clear error message +type ValidateSlotKey = + K extends keyof T["slotDetails"] + ? K + : `Error: Slot "${K & string}" is not declared in slotDetails. Add it to slotDetails!: { ${K & string}: YourType }`; + + +// Overload: slot key must exist in slotDetails with clear error +function slot< + T extends HasSlotDetails, + K extends PropertyKey +>(slotData?: Slot): ( + target: T, + key: ValidateSlotKey +) => void; + +// Implementation +function slot(slotData?: Slot) { + return ( + target: HasSlotDetails, + slotKey: K + ) => { + const ctor = (target as any).constructor as typeof UI5Element; + + if (!Object.prototype.hasOwnProperty.call(ctor, "metadata")) { + ctor.metadata = {}; + } + + const metadata = ctor.metadata; + if (!metadata.slots) { + metadata.slots = {}; + } + + const slotMetadata = metadata.slots; + + if (slotData && slotData.default && slotMetadata.default) { + throw new Error("Only one slot can be the default slot."); + } + + const key = slotData && slotData.default ? "default" : (slotKey as string); + slotData = slotData || { type: HTMLElement }; + + if (!slotData.type) { + slotData.type = HTMLElement; + } + + if (!slotMetadata[key]) { + slotMetadata[key] = slotData; + } + + if (slotData.default) { + delete slotMetadata.default.default; + slotMetadata.default.propertyName = slotKey as string; + } + + ctor.metadata.managedSlots = true; + }; +} + +export default slot; \ No newline at end of file diff --git a/packages/base/src/index.ts b/packages/base/src/index.ts index 0765f6461e3d..a73b95fd0f12 100644 --- a/packages/base/src/index.ts +++ b/packages/base/src/index.ts @@ -35,6 +35,7 @@ import customElement from "./decorators/customElement.js"; import event from "./decorators/event.js"; import property from "./decorators/property.js"; import slot from "./decorators/slot.js"; +import slotStrict from "./decorators/slot-strict.js"; // delegate/ import ItemNavigation from "./delegate/ItemNavigation.js"; @@ -141,6 +142,7 @@ export { event, property, slot, + slotStrict, // delegate/ ItemNavigation, diff --git a/packages/base/test/test-elements/Generic.tsx b/packages/base/test/test-elements/Generic.tsx index 2bd26f5fe615..a93db9e3be88 100644 --- a/packages/base/test/test-elements/Generic.tsx +++ b/packages/base/test/test-elements/Generic.tsx @@ -1,6 +1,6 @@ -import UI5Element from "../../src/UI5Element.js"; +import UI5Element, { DefaultSlot, Slot } from "../../src/UI5Element.js"; import customElement from "../../src/decorators/customElement.js"; -import slot from "../../src/decorators/slot.js"; +import slot from "../../src/decorators/slot-strict.js"; import property from "../../src/decorators/property.js"; import jsxRenderer from "../../src/renderer/JsxRenderer.js"; @@ -28,19 +28,19 @@ class Generic extends UI5Element { defaultValueProp = "Hello"; @slot({ type: Node, "default": true }) - content!: Array + content!: DefaultSlot>; @slot({ type: HTMLElement }) - other!: Array + other!: Slot> @slot({ type: HTMLElement, individualSlots: true }) - individual!: Array + individual!: Slot> @slot({ type: HTMLElement, propertyName: "items" }) - named!: Array + named!: Slot> @slot({ type: HTMLElement }) - "row-header"!: Array + "row-header"!: Slot> static get template() { return () =>
diff --git a/packages/base/test/test-elements/GenericExt.tsx b/packages/base/test/test-elements/GenericExt.tsx index 0bc3c73d1b77..84c95cdaa0b9 100644 --- a/packages/base/test/test-elements/GenericExt.tsx +++ b/packages/base/test/test-elements/GenericExt.tsx @@ -1,6 +1,7 @@ import customElement from "../../src/decorators/customElement.js"; import property from "../../src/decorators/property.js"; -import slot from "../../src/decorators/slot.js"; +import slot from "../../src/decorators/slot-strict.js"; +import { Slot } from "../../src/UI5Element.js"; import Generic from "./Generic.js"; @customElement("ui5-test-generic-ext") @@ -12,7 +13,7 @@ class GenericExt extends Generic { strProp = "Ext"; @slot() - extSlot!: Array; + extSlot!: Slot>; } GenericExt.define(); diff --git a/packages/base/test/test-elements/Parent.tsx b/packages/base/test/test-elements/Parent.tsx index b48fc24b6c5f..2a9797aa3f75 100644 --- a/packages/base/test/test-elements/Parent.tsx +++ b/packages/base/test/test-elements/Parent.tsx @@ -1,6 +1,6 @@ -import UI5Element from "../../src/UI5Element.js"; +import UI5Element, { Slot } from "../../src/UI5Element.js"; import customElement from "../../src/decorators/customElement.js"; -import slot from "../../src/decorators/slot.js"; +import slot from "../../src/decorators/slot-strict.js"; import jsxRenderer from "../../src/renderer/JsxRenderer.js"; @customElement({ @@ -16,7 +16,7 @@ class Parent extends UI5Element { slots: false, }, }) - content!: Array; + content!: Slot>; @slot({ type: HTMLElement, @@ -25,7 +25,7 @@ class Parent extends UI5Element { slots: false, }, }) - items!: Array; + items!: Slot>; static get template() { return () =>
diff --git a/packages/compat/src/Table.ts b/packages/compat/src/Table.ts index 53143bbdb715..02c5b65d02be 100644 --- a/packages/compat/src/Table.ts +++ b/packages/compat/src/Table.ts @@ -1,9 +1,9 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; -import type { ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { ChangeInfo, DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; @@ -400,7 +400,7 @@ class Table extends UI5Element { individualSlots: true, invalidateOnChildChange: true, }) - rows!: Array; + rows!: DefaultSlot>; /** * Defines the configuration for the columns of the component. @@ -416,7 +416,7 @@ class Table extends UI5Element { slots: false, }, }) - columns!: Array; + columns!: Slot>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/compat/src/TableCell.ts b/packages/compat/src/TableCell.ts index 003b2b3c2722..220919ca6762 100644 --- a/packages/compat/src/TableCell.ts +++ b/packages/compat/src/TableCell.ts @@ -1,10 +1,10 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import TableCellTemplate from "./TableCellTemplate.js"; // Styles @@ -58,7 +58,7 @@ class TableCell extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content?: Array; + content!: DefaultSlot>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/compat/src/TableRow.ts b/packages/compat/src/TableRow.ts index 2ebb2c4384f6..ab6a7c71e670 100644 --- a/packages/compat/src/TableRow.ts +++ b/packages/compat/src/TableRow.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -189,7 +189,7 @@ class TableRow extends UI5Element implements ITableRow { * @public */ @slot({ type: HTMLElement, "default": true, individualSlots: true }) - cells!: Array; + cells!: DefaultSlot>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/BarcodeScannerDialog.ts b/packages/fiori/src/BarcodeScannerDialog.ts index 56bb3220e64f..4a7b6f7e683c 100644 --- a/packages/fiori/src/BarcodeScannerDialog.ts +++ b/packages/fiori/src/BarcodeScannerDialog.ts @@ -1,5 +1,5 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import type Dialog from "@ui5/webcomponents/dist/Dialog.js"; @@ -9,6 +9,7 @@ import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type { Result, Exception } from "@zxing/library"; import type { Interval } from "@ui5/webcomponents-base/dist/types.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // eslint-disable-next-line import/no-extraneous-dependencies import ZXing from "@ui5/webcomponents-fiori/dist/ssr-zxing.js"; @@ -123,7 +124,7 @@ class BarcodeScannerDialog extends UI5Element { * @since 2.4.0 */ @slot() - header!: Array; + header!: Slot>; /** * Defines the footer HTML Element. @@ -139,7 +140,7 @@ class BarcodeScannerDialog extends UI5Element { * @since 2.4.0 */ @slot() - footer!: Array; + footer!: Slot>; /** * Indicates whether the dialog is open. diff --git a/packages/fiori/src/DynamicPage.ts b/packages/fiori/src/DynamicPage.ts index aa41142c64ed..d08626ce8b14 100644 --- a/packages/fiori/src/DynamicPage.ts +++ b/packages/fiori/src/DynamicPage.ts @@ -1,7 +1,7 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; @@ -30,6 +30,8 @@ import { DYNAMIC_PAGE_ARIA_LABEL_SNAPPED_HEADER, } from "./generated/i18n/i18n-defaults.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; + const SCROLL_DEBOUNCE_RATE = 5; // ms const SCROLL_THRESHOLD = 10; // px /** @@ -156,7 +158,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement }) - content!: HTMLElement[]; + content!: DefaultSlot; /** * Defines the title HTML Element. @@ -164,7 +166,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ type: DynamicPageTitle }) - titleArea!: Array; + titleArea!: Slot>; /** * Defines the header HTML Element. @@ -172,7 +174,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ type: DynamicPageHeader }) - headerArea!: Array; + headerArea!: Slot>; /** * Defines the footer HTML Element. @@ -180,7 +182,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ type: HTMLElement }) - footerArea!: HTMLElement[]; + footerArea!: Slot; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/DynamicPageHeader.ts b/packages/fiori/src/DynamicPageHeader.ts index df79933f366f..af16c379b0d2 100644 --- a/packages/fiori/src/DynamicPageHeader.ts +++ b/packages/fiori/src/DynamicPageHeader.ts @@ -1,10 +1,11 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Template import DynamicPageHeaderTemplate from "./DynamicPageHeaderTemplate.js"; @@ -63,7 +64,7 @@ class DynamicPageHeader extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement }) - content!: HTMLElement[]; + content!: DefaultSlot; /** * Defines if the header is snapped. diff --git a/packages/fiori/src/DynamicPageTitle.ts b/packages/fiori/src/DynamicPageTitle.ts index 12493d0eef92..af61e645acc8 100644 --- a/packages/fiori/src/DynamicPageTitle.ts +++ b/packages/fiori/src/DynamicPageTitle.ts @@ -1,7 +1,7 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -14,6 +14,7 @@ import type { ToolbarMinWidthChangeEventDetail } from "@ui5/webcomponents/dist/T import ToolbarItemOverflowBehavior from "@ui5/webcomponents/dist/types/ToolbarItemOverflowBehavior.js"; import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js"; import type Title from "@ui5/webcomponents/dist/Title.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Template import DynamicPageTitleTemplate from "./DynamicPageTitleTemplate.js"; @@ -135,7 +136,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - heading!: HTMLElement[]; + heading!: Slot; /** * Defines the heading that is shown only when the header is snapped. @@ -143,7 +144,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - snappedHeading!: HTMLElement[]; + snappedHeading!: Slot; /** * Defines the content of the snapped title on mobile devices. @@ -159,7 +160,7 @@ class DynamicPageTitle extends UI5Element { * @since 2.3.0 */ @slot({ type: HTMLElement }) - snappedTitleOnMobile!: Array; + snappedTitleOnMobile!: Slot<Array<Title>>; /** * Defines the bar with actions in the Dynamic page title. @@ -167,7 +168,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - actionsBar!: HTMLElement[]; + actionsBar!: Slot<HTMLElement[]>; /** * Defines the bar with navigation actions in the Dynamic page title. @@ -175,7 +176,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - navigationBar!: Array<Toolbar>; + navigationBar!: Slot<Array<Toolbar>>; /** * Defines the content of the Dynamic page title. @@ -183,7 +184,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement }) - content!: HTMLElement[]; + content!: DefaultSlot<HTMLElement[]>; /** * Defines the content of the title that is shown only when the header is not snapped. @@ -191,7 +192,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - subheading!: HTMLElement[]; + subheading!: Slot<HTMLElement[]>; /** * Defines the content of the title that is shown only when the header is snapped. @@ -199,7 +200,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - snappedSubheading!: HTMLElement[]; + snappedSubheading!: Slot<HTMLElement[]>; /** * Defines the content of the breadcrumbs inside Dynamic Page Title. @@ -207,7 +208,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - breadcrumbs!: HTMLElement[]; + breadcrumbs!: Slot<HTMLElement[]>; /** * @private diff --git a/packages/fiori/src/DynamicSideContent.ts b/packages/fiori/src/DynamicSideContent.ts index 3b641a3c0291..f19014119c5e 100644 --- a/packages/fiori/src/DynamicSideContent.ts +++ b/packages/fiori/src/DynamicSideContent.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -233,7 +233,7 @@ class DynamicSideContent extends UI5Element { * @public */ @slot() - sideContent!: Array<HTMLElement>; + sideContent!: Slot<Array<HTMLElement>>; @query(".ui5-dsc-main") _mainContent!: HTMLElement; diff --git a/packages/fiori/src/FilterItem.ts b/packages/fiori/src/FilterItem.ts index dcf4233e150c..e79a42f625c9 100644 --- a/packages/fiori/src/FilterItem.ts +++ b/packages/fiori/src/FilterItem.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import type FilterItemOption from "./FilterItemOption.js"; @@ -49,7 +49,7 @@ class FilterItem extends UI5Element { * @public */ @slot() - values!: Array<FilterItemOption>; + values!: Slot<Array<FilterItemOption>>; } FilterItem.define(); diff --git a/packages/fiori/src/FlexibleColumnLayout.ts b/packages/fiori/src/FlexibleColumnLayout.ts index 6067ad3c2b10..a3514756c69a 100644 --- a/packages/fiori/src/FlexibleColumnLayout.ts +++ b/packages/fiori/src/FlexibleColumnLayout.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -347,21 +347,21 @@ class FlexibleColumnLayout extends UI5Element { * @public */ @slot() - startColumn!: Array<HTMLElement>; + startColumn!: Slot<Array<HTMLElement>>; /** * Defines the content in the middle column. * @public */ @slot() - midColumn!: Array<HTMLElement>; + midColumn!: Slot<Array<HTMLElement>>; /** * Defines the content in the end column. * @public */ @slot() - endColumn!: Array<HTMLElement>; + endColumn!: Slot<Array<HTMLElement>>; initialRendering: boolean; _handleResize: () => void; diff --git a/packages/fiori/src/IllustratedMessage.ts b/packages/fiori/src/IllustratedMessage.ts index 0b119df2ce0d..ca1cbd44bfa5 100644 --- a/packages/fiori/src/IllustratedMessage.ts +++ b/packages/fiori/src/IllustratedMessage.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; @@ -248,7 +248,7 @@ class IllustratedMessage extends UI5Element { * @since 1.7.0 */ @slot({ type: HTMLElement }) - title!: Array<HTMLElement> & string; // Note: since title collides with HTMLElement's title attribute and it's a String, we're adding the "& string" to the type Array<HTMLElement> to avoid ts complains. In the future we will rename/deprecate this slot name, so that it doesn't collide with HTMLElement's title attribute. + title!: Slot<Array<HTMLElement>> & Slot<string> ; /** * Defines the subtitle of the component. @@ -258,7 +258,7 @@ class IllustratedMessage extends UI5Element { * @since 1.0.0-rc.16 */ @slot({ type: HTMLElement }) - subtitle!: Array<HTMLElement>; + subtitle!: Slot<Array<HTMLElement>>; /** * Defines the component actions. @@ -267,7 +267,7 @@ class IllustratedMessage extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - actions!: Array<IButton>; + actions!: DefaultSlot<Array<IButton>>; illustrationTitle?: string; illustrationSubtitle?: string; diff --git a/packages/fiori/src/MediaGallery.ts b/packages/fiori/src/MediaGallery.ts index 33fda32f95bb..cb3c05a15f83 100644 --- a/packages/fiori/src/MediaGallery.ts +++ b/packages/fiori/src/MediaGallery.ts @@ -4,13 +4,13 @@ import { isPhone } from "@ui5/webcomponents-base/dist/Device.js"; import MediaRange from "@ui5/webcomponents-base/dist/MediaRange.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import NavigationMode from "@ui5/webcomponents-base/dist/types/NavigationMode.js"; -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import Button from "@ui5/webcomponents/dist/Button.js"; import type { CarouselNavigateEventDetail } from "@ui5/webcomponents/dist/Carousel.js"; import Carousel from "@ui5/webcomponents/dist/Carousel.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import type { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; import MediaGalleryItem from "./MediaGalleryItem.js"; @@ -215,7 +215,7 @@ class MediaGallery extends UI5Element { invalidateOnChildChange: true, "default": true, }) - items!: Array<IMediaGalleryItem>; + items!: DefaultSlot<Array<IMediaGalleryItem>>; _itemNavigation: ItemNavigation; _onResize: () => void; diff --git a/packages/fiori/src/MediaGalleryItem.ts b/packages/fiori/src/MediaGalleryItem.ts index 8e7959475864..c0a2f5c734b8 100644 --- a/packages/fiori/src/MediaGalleryItem.ts +++ b/packages/fiori/src/MediaGalleryItem.ts @@ -5,9 +5,10 @@ import { isPhone } from "@ui5/webcomponents-base/dist/Device.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type MediaGalleryItemLayout from "./types/MediaGalleryItemLayout.js"; import type { IMediaGalleryItem } from "./MediaGallery.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Styles import MediaGalleryItemCss from "./generated/themes/MediaGalleryItem.css.js"; @@ -125,14 +126,14 @@ class MediaGalleryItem extends UI5Element implements IMediaGalleryItem { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; /** * Defines the content of the thumbnail. * @public */ @slot() - thumbnail!: Array<HTMLElement>; + thumbnail!: Slot<Array<HTMLElement>>; _monitoredThumbnail: HTMLElement | null; _monitoredContent: HTMLElement | null; diff --git a/packages/fiori/src/NavigationLayout.ts b/packages/fiori/src/NavigationLayout.ts index bc8e27c2aa6d..7398c42f0860 100644 --- a/packages/fiori/src/NavigationLayout.ts +++ b/packages/fiori/src/NavigationLayout.ts @@ -1,11 +1,12 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { isPhone } from "@ui5/webcomponents-base/dist/Device.js"; import NavigationLayoutMode from "./types/NavigationLayoutMode.js"; import type SideNavigation from "./SideNavigation.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Template import NavigationLayoutTemplate from "./NavigationLayoutTemplate.js"; @@ -92,21 +93,21 @@ class NavigationLayout extends UI5Element { * @public */ @slot() - header!: Array<HTMLElement>; + header!: Slot<Array<HTMLElement>>; /** * Defines the side content. * @public */ @slot() - sideContent!: Array<SideNavigation>; + sideContent!: Slot<Array<SideNavigation>>; /** * Defines the content. * @public */ @slot({ type: HTMLElement, "default": true }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; onBeforeRendering() { this.calcSideCollapsed(); diff --git a/packages/fiori/src/NavigationMenu.ts b/packages/fiori/src/NavigationMenu.ts index bb7a685bb2ca..2ae6b389c81c 100644 --- a/packages/fiori/src/NavigationMenu.ts +++ b/packages/fiori/src/NavigationMenu.ts @@ -1,5 +1,5 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -18,6 +18,7 @@ import menuCss from "@ui5/webcomponents/dist/generated/themes/Menu.css.js"; import { NAVIGATION_MENU_POPOVER_HIDDEN_TEXT, } from "./generated/i18n/i18n-defaults.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -54,7 +55,7 @@ class NavigationMenu extends Menu { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - declare items: Array<NavigationMenuItem>; + declare items: DefaultSlot<Array<NavigationMenuItem>>; @i18n("@ui5/webcomponents-fiori") static i18nBundleFiori: I18nBundle; diff --git a/packages/fiori/src/NavigationMenuItem.ts b/packages/fiori/src/NavigationMenuItem.ts index 930ce0627216..7b1a37abb118 100644 --- a/packages/fiori/src/NavigationMenuItem.ts +++ b/packages/fiori/src/NavigationMenuItem.ts @@ -14,6 +14,7 @@ import { isEnterAlt, } from "@ui5/webcomponents-base/dist/Keys.js"; import type SideNavigationSelectableItemBase from "./SideNavigationSelectableItemBase.js"; +import { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Templates import NavigationMenuItemTemplate from "./NavigationMenuItemTemplate.js"; diff --git a/packages/fiori/src/NotificationList.ts b/packages/fiori/src/NotificationList.ts index 62cc0d411ea0..5bc60bf34303 100644 --- a/packages/fiori/src/NotificationList.ts +++ b/packages/fiori/src/NotificationList.ts @@ -1,10 +1,10 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import type { ListItemClickEventDetail, @@ -116,7 +116,7 @@ class NotificationList extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: Array<NotificationListItemBase>; + items!: DefaultSlot<Array<NotificationListItemBase>>; /** * Defines the text that is displayed when the component contains no items. diff --git a/packages/fiori/src/NotificationListGroupItem.ts b/packages/fiori/src/NotificationListGroupItem.ts index 50e672753407..9af0d417b474 100644 --- a/packages/fiori/src/NotificationListGroupItem.ts +++ b/packages/fiori/src/NotificationListGroupItem.ts @@ -3,7 +3,7 @@ import { } from "@ui5/webcomponents-base/dist/Keys.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type NotificationListGrowingMode from "@ui5/webcomponents/dist/types/NotificationListGrowingMode.js"; @@ -28,6 +28,7 @@ import NotificationListGroupItemTemplate from "./NotificationListGroupItemTempla // Styles import NotificationListGroupItemCss from "./generated/themes/NotificationListGroupItem.css.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; type NotificationListGroupItemToggleEventDetail = { item: NotificationListGroupItem, @@ -124,7 +125,7 @@ class NotificationListGroupItem extends NotificationListItemBase { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: Array<NotificationListItem> + items!: DefaultSlot<Array<NotificationListItem>> onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/fiori/src/NotificationListItem.ts b/packages/fiori/src/NotificationListItem.ts index acd64744d1d4..4713d403858b 100644 --- a/packages/fiori/src/NotificationListItem.ts +++ b/packages/fiori/src/NotificationListItem.ts @@ -5,7 +5,7 @@ import type { UI5CustomEvent } from "@ui5/webcomponents-base"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; @@ -18,6 +18,7 @@ import willShowContent from "@ui5/webcomponents-base/dist/util/willShowContent.j import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import NotificationListItemImportance from "./types/NotificationListItemImportance.js"; import NotificationListItemBase from "./NotificationListItemBase.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Icons import iconSysEnter2 from "@ui5/webcomponents-icons/dist/sys-enter-2.js"; @@ -225,7 +226,7 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot() - avatar!: Array<HTMLElement>; + avatar!: Slot<Array<HTMLElement>>; /** * Defines the menu, displayed in the `ui5-li-notification`. @@ -236,14 +237,14 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot() - menu!: Array<HTMLElement>; + menu!: Slot<Array<HTMLElement>>; /** * Defines the elements, displayed in the footer of the of the component. * @public */ @slot({ type: HTMLElement, individualSlots: true }) - footnotes!: Array<HTMLElement>; + footnotes!: Slot<Array<HTMLElement>>; /** * Defines the content of the `ui5-li-notification`, @@ -253,7 +254,7 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot({ type: Node, "default": true }) - description!: Array<Node>; + description!: DefaultSlot<Array<Node>>; @query(".ui5-nli-title-text") titleTextDOM?: HTMLElement; diff --git a/packages/fiori/src/Page.ts b/packages/fiori/src/Page.ts index 1134c8aceac7..4bda0dda4cde 100644 --- a/packages/fiori/src/Page.ts +++ b/packages/fiori/src/Page.ts @@ -1,12 +1,13 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { getAnimationMode } from "@ui5/webcomponents-base/dist/config/AnimationMode.js"; import { getScopedVarName } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js"; import AnimationMode from "@ui5/webcomponents-base/dist/types/AnimationMode.js"; import type PageBackgroundDesign from "./types/PageBackgroundDesign.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Template import PageTemplate from "./PageTemplate.js"; @@ -95,21 +96,21 @@ class Page extends UI5Element { * @public */ @slot() - header!: Array<HTMLElement>; + header!: Slot<Array<HTMLElement>>; /** * Defines the content HTML Element. * @public */ @slot({ type: Node, "default": true }) - content!: Array<Node>; + content!: DefaultSlot<Array<Node>>; /** * Defines the footer HTML Element. * @public */ @slot() - footer!: Array<HTMLElement>; + footer!: Slot<Array<HTMLElement>>; constructor() { super(); diff --git a/packages/fiori/src/ProductSwitch.ts b/packages/fiori/src/ProductSwitch.ts index 4f3583fdd5a3..3c54300be146 100644 --- a/packages/fiori/src/ProductSwitch.ts +++ b/packages/fiori/src/ProductSwitch.ts @@ -1,9 +1,9 @@ import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; import type { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; @@ -80,8 +80,8 @@ class ProductSwitch extends UI5Element { * Defines the items of the `ui5-product-switch`. * @public */ - @slot({ type: HTMLElement, "default": true }) - items!: Array<IProductSwitchItem> + @slot({ type: HTMLElement, "default": true, invalidateOnChildChange: true }) + items!: DefaultSlot<Array<IProductSwitchItem>> _itemNavigation: ItemNavigation; _currentIndex: number; diff --git a/packages/fiori/src/ProductSwitchItem.ts b/packages/fiori/src/ProductSwitchItem.ts index 8bd5bd0867a4..9d2a4d9abeac 100644 --- a/packages/fiori/src/ProductSwitchItem.ts +++ b/packages/fiori/src/ProductSwitchItem.ts @@ -1,11 +1,11 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { isSpace, isEnter, isSpaceShift } from "@ui5/webcomponents-base/dist/Keys.js"; import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import ProductSwitchItemTemplate from "./ProductSwitchItemTemplate.js"; import type { IProductSwitchItem } from "./ProductSwitch.js"; @@ -144,7 +144,7 @@ class ProductSwitchItem extends UI5Element implements IProductSwitchItem { * @since 2.14.0 */ @slot({ type: HTMLElement }) - image!: Array<HTMLElement>; + image!: Slot<Array<HTMLElement>>; _deactivate: () => void; diff --git a/packages/fiori/src/Search.ts b/packages/fiori/src/Search.ts index 0c071b508657..44da945688b0 100755 --- a/packages/fiori/src/Search.ts +++ b/packages/fiori/src/Search.ts @@ -1,5 +1,5 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import { isPhone } from "@ui5/webcomponents-base/dist/Device.js"; @@ -38,6 +38,7 @@ import type { InputEventDetail } from "@ui5/webcomponents/dist/Input.js"; import type Input from "@ui5/webcomponents/dist/Input.js"; import type { PopupBeforeCloseEventDetail } from "@ui5/webcomponents/dist/Popup.js"; import type Select from "@ui5/webcomponents/dist/Select.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; interface ISearchSuggestionItem extends UI5Element { selected: boolean; @@ -132,7 +133,7 @@ class Search extends SearchField { "default": true, invalidateOnChildChange: true, }) - items!: Array<SearchItem | SearchItemGroup>; + items!: DefaultSlot<Array<SearchItem | SearchItemGroup>>; /** * Defines the popup footer action button. @@ -140,7 +141,7 @@ class Search extends SearchField { * @public */ @slot() - action!: Array<Button>; + action!: Slot<Array<Button>>; /** * Defines the illustrated message to be shown in the popup. @@ -148,7 +149,7 @@ class Search extends SearchField { * @public */ @slot() - illustration!: Array<IllustratedMessage>; + illustration!: Slot<Array<IllustratedMessage>>; /** * Defines the illustrated message to be shown in the popup. @@ -156,7 +157,7 @@ class Search extends SearchField { * @public */ @slot() - messageArea!: Array<SearchMessageArea>; + messageArea!: Slot<Array<SearchMessageArea>>; /** * Indicates whether the items picker is open. diff --git a/packages/fiori/src/SearchField.ts b/packages/fiori/src/SearchField.ts index 7e12153a94cb..d9843060ea21 100644 --- a/packages/fiori/src/SearchField.ts +++ b/packages/fiori/src/SearchField.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; @@ -181,7 +181,7 @@ class SearchField extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true, invalidateOnChildChange: true }) - scopes!: Array<ISearchScope>; + scopes!: Slot<Array<ISearchScope>>; /** * Defines the filter button slot, used to display an additional filtering button. @@ -192,7 +192,7 @@ class SearchField extends UI5Element { * @since 2.11.0 */ @slot() - filterButton!: Array<Button>; + filterButton!: Slot<Array<Button>>; /** * @private diff --git a/packages/fiori/src/SearchItem.ts b/packages/fiori/src/SearchItem.ts index 7a7335648058..f51ee7da9302 100644 --- a/packages/fiori/src/SearchItem.ts +++ b/packages/fiori/src/SearchItem.ts @@ -1,5 +1,5 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import ListItemBase from "@ui5/webcomponents/dist/ListItemBase.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import SearchItemTemplate from "./SearchItemTemplate.js"; @@ -25,6 +25,7 @@ import { i18n } from "@ui5/webcomponents-base/dist/decorators.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; // @ts-expect-error import encodeXML from "@ui5/webcomponents-base/dist/sap/base/security/encodeXML.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class * @@ -125,7 +126,7 @@ class SearchItem extends ListItemBase { * @since 2.12.0 */ @slot() - image!: Array<HTMLElement>; + image!: Slot<Array<HTMLElement>>; /** * Defines the actionable elements. @@ -139,7 +140,7 @@ class SearchItem extends ListItemBase { * @since 2.16.0 */ @slot() - actions!: Array<HTMLElement>; + actions!: Slot<Array<HTMLElement>>; _markupText = ""; diff --git a/packages/fiori/src/SearchItemGroup.ts b/packages/fiori/src/SearchItemGroup.ts index 1f44eeb321d4..fa49916743d4 100644 --- a/packages/fiori/src/SearchItemGroup.ts +++ b/packages/fiori/src/SearchItemGroup.ts @@ -3,6 +3,7 @@ import ListItemGroup from "@ui5/webcomponents/dist/ListItemGroup.js"; import SearchItemGroupCss from "./generated/themes/SearchItemGroup.css.js"; import ListBoxItemGroupTemplate from "@ui5/webcomponents/dist/ListBoxItemGroupTemplate.js"; import WrappingType from "@ui5/webcomponents/dist/types/WrappingType.js"; +import { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class diff --git a/packages/fiori/src/ShellBar.ts b/packages/fiori/src/ShellBar.ts index 0107f9dc97e7..d59026547c83 100644 --- a/packages/fiori/src/ShellBar.ts +++ b/packages/fiori/src/ShellBar.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot, type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; @@ -482,7 +482,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - assistant!: Array<IButton>; + assistant!: Slot<Array<IButton>>; /** * Defines the branding slot. @@ -495,7 +495,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - branding!: Array<ShellBarBranding>; + branding!: Slot<Array<ShellBarBranding>>; /** * Defines the `ui5-shellbar` additional items. @@ -505,7 +505,7 @@ class ShellBar extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true, invalidateOnChildChange: true }) - items!: Array<ShellBarItem>; + items!: DefaultSlot<Array<ShellBarItem>>; /** * You can pass `ui5-avatar` to set the profile image/icon. @@ -517,7 +517,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - profile!: Array<HTMLElement>; + profile!: Slot<Array<HTMLElement>>; /** * Defines the logo of the `ui5-shellbar`. @@ -526,7 +526,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - logo!: Array<HTMLElement>; + logo!: Slot<Array<HTMLElement>>; /** * Defines the items displayed in menu after a click on a start button. @@ -536,7 +536,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - menuItems!: Array<ListItemBase>; + menuItems!: Slot<Array<ListItemBase>>; /** * Defines the `ui5-input`, that will be used as a search field. @@ -546,7 +546,7 @@ class ShellBar extends UI5Element { type: HTMLElement, invalidateOnChildChange: true, }) - searchField!: Array<IShellBarSearchField>; + searchField!: Slot<Array<IShellBarSearchField>>; /** * Defines a `ui5-button` in the bar that will be placed in the beginning. @@ -555,7 +555,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - startButton!: Array<IButton>; + startButton!: Slot<Array<IButton>>; /** * The container is positioned in the center of the `ui5-shellbar` and occupies one-third of the total length of the `ui5-shellbar`. @@ -564,7 +564,7 @@ class ShellBar extends UI5Element { * @private */ @slot() - midContent!: Array<HTMLElement>; + midContent!: Slot<Array<HTMLElement>>; /** * Define the items displayed in the content area. @@ -578,7 +578,7 @@ class ShellBar extends UI5Element { * @since 2.7.0 */ @slot({ type: HTMLElement, individualSlots: true }) - content!: Array<HTMLElement>; + content!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/ShellBarBranding.ts b/packages/fiori/src/ShellBarBranding.ts index 8f2b739b0a65..914ef0e7d404 100644 --- a/packages/fiori/src/ShellBarBranding.ts +++ b/packages/fiori/src/ShellBarBranding.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot, type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { @@ -102,7 +102,7 @@ class ShellBarBranding extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; /** * Defines the logo of the `ui5-shellbar`. @@ -110,7 +110,7 @@ class ShellBarBranding extends UI5Element { * @public */ @slot({ type: HTMLElement }) - logo!: Array<HTMLElement>; + logo!: Slot<Array<HTMLElement>>; get parsedRef() { return (this.href && this.href.length > 0) ? this.href : undefined; diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index 52b7d34989eb..a95c91e0e698 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -1,4 +1,4 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot, type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -7,7 +7,7 @@ import type NavigationMenu from "./NavigationMenu.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; import type { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; @@ -152,7 +152,7 @@ class SideNavigation extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: Array<SideNavigationItemBase>; + items!: DefaultSlot<Array<SideNavigationItemBase>>; /** * Defines the fixed items at the bottom of the component. @@ -162,7 +162,7 @@ class SideNavigation extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - fixedItems!: Array<SideNavigationItemBase>; + fixedItems!: Slot<Array<SideNavigationItemBase>>; /** * Defines the header of the `ui5-side-navigation`. @@ -173,7 +173,7 @@ class SideNavigation extends UI5Element { * @since 1.0.0-rc.11 */ @slot() - header!: Array<HTMLElement>; + header!: Slot<Array<HTMLElement>>; /** * @private @@ -218,8 +218,8 @@ class SideNavigation extends UI5Element { onBeforeRendering() { super.onBeforeRendering(); - this._getAllItems(this.items as Array<SideNavigationItem | SideNavigationGroup>) - .concat(this._getAllItems(this.fixedItems as Array<SideNavigationItem | SideNavigationGroup>)) + this._getAllItems(this.items) + .concat(this._getAllItems(this.fixedItems)) .forEach(item => { item.sideNavCollapsed = this.collapsed; item.inPopover = this.inPopover; @@ -249,7 +249,7 @@ class SideNavigation extends UI5Element { // item navigation index should be managed, because items are // dynamically recreated and tabIndexes are not updated const tree = this.getPickerTree(); - const selectedItem = tree._findSelectedItem(tree.items as Array<SideNavigationItem | SideNavigationGroup>); + const selectedItem = tree._findSelectedItem(tree.items); if (selectedItem) { selectedItem.focus(); } else { @@ -286,7 +286,7 @@ class SideNavigation extends UI5Element { return; } - const selectedItem = this._findSelectedItem(this.items as Array<SideNavigationItem | SideNavigationGroup>); + const selectedItem = this._findSelectedItem(this.items); if (selectedItem) { this.focusItem(selectedItem); @@ -421,11 +421,11 @@ class SideNavigation extends UI5Element { } getEnabledFixedItems() : Array<ITabbable> { - return this.getEnabledItems(this.fixedItems as Array<SideNavigationItem | SideNavigationGroup>); + return this.getEnabledItems(this.fixedItems); } getEnabledFlexibleItems() : Array<ITabbable> { - const items = this.getEnabledItems(this.items as Array<SideNavigationItem | SideNavigationGroup>); + const items = this.getEnabledItems(this.items); if (this._overflowItem) { items.push(this._overflowItem); @@ -434,7 +434,7 @@ class SideNavigation extends UI5Element { return items; } - getEnabledItems(items: Array<SideNavigationItem | SideNavigationGroup>) : Array<ITabbable> { + getEnabledItems(items: Array<SideNavigationItemBase>) : Array<ITabbable> { const result = new Array<ITabbable>(); this._getFocusableItems(items).forEach(item => { @@ -458,12 +458,12 @@ class SideNavigation extends UI5Element { onAfterRendering() { if (!this.getDomRef()?.matches(":focus-within")) { - let selectedItem = this._findSelectedItem(this.items as Array<SideNavigationItem | SideNavigationGroup>); + let selectedItem = this._findSelectedItem(this.items); if (selectedItem) { this._flexibleItemNavigation.setCurrentItem(selectedItem); } - selectedItem = this._findSelectedItem(this.fixedItems as Array<SideNavigationItem | SideNavigationGroup>); + selectedItem = this._findSelectedItem(this.fixedItems); if (selectedItem) { this._fixedItemNavigation.setCurrentItem(selectedItem); } @@ -565,31 +565,33 @@ class SideNavigation extends UI5Element { return this._getFocusableItems(items).find(item => item.forcedTabIndex === "0"); } - _getSelectableItems(items: Array<SideNavigationItem | SideNavigationGroup>) : Array<SideNavigationSelectableItemBase> { + _getSelectableItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationSelectableItemBase> { return items.reduce((result, item) => { - return result.concat(item.selectableItems); + return result.concat((item as SideNavigationItem).selectableItems); }, new Array<SideNavigationSelectableItemBase>()); } - _getFocusableItems(items: Array<SideNavigationItem | SideNavigationGroup>) : Array<SideNavigationItemBase> { + _getFocusableItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationItemBase> { return items.reduce((result, item) => { - return result.concat(item.focusableItems); + return result.concat((item as SideNavigationItem).focusableItems); }, new Array<SideNavigationItemBase>()); } - _getAllItems(items: Array<SideNavigationItem | SideNavigationGroup>) : Array<SideNavigationItemBase> { + _getAllItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationItemBase> { return items.reduce((result, item) => { - return result.concat(item.allItems); + return result.concat((item as SideNavigationItem).allItems); }, new Array<SideNavigationItemBase>()); } - _findSelectedItem(items: Array<SideNavigationItem | SideNavigationGroup>) : SideNavigationSelectableItemBase | undefined { + _findSelectedItem(items: Array<SideNavigationItemBase>): SideNavigationSelectableItemBase | undefined { return this._getSelectableItems(items).find(item => item._selected); } get overflowItems() : Array<HTMLElement> { - return (this.items as Array<SideNavigationItem | SideNavigationGroup>).reduce((result, item) => { - return result.concat(item.overflowItems); + const items = this.items as Array<SideNavigationItemBase>; + + return items.reduce((result, item) => { + return result.concat((item as SideNavigationItem).overflowItems); }, new Array<HTMLElement>()); } @@ -687,8 +689,8 @@ class SideNavigation extends UI5Element { return; } - let items = this._getSelectableItems(this.items as Array<SideNavigationItem | SideNavigationGroup>); - items = items.concat(this._getSelectableItems(this.fixedItems as Array<SideNavigationItem | SideNavigationGroup>)); + let items = this._getSelectableItems(this.items); + items = items.concat(this._getSelectableItems(this.fixedItems)); items.forEach(current => { current.selected = false; diff --git a/packages/fiori/src/SideNavigationGroup.ts b/packages/fiori/src/SideNavigationGroup.ts index fc52a859e511..b86f639703cb 100644 --- a/packages/fiori/src/SideNavigationGroup.ts +++ b/packages/fiori/src/SideNavigationGroup.ts @@ -1,6 +1,6 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import { isSpace, @@ -15,6 +15,7 @@ import SideNavigationItemBase from "./SideNavigationItemBase.js"; import type SideNavigationSelectableItemBase from "./SideNavigationSelectableItemBase.js"; import type SideNavigationItem from "./SideNavigationItem.js"; import SideNavigationGroupTemplate from "./SideNavigationGroupTemplate.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { SIDE_NAVIGATION_ICON_COLLAPSE, @@ -66,7 +67,7 @@ class SideNavigationGroup extends SideNavigationItemBase { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: Array<SideNavigationItem>; + items!: DefaultSlot<Array<SideNavigationItem>>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/SideNavigationItem.ts b/packages/fiori/src/SideNavigationItem.ts index ac1237316d19..8c777472e210 100644 --- a/packages/fiori/src/SideNavigationItem.ts +++ b/packages/fiori/src/SideNavigationItem.ts @@ -1,7 +1,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import { @@ -20,6 +20,7 @@ import { SIDE_NAVIGATION_OVERFLOW_ITEM_LABEL, SIDE_NAVIGATION_PARENT_ITEM_SELECTABLE_DESCRIPTION, } from "./generated/i18n/i18n-defaults.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Templates import SideNavigationItemTemplate from "./SideNavigationItemTemplate.js"; @@ -77,7 +78,7 @@ class SideNavigationItem extends SideNavigationSelectableItemBase { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: Array<SideNavigationSubItem>; + items!: DefaultSlot<Array<SideNavigationSubItem>>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/Timeline.ts b/packages/fiori/src/Timeline.ts index 539e4460af73..9f5471c72569 100644 --- a/packages/fiori/src/Timeline.ts +++ b/packages/fiori/src/Timeline.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -164,7 +164,7 @@ class Timeline extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true, "default": true }) - items!: Array<ITimelineItem>; + items!: DefaultSlot<Array<ITimelineItem>>; @query(".ui5-timeline-end-marker") timelineEndMarker!: HTMLElement; diff --git a/packages/fiori/src/TimelineGroupItem.ts b/packages/fiori/src/TimelineGroupItem.ts index 08e2aac653c1..ab2f793b8fb4 100644 --- a/packages/fiori/src/TimelineGroupItem.ts +++ b/packages/fiori/src/TimelineGroupItem.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type TimelineLayout from "./types/TimelineLayout.js"; @@ -68,7 +68,7 @@ class TimelineGroupItem extends UI5Element implements ITimelineItem { * @public */ @slot({ type: HTMLElement, individualSlots: true, "default": true }) - items!: Array<ITimelineItem>; + items!: DefaultSlot<Array<ITimelineItem>>; /** * Defines the items orientation. diff --git a/packages/fiori/src/TimelineItem.ts b/packages/fiori/src/TimelineItem.ts index ab032f0041f8..444dd37c65dc 100644 --- a/packages/fiori/src/TimelineItem.ts +++ b/packages/fiori/src/TimelineItem.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type Link from "@ui5/webcomponents/dist/Link.js"; @@ -114,7 +114,7 @@ class TimelineItem extends UI5Element implements ITimelineItem { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: Array<Node>; + content!: DefaultSlot<Array<Node>>; /** * @private diff --git a/packages/fiori/src/UploadCollection.ts b/packages/fiori/src/UploadCollection.ts index 97b091db0f4f..b22cb8ff3b4a 100644 --- a/packages/fiori/src/UploadCollection.ts +++ b/packages/fiori/src/UploadCollection.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -169,7 +169,7 @@ class UploadCollection extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: Array<UploadCollectionItem>; + items!: DefaultSlot<Array<UploadCollectionItem>>; /** * Defines the `ui5-upload-collection` header. @@ -180,7 +180,7 @@ class UploadCollection extends UI5Element { * @public */ @slot({ type: HTMLElement }) - header!: Array<HTMLElement>; + header!: Slot<Array<HTMLElement>>; _bodyDnDHandler: DnDEventListener; diff --git a/packages/fiori/src/UploadCollectionItem.ts b/packages/fiori/src/UploadCollectionItem.ts index 276131e2f506..1eeeff763d96 100644 --- a/packages/fiori/src/UploadCollectionItem.ts +++ b/packages/fiori/src/UploadCollectionItem.ts @@ -2,7 +2,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js"; @@ -39,6 +39,7 @@ import UploadCollectionItemTemplate from "./UploadCollectionItemTemplate.js"; // Styles import UploadCollectionItemCss from "./generated/themes/UploadCollectionItem.css.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -225,7 +226,7 @@ class UploadCollectionItem extends ListItem { * @public */ @slot({ type: HTMLElement }) - thumbnail!: Array<HTMLElement>; + thumbnail!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents-fiori") static i18nFioriBundle: I18nBundle; diff --git a/packages/fiori/src/UserMenu.ts b/packages/fiori/src/UserMenu.ts index eff4d52c6121..136314d46b12 100644 --- a/packages/fiori/src/UserMenu.ts +++ b/packages/fiori/src/UserMenu.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { - customElement, slot, eventStrict as event, property, + customElement, slotStrict as slot, eventStrict as event, property, } from "@ui5/webcomponents-base/dist/decorators.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; @@ -205,7 +205,7 @@ class UserMenu extends UI5Element { type: HTMLElement, "default": true, }) - menuItems!: Array<UserMenuItem>; + menuItems!: DefaultSlot<Array<UserMenuItem>>; /** * Defines the user accounts. @@ -221,7 +221,7 @@ class UserMenu extends UI5Element { slots: false, }, }) - accounts!: Array<UserMenuAccount>; + accounts!: Slot<Array<UserMenuAccount>>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/UserMenuItem.ts b/packages/fiori/src/UserMenuItem.ts index aa18ecced610..e81228585938 100644 --- a/packages/fiori/src/UserMenuItem.ts +++ b/packages/fiori/src/UserMenuItem.ts @@ -1,10 +1,11 @@ -import { customElement, slot } from "@ui5/webcomponents-base/dist/decorators.js"; +import { customElement, slotStrict as slot } from "@ui5/webcomponents-base/dist/decorators.js"; import MenuItem, { isInstanceOfMenuItem } from "@ui5/webcomponents/dist/MenuItem.js"; import UserMenuItemTemplate from "./UserMenuItemTemplate.js"; // Styles import userMenuItemCss from "./generated/themes/UserMenuItem.css.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -42,7 +43,7 @@ class UserMenuItem extends MenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - declare items: Array<UserMenuItem>; + declare items: DefaultSlot<Array<UserMenuItem>>; get _menuItems() { return this.items.filter(isInstanceOfMenuItem); diff --git a/packages/fiori/src/UserSettingsAccountView.ts b/packages/fiori/src/UserSettingsAccountView.ts index 48335de9aee0..901dc2308e3c 100644 --- a/packages/fiori/src/UserSettingsAccountView.ts +++ b/packages/fiori/src/UserSettingsAccountView.ts @@ -1,7 +1,7 @@ import UserSettingsView from "./UserSettingsView.js"; import UserSettingsAccountViewTemplate from "./UserSettingsAccountViewTemplate.js"; import { - customElement, slot, eventStrict as event, property, + customElement, slotStrict as slot, eventStrict as event, property, } from "@ui5/webcomponents-base/dist/decorators.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -15,6 +15,7 @@ import { USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT, } from "./generated/i18n/i18n-defaults.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; @customElement({ tag: "ui5-user-settings-account-view", @@ -63,7 +64,7 @@ class UserSettingsAccountView extends UserSettingsView { slots: false, }, }) - account?: Array<UserMenuAccount>; + account!: Slot<Array<UserMenuAccount>>; /** * Defines if the User Menu shows the `Manage Account` option. diff --git a/packages/fiori/src/UserSettingsAppearanceView.ts b/packages/fiori/src/UserSettingsAppearanceView.ts index 13fa3888ca56..f13900b31784 100644 --- a/packages/fiori/src/UserSettingsAppearanceView.ts +++ b/packages/fiori/src/UserSettingsAppearanceView.ts @@ -7,9 +7,10 @@ import type { ListItemClickEventDetail } from "@ui5/webcomponents/dist/List.js"; import type ListItemBase from "@ui5/webcomponents/dist/ListItemBase.js"; import { - customElement, slot, eventStrict as event, + customElement, slotStrict as slot, eventStrict as event, } from "@ui5/webcomponents-base/dist/decorators.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; type UserSettingsAppearanceViewItemSelectEventDetail = { item: UserSettingsAppearanceViewItem; @@ -61,7 +62,7 @@ class UserSettingsAppearanceView extends UserSettingsView { "default": true, invalidateOnChildChange: true, }) - items!: Array<UserSettingsAppearanceViewGroup | UserSettingsAppearanceViewItem>; + items!: DefaultSlot<Array<UserSettingsAppearanceViewGroup | UserSettingsAppearanceViewItem>>; /** * Defines additional content displayed below the items list. @@ -71,7 +72,7 @@ class UserSettingsAppearanceView extends UserSettingsView { @slot({ type: HTMLElement, }) - additionalContent?: Array<HTMLElement>; + additionalContent!: Slot<Array<HTMLElement>>; _getAllItems(): Array<UserSettingsAppearanceViewItem> { const allItems: Array<UserSettingsAppearanceViewItem> = []; diff --git a/packages/fiori/src/UserSettingsAppearanceViewGroup.ts b/packages/fiori/src/UserSettingsAppearanceViewGroup.ts index 0c81047d4c45..f9732bd4fb9e 100644 --- a/packages/fiori/src/UserSettingsAppearanceViewGroup.ts +++ b/packages/fiori/src/UserSettingsAppearanceViewGroup.ts @@ -1,7 +1,8 @@ import ListItemGroup from "@ui5/webcomponents/dist/ListItemGroup.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type UserSettingsAppearanceViewItem from "./UserSettingsAppearanceViewItem.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -33,7 +34,7 @@ class UserSettingsAppearanceViewGroup extends ListItemGroup { invalidateOnChildChange: true, type: HTMLElement, }) - declare items: Array<UserSettingsAppearanceViewItem>; + declare items: DefaultSlot<Array<UserSettingsAppearanceViewItem>>; } UserSettingsAppearanceViewGroup.define(); diff --git a/packages/fiori/src/UserSettingsDialog.ts b/packages/fiori/src/UserSettingsDialog.ts index a28a658b004f..17184e8d8d25 100644 --- a/packages/fiori/src/UserSettingsDialog.ts +++ b/packages/fiori/src/UserSettingsDialog.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { - customElement, property, slot, eventStrict as event, + customElement, property, slotStrict as slot, eventStrict as event, } from "@ui5/webcomponents-base/dist/decorators.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type Input from "@ui5/webcomponents/dist/Input.js"; @@ -132,7 +132,7 @@ class UserSettingsDialog extends UI5Element { slots: true, }, }) - items!: Array<UserSettingsItem>; + items!: DefaultSlot<Array<UserSettingsItem>>; /** * Defines the fixed user settings items. @@ -147,7 +147,7 @@ class UserSettingsDialog extends UI5Element { slots: true, }, }) - fixedItems!: Array<UserSettingsItem>; + fixedItems!: Slot<Array<UserSettingsItem>>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/UserSettingsItem.ts b/packages/fiori/src/UserSettingsItem.ts index 526dcbac19ff..1bab061d4c12 100644 --- a/packages/fiori/src/UserSettingsItem.ts +++ b/packages/fiori/src/UserSettingsItem.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { - customElement, property, slot, eventStrict as event, + customElement, property, slotStrict as slot, eventStrict as event, } from "@ui5/webcomponents-base/dist/decorators.js"; import type { TabContainerTabSelectEventDetail } from "@ui5/webcomponents/dist/TabContainer.js"; import type Tab from "@ui5/webcomponents/dist/Tab.js"; @@ -167,7 +167,7 @@ class UserSettingsItem extends UI5Element { slots: false, }, }) - pages!: Array<UserSettingsView>; + pages!: DefaultSlot<Array<UserSettingsView>>; /** * Defines the tab views of the user settings item. @@ -182,7 +182,7 @@ class UserSettingsItem extends UI5Element { slots: false, }, }) - tabs!: Array<UserSettingsView>; + tabs!: Slot<Array<UserSettingsView>>; /** * Indicates whether any of the element siblings have icon. diff --git a/packages/fiori/src/UserSettingsView.ts b/packages/fiori/src/UserSettingsView.ts index 29f44021529c..dfeebb2b64ca 100644 --- a/packages/fiori/src/UserSettingsView.ts +++ b/packages/fiori/src/UserSettingsView.ts @@ -1,5 +1,5 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; -import { customElement, property, slot } from "@ui5/webcomponents-base/dist/decorators.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import { customElement, property, slotStrict as slot } from "@ui5/webcomponents-base/dist/decorators.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import UserSettingsViewTemplate from "./UserSettingsViewTemplate.js"; import UserSettingViewCss from "./generated/themes/UserSettingsView.css.js"; @@ -60,7 +60,7 @@ class UserSettingsView extends UI5Element { type: HTMLElement, "default": true, }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; } UserSettingsView.define(); diff --git a/packages/fiori/src/ViewSettingsDialog.ts b/packages/fiori/src/ViewSettingsDialog.ts index 2a998eb02e2c..cef8ebb4dccc 100644 --- a/packages/fiori/src/ViewSettingsDialog.ts +++ b/packages/fiori/src/ViewSettingsDialog.ts @@ -1,5 +1,5 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; @@ -7,7 +7,7 @@ import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import { isPhone } from "@ui5/webcomponents-base/dist/Device.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type Dialog from "@ui5/webcomponents/dist/Dialog.js"; import type List from "@ui5/webcomponents/dist/List.js"; @@ -271,7 +271,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - sortItems!: Array<SortItem>; + sortItems!: Slot<Array<SortItem>>; /** * Defines the `filterItems` list. @@ -280,7 +280,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - filterItems!: Array<FilterItem>; + filterItems!: Slot<Array<FilterItem>>; /** * Defines the list of items against which the user could group data. @@ -289,7 +289,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - groupItems!: Array<GroupItem>; + groupItems!: Slot<Array<GroupItem>>; @query("[ui5-list]") _list!: List; diff --git a/packages/fiori/src/Wizard.ts b/packages/fiori/src/Wizard.ts index 5bfd1b49416f..183ad3830b08 100644 --- a/packages/fiori/src/Wizard.ts +++ b/packages/fiori/src/Wizard.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; @@ -259,7 +259,7 @@ class Wizard extends UI5Element { "individualSlots": true, invalidateOnChildChange: true, }) - steps!: Array<WizardStep> + steps!: DefaultSlot<Array<WizardStep>>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Avatar.ts b/packages/main/src/Avatar.ts index 9a80c0d1e93f..59ead3fa8568 100644 --- a/packages/main/src/Avatar.ts +++ b/packages/main/src/Avatar.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -236,7 +236,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { * @since 1.0.0-rc.15 */ @slot({ type: HTMLElement, "default": true }) - image!: Array<HTMLElement>; + image!: DefaultSlot<Array<HTMLElement>>; /** * Defines the optional badge that will be used for visual affordance. @@ -248,7 +248,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { * @since 1.7.0 */ @slot() - badge!: Array<HTMLElement>; + badge!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/AvatarGroup.ts b/packages/main/src/AvatarGroup.ts index 896a51114e25..e469f0631a5d 100644 --- a/packages/main/src/AvatarGroup.ts +++ b/packages/main/src/AvatarGroup.ts @@ -1,4 +1,4 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot, type IsSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; @@ -7,7 +7,7 @@ import type { UI5CustomEvent } from "@ui5/webcomponents-base"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type { AccessibilityAttributes } from "@ui5/webcomponents-base/dist/types.js"; @@ -67,7 +67,7 @@ const offsets = { [AvatarGroupType.Group]: "-1.625rem", }, [AvatarSize.L]: { - [AvatarGroupType.Individual]: "0.125rem", + [AvatarGroupType.Individual]: "0.125rem", [AvatarGroupType.Group]: " -2rem", }, [AvatarSize.XL]: { @@ -173,6 +173,12 @@ class AvatarGroup extends UI5Element { "click": AvatarGroupClickEventDetail "overflow": void } + + slotDetails!: { + overflowButton: IButton; + items: IAvatarGroupItem; + } + /** * Defines the mode of the `AvatarGroup`. * @default "Group" @@ -231,7 +237,7 @@ class AvatarGroup extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: Array<IAvatarGroupItem>; + items!: DefaultSlot<Array<IAvatarGroupItem>>; /** * Defines the overflow button of the component. @@ -243,7 +249,7 @@ class AvatarGroup extends UI5Element { * @since 1.0.0-rc.13 */ @slot() - overflowButton!: Array<IButton>; + overflowButton!: Slot<Array<IButton>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; @@ -597,6 +603,13 @@ class AvatarGroup extends UI5Element { AvatarGroup.define(); + +// Check for the brand +type Expect<T extends true> = T; +type Test1 = Expect<IsSlot<AvatarGroup['overflowButton']>>; // true +type Test1A = Expect<IsSlot<AvatarGroup['items']>>; // true + + export default AvatarGroup; export type { AvatarGroupClickEventDetail, diff --git a/packages/main/src/Bar.ts b/packages/main/src/Bar.ts index fe1dedccffe7..777aaff9bca0 100644 --- a/packages/main/src/Bar.ts +++ b/packages/main/src/Bar.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import { getEffectiveAriaLabelText } from "@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js"; @@ -107,22 +107,22 @@ class Bar extends UI5Element { * Defines the content at the start of the bar. * @public */ - @slot({ type: HTMLElement }) - startContent!: Array<HTMLElement>; + @slot() + startContent!: Slot<Array<HTMLElement>>; /** * Defines the content in the middle of the bar. * @public */ - @slot({ type: HTMLElement, "default": true }) - middleContent!: Array<HTMLElement> + @slot() + middleContent!: Slot<Array<HTMLElement>> /** * Defines the content at the end of the bar. * @public */ - @slot({ type: HTMLElement }) - endContent!: Array<HTMLElement> + @slot() + endContent!: Slot<Array<HTMLElement>> _handleResizeBound: () => void; diff --git a/packages/main/src/Breadcrumbs.ts b/packages/main/src/Breadcrumbs.ts index bd23b8976380..caeb10f5fd7b 100644 --- a/packages/main/src/Breadcrumbs.ts +++ b/packages/main/src/Breadcrumbs.ts @@ -1,8 +1,8 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; -import type { ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { ChangeInfo, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; @@ -148,7 +148,7 @@ class Breadcrumbs extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: Array<BreadcrumbsItem>; + items!: DefaultSlot<Array<BreadcrumbsItem>>; _itemNavigation: ItemNavigation _onResizeHandler: ResizeObserverCallback; diff --git a/packages/main/src/BreadcrumbsItem.ts b/packages/main/src/BreadcrumbsItem.ts index 8cdc1ff2b2bc..2e8d99245576 100644 --- a/packages/main/src/BreadcrumbsItem.ts +++ b/packages/main/src/BreadcrumbsItem.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type { AccessibilityAttributes } from "@ui5/webcomponents-base/dist/types.js"; import LinkDesign from "./types/LinkDesign.js"; @@ -62,7 +62,7 @@ class BreadcrumbsItem extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: Array<Node>; + text!: DefaultSlot<Array<Node>>; _accessibleNameText?: string; _isCurrentPageItem?: boolean; diff --git a/packages/main/src/Button.ts b/packages/main/src/Button.ts index 9dc49b0bbb10..6f57b5b163b5 100644 --- a/packages/main/src/Button.ts +++ b/packages/main/src/Button.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { @@ -377,7 +377,7 @@ class Button extends UI5Element implements IButton { * @public */ @slot({ type: Node, "default": true }) - text!: Array<Node>; + text!: DefaultSlot<Array<Node>>; /** * Adds a badge to the button. @@ -385,7 +385,7 @@ class Button extends UI5Element implements IButton { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - badge!: Array<ButtonBadge>; + badge!: Slot<Array<ButtonBadge>>; _deactivate: () => void; _onclickBound: (e: MouseEvent) => void; diff --git a/packages/main/src/Calendar.ts b/packages/main/src/Calendar.ts index 553c65c5af6b..9d103675e40d 100644 --- a/packages/main/src/Calendar.ts +++ b/packages/main/src/Calendar.ts @@ -3,7 +3,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import transformDateToSecondaryType from "@ui5/webcomponents-localization/dist/dates/transformDateToSecondaryType.js"; import convertMonthNumbersToMonthNames from "@ui5/webcomponents-localization/dist/dates/convertMonthNumbersToMonthNames.js"; @@ -36,6 +36,7 @@ import type CalendarLegend from "./CalendarLegend.js"; import type { CalendarLegendItemSelectionChangeEventDetail } from "./CalendarLegend.js"; import type SpecialCalendarDate from "./SpecialCalendarDate.js"; import type CalendarLegendItemType from "./types/CalendarLegendItemType.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Default calendar for bundling import "@ui5/webcomponents-localization/dist/features/calendar/Gregorian.js"; @@ -321,7 +322,7 @@ class Calendar extends CalendarPart { * @since 1.23.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - calendarLegend!: Array<CalendarLegend>; + calendarLegend!: Slot<Array<CalendarLegend>>; /** * Defines the selected date or dates (depending on the `selectionMode` property) @@ -330,7 +331,7 @@ class Calendar extends CalendarPart { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - dates!: Array<ICalendarSelectedDates>; + dates!: DefaultSlot<Array<ICalendarSelectedDates>>; /** * Defines the special dates, visually emphasized in the calendar. @@ -338,7 +339,7 @@ class Calendar extends CalendarPart { * @since 1.23.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - specialDates!: Array<SpecialCalendarDate>; + specialDates!: Slot<Array<SpecialCalendarDate>>; /** * Defines the disabled date ranges that cannot be selected in the calendar. @@ -348,7 +349,7 @@ class Calendar extends CalendarPart { * @since 2.16.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - disabledDates!: Array<CalendarDateRange>; + disabledDates!: Slot<Array<CalendarDateRange>>; /** * Defines the selected item type of the calendar legend item (if such exists). diff --git a/packages/main/src/CalendarLegend.ts b/packages/main/src/CalendarLegend.ts index acb263386e47..b2a4da5e9e58 100644 --- a/packages/main/src/CalendarLegend.ts +++ b/packages/main/src/CalendarLegend.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; @@ -103,7 +103,7 @@ class CalendarLegend extends UI5Element { individualSlots: true, "default": true, }) - items!: Array<CalendarLegendItem>; + items!: DefaultSlot<Array<CalendarLegendItem>>; _itemNavigation!: ItemNavigation; _lastFocusedItemIndex: number | null; diff --git a/packages/main/src/Card.ts b/packages/main/src/Card.ts index ad8cfca5a703..2e59351caa30 100644 --- a/packages/main/src/Card.ts +++ b/packages/main/src/Card.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -72,7 +72,7 @@ class Card extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; /** * Defines the header of the component. @@ -82,7 +82,7 @@ class Card extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - header!: Array<CardHeader>; + header!: Slot<Array<CardHeader>>; /** * Defines if a loading indicator would be displayed over the card. diff --git a/packages/main/src/CardHeader.ts b/packages/main/src/CardHeader.ts index fbcf3f4cd7b6..ffa14e4bfaab 100644 --- a/packages/main/src/CardHeader.ts +++ b/packages/main/src/CardHeader.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -113,14 +113,14 @@ class CardHeader extends UI5Element { * @public */ @slot() - avatar!: Array<HTMLElement>; + avatar!: Slot<Array<HTMLElement>>; /** * Defines an action, displayed in the right most part of the header. * @public */ @slot() - action!: Array<HTMLElement>; + action!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Carousel.ts b/packages/main/src/Carousel.ts index cc369f7f78e5..52a646a0c63d 100644 --- a/packages/main/src/Carousel.ts +++ b/packages/main/src/Carousel.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js"; import { @@ -320,7 +320,7 @@ class Carousel extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, individualSlots: true }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ColorPalette.ts b/packages/main/src/ColorPalette.ts index 3e6bed653a41..5d47e48cc61a 100644 --- a/packages/main/src/ColorPalette.ts +++ b/packages/main/src/ColorPalette.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -183,8 +183,7 @@ class ColorPalette extends UI5Element { invalidateOnChildChange: true, individualSlots: true, }) - - colors!: Array<IColorPaletteItem>; + colors!: DefaultSlot<Array<IColorPaletteItem>>; _itemNavigation: ItemNavigation; _itemNavigationRecentColors: ItemNavigation; @@ -290,12 +289,13 @@ class ColorPalette extends UI5Element { } get effectiveColorItems() { - let colorItems = this.colors; + // let colorItems = this.colors; + let colorItems: Array<IColorPaletteItem> = this.colors; if (this.popupMode) { colorItems = this.getSlottedNodes<ColorPaletteItem>("colors"); } - + return colorItems; } diff --git a/packages/main/src/ColorPalettePopover.ts b/packages/main/src/ColorPalettePopover.ts index 2204a1b7d92d..4336ba3ceb42 100644 --- a/packages/main/src/ColorPalettePopover.ts +++ b/packages/main/src/ColorPalettePopover.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; @@ -139,7 +139,7 @@ class ColorPalettePopover extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, individualSlots: true }) - colors!: Array<IColorPaletteItem>; + colors!: DefaultSlot<Array<IColorPaletteItem>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts index 4654984c71d1..fa78f11852b7 100644 --- a/packages/main/src/ComboBox.ts +++ b/packages/main/src/ComboBox.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js"; import { isPhone, isAndroid, isMac } from "@ui5/webcomponents-base/dist/Device.js"; @@ -424,7 +424,7 @@ class ComboBox extends UI5Element implements IFormInputElement { individualSlots: true, invalidateOnChildChange: true, }) - items!: Array<IComboBoxItem>; + items!: DefaultSlot<Array<IComboBoxItem>>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -438,7 +438,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Array<HTMLElement>; + valueStateMessage!: Slot<Array<HTMLElement>>; /** * Defines the icon to be displayed in the input field. @@ -446,7 +446,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * @since 1.0.0-rc.9 */ @slot() - icon!: Array<IIcon>; + icon!: Slot<Array<IIcon>>; _initialRendering = true; _itemFocused = false; diff --git a/packages/main/src/ComboBoxItemGroup.ts b/packages/main/src/ComboBoxItemGroup.ts index e26342dd0b54..4390df472334 100644 --- a/packages/main/src/ComboBoxItemGroup.ts +++ b/packages/main/src/ComboBoxItemGroup.ts @@ -1,9 +1,10 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type { IComboBoxItem } from "./ComboBox.js"; import ListItemGroup from "./ListItemGroup.js"; import type ComboBoxItem from "./ComboBoxItem.js"; import ComboBoxItemGroupTemplate from "./ComboBoxItemGroupTemplate.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -32,7 +33,7 @@ class ComboBoxItemGroup extends ListItemGroup implements IComboBoxItem { individualSlots: true, type: HTMLElement, }) - items!: Array<ComboBoxItem>; + items!: DefaultSlot<Array<ComboBoxItem>>; get isGroupItem(): boolean { return true; diff --git a/packages/main/src/DatePicker.ts b/packages/main/src/DatePicker.ts index 9884dbce8ae8..52613902323c 100644 --- a/packages/main/src/DatePicker.ts +++ b/packages/main/src/DatePicker.ts @@ -1,7 +1,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; @@ -77,6 +77,7 @@ import datePickerCss from "./generated/themes/DatePicker.css.js"; import datePickerPopoverCss from "./generated/themes/DatePickerPopover.css.js"; import ResponsivePopoverCommonCss from "./generated/themes/ResponsivePopoverCommon.css.js"; import ValueStateMessageCss from "./generated/themes/ValueStateMessage.css.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; type ValueStateAnnouncement = Record<Exclude<ValueState, ValueState.None>, string>; @@ -386,8 +387,8 @@ class DatePicker extends DateComponentBase implements IFormInputElement { * @since 1.0.0-rc.7 * @public */ - @slot({ type: HTMLElement }) - valueStateMessage!: Array<HTMLElement>; + @slot() + valueStateMessage!: Slot<Array<HTMLElement>>; responsivePopover?: ResponsivePopover; diff --git a/packages/main/src/Dialog.ts b/packages/main/src/Dialog.ts index ecb7110ed8af..18edeba0f8ad 100644 --- a/packages/main/src/Dialog.ts +++ b/packages/main/src/Dialog.ts @@ -1,5 +1,6 @@ +import { type IsDefaultSlot, type IsSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import clamp from "@ui5/webcomponents-base/dist/util/clamp.js"; import { @@ -112,6 +113,7 @@ const ICON_PER_STATE: Record<ValueStateWithIcon, string> = { }) class Dialog extends Popup { eventDetails!: Popup["eventDetails"]; + /** * Defines the header text. * @@ -206,7 +208,7 @@ class Dialog extends Popup { * @public */ @slot() - header!: Array<HTMLElement>; + header!: Slot<Array<HTMLElement>>; /** * Defines the footer HTML Element. @@ -215,7 +217,7 @@ class Dialog extends Popup { * @public */ @slot() - footer!: Array<HTMLElement>; + footer!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; @@ -673,6 +675,21 @@ class Dialog extends Popup { } } +// TODO: Remove afterwards - used only to test the slot types union +// type ExtractSlots<T> = { +// [K in keyof T]: IsDefaultSlot<NonNullable<T[K]>> extends true +// ? "default" +// : IsSlot<NonNullable<T[K]>> extends true +// ? K +// : never +// }[keyof T]; + +// type DialogSlots = Exclude<ExtractSlots<Dialog>, undefined>; + +// let a: DialogSlots; +// a = "footer"; +// a = "default"; + Dialog.define(); export default Dialog; diff --git a/packages/main/src/FileUploader.ts b/packages/main/src/FileUploader.ts index bcc13f154f4e..0fb65386d0f5 100644 --- a/packages/main/src/FileUploader.ts +++ b/packages/main/src/FileUploader.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js"; import { @@ -271,7 +271,7 @@ class FileUploader extends UI5Element implements IFormInputElement { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -284,7 +284,7 @@ class FileUploader extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Array<HTMLElement>; + valueStateMessage!: Slot<Array<HTMLElement>>; @query(".ui5-file-uploader-form") _form!: HTMLFormElement; diff --git a/packages/main/src/Form.ts b/packages/main/src/Form.ts index 452ca6c4acb9..237d6d0b0fc0 100644 --- a/packages/main/src/Form.ts +++ b/packages/main/src/Form.ts @@ -1,9 +1,9 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import { getScopedVarName } from "@ui5/webcomponents-base/dist/CustomElementsScope.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type { AriaRole } from "@ui5/webcomponents-base"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -344,8 +344,8 @@ class Form extends UI5Element { * **Note:** When a `header` is provided, the `headerText` property is ignored. * @public */ - @slot({ type: HTMLElement }) - header!: Array<HTMLElement>; + @slot() + header!: Slot<Array<HTMLElement>>; /** * Defines the component content - FormGroups or FormItems. @@ -360,7 +360,7 @@ class Form extends UI5Element { individualSlots: true, invalidateOnChildChange: true, }) - items!: Array<IFormItem>; + items!: DefaultSlot<Array<IFormItem>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/FormGroup.ts b/packages/main/src/FormGroup.ts index 54e7362a54d4..2edd38c04006 100644 --- a/packages/main/src/FormGroup.ts +++ b/packages/main/src/FormGroup.ts @@ -1,9 +1,9 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import { getEffectiveAriaLabelText } from "@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js"; import type FormItem from "./FormItem.js"; @@ -99,7 +99,7 @@ class FormGroup extends UI5Element implements IFormItem { type: HTMLElement, "default": true, }) - items!: Array<FormItem>; + items!: DefaultSlot<Array<FormItem>>; /** * @private diff --git a/packages/main/src/FormItem.ts b/packages/main/src/FormItem.ts index 18cc80a27669..c912b5b77e2b 100644 --- a/packages/main/src/FormItem.ts +++ b/packages/main/src/FormItem.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; // Template import FormItemTemplate from "./FormItemTemplate.js"; @@ -66,7 +66,7 @@ class FormItem extends UI5Element implements IFormItem { * @public */ @slot() - labelContent!: Array<HTMLElement>; + labelContent!: Slot<Array<HTMLElement>>; /** * Defines the content of the component, @@ -78,7 +78,7 @@ class FormItem extends UI5Element implements IFormItem { "default": true, individualSlots: true, }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; /** * @private diff --git a/packages/main/src/Input.ts b/packages/main/src/Input.ts index bfc26327cf29..c403897fe4ed 100644 --- a/packages/main/src/Input.ts +++ b/packages/main/src/Input.ts @@ -1,9 +1,9 @@ /* eslint-disable spaced-comment */ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { UI5CustomEvent } from "@ui5/webcomponents-base"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type { @@ -586,14 +586,14 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * @public */ @slot({ type: HTMLElement, "default": true }) - suggestionItems!: Array<IInputSuggestionItem>; + suggestionItems!: DefaultSlot<Array<IInputSuggestionItem>>; /** * Defines the icon to be displayed in the component. * @public */ @slot() - icon!: Array<IIcon>; + icon!: Slot<Array<IIcon>>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -613,7 +613,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement type: HTMLElement, invalidateOnChildChange: true, }) - valueStateMessage!: Array<HTMLElement>; + valueStateMessage!: Slot<Array<HTMLElement>>; hasSuggestionItemSelected: boolean; valueBeforeItemSelection: string; diff --git a/packages/main/src/List.ts b/packages/main/src/List.ts index 887d557cd9a2..3db48b73cde6 100644 --- a/packages/main/src/List.ts +++ b/packages/main/src/List.ts @@ -1,4 +1,4 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; @@ -7,7 +7,7 @@ import toLowercaseEnumValue from "@ui5/webcomponents-base/dist/util/toLowercaseE import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type { ClassMap } from "@ui5/webcomponents-base/dist/types.js"; import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js"; @@ -522,7 +522,7 @@ class List extends UI5Element { "default": true, invalidateOnChildChange: true, }) - items!: Array<ListItemBase | ListItemGroup>; + items!: DefaultSlot<Array<ListItemBase | ListItemGroup>>; /** * Defines the component header. @@ -532,7 +532,7 @@ class List extends UI5Element { * @public */ @slot() - header!: Array<HTMLElement>; + header!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ListItem.ts b/packages/main/src/ListItem.ts index ba655edb08f0..a4667b3fdc92 100644 --- a/packages/main/src/ListItem.ts +++ b/packages/main/src/ListItem.ts @@ -10,7 +10,7 @@ import { getTabbableElements } from "@ui5/webcomponents-base/dist/util/TabbableE import type { AccessibilityAttributes, AriaRole, AriaHasPopup } from "@ui5/webcomponents-base"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import "@ui5/webcomponents-icons/dist/decline.js"; import "@ui5/webcomponents-icons/dist/edit.js"; @@ -38,6 +38,7 @@ import listItemAdditionalTextCss from "./generated/themes/ListItemAdditionalText // Icons import "@ui5/webcomponents-icons/dist/slim-arrow-right.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; interface IAccessibleListItem { accessibleName?: string; @@ -210,7 +211,7 @@ abstract class ListItem extends ListItemBase { * @public */ @slot() - deleteButton!: Array<IButton>; + deleteButton!: Slot<Array<IButton>>; deactivateByKey: (e: KeyboardEvent) => void; deactivate: () => void; diff --git a/packages/main/src/ListItemGroup.ts b/packages/main/src/ListItemGroup.ts index 71d649c2edc4..533c653c55ac 100644 --- a/packages/main/src/ListItemGroup.ts +++ b/packages/main/src/ListItemGroup.ts @@ -1,9 +1,9 @@ -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import DragAndDropHandler from "./delegate/DragAndDropHandler.js"; import MovePlacement from "@ui5/webcomponents-base/dist/types/MovePlacement.js"; import type DropIndicator from "./DropIndicator.js"; @@ -108,7 +108,7 @@ class ListItemGroup extends UI5Element { invalidateOnChildChange: true, type: HTMLElement, }) - items!: Array<ListItemBase>; + items!: DefaultSlot<Array<ListItemBase>>; /** * Defines if the text of the component should wrap when it's too long. @@ -143,8 +143,8 @@ class ListItemGroup extends UI5Element { * **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten. * @public */ - @slot({ type: HTMLElement }) - header!: Array<ListItemBase>; + @slot() + header!: Slot<Array<ListItemBase>>; _dragAndDropHandler: DragAndDropHandler; diff --git a/packages/main/src/ListItemGroupHeader.ts b/packages/main/src/ListItemGroupHeader.ts index f650e826e981..063508c98ae2 100644 --- a/packages/main/src/ListItemGroupHeader.ts +++ b/packages/main/src/ListItemGroupHeader.ts @@ -1,4 +1,4 @@ -import { slot, property, customElement } from "@ui5/webcomponents-base/dist/decorators.js"; +import { slotStrict as slot, property, customElement } from "@ui5/webcomponents-base/dist/decorators.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import type { AriaRole } from "@ui5/webcomponents-base/dist/types.js"; @@ -15,6 +15,7 @@ import ListItemGroupHeaderTemplate from "./ListItemGroupHeaderTemplate.js"; import ListItemGroupHeaderCss from "./generated/themes/ListItemGroupHeader.css.js"; import ListItemAccessibleRole from "./types/ListItemAccessibleRole.js"; import type WrappingType from "./types/WrappingType.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * Maximum number of characters to display for small screens (Size S) @@ -98,7 +99,7 @@ class ListItemGroupHeader extends ListItemBase { expandableTextTemplate?: ExpandableTextTemplate; @slot() - subItems!: Array<HTMLElement>; + subItems!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ListItemStandard.ts b/packages/main/src/ListItemStandard.ts index 446d9586daee..8ffece81862e 100644 --- a/packages/main/src/ListItemStandard.ts +++ b/packages/main/src/ListItemStandard.ts @@ -1,13 +1,14 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js"; import ListItem from "./ListItem.js"; import type { IAccessibleListItem } from "./ListItem.js"; import type WrappingType from "./types/WrappingType.js"; import ListItemStandardTemplate from "./ListItemStandardTemplate.js"; import type { ExpandableTextTemplateParams } from "./types/ExpandableTextTemplateParams.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * Maximum number of characters to display for small screens (Size S) @@ -180,7 +181,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * @public */ @slot({ type: Node, "default": true }) - content!: Array<Node>; + content!: DefaultSlot<Array<Node>>; /** * **Note:** While the slot allows option for setting custom avatar, to match the @@ -192,7 +193,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * @public */ @slot() - image!: Array<HTMLElement>; + image!: Slot<Array<HTMLElement>>; onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/main/src/Menu.ts b/packages/main/src/Menu.ts index fdb2198e715b..d2fe49b3ab3d 100644 --- a/packages/main/src/Menu.ts +++ b/packages/main/src/Menu.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import { isLeft, @@ -254,7 +254,7 @@ class Menu extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: Array<IMenuItem>; + items!: DefaultSlot<Array<IMenuItem>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MenuItem.ts b/packages/main/src/MenuItem.ts index f9db130beec8..cb08306bd55d 100644 --- a/packages/main/src/MenuItem.ts +++ b/packages/main/src/MenuItem.ts @@ -3,7 +3,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import type { AccessibilityAttributes, AriaHasPopup, AriaRole } from "@ui5/webcomponents-base"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import { isLeft, @@ -42,6 +42,7 @@ import type { IMenuItem } from "./Menu.js"; // Styles import menuItemCss from "./generated/themes/MenuItem.css.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; type MenuBeforeOpenEventDetail = { item?: MenuItem }; type MenuBeforeCloseEventDetail = { escPressed: boolean }; @@ -290,7 +291,7 @@ class MenuItem extends ListItem implements IMenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: Array<IMenuItem>; + items!: DefaultSlot<Array<IMenuItem>>; /** * Defines the components that should be displayed at the end of the menu item. @@ -309,8 +310,8 @@ class MenuItem extends ListItem implements IMenuItem { * @public * @since 2.0.0 */ - @slot({ type: HTMLElement }) - endContent!: Array<HTMLElement>; + @slot() + endContent!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MenuItemGroup.ts b/packages/main/src/MenuItemGroup.ts index ae9fc3445640..66b651492673 100644 --- a/packages/main/src/MenuItemGroup.ts +++ b/packages/main/src/MenuItemGroup.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -67,7 +67,7 @@ class MenuItemGroup extends UI5Element implements IMenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: Array<IMenuItem>; + items!: DefaultSlot<Array<IMenuItem>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MessageStrip.ts b/packages/main/src/MessageStrip.ts index 00a7ae242963..6033fb5c5f11 100644 --- a/packages/main/src/MessageStrip.ts +++ b/packages/main/src/MessageStrip.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -145,7 +145,7 @@ class MessageStrip extends UI5Element { * @public */ @slot() - icon!: Array<IIcon>; + icon!: Slot<Array<IIcon>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MultiComboBox.ts b/packages/main/src/MultiComboBox.ts index 8f4974abd0c5..6c024ea3eef0 100644 --- a/packages/main/src/MultiComboBox.ts +++ b/packages/main/src/MultiComboBox.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import type { ClassMap, Timeout } from "@ui5/webcomponents-base/dist/types.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -498,7 +498,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { invalidateOnChildChange: true, individualSlots: true, }) - items!: Array<IMultiComboBoxItem>; + items!: DefaultSlot<Array<IMultiComboBoxItem>>; /** * Defines the icon to be displayed in the component. @@ -506,7 +506,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { * @since 1.0.0-rc.9 */ @slot() - icon!: Array<IIcon>; + icon!: Slot<Array<IIcon>>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -520,7 +520,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Array<HTMLElement>; + valueStateMessage!: Slot<Array<HTMLElement>>; selectedValues: Array<IMultiComboBoxItem>; _inputLastValue: string; diff --git a/packages/main/src/MultiComboBoxItemGroup.ts b/packages/main/src/MultiComboBoxItemGroup.ts index 1ead17421993..be670ab60552 100644 --- a/packages/main/src/MultiComboBoxItemGroup.ts +++ b/packages/main/src/MultiComboBoxItemGroup.ts @@ -1,10 +1,11 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type { IMultiComboBoxItem } from "./MultiComboBox.js"; import type MultiComboBoxItem from "./MultiComboBoxItem.js"; import MultiComboBoxItemGroupTemplate from "./MultiComboBoxItemGroupTemplate.js"; import type ListItemGroupHeader from "./ListItemGroupHeader.js"; import ComboBoxItemGroup from "./ComboBoxItemGroup.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -32,7 +33,7 @@ class MultiComboBoxItemGroup extends ComboBoxItemGroup implements IMultiComboBox individualSlots: true, type: HTMLElement, }) - items!: Array<MultiComboBoxItem>; + items!: DefaultSlot<Array<MultiComboBoxItem>>; /** * Used to avoid tag name checks diff --git a/packages/main/src/MultiInput.ts b/packages/main/src/MultiInput.ts index 38ff55f92434..8fc37b97c79f 100644 --- a/packages/main/src/MultiInput.ts +++ b/packages/main/src/MultiInput.ts @@ -1,6 +1,6 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -39,6 +39,7 @@ import type Icon from "./Icon.js"; import type { InputSelectionChangeEventDetail as MultiInputSelectionChangeEventDetail, } from "./Input.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; interface IToken extends UI5Element, ITabbable { text?: string; @@ -151,7 +152,7 @@ class MultiInput extends Input implements IFormInputElement { * @public */ @slot({ type: HTMLElement, individualSlots: true }) - tokens!: Array<IToken>; + tokens!: Slot<Array<IToken>>; _skipOpenSuggestions: boolean; _valueHelpIconPressed: boolean; diff --git a/packages/main/src/Option.ts b/packages/main/src/Option.ts index 128e998099a4..5169899ce6ff 100644 --- a/packages/main/src/Option.ts +++ b/packages/main/src/Option.ts @@ -1,5 +1,5 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import type { IOption } from "./Select.js"; import ListItemBase from "./ListItemBase.js"; @@ -11,6 +11,7 @@ import OptionTemplate from "./OptionTemplate.js"; import optionBaseCss from "./generated/themes/OptionBase.css.js"; import listItemIconCss from "./generated/themes/ListItemIcon.css.js"; import listItemAdditionalTextCss from "./generated/themes/ListItemAdditionalText.css.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -47,7 +48,7 @@ class Option extends ListItemBase implements IOption { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - text!: Array<Node>; + text!: DefaultSlot<Array<Node>>; /** * Defines the value of the `ui5-select` inside an HTML Form element when this component is selected. diff --git a/packages/main/src/OptionCustom.ts b/packages/main/src/OptionCustom.ts index 23b755013c62..22367849bc63 100644 --- a/packages/main/src/OptionCustom.ts +++ b/packages/main/src/OptionCustom.ts @@ -1,5 +1,5 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import type { IOption } from "./Select.js"; import ListItemBase from "./ListItemBase.js"; @@ -9,6 +9,7 @@ import OptionCustomTemplate from "./OptionCustomTemplate.js"; // Styles import optionBaseCss from "./generated/themes/OptionBase.css.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -62,7 +63,7 @@ class OptionCustom extends ListItemBase implements IOption { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - content!: Array<Node>; + content!: DefaultSlot<Array<Node>>; /** * Defines the tooltip of the option. diff --git a/packages/main/src/Panel.ts b/packages/main/src/Panel.ts index 33e19b1ee0fa..ce6881810b6e 100644 --- a/packages/main/src/Panel.ts +++ b/packages/main/src/Panel.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot, type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import slideDown from "@ui5/webcomponents-base/dist/animations/slideDown.js"; import slideUp from "@ui5/webcomponents-base/dist/animations/slideUp.js"; @@ -205,7 +205,7 @@ class Panel extends UI5Element { * @public */ @slot() - header!: Array<HTMLElement>; + header!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Popover.ts b/packages/main/src/Popover.ts index a5412410cc91..711d5818d17a 100644 --- a/packages/main/src/Popover.ts +++ b/packages/main/src/Popover.ts @@ -1,8 +1,8 @@ -import { instanceOfUI5Element } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import { instanceOfUI5Element, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import { isIOS } from "@ui5/webcomponents-base/dist/Device.js"; import { isClickInRect, getClosedPopupParent } from "@ui5/webcomponents-base/dist/util/PopupUtils.js"; import clamp from "@ui5/webcomponents-base/dist/util/clamp.js"; @@ -207,15 +207,15 @@ class Popover extends Popup { * Defines the header HTML Element. * @public */ - @slot({ type: HTMLElement }) - header!: Array<HTMLElement>; + @slot() + header!: Slot<Array<HTMLElement>>; /** * Defines the footer HTML Element. * @public */ - @slot({ type: HTMLElement }) - footer!: Array<HTMLElement>; + @slot() + footer!: Slot<Array<HTMLElement>>; _opener?: HTMLElement | string | null | undefined; _openerRect?: DOMRect; diff --git a/packages/main/src/Popup.ts b/packages/main/src/Popup.ts index fda670bdff31..b08379932f85 100644 --- a/packages/main/src/Popup.ts +++ b/packages/main/src/Popup.ts @@ -1,11 +1,11 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import type { ClassMap } from "@ui5/webcomponents-base/dist/types.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot, type IsDefaultSlot, type IsSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { isChrome, isDesktop, @@ -233,7 +233,7 @@ abstract class Popup extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: Array<HTMLElement>; + content!: DefaultSlot<Array<HTMLElement>>; /** * @private diff --git a/packages/main/src/SegmentedButton.ts b/packages/main/src/SegmentedButton.ts index 971139b11792..ad365c26c088 100644 --- a/packages/main/src/SegmentedButton.ts +++ b/packages/main/src/SegmentedButton.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import { getEffectiveAriaLabelText, getAssociatedLabelForTexts, @@ -148,7 +148,7 @@ class SegmentedButton extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: Array<ISegmentedButtonItem>; + items!: DefaultSlot<Array<ISegmentedButtonItem>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/SegmentedButtonItem.ts b/packages/main/src/SegmentedButtonItem.ts index f48706d85177..e096fddd04b8 100644 --- a/packages/main/src/SegmentedButtonItem.ts +++ b/packages/main/src/SegmentedButtonItem.ts @@ -1,6 +1,6 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import { getEnableDefaultTooltips } from "@ui5/webcomponents-base/dist/config/Tooltips.js"; @@ -12,7 +12,7 @@ import { getEffectiveAriaDescriptionText, } from "@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js"; import willShowContent from "@ui5/webcomponents-base/dist/util/willShowContent.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { SEGMENTEDBUTTONITEM_ARIA_DESCRIPTION } from "./generated/i18n/i18n-defaults.js"; import type { ISegmentedButtonItem } from "./SegmentedButton.js"; @@ -175,7 +175,7 @@ class SegmentedButtonItem extends UI5Element implements IButton, ISegmentedButto * @public */ @slot({ type: Node, "default": true }) - text!: Array<Node>; + text!: DefaultSlot<Array<Node>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Select.ts b/packages/main/src/Select.ts index 301a52b4254c..726e97718efb 100644 --- a/packages/main/src/Select.ts +++ b/packages/main/src/Select.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { isSpace, @@ -399,7 +399,7 @@ class Select extends UI5Element implements IFormInputElement { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - options!: Array<IOption>; + options!: DefaultSlot<Array<IOption>>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -414,7 +414,7 @@ class Select extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Array<HTMLElement>; + valueStateMessage!: Slot<Array<HTMLElement>>; /** * Defines the HTML element that will be displayed in the component input part, @@ -429,7 +429,7 @@ class Select extends UI5Element implements IFormInputElement { * @since 1.17.0 */ @slot() - label!: Array<HTMLElement>; + label!: Slot<Array<HTMLElement>>; get formValidityMessage() { return Select.i18nBundle.getText(FORM_SELECTABLE_REQUIRED); diff --git a/packages/main/src/SplitButton.ts b/packages/main/src/SplitButton.ts index 4e3fc073d3cc..d60bf3165156 100644 --- a/packages/main/src/SplitButton.ts +++ b/packages/main/src/SplitButton.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import { isEscape, isSpace, @@ -248,7 +248,7 @@ class SplitButton extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: Array<Node>; + text!: DefaultSlot<Array<Node>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/StepInput.ts b/packages/main/src/StepInput.ts index 7007d89906a8..ed112c1dba1d 100644 --- a/packages/main/src/StepInput.ts +++ b/packages/main/src/StepInput.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { @@ -295,7 +295,7 @@ class StepInput extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Array<HTMLElement>; + valueStateMessage!: Slot<Array<HTMLElement>>; _initialValueState?: `${ValueState}`; diff --git a/packages/main/src/SuggestionItemCustom.ts b/packages/main/src/SuggestionItemCustom.ts index ea3228fae127..90e6633c8fcd 100644 --- a/packages/main/src/SuggestionItemCustom.ts +++ b/packages/main/src/SuggestionItemCustom.ts @@ -1,6 +1,6 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type { IInputSuggestionItemSelectable } from "./Input.js"; import ListItemBase from "./ListItemBase.js"; @@ -9,6 +9,7 @@ import SuggestionItemCustomTemplate from "./SuggestionItemCustomTemplate.js"; // styles import styles from "./generated/themes/SuggestionItemCustom.css.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -49,7 +50,7 @@ class SuggestionItemCustom extends ListItemBase implements IInputSuggestionItemS * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - content!: Array<Node>; + content!: DefaultSlot<Array<Node>>; get _effectiveTabIndex() { return -1; diff --git a/packages/main/src/SuggestionItemGroup.ts b/packages/main/src/SuggestionItemGroup.ts index 92aee7df9bd2..416be280bdd8 100644 --- a/packages/main/src/SuggestionItemGroup.ts +++ b/packages/main/src/SuggestionItemGroup.ts @@ -1,8 +1,9 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import type SuggestionListItem from "./SuggestionListItem.js"; import ListItemGroup from "./ListItemGroup.js"; import ListBoxItemGroupTemplate from "./ListBoxItemGroupTemplate.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -27,7 +28,7 @@ class SuggestionItemGroup extends ListItemGroup { invalidateOnChildChange: true, type: HTMLElement, }) - items!: Array<SuggestionListItem>; + items!: DefaultSlot<Array<SuggestionListItem>>; } SuggestionItemGroup.define(); diff --git a/packages/main/src/SuggestionListItem.ts b/packages/main/src/SuggestionListItem.ts index d7980ba015a2..b318e15e1afb 100644 --- a/packages/main/src/SuggestionListItem.ts +++ b/packages/main/src/SuggestionListItem.ts @@ -1,8 +1,9 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import ListItemStandard from "./ListItemStandard.js"; import SuggestionListItemTemplate from "./SuggestionListItemTemplate.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -26,15 +27,15 @@ class SuggestionListItem extends ListItemStandard { * @since 1.0.0-rc.8 * @public */ - @slot({ type: HTMLElement }) - richDescription!: Array<HTMLElement> + @slot() + richDescription!: Slot<Array<HTMLElement>>; /** * Defines the title text of the suggestion item. * @public */ @slot({ type: Node, "default": true }) - titleText!: Array<Node>; + titleText!: DefaultSlot<Array<Node>>; onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/main/src/Tab.ts b/packages/main/src/Tab.ts index ad6e6f379ec3..00ab6692cac3 100644 --- a/packages/main/src/Tab.ts +++ b/packages/main/src/Tab.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; import executeTemplate from "@ui5/webcomponents-base/dist/renderer/executeTemplate.js"; @@ -162,7 +162,7 @@ class Tab extends UI5Element implements ITabbable, ITab { slots: false, }, }) - content!: Array<Node>; + content!: DefaultSlot<Array<Node>>; /** * Defines hierarchies with nested sub tabs. @@ -178,7 +178,7 @@ class Tab extends UI5Element implements ITabbable, ITab { slots: false, }, }) - items!: Array<ITab> + items!: Slot<Array<ITab>>; _isInline?: boolean; _forcedMixedMode?: boolean; diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index d6eef7a9559c..7f95af458714 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -1,9 +1,9 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { AccessibilityAttributes } from "@ui5/webcomponents-base/dist/types.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js"; @@ -330,7 +330,7 @@ class TabContainer extends UI5Element { slots: true, }, }) - items!: Array<ITab>; + items!: DefaultSlot<Array<ITab>>; /** * Defines the button which will open the overflow menu. If nothing is provided to this slot, @@ -339,7 +339,7 @@ class TabContainer extends UI5Element { * @since 1.0.0-rc.9 */ @slot() - overflowButton!: Array<IButton>; + overflowButton!: Slot<Array<IButton>>; /** * Defines the button which will open the start overflow menu if available. If nothing is provided to this slot, @@ -348,7 +348,7 @@ class TabContainer extends UI5Element { * @since 1.1.0 */ @slot() - startOverflowButton!: Array<IButton>; + startOverflowButton!: Slot<Array<IButton>>; _itemNavigation: ItemNavigation; _itemsFlat: Array<ITab> = []; @@ -633,11 +633,13 @@ class TabContainer extends UI5Element { if (e.detail.originalEvent instanceof KeyboardEvent) { const realTabReference = (source.element as TabInOverflow).realTabReference; const siblings = this._findSiblings(realTabReference); - let items = siblings; + // let items = siblings; + let items: Array<ITab> = siblings; if (this.items.includes(realTabReference)) { items = siblings.filter(sibling => { - return ((e.target as List).items as Array<TabInOverflow>).some(el => el.realTabReference === sibling); + // return ((e.target as List).items as Array<TabInOverflow>).some(el => el.realTabReference === sibling); + return (e.target as List).items.some(el => (el as TabInOverflow).realTabReference === sibling); }); } @@ -683,11 +685,12 @@ class TabContainer extends UI5Element { if (e.detail.originalEvent instanceof KeyboardEvent) { const realTabReference = (source.element as TabInOverflow).realTabReference; const siblings = this._findSiblings(realTabReference); - let items = siblings; + let items: Array<ITab> = siblings; if (this.items.includes(realTabReference)) { items = siblings.filter(sibling => { - return ((e.target as List).items as Array<TabInOverflow>).some(el => el.realTabReference === sibling); + // return ((e.target as List).items as Array<TabInOverflow>).some(el => el.realTabReference === sibling); + return (e.target as List).items.some(el => (el as TabInOverflow).realTabReference === sibling); }); } @@ -797,7 +800,8 @@ class TabContainer extends UI5Element { return undefined; } - return ((this.responsivePopover!.content[0] as List).items as Array<TabInOverflow | TabSeparatorInOverflow>).find(item => item.realTabReference === realTab); + const listItems = (this.responsivePopover!.content[0] as List).items; + return listItems.find(item => (item as TabInOverflow).realTabReference === realTab); } _onTabStripKeyDown(e: KeyboardEvent) { diff --git a/packages/main/src/Table.ts b/packages/main/src/Table.ts index 7dcbc0671ed5..e615b7b06538 100644 --- a/packages/main/src/Table.ts +++ b/packages/main/src/Table.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { - customElement, slot, property, eventStrict, i18n, + customElement, slotStrict as slot, property, eventStrict, i18n, } from "@ui5/webcomponents-base/dist/decorators.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -278,7 +278,7 @@ class Table extends UI5Element { slots: false, }, }) - rows!: Array<TableRow>; + rows!: DefaultSlot<Array<TableRow>>; /** * Defines the header row of the component. @@ -288,7 +288,7 @@ class Table extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: { properties: false, slots: true } }) - headerRow!: Array<TableHeaderRow>; + headerRow!: Slot<Array<TableHeaderRow>>; /** * Defines the custom visualization if there is no data available. @@ -296,7 +296,7 @@ class Table extends UI5Element { * @public */ @slot() - noData!: Array<HTMLElement>; + noData!: Slot<Array<HTMLElement>>; /** * Defines the features of the component. @@ -304,7 +304,7 @@ class Table extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true }) - features!: Array<ITableFeature>; + features!: Slot<Array<ITableFeature>>; /** * Defines the accessible ARIA name of the component. diff --git a/packages/main/src/TableCellBase.ts b/packages/main/src/TableCellBase.ts index 0976884644d4..3d29ef43a0af 100644 --- a/packages/main/src/TableCellBase.ts +++ b/packages/main/src/TableCellBase.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { - customElement, slot, property, i18n, + customElement, slotStrict as slot, property, i18n, } from "@ui5/webcomponents-base/dist/decorators.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import TableCellBaseStyles from "./generated/themes/TableCellBase.css.js"; @@ -27,7 +27,7 @@ abstract class TableCellBase extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - content!: Array<Node>; + content!: DefaultSlot<Array<Node>>; /** * Determines the horizontal alignment of table cells. diff --git a/packages/main/src/TableHeaderCell.ts b/packages/main/src/TableHeaderCell.ts index 0d4057d55853..8c46c8b34c61 100644 --- a/packages/main/src/TableHeaderCell.ts +++ b/packages/main/src/TableHeaderCell.ts @@ -1,4 +1,4 @@ -import { customElement, property, slot } from "@ui5/webcomponents-base/dist/decorators.js"; +import { customElement, property, slotStrict as slot } from "@ui5/webcomponents-base/dist/decorators.js"; import { toggleAttribute } from "./TableUtils.js"; import TableCellBase from "./TableCellBase.js"; import TableHeaderCellTemplate from "./TableHeaderCellTemplate.js"; @@ -6,6 +6,7 @@ import TableHeaderCellStyles from "./generated/themes/TableHeaderCell.css.js"; import SortOrder from "@ui5/webcomponents-base/dist/types/SortOrder.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import type TableHeaderCellActionBase from "./TableHeaderCellActionBase.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -120,7 +121,7 @@ class TableHeaderCell extends TableCellBase { * @since 2.8.0 */ @slot() - action!: Array<TableHeaderCellActionBase>; + action!: Slot<Array<TableHeaderCellActionBase>>; @property({ type: Boolean, noAttribute: true }) _popin = false; diff --git a/packages/main/src/TableHeaderRow.ts b/packages/main/src/TableHeaderRow.ts index cef10b8f485a..28c27d4c14f6 100644 --- a/packages/main/src/TableHeaderRow.ts +++ b/packages/main/src/TableHeaderRow.ts @@ -1,4 +1,4 @@ -import { customElement, slot, property } from "@ui5/webcomponents-base/dist/decorators.js"; +import { customElement, slotStrict as slot, property } from "@ui5/webcomponents-base/dist/decorators.js"; import TableRowBase from "./TableRowBase.js"; import TableHeaderRowTemplate from "./TableHeaderRowTemplate.js"; import TableHeaderRowStyles from "./generated/themes/TableHeaderRow.css.js"; @@ -12,6 +12,7 @@ import { TABLE_SELECT_ALL_ROWS, TABLE_DESELECT_ALL_ROWS, } from "./generated/i18n/i18n-defaults.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -62,7 +63,7 @@ class TableHeaderRow extends TableRowBase<TableHeaderCell> { }, individualSlots: true, }) - cells!: Array<TableHeaderCell>; + cells!: DefaultSlot<Array<TableHeaderCell>>; /** * Sticks the `ui5-table-header-row` to the top of a table. diff --git a/packages/main/src/TableRow.ts b/packages/main/src/TableRow.ts index a69936e9005f..0d89cd898ca9 100644 --- a/packages/main/src/TableRow.ts +++ b/packages/main/src/TableRow.ts @@ -1,4 +1,4 @@ -import { customElement, slot, property } from "@ui5/webcomponents-base/dist/decorators.js"; +import { customElement, slotStrict as slot, property } from "@ui5/webcomponents-base/dist/decorators.js"; import { isEnter } from "@ui5/webcomponents-base/dist/Keys.js"; import getActiveElement from "@ui5/webcomponents-base/dist/util/getActiveElement.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; @@ -13,6 +13,7 @@ import type { UI5CustomEvent } from "@ui5/webcomponents-base"; import { TABLE_ROW_MULTIPLE_ACTIONS, TABLE_ROW_SINGLE_ACTION, } from "./generated/i18n/i18n-defaults.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -52,7 +53,7 @@ class TableRow extends TableRowBase<TableCell> { slots: false, }, }) - cells!: Array<TableCell>; + cells!: DefaultSlot<Array<TableCell>>; /** * Defines the actions of the component. @@ -66,7 +67,7 @@ class TableRow extends TableRowBase<TableCell> { type: HTMLElement, individualSlots: true, }) - actions!: Array<TableRowActionBase>; + actions!: Slot<Array<TableRowActionBase>>; /** * Unique identifier of the row. diff --git a/packages/main/src/Tag.ts b/packages/main/src/Tag.ts index 7d050b47ddd7..b1d54ff3f621 100644 --- a/packages/main/src/Tag.ts +++ b/packages/main/src/Tag.ts @@ -1,8 +1,8 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; @@ -159,14 +159,14 @@ class Tag extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: Array<Node>; + text!: DefaultSlot<Array<Node>>; /** * Defines the icon to be displayed in the component. * @public */ @slot() - icon!: Array<IIcon>; + icon!: Slot<Array<IIcon>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Text.ts b/packages/main/src/Text.ts index d60a97762fcb..089f97742550 100644 --- a/packages/main/src/Text.ts +++ b/packages/main/src/Text.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { getScopedVarName } from "@ui5/webcomponents-base/dist/CustomElementsScope.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; @@ -76,7 +76,7 @@ class Text extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: Array<Node>; + text!: DefaultSlot<Array<Node>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/TextArea.ts b/packages/main/src/TextArea.ts index 71419cf8a8ac..fbe894d68ac3 100644 --- a/packages/main/src/TextArea.ts +++ b/packages/main/src/TextArea.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -337,7 +337,7 @@ class TextArea extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Array<HTMLElement>; + valueStateMessage!: Slot<Array<HTMLElement>>; _fnOnResize: ResizeObserverCallback; _firstRendering: boolean; diff --git a/packages/main/src/TimePicker.ts b/packages/main/src/TimePicker.ts index 000308673b76..03e58b1ac2a3 100644 --- a/packages/main/src/TimePicker.ts +++ b/packages/main/src/TimePicker.ts @@ -1,9 +1,9 @@ import { isDesktop, isPhone, isTablet } from "@ui5/webcomponents-base/dist/Device.js"; -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -339,7 +339,7 @@ class TimePicker extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Array<HTMLElement>; + valueStateMessage!: Slot<Array<HTMLElement>>; @query("[ui5-time-selection-clocks]") _timeSelectionClocks?: TimeSelectionClocks; diff --git a/packages/main/src/Token.ts b/packages/main/src/Token.ts index 396b5c435f08..d88af06256e7 100644 --- a/packages/main/src/Token.ts +++ b/packages/main/src/Token.ts @@ -1,7 +1,7 @@ // eslint-disable-next-line max-classes-per-file -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -141,7 +141,7 @@ class Token extends UI5Element implements IToken { * @since 1.0.0-rc.9 */ @slot() - closeIcon!: Array<IIcon>; + closeIcon!: Slot<Array<IIcon>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Tokenizer.ts b/packages/main/src/Tokenizer.ts index 095904de05bd..3b6da5f83341 100644 --- a/packages/main/src/Tokenizer.ts +++ b/packages/main/src/Tokenizer.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -350,7 +350,7 @@ class Tokenizer extends UI5Element implements IFormInputElement { slots: false, }, }) - tokens!: Array<Token>; + tokens!: DefaultSlot<Array<Token>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Toolbar.ts b/packages/main/src/Toolbar.ts index 0a6165bb24e2..0650d21ec9c2 100644 --- a/packages/main/src/Toolbar.ts +++ b/packages/main/src/Toolbar.ts @@ -1,6 +1,6 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; -import type { ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import type { ChangeInfo, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; @@ -157,7 +157,7 @@ class Toolbar extends UI5Element { @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true, individualSlots: true, }) - items!: Array<ToolbarItem> + items!: DefaultSlot<Array<ToolbarItem>> _onResize!: ResizeObserverCallback; _onCloseOverflow!: EventListener; diff --git a/packages/main/src/ToolbarSelect.ts b/packages/main/src/ToolbarSelect.ts index ff3011be84ac..77c31c4d197f 100644 --- a/packages/main/src/ToolbarSelect.ts +++ b/packages/main/src/ToolbarSelect.ts @@ -1,7 +1,7 @@ import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import type ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js"; import ToolbarSelectCss from "./generated/themes/ToolbarSelect.css.js"; @@ -13,6 +13,7 @@ import ToolbarItem from "./ToolbarItem.js"; import type { ToolbarItemEventDetail } from "./ToolbarItem.js"; import type ToolbarSelectOption from "./ToolbarSelectOption.js"; import type { SelectChangeEventDetail } from "./Select.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; type ToolbarSelectChangeEventDetail = ToolbarItemEventDetail & SelectChangeEventDetail; @@ -93,7 +94,7 @@ class ToolbarSelect extends ToolbarItem { type: HTMLElement, invalidateOnChildChange: true, }) - options!: Array<ToolbarSelectOption>; + options!: DefaultSlot<Array<ToolbarSelectOption>>; /** * Defines the HTML element that will be displayed in the component input part, @@ -102,7 +103,7 @@ class ToolbarSelect extends ToolbarItem { * @since 2.15.0 */ @slot() - label!: Array<HTMLElement>; + label!: Slot<Array<HTMLElement>>; /** * Defines the value state of the component. diff --git a/packages/main/src/ToolbarSelectOption.ts b/packages/main/src/ToolbarSelectOption.ts index 1287701ac9cf..dd8b0ec8cff3 100644 --- a/packages/main/src/ToolbarSelectOption.ts +++ b/packages/main/src/ToolbarSelectOption.ts @@ -1,6 +1,6 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import type ToolbarSelect from "./ToolbarSelect.js"; @@ -58,7 +58,7 @@ class ToolbarSelectOption extends UI5Element { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - text!: Array<Node>; + text!: DefaultSlot<Array<Node>>; } ToolbarSelectOption.define(); diff --git a/packages/main/src/Tree.ts b/packages/main/src/Tree.ts index d4ece8b3ac05..26329504017a 100644 --- a/packages/main/src/Tree.ts +++ b/packages/main/src/Tree.ts @@ -1,7 +1,7 @@ -import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import DragAndDropHandler from "./delegate/DragAndDropHandler.js"; import MovePlacement from "@ui5/webcomponents-base/dist/types/MovePlacement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; @@ -295,7 +295,7 @@ class Tree extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: Array<TreeItemBase>; + items!: DefaultSlot<Array<TreeItemBase>>; /** * Defines the component header. @@ -305,7 +305,7 @@ class Tree extends UI5Element { * @public */ @slot() - header!: Array<HTMLElement>; + header!: Slot<Array<HTMLElement>>; _dragAndDropHandler: DragAndDropHandler; diff --git a/packages/main/src/TreeItemBase.ts b/packages/main/src/TreeItemBase.ts index 274dae32e5fb..6f7344dfdb83 100644 --- a/packages/main/src/TreeItemBase.ts +++ b/packages/main/src/TreeItemBase.ts @@ -1,7 +1,7 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import type { ClassMap } from "@ui5/webcomponents-base/dist/types.js"; import { isLeft, isRight } from "@ui5/webcomponents-base/dist/Keys.js"; @@ -23,6 +23,7 @@ import TreeItemBaseTemplate from "./TreeItemBaseTemplate.js"; // Styles import treeItemCss from "./generated/themes/TreeItem.css.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; type TreeItemBaseEventDetail = { item: TreeItemBase, @@ -215,7 +216,7 @@ class TreeItemBase extends ListItem { }, "default": true, }) - items!: Array<TreeItemBase>; + items!: DefaultSlot<Array<TreeItemBase>>; /** * **Note:** While the slot allows option for setting custom avatar, to match the @@ -227,7 +228,7 @@ class TreeItemBase extends ListItem { * @public */ @slot() - image!: Array<HTMLElement>; + image!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/TreeItemCustom.ts b/packages/main/src/TreeItemCustom.ts index c24d2dff598d..e75ad2f87c91 100644 --- a/packages/main/src/TreeItemCustom.ts +++ b/packages/main/src/TreeItemCustom.ts @@ -1,7 +1,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import slot from "@ui5/webcomponents-base/dist/decorators/slot.js"; +import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import { isTabNext, isTabPrevious, @@ -15,6 +15,7 @@ import TreeItemCustomTemplate from "./TreeItemCustomTemplate.js"; // Styles import treeItemCustomCss from "./generated/themes/TreeItem.css.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class @@ -55,7 +56,7 @@ class TreeItemCustom extends TreeItemBase { * @public */ @slot() - content!: Array<HTMLElement>; + content!: Slot<Array<HTMLElement>>; _onkeydown(e: KeyboardEvent) { if (isDown(e) && this.content?.some(el => el.contains(e.target as Node))) { From 8956b78a4430a6fece995396d8b455b59941f48c Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Tue, 27 Jan 2026 16:12:17 +0200 Subject: [PATCH 02/14] chore: clean up --- packages/base/src/decorators/slot-strict.ts | 60 +++++++++--------- packages/base/src/decorators/slot-strict2.ts | 65 -------------------- packages/fiori/src/NavigationMenuItem.ts | 1 - packages/fiori/src/SearchItemGroup.ts | 1 - packages/main/src/Dialog.ts | 15 ----- 5 files changed, 30 insertions(+), 112 deletions(-) delete mode 100644 packages/base/src/decorators/slot-strict2.ts diff --git a/packages/base/src/decorators/slot-strict.ts b/packages/base/src/decorators/slot-strict.ts index bd4fb4c5dc85..092ca6866add 100644 --- a/packages/base/src/decorators/slot-strict.ts +++ b/packages/base/src/decorators/slot-strict.ts @@ -1,48 +1,48 @@ import type UI5Element from "../UI5Element.js"; -import type { Slot, DefaultSlot, IsSlot } from "../UI5Element.js"; +import type { Slot, DefaultSlot } from "../UI5Element.js"; import type { Slot as SlotMetadata } from "../UI5ElementMetadata.js"; function slot< - T extends Record<K, Slot<unknown> | DefaultSlot<unknown>>, - K extends string + T extends Record<K, Slot<unknown> | DefaultSlot<unknown>>, + K extends string >(slotData?: SlotMetadata): (target: T, prop: K) => void { - return (target: any, slotKey: string | symbol) => { - const ctor = target.constructor as typeof UI5Element; + return (target: any, slotKey: string | symbol) => { + const ctor = target.constructor as typeof UI5Element; - if (!Object.prototype.hasOwnProperty.call(ctor, "metadata")) { - ctor.metadata = {}; - } + if (!Object.prototype.hasOwnProperty.call(ctor, "metadata")) { + ctor.metadata = {}; + } - const metadata = ctor.metadata; - if (!metadata.slots) { - metadata.slots = {}; - } + const metadata = ctor.metadata; + if (!metadata.slots) { + metadata.slots = {}; + } - const slotMetadata = metadata.slots; + const slotMetadata = metadata.slots; - if (slotData && slotData.default && slotMetadata.default) { - throw new Error("Only one slot can be the default slot."); - } + if (slotData && slotData.default && slotMetadata.default) { + throw new Error("Only one slot can be the default slot."); + } - const key = slotData && slotData.default ? "default" : (slotKey as string); - slotData = slotData || { type: HTMLElement }; + const key = slotData && slotData.default ? "default" : (slotKey as string); + slotData = slotData || { type: HTMLElement }; - if (!slotData.type) { - slotData.type = HTMLElement; - } + if (!slotData.type) { + slotData.type = HTMLElement; + } - if (!slotMetadata[key]) { - slotMetadata[key] = slotData; - } + if (!slotMetadata[key]) { + slotMetadata[key] = slotData; + } - if (slotData.default) { - delete slotMetadata.default.default; - slotMetadata.default.propertyName = slotKey as string; - } + if (slotData.default) { + delete slotMetadata.default.default; + slotMetadata.default.propertyName = slotKey as string; + } - ctor.metadata.managedSlots = true; - }; + ctor.metadata.managedSlots = true; + }; } export default slot; \ No newline at end of file diff --git a/packages/base/src/decorators/slot-strict2.ts b/packages/base/src/decorators/slot-strict2.ts deleted file mode 100644 index 897e67578d39..000000000000 --- a/packages/base/src/decorators/slot-strict2.ts +++ /dev/null @@ -1,65 +0,0 @@ -import type UI5Element from "../UI5Element.js"; -import type { Slot } from "../UI5ElementMetadata.js"; - -type HasSlotDetails = { slotDetails: Record<string, unknown> }; - -// Helper type that produces a clear error message -type ValidateSlotKey<T extends HasSlotDetails, K extends PropertyKey> = - K extends keyof T["slotDetails"] - ? K - : `Error: Slot "${K & string}" is not declared in slotDetails. Add it to slotDetails!: { ${K & string}: YourType }`; - - -// Overload: slot key must exist in slotDetails with clear error -function slot< - T extends HasSlotDetails, - K extends PropertyKey ->(slotData?: Slot): ( - target: T, - key: ValidateSlotKey<T, K> -) => void; - -// Implementation -function slot(slotData?: Slot) { - return <K extends PropertyKey>( - target: HasSlotDetails, - slotKey: K - ) => { - const ctor = (target as any).constructor as typeof UI5Element; - - if (!Object.prototype.hasOwnProperty.call(ctor, "metadata")) { - ctor.metadata = {}; - } - - const metadata = ctor.metadata; - if (!metadata.slots) { - metadata.slots = {}; - } - - const slotMetadata = metadata.slots; - - if (slotData && slotData.default && slotMetadata.default) { - throw new Error("Only one slot can be the default slot."); - } - - const key = slotData && slotData.default ? "default" : (slotKey as string); - slotData = slotData || { type: HTMLElement }; - - if (!slotData.type) { - slotData.type = HTMLElement; - } - - if (!slotMetadata[key]) { - slotMetadata[key] = slotData; - } - - if (slotData.default) { - delete slotMetadata.default.default; - slotMetadata.default.propertyName = slotKey as string; - } - - ctor.metadata.managedSlots = true; - }; -} - -export default slot; \ No newline at end of file diff --git a/packages/fiori/src/NavigationMenuItem.ts b/packages/fiori/src/NavigationMenuItem.ts index 7b1a37abb118..930ce0627216 100644 --- a/packages/fiori/src/NavigationMenuItem.ts +++ b/packages/fiori/src/NavigationMenuItem.ts @@ -14,7 +14,6 @@ import { isEnterAlt, } from "@ui5/webcomponents-base/dist/Keys.js"; import type SideNavigationSelectableItemBase from "./SideNavigationSelectableItemBase.js"; -import { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Templates import NavigationMenuItemTemplate from "./NavigationMenuItemTemplate.js"; diff --git a/packages/fiori/src/SearchItemGroup.ts b/packages/fiori/src/SearchItemGroup.ts index fa49916743d4..1f44eeb321d4 100644 --- a/packages/fiori/src/SearchItemGroup.ts +++ b/packages/fiori/src/SearchItemGroup.ts @@ -3,7 +3,6 @@ import ListItemGroup from "@ui5/webcomponents/dist/ListItemGroup.js"; import SearchItemGroupCss from "./generated/themes/SearchItemGroup.css.js"; import ListBoxItemGroupTemplate from "@ui5/webcomponents/dist/ListBoxItemGroupTemplate.js"; import WrappingType from "@ui5/webcomponents/dist/types/WrappingType.js"; -import { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; /** * @class diff --git a/packages/main/src/Dialog.ts b/packages/main/src/Dialog.ts index dc59c1399eaf..0f375a771f6e 100644 --- a/packages/main/src/Dialog.ts +++ b/packages/main/src/Dialog.ts @@ -686,21 +686,6 @@ class Dialog extends Popup { } } -// TODO: Remove afterwards - used only to test the slot types union -// type ExtractSlots<T> = { -// [K in keyof T]: IsDefaultSlot<NonNullable<T[K]>> extends true -// ? "default" -// : IsSlot<NonNullable<T[K]>> extends true -// ? K -// : never -// }[keyof T]; - -// type DialogSlots = Exclude<ExtractSlots<Dialog>, undefined>; - -// let a: DialogSlots; -// a = "footer"; -// a = "default"; - Dialog.define(); export default Dialog; From d156c3cdd94ecf6d9d900ea9350e9b628519953a Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Tue, 27 Jan 2026 18:54:19 +0200 Subject: [PATCH 03/14] chore: fix lint --- packages/ai/src/Button.ts | 3 ++- packages/base/src/UI5Element.ts | 4 +--- packages/base/src/decorators/slot-strict.ts | 5 ++--- packages/compat/src/TableCell.ts | 3 ++- packages/compat/src/TableRow.ts | 3 ++- packages/fiori/src/DynamicSideContent.ts | 3 ++- packages/fiori/src/FilterItem.ts | 3 ++- packages/fiori/src/FlexibleColumnLayout.ts | 3 ++- packages/fiori/src/IllustratedMessage.ts | 3 ++- packages/fiori/src/MediaGallery.ts | 3 ++- packages/fiori/src/NotificationList.ts | 3 ++- packages/fiori/src/ProductSwitch.ts | 3 ++- packages/fiori/src/ProductSwitchItem.ts | 3 ++- packages/fiori/src/SearchField.ts | 3 ++- packages/fiori/src/ShellBar.ts | 3 ++- packages/fiori/src/ShellBarBranding.ts | 3 ++- packages/fiori/src/SideNavigation.ts | 3 ++- packages/fiori/src/Timeline.ts | 3 ++- packages/fiori/src/TimelineGroupItem.ts | 3 ++- packages/fiori/src/TimelineItem.ts | 3 ++- packages/fiori/src/UploadCollection.ts | 3 ++- packages/fiori/src/UserMenu.ts | 3 ++- packages/fiori/src/UserSettingsDialog.ts | 3 ++- packages/fiori/src/UserSettingsItem.ts | 3 ++- packages/fiori/src/UserSettingsView.ts | 3 ++- packages/fiori/src/ViewSettingsDialog.ts | 4 ++-- packages/fiori/src/Wizard.ts | 3 ++- packages/main/src/Avatar.ts | 3 ++- packages/main/src/AvatarGroup.ts | 14 ++++---------- packages/main/src/Bar.ts | 3 ++- packages/main/src/BreadcrumbsItem.ts | 3 ++- packages/main/src/Button.ts | 3 ++- packages/main/src/Calendar.ts | 3 +-- packages/main/src/CalendarLegend.ts | 3 ++- packages/main/src/Card.ts | 3 ++- packages/main/src/CardHeader.ts | 3 ++- packages/main/src/Carousel.ts | 3 ++- packages/main/src/ColorPalette.ts | 6 +++--- packages/main/src/ColorPalettePopover.ts | 3 ++- packages/main/src/ComboBox.ts | 3 ++- packages/main/src/Dialog.ts | 4 ++-- packages/main/src/FileUploader.ts | 3 ++- packages/main/src/Form.ts | 3 ++- packages/main/src/FormGroup.ts | 3 ++- packages/main/src/FormItem.ts | 3 ++- packages/main/src/Input.ts | 3 ++- packages/main/src/List.ts | 3 ++- packages/main/src/ListItemGroup.ts | 3 ++- packages/main/src/Menu.ts | 3 ++- packages/main/src/MenuItemGroup.ts | 3 ++- packages/main/src/MessageStrip.ts | 3 ++- packages/main/src/MultiComboBox.ts | 3 ++- packages/main/src/Panel.ts | 3 ++- packages/main/src/Popover.ts | 3 ++- packages/main/src/Popup.ts | 3 ++- packages/main/src/SegmentedButton.ts | 3 ++- packages/main/src/SegmentedButtonItem.ts | 3 ++- packages/main/src/Select.ts | 3 ++- packages/main/src/SplitButton.ts | 3 ++- packages/main/src/StepInput.ts | 3 ++- packages/main/src/Tab.ts | 3 ++- packages/main/src/TabContainer.ts | 5 +++-- packages/main/src/Table.ts | 3 ++- packages/main/src/TableCellBase.ts | 3 ++- packages/main/src/Tag.ts | 3 ++- packages/main/src/Text.ts | 3 ++- packages/main/src/TextArea.ts | 3 ++- packages/main/src/TimePicker.ts | 3 ++- packages/main/src/Token.ts | 4 ++-- packages/main/src/Tokenizer.ts | 3 ++- packages/main/src/ToolbarSelectOption.ts | 3 ++- packages/main/src/Tree.ts | 3 ++- 72 files changed, 146 insertions(+), 92 deletions(-) diff --git a/packages/ai/src/Button.ts b/packages/ai/src/Button.ts index 963bae502486..28df60aa97a2 100644 --- a/packages/ai/src/Button.ts +++ b/packages/ai/src/Button.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/base/src/UI5Element.ts b/packages/base/src/UI5Element.ts index 23ccaec1b391..4ff7d412d5be 100644 --- a/packages/base/src/UI5Element.ts +++ b/packages/base/src/UI5Element.ts @@ -169,7 +169,6 @@ type TargetedEventHandler<D, T> = { }["asMethod"]; type Convert<T, K extends UI5Element> = { [Property in keyof T as `on${KebabToPascal<string & Property>}`]: IsAny<T[Property], any, TargetedEventHandler<T[Property], K>> } - // Create a unique symbol as a marker declare const SlotMarker: unique symbol; declare const DefaultSlotMarker: unique symbol; @@ -193,8 +192,7 @@ abstract class UI5Element extends HTMLElement { }; _jsxEvents!: Omit<JSX.DOMAttributes<this>, keyof Convert<this["eventDetails"], this> | "onClose" | "onToggle" | "onChange" | "onSelect" | "onInput"> & Convert<this["eventDetails"], this>; _jsxProps!: Pick<JSX.AllHTMLAttributes<HTMLElement>, GlobalHTMLAttributeNames> & ElementProps<this> & Partial<this["_jsxEvents"]> & { key?: any }; - // _jsxSlots!: NotEqual<this, UI5Element> extends true ? Exclude<ExtractSlotNames<this>, undefined> : string; - + __id?: string; _suppressInvalidation: boolean; _changedState: Array<ChangeInfo>; diff --git a/packages/base/src/decorators/slot-strict.ts b/packages/base/src/decorators/slot-strict.ts index 092ca6866add..0c254c02ce63 100644 --- a/packages/base/src/decorators/slot-strict.ts +++ b/packages/base/src/decorators/slot-strict.ts @@ -3,10 +3,9 @@ import type { Slot, DefaultSlot } from "../UI5Element.js"; import type { Slot as SlotMetadata } from "../UI5ElementMetadata.js"; function slot< - T extends Record<K, Slot<unknown> | DefaultSlot<unknown>>, + T extends Record<K, Slot<unknown> | DefaultSlot<unknown>>, K extends string >(slotData?: SlotMetadata): (target: T, prop: K) => void { - return (target: any, slotKey: string | symbol) => { const ctor = target.constructor as typeof UI5Element; @@ -45,4 +44,4 @@ function slot< }; } -export default slot; \ No newline at end of file +export default slot; diff --git a/packages/compat/src/TableCell.ts b/packages/compat/src/TableCell.ts index 220919ca6762..3f0056d4af89 100644 --- a/packages/compat/src/TableCell.ts +++ b/packages/compat/src/TableCell.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; diff --git a/packages/compat/src/TableRow.ts b/packages/compat/src/TableRow.ts index ab6a7c71e670..e6319b79d1c5 100644 --- a/packages/compat/src/TableRow.ts +++ b/packages/compat/src/TableRow.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/fiori/src/DynamicSideContent.ts b/packages/fiori/src/DynamicSideContent.ts index f19014119c5e..f2d57ee9e57d 100644 --- a/packages/fiori/src/DynamicSideContent.ts +++ b/packages/fiori/src/DynamicSideContent.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/fiori/src/FilterItem.ts b/packages/fiori/src/FilterItem.ts index e79a42f625c9..99a2467993fe 100644 --- a/packages/fiori/src/FilterItem.ts +++ b/packages/fiori/src/FilterItem.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; diff --git a/packages/fiori/src/FlexibleColumnLayout.ts b/packages/fiori/src/FlexibleColumnLayout.ts index a3514756c69a..c5a921907827 100644 --- a/packages/fiori/src/FlexibleColumnLayout.ts +++ b/packages/fiori/src/FlexibleColumnLayout.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/fiori/src/IllustratedMessage.ts b/packages/fiori/src/IllustratedMessage.ts index ca1cbd44bfa5..1a590b9721c0 100644 --- a/packages/fiori/src/IllustratedMessage.ts +++ b/packages/fiori/src/IllustratedMessage.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/fiori/src/MediaGallery.ts b/packages/fiori/src/MediaGallery.ts index cb3c05a15f83..5781b4b8ed2c 100644 --- a/packages/fiori/src/MediaGallery.ts +++ b/packages/fiori/src/MediaGallery.ts @@ -4,7 +4,8 @@ import { isPhone } from "@ui5/webcomponents-base/dist/Device.js"; import MediaRange from "@ui5/webcomponents-base/dist/MediaRange.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import NavigationMode from "@ui5/webcomponents-base/dist/types/NavigationMode.js"; -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import Button from "@ui5/webcomponents/dist/Button.js"; import type { CarouselNavigateEventDetail } from "@ui5/webcomponents/dist/Carousel.js"; import Carousel from "@ui5/webcomponents/dist/Carousel.js"; diff --git a/packages/fiori/src/NotificationList.ts b/packages/fiori/src/NotificationList.ts index 5bc60bf34303..96eb5b80eabf 100644 --- a/packages/fiori/src/NotificationList.ts +++ b/packages/fiori/src/NotificationList.ts @@ -4,7 +4,8 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import type { ListItemClickEventDetail, diff --git a/packages/fiori/src/ProductSwitch.ts b/packages/fiori/src/ProductSwitch.ts index 3c54300be146..5a96be976c81 100644 --- a/packages/fiori/src/ProductSwitch.ts +++ b/packages/fiori/src/ProductSwitch.ts @@ -1,5 +1,6 @@ import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; import type { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/fiori/src/ProductSwitchItem.ts b/packages/fiori/src/ProductSwitchItem.ts index 9d2a4d9abeac..27e223d1f169 100644 --- a/packages/fiori/src/ProductSwitchItem.ts +++ b/packages/fiori/src/ProductSwitchItem.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { isSpace, isEnter, isSpaceShift } from "@ui5/webcomponents-base/dist/Keys.js"; import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js"; diff --git a/packages/fiori/src/SearchField.ts b/packages/fiori/src/SearchField.ts index d9843060ea21..8839d9965117 100644 --- a/packages/fiori/src/SearchField.ts +++ b/packages/fiori/src/SearchField.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/fiori/src/ShellBar.ts b/packages/fiori/src/ShellBar.ts index d59026547c83..bf31dc22ef7d 100644 --- a/packages/fiori/src/ShellBar.ts +++ b/packages/fiori/src/ShellBar.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot, type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/fiori/src/ShellBarBranding.ts b/packages/fiori/src/ShellBarBranding.ts index 914ef0e7d404..ceea9e22838f 100644 --- a/packages/fiori/src/ShellBarBranding.ts +++ b/packages/fiori/src/ShellBarBranding.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot, type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index a95c91e0e698..23be132b546a 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot, type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; diff --git a/packages/fiori/src/Timeline.ts b/packages/fiori/src/Timeline.ts index 9f5471c72569..baf9a11435db 100644 --- a/packages/fiori/src/Timeline.ts +++ b/packages/fiori/src/Timeline.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/fiori/src/TimelineGroupItem.ts b/packages/fiori/src/TimelineGroupItem.ts index ab2f793b8fb4..59b130eac161 100644 --- a/packages/fiori/src/TimelineGroupItem.ts +++ b/packages/fiori/src/TimelineGroupItem.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/fiori/src/TimelineItem.ts b/packages/fiori/src/TimelineItem.ts index 444dd37c65dc..4f001bdd5af4 100644 --- a/packages/fiori/src/TimelineItem.ts +++ b/packages/fiori/src/TimelineItem.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/fiori/src/UploadCollection.ts b/packages/fiori/src/UploadCollection.ts index b22cb8ff3b4a..78b12b42dc93 100644 --- a/packages/fiori/src/UploadCollection.ts +++ b/packages/fiori/src/UploadCollection.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/fiori/src/UserMenu.ts b/packages/fiori/src/UserMenu.ts index 136314d46b12..53a79a74fab7 100644 --- a/packages/fiori/src/UserMenu.ts +++ b/packages/fiori/src/UserMenu.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { customElement, slotStrict as slot, eventStrict as event, property, } from "@ui5/webcomponents-base/dist/decorators.js"; diff --git a/packages/fiori/src/UserSettingsDialog.ts b/packages/fiori/src/UserSettingsDialog.ts index 17184e8d8d25..860aeedf5e12 100644 --- a/packages/fiori/src/UserSettingsDialog.ts +++ b/packages/fiori/src/UserSettingsDialog.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { customElement, property, slotStrict as slot, eventStrict as event, } from "@ui5/webcomponents-base/dist/decorators.js"; diff --git a/packages/fiori/src/UserSettingsItem.ts b/packages/fiori/src/UserSettingsItem.ts index 1bab061d4c12..504dabd0cd1b 100644 --- a/packages/fiori/src/UserSettingsItem.ts +++ b/packages/fiori/src/UserSettingsItem.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import { customElement, property, slotStrict as slot, eventStrict as event, diff --git a/packages/fiori/src/UserSettingsView.ts b/packages/fiori/src/UserSettingsView.ts index dfeebb2b64ca..df32dde0df1e 100644 --- a/packages/fiori/src/UserSettingsView.ts +++ b/packages/fiori/src/UserSettingsView.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { customElement, property, slotStrict as slot } from "@ui5/webcomponents-base/dist/decorators.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import UserSettingsViewTemplate from "./UserSettingsViewTemplate.js"; diff --git a/packages/fiori/src/ViewSettingsDialog.ts b/packages/fiori/src/ViewSettingsDialog.ts index cef8ebb4dccc..2c822979bd6d 100644 --- a/packages/fiori/src/ViewSettingsDialog.ts +++ b/packages/fiori/src/ViewSettingsDialog.ts @@ -7,8 +7,8 @@ import query from "@ui5/webcomponents-base/dist/decorators/query.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import { isPhone } from "@ui5/webcomponents-base/dist/Device.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; -import type { ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type Dialog from "@ui5/webcomponents/dist/Dialog.js"; import type List from "@ui5/webcomponents/dist/List.js"; import type { ListItemClickEventDetail, ListSelectionChangeEventDetail } from "@ui5/webcomponents/dist/List.js"; diff --git a/packages/fiori/src/Wizard.ts b/packages/fiori/src/Wizard.ts index 183ad3830b08..22e1f70083b9 100644 --- a/packages/fiori/src/Wizard.ts +++ b/packages/fiori/src/Wizard.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/Avatar.ts b/packages/main/src/Avatar.ts index 59ead3fa8568..21ca71c47607 100644 --- a/packages/main/src/Avatar.ts +++ b/packages/main/src/Avatar.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/AvatarGroup.ts b/packages/main/src/AvatarGroup.ts index e469f0631a5d..9bb761c1fa6a 100644 --- a/packages/main/src/AvatarGroup.ts +++ b/packages/main/src/AvatarGroup.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot, type IsSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js"; @@ -67,8 +68,8 @@ const offsets = { [AvatarGroupType.Group]: "-1.625rem", }, [AvatarSize.L]: { - [AvatarGroupType.Individual]: "0.125rem", - [AvatarGroupType.Group]: " -2rem", + [AvatarGroupType.Individual]: "0.125rem", + [AvatarGroupType.Group]: "-2rem", }, [AvatarSize.XL]: { [AvatarGroupType.Individual]: "0.25rem", @@ -603,13 +604,6 @@ class AvatarGroup extends UI5Element { AvatarGroup.define(); - -// Check for the brand -type Expect<T extends true> = T; -type Test1 = Expect<IsSlot<AvatarGroup['overflowButton']>>; // true -type Test1A = Expect<IsSlot<AvatarGroup['items']>>; // true - - export default AvatarGroup; export type { AvatarGroupClickEventDetail, diff --git a/packages/main/src/Bar.ts b/packages/main/src/Bar.ts index 777aaff9bca0..69665306759f 100644 --- a/packages/main/src/Bar.ts +++ b/packages/main/src/Bar.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/BreadcrumbsItem.ts b/packages/main/src/BreadcrumbsItem.ts index 2e8d99245576..1dd4403331f0 100644 --- a/packages/main/src/BreadcrumbsItem.ts +++ b/packages/main/src/BreadcrumbsItem.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/Button.ts b/packages/main/src/Button.ts index 527751818e15..e55660d9af8c 100644 --- a/packages/main/src/Button.ts +++ b/packages/main/src/Button.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/Calendar.ts b/packages/main/src/Calendar.ts index 9d103675e40d..626766baca04 100644 --- a/packages/main/src/Calendar.ts +++ b/packages/main/src/Calendar.ts @@ -1,6 +1,6 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; -import type { ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { ChangeInfo, DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @@ -36,7 +36,6 @@ import type CalendarLegend from "./CalendarLegend.js"; import type { CalendarLegendItemSelectionChangeEventDetail } from "./CalendarLegend.js"; import type SpecialCalendarDate from "./SpecialCalendarDate.js"; import type CalendarLegendItemType from "./types/CalendarLegendItemType.js"; -import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; // Default calendar for bundling import "@ui5/webcomponents-localization/dist/features/calendar/Gregorian.js"; diff --git a/packages/main/src/CalendarLegend.ts b/packages/main/src/CalendarLegend.ts index b2a4da5e9e58..85249f992567 100644 --- a/packages/main/src/CalendarLegend.ts +++ b/packages/main/src/CalendarLegend.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/main/src/Card.ts b/packages/main/src/Card.ts index 2e59351caa30..daffca08f8e5 100644 --- a/packages/main/src/Card.ts +++ b/packages/main/src/Card.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/CardHeader.ts b/packages/main/src/CardHeader.ts index ffa14e4bfaab..f117815a2e6f 100644 --- a/packages/main/src/CardHeader.ts +++ b/packages/main/src/CardHeader.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/Carousel.ts b/packages/main/src/Carousel.ts index be2b220bbfd6..9eaaef8c5039 100644 --- a/packages/main/src/Carousel.ts +++ b/packages/main/src/Carousel.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/ColorPalette.ts b/packages/main/src/ColorPalette.ts index 5d47e48cc61a..4e944ed728c3 100644 --- a/packages/main/src/ColorPalette.ts +++ b/packages/main/src/ColorPalette.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @@ -289,13 +290,12 @@ class ColorPalette extends UI5Element { } get effectiveColorItems() { - // let colorItems = this.colors; let colorItems: Array<IColorPaletteItem> = this.colors; if (this.popupMode) { colorItems = this.getSlottedNodes<ColorPaletteItem>("colors"); } - + return colorItems; } diff --git a/packages/main/src/ColorPalettePopover.ts b/packages/main/src/ColorPalettePopover.ts index 4336ba3ceb42..ec34547fdeed 100644 --- a/packages/main/src/ColorPalettePopover.ts +++ b/packages/main/src/ColorPalettePopover.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts index fa78f11852b7..a9d9a2a6887b 100644 --- a/packages/main/src/ComboBox.ts +++ b/packages/main/src/ComboBox.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/Dialog.ts b/packages/main/src/Dialog.ts index 0f375a771f6e..840d8d59d0d0 100644 --- a/packages/main/src/Dialog.ts +++ b/packages/main/src/Dialog.ts @@ -1,4 +1,4 @@ -import { type IsDefaultSlot, type IsSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; @@ -218,7 +218,7 @@ class Dialog extends Popup { * @public */ @slot() - footer!: Slot<Array<HTMLElement>>; + footer!: Slot<Array<HTMLElement>>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/FileUploader.ts b/packages/main/src/FileUploader.ts index 0fb65386d0f5..e5dc335c2de7 100644 --- a/packages/main/src/FileUploader.ts +++ b/packages/main/src/FileUploader.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/Form.ts b/packages/main/src/Form.ts index 237d6d0b0fc0..cafddf9b6e40 100644 --- a/packages/main/src/Form.ts +++ b/packages/main/src/Form.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; diff --git a/packages/main/src/FormGroup.ts b/packages/main/src/FormGroup.ts index 2edd38c04006..f72a6a16a382 100644 --- a/packages/main/src/FormGroup.ts +++ b/packages/main/src/FormGroup.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; diff --git a/packages/main/src/FormItem.ts b/packages/main/src/FormItem.ts index c912b5b77e2b..c89a4f718967 100644 --- a/packages/main/src/FormItem.ts +++ b/packages/main/src/FormItem.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; diff --git a/packages/main/src/Input.ts b/packages/main/src/Input.ts index 8d203ac170c9..8c7720cccaff 100644 --- a/packages/main/src/Input.ts +++ b/packages/main/src/Input.ts @@ -1,5 +1,6 @@ /* eslint-disable spaced-comment */ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { UI5CustomEvent } from "@ui5/webcomponents-base"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; diff --git a/packages/main/src/List.ts b/packages/main/src/List.ts index 3db48b73cde6..21596764586f 100644 --- a/packages/main/src/List.ts +++ b/packages/main/src/List.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js"; diff --git a/packages/main/src/ListItemGroup.ts b/packages/main/src/ListItemGroup.ts index 533c653c55ac..ded228fdfa5a 100644 --- a/packages/main/src/ListItemGroup.ts +++ b/packages/main/src/ListItemGroup.ts @@ -3,7 +3,8 @@ import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import DragAndDropHandler from "./delegate/DragAndDropHandler.js"; import MovePlacement from "@ui5/webcomponents-base/dist/types/MovePlacement.js"; import type DropIndicator from "./DropIndicator.js"; diff --git a/packages/main/src/Menu.ts b/packages/main/src/Menu.ts index d2fe49b3ab3d..bd8d4795cbdc 100644 --- a/packages/main/src/Menu.ts +++ b/packages/main/src/Menu.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/MenuItemGroup.ts b/packages/main/src/MenuItemGroup.ts index 66b651492673..a163655d6f5b 100644 --- a/packages/main/src/MenuItemGroup.ts +++ b/packages/main/src/MenuItemGroup.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/MessageStrip.ts b/packages/main/src/MessageStrip.ts index 6033fb5c5f11..d218a10b049c 100644 --- a/packages/main/src/MessageStrip.ts +++ b/packages/main/src/MessageStrip.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/MultiComboBox.ts b/packages/main/src/MultiComboBox.ts index 45b3fe014581..bb31080e7530 100644 --- a/packages/main/src/MultiComboBox.ts +++ b/packages/main/src/MultiComboBox.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/Panel.ts b/packages/main/src/Panel.ts index ce6881810b6e..ed78fed56ce2 100644 --- a/packages/main/src/Panel.ts +++ b/packages/main/src/Panel.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot, type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/main/src/Popover.ts b/packages/main/src/Popover.ts index 711d5818d17a..6c9065070118 100644 --- a/packages/main/src/Popover.ts +++ b/packages/main/src/Popover.ts @@ -1,4 +1,5 @@ -import { instanceOfUI5Element, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import { instanceOfUI5Element } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/main/src/Popup.ts b/packages/main/src/Popup.ts index a3b3e9c0fee2..615f010ea33d 100644 --- a/packages/main/src/Popup.ts +++ b/packages/main/src/Popup.ts @@ -5,7 +5,8 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import type { ClassMap } from "@ui5/webcomponents-base/dist/types.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; -import UI5Element, { type DefaultSlot, type Slot, type IsDefaultSlot, type IsSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { isChrome, isDesktop, diff --git a/packages/main/src/SegmentedButton.ts b/packages/main/src/SegmentedButton.ts index 3c920c66277c..3eb1a210f914 100644 --- a/packages/main/src/SegmentedButton.ts +++ b/packages/main/src/SegmentedButton.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/SegmentedButtonItem.ts b/packages/main/src/SegmentedButtonItem.ts index 0002b42fefbe..5edaa8bd23df 100644 --- a/packages/main/src/SegmentedButtonItem.ts +++ b/packages/main/src/SegmentedButtonItem.ts @@ -1,6 +1,7 @@ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import { getEnableDefaultTooltips } from "@ui5/webcomponents-base/dist/config/Tooltips.js"; diff --git a/packages/main/src/Select.ts b/packages/main/src/Select.ts index 726e97718efb..10f819da7737 100644 --- a/packages/main/src/Select.ts +++ b/packages/main/src/Select.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/SplitButton.ts b/packages/main/src/SplitButton.ts index d60bf3165156..1f91f6b6c4a1 100644 --- a/packages/main/src/SplitButton.ts +++ b/packages/main/src/SplitButton.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/main/src/StepInput.ts b/packages/main/src/StepInput.ts index f86c259f4886..391ada07cf01 100644 --- a/packages/main/src/StepInput.ts +++ b/packages/main/src/StepInput.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/Tab.ts b/packages/main/src/Tab.ts index 00ab6692cac3..670d1e3536d2 100644 --- a/packages/main/src/Tab.ts +++ b/packages/main/src/Tab.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index 7f95af458714..91b8cf9a224e 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { AccessibilityAttributes } from "@ui5/webcomponents-base/dist/types.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; @@ -49,7 +50,7 @@ import type List from "./List.js"; import type DropIndicator from "./DropIndicator.js"; import type Tab from "./Tab.js"; import type { TabInStrip, TabInOverflow } from "./Tab.js"; -import type { TabSeparatorInOverflow, TabSeparatorInStrip } from "./TabSeparator.js"; +import type { TabSeparatorInStrip } from "./TabSeparator.js"; import type { ListItemClickEventDetail, ListMoveEventDetail } from "./List.js"; import type ResponsivePopover from "./ResponsivePopover.js"; import TabContainerTabsPlacement from "./types/TabContainerTabsPlacement.js"; diff --git a/packages/main/src/Table.ts b/packages/main/src/Table.ts index 0392e6fcd2b3..0c4dbfde0d60 100644 --- a/packages/main/src/Table.ts +++ b/packages/main/src/Table.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { customElement, slotStrict as slot, property, eventStrict, i18n, } from "@ui5/webcomponents-base/dist/decorators.js"; diff --git a/packages/main/src/TableCellBase.ts b/packages/main/src/TableCellBase.ts index 3d29ef43a0af..6b2e61cab708 100644 --- a/packages/main/src/TableCellBase.ts +++ b/packages/main/src/TableCellBase.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import { customElement, slotStrict as slot, property, i18n, } from "@ui5/webcomponents-base/dist/decorators.js"; diff --git a/packages/main/src/Tag.ts b/packages/main/src/Tag.ts index b1d54ff3f621..9419d1a56d33 100644 --- a/packages/main/src/Tag.ts +++ b/packages/main/src/Tag.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/main/src/Text.ts b/packages/main/src/Text.ts index 089f97742550..dbce0ebbf803 100644 --- a/packages/main/src/Text.ts +++ b/packages/main/src/Text.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/TextArea.ts b/packages/main/src/TextArea.ts index fbe894d68ac3..8ab1343468f4 100644 --- a/packages/main/src/TextArea.ts +++ b/packages/main/src/TextArea.ts @@ -1,4 +1,5 @@ -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; diff --git a/packages/main/src/TimePicker.ts b/packages/main/src/TimePicker.ts index 03e58b1ac2a3..dd4b1f4736ed 100644 --- a/packages/main/src/TimePicker.ts +++ b/packages/main/src/TimePicker.ts @@ -1,5 +1,6 @@ import { isDesktop, isPhone, isTablet } from "@ui5/webcomponents-base/dist/Device.js"; -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/Token.ts b/packages/main/src/Token.ts index d88af06256e7..ef10b9eb1044 100644 --- a/packages/main/src/Token.ts +++ b/packages/main/src/Token.ts @@ -1,5 +1,5 @@ -// eslint-disable-next-line max-classes-per-file -import UI5Element, { type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/Tokenizer.ts b/packages/main/src/Tokenizer.ts index 3b6da5f83341..9b94fdd74cfb 100644 --- a/packages/main/src/Tokenizer.ts +++ b/packages/main/src/Tokenizer.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; diff --git a/packages/main/src/ToolbarSelectOption.ts b/packages/main/src/ToolbarSelectOption.ts index dd8b0ec8cff3..4151c3053033 100644 --- a/packages/main/src/ToolbarSelectOption.ts +++ b/packages/main/src/ToolbarSelectOption.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; diff --git a/packages/main/src/Tree.ts b/packages/main/src/Tree.ts index 26329504017a..8d1c64b8fe76 100644 --- a/packages/main/src/Tree.ts +++ b/packages/main/src/Tree.ts @@ -1,4 +1,5 @@ -import UI5Element, { type DefaultSlot, type Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; From 0b5db0171dde2bf89efe274f4ef6228f76d14ab5 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Wed, 28 Jan 2026 10:56:45 +0200 Subject: [PATCH 04/14] chore: enforce strict checks with isInstanceOf{Element} guards --- packages/base/src/UI5Element.ts | 4 ++-- packages/fiori/src/SideNavigation.ts | 20 +++++++++----------- packages/main/src/ColorPalette.ts | 2 +- packages/main/src/Tab.ts | 7 +++++++ packages/main/src/TabContainer.ts | 17 +++++++++++------ 5 files changed, 30 insertions(+), 20 deletions(-) diff --git a/packages/base/src/UI5Element.ts b/packages/base/src/UI5Element.ts index 4ff7d412d5be..ae62d6b804ee 100644 --- a/packages/base/src/UI5Element.ts +++ b/packages/base/src/UI5Element.ts @@ -1075,8 +1075,8 @@ abstract class UI5Element extends HTMLElement { * Useful when there are transitive slots in nested component scenarios and you don't want to get a list of the slots, but rather of their content. * @public */ - getSlottedNodes<T = Node>(slotName: string): Array<T> { - return getSlottedNodesList((this as unknown as Record<string, Array<SlotValue>>)[slotName]) as Array<T>; + getSlottedNodes<T = Node>(slotName: string): Array<T> & { [SlotMarker]: true, [DefaultSlotMarker]: true } { + return getSlottedNodesList((this as unknown as Record<string, Array<SlotValue>>)[slotName]) as Array<T> & { [SlotMarker]: true, [DefaultSlotMarker]: true }; } /** diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index 23be132b546a..e44731b15aa8 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -567,32 +567,30 @@ class SideNavigation extends UI5Element { } _getSelectableItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationSelectableItemBase> { - return items.reduce((result, item) => { - return result.concat((item as SideNavigationItem).selectableItems); + return items.filter(isInstanceOfSideNavigationItem).reduce((result, item) => { + return result.concat(item.selectableItems); }, new Array<SideNavigationSelectableItemBase>()); } _getFocusableItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationItemBase> { - return items.reduce((result, item) => { - return result.concat((item as SideNavigationItem).focusableItems); + return items.filter(isInstanceOfSideNavigationItem).reduce((result, item) => { + return result.concat(item.focusableItems); }, new Array<SideNavigationItemBase>()); } _getAllItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationItemBase> { - return items.reduce((result, item) => { - return result.concat((item as SideNavigationItem).allItems); + return items.filter(isInstanceOfSideNavigationItem).reduce((result, item) => { + return result.concat(item.allItems); }, new Array<SideNavigationItemBase>()); } - _findSelectedItem(items: Array<SideNavigationItemBase>): SideNavigationSelectableItemBase | undefined { + _findSelectedItem(items: Array<SideNavigationItemBase>) : SideNavigationSelectableItemBase | undefined { return this._getSelectableItems(items).find(item => item._selected); } get overflowItems() : Array<HTMLElement> { - const items = this.items as Array<SideNavigationItemBase>; - - return items.reduce((result, item) => { - return result.concat((item as SideNavigationItem).overflowItems); + return this.items.filter(isInstanceOfSideNavigationItem).reduce((result, item) => { + return result.concat(item.overflowItems); }, new Array<HTMLElement>()); } diff --git a/packages/main/src/ColorPalette.ts b/packages/main/src/ColorPalette.ts index 4e944ed728c3..59981534c67a 100644 --- a/packages/main/src/ColorPalette.ts +++ b/packages/main/src/ColorPalette.ts @@ -290,7 +290,7 @@ class ColorPalette extends UI5Element { } get effectiveColorItems() { - let colorItems: Array<IColorPaletteItem> = this.colors; + let colorItems = this.colors; if (this.popupMode) { colorItems = this.getSlottedNodes<ColorPaletteItem>("colors"); diff --git a/packages/main/src/Tab.ts b/packages/main/src/Tab.ts index 670d1e3536d2..7bae11f2504f 100644 --- a/packages/main/src/Tab.ts +++ b/packages/main/src/Tab.ts @@ -517,6 +517,10 @@ class Tab extends UI5Element implements ITabbable, ITab { } } +const isInstanceOfTab = (object: any): object is TabInOverflow => { + return "realTabReference" in object; +}; + Tab.define(); TabContainer.registerTabStyles(stripCss); @@ -524,6 +528,9 @@ TabContainer.registerTabStyles(draggableElementStyles); TabContainer.registerTabStyles(overflowCss); export default Tab; +export { + isInstanceOfTab, +} export type { TabInStrip, TabInOverflow, diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index 91b8cf9a224e..843f8d785ac8 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -49,6 +49,7 @@ import type Button from "./Button.js"; import type List from "./List.js"; import type DropIndicator from "./DropIndicator.js"; import type Tab from "./Tab.js"; +import { isInstanceOfTab } from "./Tab.js"; import type { TabInStrip, TabInOverflow } from "./Tab.js"; import type { TabSeparatorInStrip } from "./TabSeparator.js"; import type { ListItemClickEventDetail, ListMoveEventDetail } from "./List.js"; @@ -634,13 +635,14 @@ class TabContainer extends UI5Element { if (e.detail.originalEvent instanceof KeyboardEvent) { const realTabReference = (source.element as TabInOverflow).realTabReference; const siblings = this._findSiblings(realTabReference); - // let items = siblings; + let items: Array<ITab> = siblings; if (this.items.includes(realTabReference)) { items = siblings.filter(sibling => { - // return ((e.target as List).items as Array<TabInOverflow>).some(el => el.realTabReference === sibling); - return (e.target as List).items.some(el => (el as TabInOverflow).realTabReference === sibling); + return (e.target as List).items + .filter(isInstanceOfTab) + .some(el => el.realTabReference === sibling); }); } @@ -690,8 +692,9 @@ class TabContainer extends UI5Element { if (this.items.includes(realTabReference)) { items = siblings.filter(sibling => { - // return ((e.target as List).items as Array<TabInOverflow>).some(el => el.realTabReference === sibling); - return (e.target as List).items.some(el => (el as TabInOverflow).realTabReference === sibling); + return ((e.target as List).items) + .filter(isInstanceOfTab) + .some(el => el.realTabReference === sibling); }); } @@ -802,7 +805,9 @@ class TabContainer extends UI5Element { } const listItems = (this.responsivePopover!.content[0] as List).items; - return listItems.find(item => (item as TabInOverflow).realTabReference === realTab); + return listItems + .filter(isInstanceOfTab) + .find(item => item.realTabReference === realTab); } _onTabStripKeyDown(e: KeyboardEvent) { From e240c67c27de0eb1c56035531cca51d14df87d9d Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Wed, 28 Jan 2026 11:35:02 +0200 Subject: [PATCH 05/14] chore: replace `Array<>` with `[]` --- docs/4-development/04-slots.md | 14 ++++++------- .../11-deep-dive-and-best-practices.md | 2 +- packages/ai/src/Button.ts | 2 +- packages/ai/src/Input.ts | 2 +- packages/ai/src/PromptInput.ts | 4 ++-- packages/ai/src/TextArea.ts | 2 +- packages/base/src/UI5Element.ts | 4 ++-- packages/base/test/test-elements/Generic.tsx | 10 +++++----- .../base/test/test-elements/GenericExt.tsx | 2 +- packages/base/test/test-elements/Parent.tsx | 4 ++-- packages/compat/src/Table.ts | 4 ++-- packages/compat/src/TableCell.ts | 2 +- packages/compat/src/TableRow.ts | 2 +- packages/fiori/src/BarcodeScannerDialog.ts | 4 ++-- packages/fiori/src/DynamicPage.ts | 4 ++-- packages/fiori/src/DynamicPageTitle.ts | 4 ++-- packages/fiori/src/DynamicSideContent.ts | 2 +- packages/fiori/src/FilterItem.ts | 2 +- packages/fiori/src/FlexibleColumnLayout.ts | 6 +++--- packages/fiori/src/IllustratedMessage.ts | 6 +++--- packages/fiori/src/MediaGallery.ts | 2 +- packages/fiori/src/MediaGalleryItem.ts | 4 ++-- packages/fiori/src/NavigationLayout.ts | 6 +++--- packages/fiori/src/NavigationMenu.ts | 2 +- packages/fiori/src/NotificationList.ts | 2 +- .../fiori/src/NotificationListGroupItem.ts | 2 +- packages/fiori/src/NotificationListItem.ts | 8 ++++---- packages/fiori/src/Page.ts | 6 +++--- packages/fiori/src/ProductSwitch.ts | 2 +- packages/fiori/src/ProductSwitchItem.ts | 2 +- packages/fiori/src/Search.ts | 8 ++++---- packages/fiori/src/SearchField.ts | 4 ++-- packages/fiori/src/SearchItem.ts | 4 ++-- packages/fiori/src/ShellBar.ts | 20 +++++++++---------- packages/fiori/src/ShellBarBranding.ts | 4 ++-- packages/fiori/src/SideNavigation.ts | 6 +++--- packages/fiori/src/SideNavigationGroup.ts | 2 +- packages/fiori/src/SideNavigationItem.ts | 2 +- packages/fiori/src/Timeline.ts | 2 +- packages/fiori/src/TimelineGroupItem.ts | 2 +- packages/fiori/src/TimelineItem.ts | 2 +- packages/fiori/src/UploadCollection.ts | 4 ++-- packages/fiori/src/UploadCollectionItem.ts | 2 +- packages/fiori/src/UserMenu.ts | 4 ++-- packages/fiori/src/UserMenuItem.ts | 2 +- packages/fiori/src/UserSettingsAccountView.ts | 2 +- .../fiori/src/UserSettingsAppearanceView.ts | 4 ++-- .../src/UserSettingsAppearanceViewGroup.ts | 2 +- packages/fiori/src/UserSettingsDialog.ts | 4 ++-- packages/fiori/src/UserSettingsItem.ts | 4 ++-- packages/fiori/src/UserSettingsView.ts | 2 +- packages/fiori/src/ViewSettingsDialog.ts | 6 +++--- packages/fiori/src/Wizard.ts | 2 +- packages/main/src/Avatar.ts | 4 ++-- packages/main/src/AvatarGroup.ts | 4 ++-- packages/main/src/Bar.ts | 6 +++--- packages/main/src/Breadcrumbs.ts | 2 +- packages/main/src/BreadcrumbsItem.ts | 2 +- packages/main/src/Button.ts | 4 ++-- packages/main/src/Calendar.ts | 8 ++++---- packages/main/src/CalendarLegend.ts | 2 +- packages/main/src/Card.ts | 4 ++-- packages/main/src/CardHeader.ts | 4 ++-- packages/main/src/Carousel.ts | 2 +- packages/main/src/ColorPalette.ts | 4 ++-- packages/main/src/ColorPalettePopover.ts | 2 +- packages/main/src/ComboBox.ts | 6 +++--- packages/main/src/ComboBoxItemGroup.ts | 2 +- packages/main/src/DatePicker.ts | 2 +- packages/main/src/Dialog.ts | 4 ++-- packages/main/src/FileUploader.ts | 4 ++-- packages/main/src/Form.ts | 4 ++-- packages/main/src/FormGroup.ts | 2 +- packages/main/src/FormItem.ts | 4 ++-- packages/main/src/Input.ts | 6 +++--- packages/main/src/List.ts | 4 ++-- packages/main/src/ListItem.ts | 2 +- packages/main/src/ListItemGroup.ts | 4 ++-- packages/main/src/ListItemGroupHeader.ts | 2 +- packages/main/src/ListItemStandard.ts | 4 ++-- packages/main/src/Menu.ts | 2 +- packages/main/src/MenuItem.ts | 4 ++-- packages/main/src/MenuItemGroup.ts | 2 +- packages/main/src/MessageStrip.ts | 2 +- packages/main/src/MultiComboBox.ts | 6 +++--- packages/main/src/MultiComboBoxItemGroup.ts | 2 +- packages/main/src/MultiInput.ts | 2 +- packages/main/src/Option.ts | 2 +- packages/main/src/OptionCustom.ts | 2 +- packages/main/src/Panel.ts | 2 +- packages/main/src/Popover.ts | 4 ++-- packages/main/src/Popup.ts | 2 +- packages/main/src/SegmentedButton.ts | 2 +- packages/main/src/SegmentedButtonItem.ts | 2 +- packages/main/src/Select.ts | 6 +++--- packages/main/src/SplitButton.ts | 2 +- packages/main/src/StepInput.ts | 2 +- packages/main/src/SuggestionItemCustom.ts | 2 +- packages/main/src/SuggestionItemGroup.ts | 2 +- packages/main/src/SuggestionListItem.ts | 4 ++-- packages/main/src/Tab.ts | 4 ++-- packages/main/src/TabContainer.ts | 6 +++--- packages/main/src/Table.ts | 8 ++++---- packages/main/src/TableCellBase.ts | 2 +- packages/main/src/TableHeaderCell.ts | 2 +- packages/main/src/TableHeaderRow.ts | 2 +- packages/main/src/TableRow.ts | 4 ++-- packages/main/src/Tag.ts | 4 ++-- packages/main/src/Text.ts | 2 +- packages/main/src/TextArea.ts | 2 +- packages/main/src/TimePicker.ts | 2 +- packages/main/src/Token.ts | 2 +- packages/main/src/Tokenizer.ts | 2 +- packages/main/src/Toolbar.ts | 2 +- packages/main/src/ToolbarSelect.ts | 4 ++-- packages/main/src/ToolbarSelectOption.ts | 2 +- packages/main/src/Tree.ts | 4 ++-- packages/main/src/TreeItemBase.ts | 4 ++-- packages/main/src/TreeItemCustom.ts | 2 +- 119 files changed, 212 insertions(+), 212 deletions(-) diff --git a/docs/4-development/04-slots.md b/docs/4-development/04-slots.md index bf2ac822baef..3ec7e62f4335 100644 --- a/docs/4-development/04-slots.md +++ b/docs/4-development/04-slots.md @@ -52,7 +52,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot() - mySlot!: Slot<Array<HTMLElement>>; + mySlot!: Slot<HTMLElement[]>; } ``` @@ -69,7 +69,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement }) - mySlot!: Slot<Array<HTMLElement>>;; + mySlot!: Slot<HTMLElement[]>;; } ``` @@ -96,7 +96,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, "default": true }) - mySlot!: Slot<Array<HTMLElement>>;; + mySlot!: Slot<HTMLElement[]>;; } ``` @@ -112,7 +112,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, individualSlots: true }) - mySlot!: Slot<Array<HTMLElement>>;; + mySlot!: Slot<HTMLElement[]>;; } ``` @@ -144,12 +144,12 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, invalidateOnChildChange: true }) - mySlot!: Slot<Array<HTMLElement>>;; + mySlot!: Slot<HTMLElement[]>;; @slot({ type: HTMLElement, invalidateOnChildChange: { properties: true, slots: false }}) - mySlot2!: Slot<Array<HTMLElement>>;; + mySlot2!: Slot<HTMLElement[]>;; @slot({ type: HTMLElement, invalidateOnChildChange: { properties: ["myProp"], slots: ["anotherSlot"] }}) - mySlot3!: Slot<Array<HTMLElement>>;; + mySlot3!: Slot<HTMLElement[]>;; } ``` \ No newline at end of file diff --git a/docs/4-development/11-deep-dive-and-best-practices.md b/docs/4-development/11-deep-dive-and-best-practices.md index aa246dfaf93c..065e60bf132d 100644 --- a/docs/4-development/11-deep-dive-and-best-practices.md +++ b/docs/4-development/11-deep-dive-and-best-practices.md @@ -442,7 +442,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @slot() - items!: Slot<Array<HTMLElement>>;; + items!: Slot<HTMLElement[]>;; } ``` diff --git a/packages/ai/src/Button.ts b/packages/ai/src/Button.ts index 28df60aa97a2..64dbdb524843 100644 --- a/packages/ai/src/Button.ts +++ b/packages/ai/src/Button.ts @@ -184,7 +184,7 @@ class Button extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - states!: DefaultSlot<Array<ButtonState>>; + states!: DefaultSlot<ButtonState[]>; @query("[ui5-split-button]") _splitButton?: SplitButton; diff --git a/packages/ai/src/Input.ts b/packages/ai/src/Input.ts index ce1eb65deaf7..633ab0da3268 100644 --- a/packages/ai/src/Input.ts +++ b/packages/ai/src/Input.ts @@ -165,7 +165,7 @@ class Input extends BaseInput { type: HTMLElement, invalidateOnChildChange: true, }) - actions!: Slot<Array<HTMLElement>>; + actions!: Slot<HTMLElement[]>; _previousCurrentStep = 0; _previousTotalSteps = 0; diff --git a/packages/ai/src/PromptInput.ts b/packages/ai/src/PromptInput.ts index 36537e3983e3..6f02f2be6620 100644 --- a/packages/ai/src/PromptInput.ts +++ b/packages/ai/src/PromptInput.ts @@ -203,7 +203,7 @@ class PromptInput extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - suggestionItems!: DefaultSlot<Array<IInputSuggestionItem>>; + suggestionItems!: DefaultSlot<IInputSuggestionItem[]>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -221,7 +221,7 @@ class PromptInput extends UI5Element { type: HTMLElement, invalidateOnChildChange: true, }) - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents-ai") static i18nBundle: I18nBundle; diff --git a/packages/ai/src/TextArea.ts b/packages/ai/src/TextArea.ts index c75a3b2743b9..786868525a01 100644 --- a/packages/ai/src/TextArea.ts +++ b/packages/ai/src/TextArea.ts @@ -132,7 +132,7 @@ class TextArea extends BaseTextArea { focused = false; @slot({ type: HTMLElement }) - menu!: Slot<Array<HTMLElement>>; + menu!: Slot<HTMLElement[]>; static i18nBundle: I18nBundle; diff --git a/packages/base/src/UI5Element.ts b/packages/base/src/UI5Element.ts index ae62d6b804ee..4ff7d412d5be 100644 --- a/packages/base/src/UI5Element.ts +++ b/packages/base/src/UI5Element.ts @@ -1075,8 +1075,8 @@ abstract class UI5Element extends HTMLElement { * Useful when there are transitive slots in nested component scenarios and you don't want to get a list of the slots, but rather of their content. * @public */ - getSlottedNodes<T = Node>(slotName: string): Array<T> & { [SlotMarker]: true, [DefaultSlotMarker]: true } { - return getSlottedNodesList((this as unknown as Record<string, Array<SlotValue>>)[slotName]) as Array<T> & { [SlotMarker]: true, [DefaultSlotMarker]: true }; + getSlottedNodes<T = Node>(slotName: string): Array<T> { + return getSlottedNodesList((this as unknown as Record<string, Array<SlotValue>>)[slotName]) as Array<T>; } /** diff --git a/packages/base/test/test-elements/Generic.tsx b/packages/base/test/test-elements/Generic.tsx index a93db9e3be88..a957c05d2acf 100644 --- a/packages/base/test/test-elements/Generic.tsx +++ b/packages/base/test/test-elements/Generic.tsx @@ -28,19 +28,19 @@ class Generic extends UI5Element { defaultValueProp = "Hello"; @slot({ type: Node, "default": true }) - content!: DefaultSlot<Array<Node>>; + content!: DefaultSlot<Node[]>; @slot({ type: HTMLElement }) - other!: Slot<Array<HTMLElement>> + other!: Slot<HTMLElement[]> @slot({ type: HTMLElement, individualSlots: true }) - individual!: Slot<Array<HTMLElement>> + individual!: Slot<HTMLElement[]> @slot({ type: HTMLElement, propertyName: "items" }) - named!: Slot<Array<HTMLElement>> + named!: Slot<HTMLElement[]> @slot({ type: HTMLElement }) - "row-header"!: Slot<Array<HTMLElement>> + "row-header"!: Slot<HTMLElement[]> static get template() { return () => <div> diff --git a/packages/base/test/test-elements/GenericExt.tsx b/packages/base/test/test-elements/GenericExt.tsx index 84c95cdaa0b9..e56d3fda86a2 100644 --- a/packages/base/test/test-elements/GenericExt.tsx +++ b/packages/base/test/test-elements/GenericExt.tsx @@ -13,7 +13,7 @@ class GenericExt extends Generic { strProp = "Ext"; @slot() - extSlot!: Slot<Array<HTMLElement>>; + extSlot!: Slot<HTMLElement[]>; } GenericExt.define(); diff --git a/packages/base/test/test-elements/Parent.tsx b/packages/base/test/test-elements/Parent.tsx index 2a9797aa3f75..3cfdc8fd535d 100644 --- a/packages/base/test/test-elements/Parent.tsx +++ b/packages/base/test/test-elements/Parent.tsx @@ -16,7 +16,7 @@ class Parent extends UI5Element { slots: false, }, }) - content!: Slot<Array<Node>>; + content!: Slot<Node[]>; @slot({ type: HTMLElement, @@ -25,7 +25,7 @@ class Parent extends UI5Element { slots: false, }, }) - items!: Slot<Array<HTMLElement>>; + items!: Slot<HTMLElement[]>; static get template() { return () => <div> diff --git a/packages/compat/src/Table.ts b/packages/compat/src/Table.ts index 02c5b65d02be..03b1232bd8a8 100644 --- a/packages/compat/src/Table.ts +++ b/packages/compat/src/Table.ts @@ -400,7 +400,7 @@ class Table extends UI5Element { individualSlots: true, invalidateOnChildChange: true, }) - rows!: DefaultSlot<Array<ITableRow>>; + rows!: DefaultSlot<ITableRow[]>; /** * Defines the configuration for the columns of the component. @@ -416,7 +416,7 @@ class Table extends UI5Element { slots: false, }, }) - columns!: Slot<Array<TableColumn>>; + columns!: Slot<TableColumn[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/compat/src/TableCell.ts b/packages/compat/src/TableCell.ts index 3f0056d4af89..d70d0a440050 100644 --- a/packages/compat/src/TableCell.ts +++ b/packages/compat/src/TableCell.ts @@ -59,7 +59,7 @@ class TableCell extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/compat/src/TableRow.ts b/packages/compat/src/TableRow.ts index e6319b79d1c5..c8f48f4200d7 100644 --- a/packages/compat/src/TableRow.ts +++ b/packages/compat/src/TableRow.ts @@ -190,7 +190,7 @@ class TableRow extends UI5Element implements ITableRow { * @public */ @slot({ type: HTMLElement, "default": true, individualSlots: true }) - cells!: DefaultSlot<Array<TableCell>>; + cells!: DefaultSlot<TableCell[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/BarcodeScannerDialog.ts b/packages/fiori/src/BarcodeScannerDialog.ts index 4a7b6f7e683c..5113d2865338 100644 --- a/packages/fiori/src/BarcodeScannerDialog.ts +++ b/packages/fiori/src/BarcodeScannerDialog.ts @@ -124,7 +124,7 @@ class BarcodeScannerDialog extends UI5Element { * @since 2.4.0 */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; /** * Defines the footer HTML Element. @@ -140,7 +140,7 @@ class BarcodeScannerDialog extends UI5Element { * @since 2.4.0 */ @slot() - footer!: Slot<Array<HTMLElement>>; + footer!: Slot<HTMLElement[]>; /** * Indicates whether the dialog is open. diff --git a/packages/fiori/src/DynamicPage.ts b/packages/fiori/src/DynamicPage.ts index d08626ce8b14..117bf594000a 100644 --- a/packages/fiori/src/DynamicPage.ts +++ b/packages/fiori/src/DynamicPage.ts @@ -166,7 +166,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ type: DynamicPageTitle }) - titleArea!: Slot<Array<DynamicPageTitle>>; + titleArea!: Slot<DynamicPageTitle[]>; /** * Defines the header HTML Element. @@ -174,7 +174,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ type: DynamicPageHeader }) - headerArea!: Slot<Array<DynamicPageHeader>>; + headerArea!: Slot<DynamicPageHeader[]>; /** * Defines the footer HTML Element. diff --git a/packages/fiori/src/DynamicPageTitle.ts b/packages/fiori/src/DynamicPageTitle.ts index af61e645acc8..9f2a51f877d9 100644 --- a/packages/fiori/src/DynamicPageTitle.ts +++ b/packages/fiori/src/DynamicPageTitle.ts @@ -160,7 +160,7 @@ class DynamicPageTitle extends UI5Element { * @since 2.3.0 */ @slot({ type: HTMLElement }) - snappedTitleOnMobile!: Slot<Array<Title>>; + snappedTitleOnMobile!: Slot<Title[]>; /** * Defines the bar with actions in the Dynamic page title. @@ -176,7 +176,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - navigationBar!: Slot<Array<Toolbar>>; + navigationBar!: Slot<Toolbar[]>; /** * Defines the content of the Dynamic page title. diff --git a/packages/fiori/src/DynamicSideContent.ts b/packages/fiori/src/DynamicSideContent.ts index f2d57ee9e57d..70592df9adc0 100644 --- a/packages/fiori/src/DynamicSideContent.ts +++ b/packages/fiori/src/DynamicSideContent.ts @@ -234,7 +234,7 @@ class DynamicSideContent extends UI5Element { * @public */ @slot() - sideContent!: Slot<Array<HTMLElement>>; + sideContent!: Slot<HTMLElement[]>; @query(".ui5-dsc-main") _mainContent!: HTMLElement; diff --git a/packages/fiori/src/FilterItem.ts b/packages/fiori/src/FilterItem.ts index 99a2467993fe..72b69dfea5a8 100644 --- a/packages/fiori/src/FilterItem.ts +++ b/packages/fiori/src/FilterItem.ts @@ -50,7 +50,7 @@ class FilterItem extends UI5Element { * @public */ @slot() - values!: Slot<Array<FilterItemOption>>; + values!: Slot<FilterItemOption[]>; } FilterItem.define(); diff --git a/packages/fiori/src/FlexibleColumnLayout.ts b/packages/fiori/src/FlexibleColumnLayout.ts index c5a921907827..811888ff7f94 100644 --- a/packages/fiori/src/FlexibleColumnLayout.ts +++ b/packages/fiori/src/FlexibleColumnLayout.ts @@ -348,21 +348,21 @@ class FlexibleColumnLayout extends UI5Element { * @public */ @slot() - startColumn!: Slot<Array<HTMLElement>>; + startColumn!: Slot<HTMLElement[]>; /** * Defines the content in the middle column. * @public */ @slot() - midColumn!: Slot<Array<HTMLElement>>; + midColumn!: Slot<HTMLElement[]>; /** * Defines the content in the end column. * @public */ @slot() - endColumn!: Slot<Array<HTMLElement>>; + endColumn!: Slot<HTMLElement[]>; initialRendering: boolean; _handleResize: () => void; diff --git a/packages/fiori/src/IllustratedMessage.ts b/packages/fiori/src/IllustratedMessage.ts index 1a590b9721c0..4d7e7606a40c 100644 --- a/packages/fiori/src/IllustratedMessage.ts +++ b/packages/fiori/src/IllustratedMessage.ts @@ -249,7 +249,7 @@ class IllustratedMessage extends UI5Element { * @since 1.7.0 */ @slot({ type: HTMLElement }) - title!: Slot<Array<HTMLElement>> & Slot<string> ; + title!: Slot<HTMLElement[]> & string; /** * Defines the subtitle of the component. @@ -259,7 +259,7 @@ class IllustratedMessage extends UI5Element { * @since 1.0.0-rc.16 */ @slot({ type: HTMLElement }) - subtitle!: Slot<Array<HTMLElement>>; + subtitle!: Slot<HTMLElement[]>; /** * Defines the component actions. @@ -268,7 +268,7 @@ class IllustratedMessage extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - actions!: DefaultSlot<Array<IButton>>; + actions!: DefaultSlot<IButton[]>; illustrationTitle?: string; illustrationSubtitle?: string; diff --git a/packages/fiori/src/MediaGallery.ts b/packages/fiori/src/MediaGallery.ts index 5781b4b8ed2c..5c5a44b4a971 100644 --- a/packages/fiori/src/MediaGallery.ts +++ b/packages/fiori/src/MediaGallery.ts @@ -216,7 +216,7 @@ class MediaGallery extends UI5Element { invalidateOnChildChange: true, "default": true, }) - items!: DefaultSlot<Array<IMediaGalleryItem>>; + items!: DefaultSlot<IMediaGalleryItem[]>; _itemNavigation: ItemNavigation; _onResize: () => void; diff --git a/packages/fiori/src/MediaGalleryItem.ts b/packages/fiori/src/MediaGalleryItem.ts index c0a2f5c734b8..6b4dfc6eb954 100644 --- a/packages/fiori/src/MediaGalleryItem.ts +++ b/packages/fiori/src/MediaGalleryItem.ts @@ -126,14 +126,14 @@ class MediaGalleryItem extends UI5Element implements IMediaGalleryItem { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; /** * Defines the content of the thumbnail. * @public */ @slot() - thumbnail!: Slot<Array<HTMLElement>>; + thumbnail!: Slot<HTMLElement[]>; _monitoredThumbnail: HTMLElement | null; _monitoredContent: HTMLElement | null; diff --git a/packages/fiori/src/NavigationLayout.ts b/packages/fiori/src/NavigationLayout.ts index 7398c42f0860..7f3fb0ca6113 100644 --- a/packages/fiori/src/NavigationLayout.ts +++ b/packages/fiori/src/NavigationLayout.ts @@ -93,21 +93,21 @@ class NavigationLayout extends UI5Element { * @public */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; /** * Defines the side content. * @public */ @slot() - sideContent!: Slot<Array<SideNavigation>>; + sideContent!: Slot<SideNavigation[]>; /** * Defines the content. * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; onBeforeRendering() { this.calcSideCollapsed(); diff --git a/packages/fiori/src/NavigationMenu.ts b/packages/fiori/src/NavigationMenu.ts index 2ae6b389c81c..f1697b8b2b19 100644 --- a/packages/fiori/src/NavigationMenu.ts +++ b/packages/fiori/src/NavigationMenu.ts @@ -55,7 +55,7 @@ class NavigationMenu extends Menu { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - declare items: DefaultSlot<Array<NavigationMenuItem>>; + declare items: DefaultSlot<NavigationMenuItem[]>; @i18n("@ui5/webcomponents-fiori") static i18nBundleFiori: I18nBundle; diff --git a/packages/fiori/src/NotificationList.ts b/packages/fiori/src/NotificationList.ts index 96eb5b80eabf..b21d97ba2eab 100644 --- a/packages/fiori/src/NotificationList.ts +++ b/packages/fiori/src/NotificationList.ts @@ -117,7 +117,7 @@ class NotificationList extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: DefaultSlot<Array<NotificationListItemBase>>; + items!: DefaultSlot<NotificationListItemBase[]>; /** * Defines the text that is displayed when the component contains no items. diff --git a/packages/fiori/src/NotificationListGroupItem.ts b/packages/fiori/src/NotificationListGroupItem.ts index 9af0d417b474..692344a92674 100644 --- a/packages/fiori/src/NotificationListGroupItem.ts +++ b/packages/fiori/src/NotificationListGroupItem.ts @@ -125,7 +125,7 @@ class NotificationListGroupItem extends NotificationListItemBase { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: DefaultSlot<Array<NotificationListItem>> + items!: DefaultSlot<NotificationListItem[]> onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/fiori/src/NotificationListItem.ts b/packages/fiori/src/NotificationListItem.ts index 4713d403858b..e2ded30c9b76 100644 --- a/packages/fiori/src/NotificationListItem.ts +++ b/packages/fiori/src/NotificationListItem.ts @@ -226,7 +226,7 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot() - avatar!: Slot<Array<HTMLElement>>; + avatar!: Slot<HTMLElement[]>; /** * Defines the menu, displayed in the `ui5-li-notification`. @@ -237,14 +237,14 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot() - menu!: Slot<Array<HTMLElement>>; + menu!: Slot<HTMLElement[]>; /** * Defines the elements, displayed in the footer of the of the component. * @public */ @slot({ type: HTMLElement, individualSlots: true }) - footnotes!: Slot<Array<HTMLElement>>; + footnotes!: Slot<HTMLElement[]>; /** * Defines the content of the `ui5-li-notification`, @@ -254,7 +254,7 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot({ type: Node, "default": true }) - description!: DefaultSlot<Array<Node>>; + description!: DefaultSlot<Node[]>; @query(".ui5-nli-title-text") titleTextDOM?: HTMLElement; diff --git a/packages/fiori/src/Page.ts b/packages/fiori/src/Page.ts index 4bda0dda4cde..3ed8415fd140 100644 --- a/packages/fiori/src/Page.ts +++ b/packages/fiori/src/Page.ts @@ -96,21 +96,21 @@ class Page extends UI5Element { * @public */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; /** * Defines the content HTML Element. * @public */ @slot({ type: Node, "default": true }) - content!: DefaultSlot<Array<Node>>; + content!: DefaultSlot<Node[]>; /** * Defines the footer HTML Element. * @public */ @slot() - footer!: Slot<Array<HTMLElement>>; + footer!: Slot<HTMLElement[]>; constructor() { super(); diff --git a/packages/fiori/src/ProductSwitch.ts b/packages/fiori/src/ProductSwitch.ts index 5a96be976c81..eb9d0fa39fdc 100644 --- a/packages/fiori/src/ProductSwitch.ts +++ b/packages/fiori/src/ProductSwitch.ts @@ -82,7 +82,7 @@ class ProductSwitch extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true, invalidateOnChildChange: true }) - items!: DefaultSlot<Array<IProductSwitchItem>> + items!: DefaultSlot<IProductSwitchItem[]> _itemNavigation: ItemNavigation; _currentIndex: number; diff --git a/packages/fiori/src/ProductSwitchItem.ts b/packages/fiori/src/ProductSwitchItem.ts index 27e223d1f169..7bbfb5cb6762 100644 --- a/packages/fiori/src/ProductSwitchItem.ts +++ b/packages/fiori/src/ProductSwitchItem.ts @@ -145,7 +145,7 @@ class ProductSwitchItem extends UI5Element implements IProductSwitchItem { * @since 2.14.0 */ @slot({ type: HTMLElement }) - image!: Slot<Array<HTMLElement>>; + image!: Slot<HTMLElement[]>; _deactivate: () => void; diff --git a/packages/fiori/src/Search.ts b/packages/fiori/src/Search.ts index 44da945688b0..9dd05354271e 100755 --- a/packages/fiori/src/Search.ts +++ b/packages/fiori/src/Search.ts @@ -133,7 +133,7 @@ class Search extends SearchField { "default": true, invalidateOnChildChange: true, }) - items!: DefaultSlot<Array<SearchItem | SearchItemGroup>>; + items!: DefaultSlot<(SearchItem | SearchItemGroup)[]>; /** * Defines the popup footer action button. @@ -141,7 +141,7 @@ class Search extends SearchField { * @public */ @slot() - action!: Slot<Array<Button>>; + action!: Slot<Button[]>; /** * Defines the illustrated message to be shown in the popup. @@ -149,7 +149,7 @@ class Search extends SearchField { * @public */ @slot() - illustration!: Slot<Array<IllustratedMessage>>; + illustration!: Slot<IllustratedMessage[]>; /** * Defines the illustrated message to be shown in the popup. @@ -157,7 +157,7 @@ class Search extends SearchField { * @public */ @slot() - messageArea!: Slot<Array<SearchMessageArea>>; + messageArea!: Slot<SearchMessageArea[]>; /** * Indicates whether the items picker is open. diff --git a/packages/fiori/src/SearchField.ts b/packages/fiori/src/SearchField.ts index 8839d9965117..7360ed9ea94f 100644 --- a/packages/fiori/src/SearchField.ts +++ b/packages/fiori/src/SearchField.ts @@ -182,7 +182,7 @@ class SearchField extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true, invalidateOnChildChange: true }) - scopes!: Slot<Array<ISearchScope>>; + scopes!: Slot<ISearchScope[]>; /** * Defines the filter button slot, used to display an additional filtering button. @@ -193,7 +193,7 @@ class SearchField extends UI5Element { * @since 2.11.0 */ @slot() - filterButton!: Slot<Array<Button>>; + filterButton!: Slot<Button[]>; /** * @private diff --git a/packages/fiori/src/SearchItem.ts b/packages/fiori/src/SearchItem.ts index f51ee7da9302..fcb28157fd07 100644 --- a/packages/fiori/src/SearchItem.ts +++ b/packages/fiori/src/SearchItem.ts @@ -126,7 +126,7 @@ class SearchItem extends ListItemBase { * @since 2.12.0 */ @slot() - image!: Slot<Array<HTMLElement>>; + image!: Slot<HTMLElement[]>; /** * Defines the actionable elements. @@ -140,7 +140,7 @@ class SearchItem extends ListItemBase { * @since 2.16.0 */ @slot() - actions!: Slot<Array<HTMLElement>>; + actions!: Slot<HTMLElement[]>; _markupText = ""; diff --git a/packages/fiori/src/ShellBar.ts b/packages/fiori/src/ShellBar.ts index bf31dc22ef7d..fe254f5edf33 100644 --- a/packages/fiori/src/ShellBar.ts +++ b/packages/fiori/src/ShellBar.ts @@ -483,7 +483,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - assistant!: Slot<Array<IButton>>; + assistant!: Slot<IButton[]>; /** * Defines the branding slot. @@ -496,7 +496,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - branding!: Slot<Array<ShellBarBranding>>; + branding!: Slot<ShellBarBranding[]>; /** * Defines the `ui5-shellbar` additional items. @@ -506,7 +506,7 @@ class ShellBar extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true, invalidateOnChildChange: true }) - items!: DefaultSlot<Array<ShellBarItem>>; + items!: DefaultSlot<ShellBarItem[]>; /** * You can pass `ui5-avatar` to set the profile image/icon. @@ -518,7 +518,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - profile!: Slot<Array<HTMLElement>>; + profile!: Slot<HTMLElement[]>; /** * Defines the logo of the `ui5-shellbar`. @@ -527,7 +527,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - logo!: Slot<Array<HTMLElement>>; + logo!: Slot<HTMLElement[]>; /** * Defines the items displayed in menu after a click on a start button. @@ -537,7 +537,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - menuItems!: Slot<Array<ListItemBase>>; + menuItems!: Slot<ListItemBase[]>; /** * Defines the `ui5-input`, that will be used as a search field. @@ -547,7 +547,7 @@ class ShellBar extends UI5Element { type: HTMLElement, invalidateOnChildChange: true, }) - searchField!: Slot<Array<IShellBarSearchField>>; + searchField!: Slot<IShellBarSearchField[]>; /** * Defines a `ui5-button` in the bar that will be placed in the beginning. @@ -556,7 +556,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - startButton!: Slot<Array<IButton>>; + startButton!: Slot<IButton[]>; /** * The container is positioned in the center of the `ui5-shellbar` and occupies one-third of the total length of the `ui5-shellbar`. @@ -565,7 +565,7 @@ class ShellBar extends UI5Element { * @private */ @slot() - midContent!: Slot<Array<HTMLElement>>; + midContent!: Slot<HTMLElement[]>; /** * Define the items displayed in the content area. @@ -579,7 +579,7 @@ class ShellBar extends UI5Element { * @since 2.7.0 */ @slot({ type: HTMLElement, individualSlots: true }) - content!: Slot<Array<HTMLElement>>; + content!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/ShellBarBranding.ts b/packages/fiori/src/ShellBarBranding.ts index ceea9e22838f..290d3cfc63ab 100644 --- a/packages/fiori/src/ShellBarBranding.ts +++ b/packages/fiori/src/ShellBarBranding.ts @@ -103,7 +103,7 @@ class ShellBarBranding extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; /** * Defines the logo of the `ui5-shellbar`. @@ -111,7 +111,7 @@ class ShellBarBranding extends UI5Element { * @public */ @slot({ type: HTMLElement }) - logo!: Slot<Array<HTMLElement>>; + logo!: Slot<HTMLElement[]>; get parsedRef() { return (this.href && this.href.length > 0) ? this.href : undefined; diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index e44731b15aa8..741ea8ba6f18 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -153,7 +153,7 @@ class SideNavigation extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<Array<SideNavigationItemBase>>; + items!: DefaultSlot<SideNavigationItemBase[]>; /** * Defines the fixed items at the bottom of the component. @@ -163,7 +163,7 @@ class SideNavigation extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - fixedItems!: Slot<Array<SideNavigationItemBase>>; + fixedItems!: Slot<SideNavigationItemBase[]>; /** * Defines the header of the `ui5-side-navigation`. @@ -174,7 +174,7 @@ class SideNavigation extends UI5Element { * @since 1.0.0-rc.11 */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; /** * @private diff --git a/packages/fiori/src/SideNavigationGroup.ts b/packages/fiori/src/SideNavigationGroup.ts index b86f639703cb..68b560af4355 100644 --- a/packages/fiori/src/SideNavigationGroup.ts +++ b/packages/fiori/src/SideNavigationGroup.ts @@ -67,7 +67,7 @@ class SideNavigationGroup extends SideNavigationItemBase { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<Array<SideNavigationItem>>; + items!: DefaultSlot<SideNavigationItem[]>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/SideNavigationItem.ts b/packages/fiori/src/SideNavigationItem.ts index 8c777472e210..586aabe4e9f8 100644 --- a/packages/fiori/src/SideNavigationItem.ts +++ b/packages/fiori/src/SideNavigationItem.ts @@ -78,7 +78,7 @@ class SideNavigationItem extends SideNavigationSelectableItemBase { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<Array<SideNavigationSubItem>>; + items!: DefaultSlot<SideNavigationSubItem[]>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/Timeline.ts b/packages/fiori/src/Timeline.ts index baf9a11435db..61d859deb484 100644 --- a/packages/fiori/src/Timeline.ts +++ b/packages/fiori/src/Timeline.ts @@ -165,7 +165,7 @@ class Timeline extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true, "default": true }) - items!: DefaultSlot<Array<ITimelineItem>>; + items!: DefaultSlot<ITimelineItem[]>; @query(".ui5-timeline-end-marker") timelineEndMarker!: HTMLElement; diff --git a/packages/fiori/src/TimelineGroupItem.ts b/packages/fiori/src/TimelineGroupItem.ts index 59b130eac161..f939c4e6e86d 100644 --- a/packages/fiori/src/TimelineGroupItem.ts +++ b/packages/fiori/src/TimelineGroupItem.ts @@ -69,7 +69,7 @@ class TimelineGroupItem extends UI5Element implements ITimelineItem { * @public */ @slot({ type: HTMLElement, individualSlots: true, "default": true }) - items!: DefaultSlot<Array<ITimelineItem>>; + items!: DefaultSlot<ITimelineItem[]>; /** * Defines the items orientation. diff --git a/packages/fiori/src/TimelineItem.ts b/packages/fiori/src/TimelineItem.ts index 4f001bdd5af4..bc52e2d42b1d 100644 --- a/packages/fiori/src/TimelineItem.ts +++ b/packages/fiori/src/TimelineItem.ts @@ -115,7 +115,7 @@ class TimelineItem extends UI5Element implements ITimelineItem { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Array<Node>>; + content!: DefaultSlot<Node[]>; /** * @private diff --git a/packages/fiori/src/UploadCollection.ts b/packages/fiori/src/UploadCollection.ts index 78b12b42dc93..795078ca7e8f 100644 --- a/packages/fiori/src/UploadCollection.ts +++ b/packages/fiori/src/UploadCollection.ts @@ -170,7 +170,7 @@ class UploadCollection extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: DefaultSlot<Array<UploadCollectionItem>>; + items!: DefaultSlot<UploadCollectionItem[]>; /** * Defines the `ui5-upload-collection` header. @@ -181,7 +181,7 @@ class UploadCollection extends UI5Element { * @public */ @slot({ type: HTMLElement }) - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; _bodyDnDHandler: DnDEventListener; diff --git a/packages/fiori/src/UploadCollectionItem.ts b/packages/fiori/src/UploadCollectionItem.ts index 1eeeff763d96..9275ec3d17b4 100644 --- a/packages/fiori/src/UploadCollectionItem.ts +++ b/packages/fiori/src/UploadCollectionItem.ts @@ -226,7 +226,7 @@ class UploadCollectionItem extends ListItem { * @public */ @slot({ type: HTMLElement }) - thumbnail!: Slot<Array<HTMLElement>>; + thumbnail!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents-fiori") static i18nFioriBundle: I18nBundle; diff --git a/packages/fiori/src/UserMenu.ts b/packages/fiori/src/UserMenu.ts index 53a79a74fab7..77a0fb82ca19 100644 --- a/packages/fiori/src/UserMenu.ts +++ b/packages/fiori/src/UserMenu.ts @@ -206,7 +206,7 @@ class UserMenu extends UI5Element { type: HTMLElement, "default": true, }) - menuItems!: DefaultSlot<Array<UserMenuItem>>; + menuItems!: DefaultSlot<UserMenuItem[]>; /** * Defines the user accounts. @@ -222,7 +222,7 @@ class UserMenu extends UI5Element { slots: false, }, }) - accounts!: Slot<Array<UserMenuAccount>>; + accounts!: Slot<UserMenuAccount[]>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/UserMenuItem.ts b/packages/fiori/src/UserMenuItem.ts index e81228585938..0061867a69cb 100644 --- a/packages/fiori/src/UserMenuItem.ts +++ b/packages/fiori/src/UserMenuItem.ts @@ -43,7 +43,7 @@ class UserMenuItem extends MenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - declare items: DefaultSlot<Array<UserMenuItem>>; + declare items: DefaultSlot<UserMenuItem[]>; get _menuItems() { return this.items.filter(isInstanceOfMenuItem); diff --git a/packages/fiori/src/UserSettingsAccountView.ts b/packages/fiori/src/UserSettingsAccountView.ts index 901dc2308e3c..58b1438d5e44 100644 --- a/packages/fiori/src/UserSettingsAccountView.ts +++ b/packages/fiori/src/UserSettingsAccountView.ts @@ -64,7 +64,7 @@ class UserSettingsAccountView extends UserSettingsView { slots: false, }, }) - account!: Slot<Array<UserMenuAccount>>; + account!: Slot<UserMenuAccount[]>; /** * Defines if the User Menu shows the `Manage Account` option. diff --git a/packages/fiori/src/UserSettingsAppearanceView.ts b/packages/fiori/src/UserSettingsAppearanceView.ts index f13900b31784..6b0e4a251451 100644 --- a/packages/fiori/src/UserSettingsAppearanceView.ts +++ b/packages/fiori/src/UserSettingsAppearanceView.ts @@ -62,7 +62,7 @@ class UserSettingsAppearanceView extends UserSettingsView { "default": true, invalidateOnChildChange: true, }) - items!: DefaultSlot<Array<UserSettingsAppearanceViewGroup | UserSettingsAppearanceViewItem>>; + items!: DefaultSlot<(UserSettingsAppearanceViewGroup | UserSettingsAppearanceViewItem)[]>; /** * Defines additional content displayed below the items list. @@ -72,7 +72,7 @@ class UserSettingsAppearanceView extends UserSettingsView { @slot({ type: HTMLElement, }) - additionalContent!: Slot<Array<HTMLElement>>; + additionalContent!: Slot<HTMLElement[]>; _getAllItems(): Array<UserSettingsAppearanceViewItem> { const allItems: Array<UserSettingsAppearanceViewItem> = []; diff --git a/packages/fiori/src/UserSettingsAppearanceViewGroup.ts b/packages/fiori/src/UserSettingsAppearanceViewGroup.ts index f9732bd4fb9e..e8a1374317f4 100644 --- a/packages/fiori/src/UserSettingsAppearanceViewGroup.ts +++ b/packages/fiori/src/UserSettingsAppearanceViewGroup.ts @@ -34,7 +34,7 @@ class UserSettingsAppearanceViewGroup extends ListItemGroup { invalidateOnChildChange: true, type: HTMLElement, }) - declare items: DefaultSlot<Array<UserSettingsAppearanceViewItem>>; + declare items: DefaultSlot<UserSettingsAppearanceViewItem[]>; } UserSettingsAppearanceViewGroup.define(); diff --git a/packages/fiori/src/UserSettingsDialog.ts b/packages/fiori/src/UserSettingsDialog.ts index 860aeedf5e12..7919935e82af 100644 --- a/packages/fiori/src/UserSettingsDialog.ts +++ b/packages/fiori/src/UserSettingsDialog.ts @@ -133,7 +133,7 @@ class UserSettingsDialog extends UI5Element { slots: true, }, }) - items!: DefaultSlot<Array<UserSettingsItem>>; + items!: DefaultSlot<UserSettingsItem[]>; /** * Defines the fixed user settings items. @@ -148,7 +148,7 @@ class UserSettingsDialog extends UI5Element { slots: true, }, }) - fixedItems!: Slot<Array<UserSettingsItem>>; + fixedItems!: Slot<UserSettingsItem[]>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/UserSettingsItem.ts b/packages/fiori/src/UserSettingsItem.ts index 504dabd0cd1b..1ba4b82cd906 100644 --- a/packages/fiori/src/UserSettingsItem.ts +++ b/packages/fiori/src/UserSettingsItem.ts @@ -168,7 +168,7 @@ class UserSettingsItem extends UI5Element { slots: false, }, }) - pages!: DefaultSlot<Array<UserSettingsView>>; + pages!: DefaultSlot<UserSettingsView[]>; /** * Defines the tab views of the user settings item. @@ -183,7 +183,7 @@ class UserSettingsItem extends UI5Element { slots: false, }, }) - tabs!: Slot<Array<UserSettingsView>>; + tabs!: Slot<UserSettingsView[]>; /** * Indicates whether any of the element siblings have icon. diff --git a/packages/fiori/src/UserSettingsView.ts b/packages/fiori/src/UserSettingsView.ts index df32dde0df1e..c20a60e18133 100644 --- a/packages/fiori/src/UserSettingsView.ts +++ b/packages/fiori/src/UserSettingsView.ts @@ -61,7 +61,7 @@ class UserSettingsView extends UI5Element { type: HTMLElement, "default": true, }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; } UserSettingsView.define(); diff --git a/packages/fiori/src/ViewSettingsDialog.ts b/packages/fiori/src/ViewSettingsDialog.ts index 2c822979bd6d..897a1204b80c 100644 --- a/packages/fiori/src/ViewSettingsDialog.ts +++ b/packages/fiori/src/ViewSettingsDialog.ts @@ -271,7 +271,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - sortItems!: Slot<Array<SortItem>>; + sortItems!: Slot<SortItem[]>; /** * Defines the `filterItems` list. @@ -280,7 +280,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - filterItems!: Slot<Array<FilterItem>>; + filterItems!: Slot<FilterItem[]>; /** * Defines the list of items against which the user could group data. @@ -289,7 +289,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - groupItems!: Slot<Array<GroupItem>>; + groupItems!: Slot<GroupItem[]>; @query("[ui5-list]") _list!: List; diff --git a/packages/fiori/src/Wizard.ts b/packages/fiori/src/Wizard.ts index 22e1f70083b9..958f867dbcad 100644 --- a/packages/fiori/src/Wizard.ts +++ b/packages/fiori/src/Wizard.ts @@ -260,7 +260,7 @@ class Wizard extends UI5Element { "individualSlots": true, invalidateOnChildChange: true, }) - steps!: DefaultSlot<Array<WizardStep>>; + steps!: DefaultSlot<WizardStep[]>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Avatar.ts b/packages/main/src/Avatar.ts index 21ca71c47607..28ba856d6699 100644 --- a/packages/main/src/Avatar.ts +++ b/packages/main/src/Avatar.ts @@ -237,7 +237,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { * @since 1.0.0-rc.15 */ @slot({ type: HTMLElement, "default": true }) - image!: DefaultSlot<Array<HTMLElement>>; + image!: DefaultSlot<HTMLElement[]>; /** * Defines the optional badge that will be used for visual affordance. @@ -249,7 +249,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { * @since 1.7.0 */ @slot() - badge!: Slot<Array<HTMLElement>>; + badge!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/AvatarGroup.ts b/packages/main/src/AvatarGroup.ts index 9bb761c1fa6a..20d67b6621c0 100644 --- a/packages/main/src/AvatarGroup.ts +++ b/packages/main/src/AvatarGroup.ts @@ -238,7 +238,7 @@ class AvatarGroup extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: DefaultSlot<Array<IAvatarGroupItem>>; + items!: DefaultSlot<IAvatarGroupItem[]>; /** * Defines the overflow button of the component. @@ -250,7 +250,7 @@ class AvatarGroup extends UI5Element { * @since 1.0.0-rc.13 */ @slot() - overflowButton!: Slot<Array<IButton>>; + overflowButton!: Slot<IButton[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Bar.ts b/packages/main/src/Bar.ts index 69665306759f..377f75f46cc8 100644 --- a/packages/main/src/Bar.ts +++ b/packages/main/src/Bar.ts @@ -109,21 +109,21 @@ class Bar extends UI5Element { * @public */ @slot() - startContent!: Slot<Array<HTMLElement>>; + startContent!: Slot<HTMLElement[]>; /** * Defines the content in the middle of the bar. * @public */ @slot() - middleContent!: Slot<Array<HTMLElement>> + middleContent!: Slot<HTMLElement[]> /** * Defines the content at the end of the bar. * @public */ @slot() - endContent!: Slot<Array<HTMLElement>> + endContent!: Slot<HTMLElement[]> _handleResizeBound: () => void; diff --git a/packages/main/src/Breadcrumbs.ts b/packages/main/src/Breadcrumbs.ts index caeb10f5fd7b..816c91c78a8e 100644 --- a/packages/main/src/Breadcrumbs.ts +++ b/packages/main/src/Breadcrumbs.ts @@ -148,7 +148,7 @@ class Breadcrumbs extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<Array<BreadcrumbsItem>>; + items!: DefaultSlot<BreadcrumbsItem[]>; _itemNavigation: ItemNavigation _onResizeHandler: ResizeObserverCallback; diff --git a/packages/main/src/BreadcrumbsItem.ts b/packages/main/src/BreadcrumbsItem.ts index 1dd4403331f0..e0051094adce 100644 --- a/packages/main/src/BreadcrumbsItem.ts +++ b/packages/main/src/BreadcrumbsItem.ts @@ -63,7 +63,7 @@ class BreadcrumbsItem extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Array<Node>>; + text!: DefaultSlot<Node[]>; _accessibleNameText?: string; _isCurrentPageItem?: boolean; diff --git a/packages/main/src/Button.ts b/packages/main/src/Button.ts index e55660d9af8c..c1cc65d1a0b3 100644 --- a/packages/main/src/Button.ts +++ b/packages/main/src/Button.ts @@ -382,7 +382,7 @@ class Button extends UI5Element implements IButton { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Array<Node>>; + text!: DefaultSlot<Node[]>; /** * Adds a badge to the button. @@ -390,7 +390,7 @@ class Button extends UI5Element implements IButton { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - badge!: Slot<Array<ButtonBadge>>; + badge!: Slot<ButtonBadge[]>; _deactivate: () => void; _onclickBound: (e: MouseEvent) => void; diff --git a/packages/main/src/Calendar.ts b/packages/main/src/Calendar.ts index 626766baca04..383c71837d16 100644 --- a/packages/main/src/Calendar.ts +++ b/packages/main/src/Calendar.ts @@ -321,7 +321,7 @@ class Calendar extends CalendarPart { * @since 1.23.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - calendarLegend!: Slot<Array<CalendarLegend>>; + calendarLegend!: Slot<CalendarLegend[]>; /** * Defines the selected date or dates (depending on the `selectionMode` property) @@ -330,7 +330,7 @@ class Calendar extends CalendarPart { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - dates!: DefaultSlot<Array<ICalendarSelectedDates>>; + dates!: DefaultSlot<ICalendarSelectedDates[]>; /** * Defines the special dates, visually emphasized in the calendar. @@ -338,7 +338,7 @@ class Calendar extends CalendarPart { * @since 1.23.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - specialDates!: Slot<Array<SpecialCalendarDate>>; + specialDates!: Slot<SpecialCalendarDate[]>; /** * Defines the disabled date ranges that cannot be selected in the calendar. @@ -348,7 +348,7 @@ class Calendar extends CalendarPart { * @since 2.16.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - disabledDates!: Slot<Array<CalendarDateRange>>; + disabledDates!: Slot<CalendarDateRange[]>; /** * Defines the selected item type of the calendar legend item (if such exists). diff --git a/packages/main/src/CalendarLegend.ts b/packages/main/src/CalendarLegend.ts index 85249f992567..938ab807f572 100644 --- a/packages/main/src/CalendarLegend.ts +++ b/packages/main/src/CalendarLegend.ts @@ -104,7 +104,7 @@ class CalendarLegend extends UI5Element { individualSlots: true, "default": true, }) - items!: DefaultSlot<Array<CalendarLegendItem>>; + items!: DefaultSlot<CalendarLegendItem[]>; _itemNavigation!: ItemNavigation; _lastFocusedItemIndex: number | null; diff --git a/packages/main/src/Card.ts b/packages/main/src/Card.ts index daffca08f8e5..ccaee1259e9d 100644 --- a/packages/main/src/Card.ts +++ b/packages/main/src/Card.ts @@ -73,7 +73,7 @@ class Card extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; /** * Defines the header of the component. @@ -83,7 +83,7 @@ class Card extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - header!: Slot<Array<CardHeader>>; + header!: Slot<CardHeader[]>; /** * Defines if a loading indicator would be displayed over the card. diff --git a/packages/main/src/CardHeader.ts b/packages/main/src/CardHeader.ts index f117815a2e6f..e56f5f4fa554 100644 --- a/packages/main/src/CardHeader.ts +++ b/packages/main/src/CardHeader.ts @@ -114,14 +114,14 @@ class CardHeader extends UI5Element { * @public */ @slot() - avatar!: Slot<Array<HTMLElement>>; + avatar!: Slot<HTMLElement[]>; /** * Defines an action, displayed in the right most part of the header. * @public */ @slot() - action!: Slot<Array<HTMLElement>>; + action!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Carousel.ts b/packages/main/src/Carousel.ts index 9eaaef8c5039..df2421261fd7 100644 --- a/packages/main/src/Carousel.ts +++ b/packages/main/src/Carousel.ts @@ -321,7 +321,7 @@ class Carousel extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, individualSlots: true }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ColorPalette.ts b/packages/main/src/ColorPalette.ts index 59981534c67a..07e8cdb11635 100644 --- a/packages/main/src/ColorPalette.ts +++ b/packages/main/src/ColorPalette.ts @@ -184,7 +184,7 @@ class ColorPalette extends UI5Element { invalidateOnChildChange: true, individualSlots: true, }) - colors!: DefaultSlot<Array<IColorPaletteItem>>; + colors!: DefaultSlot<IColorPaletteItem[]>; _itemNavigation: ItemNavigation; _itemNavigationRecentColors: ItemNavigation; @@ -290,7 +290,7 @@ class ColorPalette extends UI5Element { } get effectiveColorItems() { - let colorItems = this.colors; + let colorItems: IColorPaletteItem[] = this.colors; if (this.popupMode) { colorItems = this.getSlottedNodes<ColorPaletteItem>("colors"); diff --git a/packages/main/src/ColorPalettePopover.ts b/packages/main/src/ColorPalettePopover.ts index ec34547fdeed..6e6caa81f8fe 100644 --- a/packages/main/src/ColorPalettePopover.ts +++ b/packages/main/src/ColorPalettePopover.ts @@ -140,7 +140,7 @@ class ColorPalettePopover extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, individualSlots: true }) - colors!: DefaultSlot<Array<IColorPaletteItem>>; + colors!: DefaultSlot<IColorPaletteItem[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts index a9d9a2a6887b..ab37847c6c6f 100644 --- a/packages/main/src/ComboBox.ts +++ b/packages/main/src/ComboBox.ts @@ -425,7 +425,7 @@ class ComboBox extends UI5Element implements IFormInputElement { individualSlots: true, invalidateOnChildChange: true, }) - items!: DefaultSlot<Array<IComboBoxItem>>; + items!: DefaultSlot<IComboBoxItem[]>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -439,7 +439,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; /** * Defines the icon to be displayed in the input field. @@ -447,7 +447,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * @since 1.0.0-rc.9 */ @slot() - icon!: Slot<Array<IIcon>>; + icon!: Slot<IIcon[]>; _initialRendering = true; _itemFocused = false; diff --git a/packages/main/src/ComboBoxItemGroup.ts b/packages/main/src/ComboBoxItemGroup.ts index 4390df472334..77a669e6892e 100644 --- a/packages/main/src/ComboBoxItemGroup.ts +++ b/packages/main/src/ComboBoxItemGroup.ts @@ -33,7 +33,7 @@ class ComboBoxItemGroup extends ListItemGroup implements IComboBoxItem { individualSlots: true, type: HTMLElement, }) - items!: DefaultSlot<Array<ComboBoxItem>>; + items!: DefaultSlot<ComboBoxItem[]>; get isGroupItem(): boolean { return true; diff --git a/packages/main/src/DatePicker.ts b/packages/main/src/DatePicker.ts index 83daf4e6e4bf..9bc082bf4369 100644 --- a/packages/main/src/DatePicker.ts +++ b/packages/main/src/DatePicker.ts @@ -388,7 +388,7 @@ class DatePicker extends DateComponentBase implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; responsivePopover?: ResponsivePopover; diff --git a/packages/main/src/Dialog.ts b/packages/main/src/Dialog.ts index 840d8d59d0d0..d794190d876e 100644 --- a/packages/main/src/Dialog.ts +++ b/packages/main/src/Dialog.ts @@ -209,7 +209,7 @@ class Dialog extends Popup { * @public */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; /** * Defines the footer HTML Element. @@ -218,7 +218,7 @@ class Dialog extends Popup { * @public */ @slot() - footer!: Slot<Array<HTMLElement>>; + footer!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/FileUploader.ts b/packages/main/src/FileUploader.ts index e5dc335c2de7..d6abe4dcca8a 100644 --- a/packages/main/src/FileUploader.ts +++ b/packages/main/src/FileUploader.ts @@ -272,7 +272,7 @@ class FileUploader extends UI5Element implements IFormInputElement { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -285,7 +285,7 @@ class FileUploader extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; @query(".ui5-file-uploader-form") _form!: HTMLFormElement; diff --git a/packages/main/src/Form.ts b/packages/main/src/Form.ts index cafddf9b6e40..24fb98a243c5 100644 --- a/packages/main/src/Form.ts +++ b/packages/main/src/Form.ts @@ -346,7 +346,7 @@ class Form extends UI5Element { * @public */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; /** * Defines the component content - FormGroups or FormItems. @@ -361,7 +361,7 @@ class Form extends UI5Element { individualSlots: true, invalidateOnChildChange: true, }) - items!: DefaultSlot<Array<IFormItem>>; + items!: DefaultSlot<IFormItem[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/FormGroup.ts b/packages/main/src/FormGroup.ts index f72a6a16a382..ff5f5fbc9c13 100644 --- a/packages/main/src/FormGroup.ts +++ b/packages/main/src/FormGroup.ts @@ -100,7 +100,7 @@ class FormGroup extends UI5Element implements IFormItem { type: HTMLElement, "default": true, }) - items!: DefaultSlot<Array<FormItem>>; + items!: DefaultSlot<FormItem[]>; /** * @private diff --git a/packages/main/src/FormItem.ts b/packages/main/src/FormItem.ts index c89a4f718967..1e450f61f3c2 100644 --- a/packages/main/src/FormItem.ts +++ b/packages/main/src/FormItem.ts @@ -67,7 +67,7 @@ class FormItem extends UI5Element implements IFormItem { * @public */ @slot() - labelContent!: Slot<Array<HTMLElement>>; + labelContent!: Slot<HTMLElement[]>; /** * Defines the content of the component, @@ -79,7 +79,7 @@ class FormItem extends UI5Element implements IFormItem { "default": true, individualSlots: true, }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; /** * @private diff --git a/packages/main/src/Input.ts b/packages/main/src/Input.ts index 8c7720cccaff..ed85ee9284e5 100644 --- a/packages/main/src/Input.ts +++ b/packages/main/src/Input.ts @@ -587,14 +587,14 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * @public */ @slot({ type: HTMLElement, "default": true }) - suggestionItems!: DefaultSlot<Array<IInputSuggestionItem>>; + suggestionItems!: DefaultSlot<IInputSuggestionItem[]>; /** * Defines the icon to be displayed in the component. * @public */ @slot() - icon!: Slot<Array<IIcon>>; + icon!: Slot<IIcon[]>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -614,7 +614,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement type: HTMLElement, invalidateOnChildChange: true, }) - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; hasSuggestionItemSelected: boolean; valueBeforeItemSelection: string; diff --git a/packages/main/src/List.ts b/packages/main/src/List.ts index 21596764586f..0602f6dbd8d5 100644 --- a/packages/main/src/List.ts +++ b/packages/main/src/List.ts @@ -523,7 +523,7 @@ class List extends UI5Element { "default": true, invalidateOnChildChange: true, }) - items!: DefaultSlot<Array<ListItemBase | ListItemGroup>>; + items!: DefaultSlot<(ListItemBase | ListItemGroup)[]>; /** * Defines the component header. @@ -533,7 +533,7 @@ class List extends UI5Element { * @public */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ListItem.ts b/packages/main/src/ListItem.ts index a4667b3fdc92..84cf9c2348a6 100644 --- a/packages/main/src/ListItem.ts +++ b/packages/main/src/ListItem.ts @@ -211,7 +211,7 @@ abstract class ListItem extends ListItemBase { * @public */ @slot() - deleteButton!: Slot<Array<IButton>>; + deleteButton!: Slot<IButton[]>; deactivateByKey: (e: KeyboardEvent) => void; deactivate: () => void; diff --git a/packages/main/src/ListItemGroup.ts b/packages/main/src/ListItemGroup.ts index ded228fdfa5a..4af45246f1e8 100644 --- a/packages/main/src/ListItemGroup.ts +++ b/packages/main/src/ListItemGroup.ts @@ -109,7 +109,7 @@ class ListItemGroup extends UI5Element { invalidateOnChildChange: true, type: HTMLElement, }) - items!: DefaultSlot<Array<ListItemBase>>; + items!: DefaultSlot<ListItemBase[]>; /** * Defines if the text of the component should wrap when it's too long. @@ -145,7 +145,7 @@ class ListItemGroup extends UI5Element { * @public */ @slot() - header!: Slot<Array<ListItemBase>>; + header!: Slot<ListItemBase[]>; _dragAndDropHandler: DragAndDropHandler; diff --git a/packages/main/src/ListItemGroupHeader.ts b/packages/main/src/ListItemGroupHeader.ts index 063508c98ae2..adce8ce1fcd2 100644 --- a/packages/main/src/ListItemGroupHeader.ts +++ b/packages/main/src/ListItemGroupHeader.ts @@ -99,7 +99,7 @@ class ListItemGroupHeader extends ListItemBase { expandableTextTemplate?: ExpandableTextTemplate; @slot() - subItems!: Slot<Array<HTMLElement>>; + subItems!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ListItemStandard.ts b/packages/main/src/ListItemStandard.ts index 8ffece81862e..9e5c8166bf85 100644 --- a/packages/main/src/ListItemStandard.ts +++ b/packages/main/src/ListItemStandard.ts @@ -181,7 +181,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * @public */ @slot({ type: Node, "default": true }) - content!: DefaultSlot<Array<Node>>; + content!: DefaultSlot<Node[]>; /** * **Note:** While the slot allows option for setting custom avatar, to match the @@ -193,7 +193,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * @public */ @slot() - image!: Slot<Array<HTMLElement>>; + image!: Slot<HTMLElement[]>; onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/main/src/Menu.ts b/packages/main/src/Menu.ts index bd8d4795cbdc..577a56e0b7ea 100644 --- a/packages/main/src/Menu.ts +++ b/packages/main/src/Menu.ts @@ -255,7 +255,7 @@ class Menu extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: DefaultSlot<Array<IMenuItem>>; + items!: DefaultSlot<IMenuItem[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MenuItem.ts b/packages/main/src/MenuItem.ts index cb08306bd55d..708323757182 100644 --- a/packages/main/src/MenuItem.ts +++ b/packages/main/src/MenuItem.ts @@ -291,7 +291,7 @@ class MenuItem extends ListItem implements IMenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: DefaultSlot<Array<IMenuItem>>; + items!: DefaultSlot<IMenuItem[]>; /** * Defines the components that should be displayed at the end of the menu item. @@ -311,7 +311,7 @@ class MenuItem extends ListItem implements IMenuItem { * @since 2.0.0 */ @slot() - endContent!: Slot<Array<HTMLElement>>; + endContent!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MenuItemGroup.ts b/packages/main/src/MenuItemGroup.ts index a163655d6f5b..f73988a12af2 100644 --- a/packages/main/src/MenuItemGroup.ts +++ b/packages/main/src/MenuItemGroup.ts @@ -68,7 +68,7 @@ class MenuItemGroup extends UI5Element implements IMenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: DefaultSlot<Array<IMenuItem>>; + items!: DefaultSlot<IMenuItem[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MessageStrip.ts b/packages/main/src/MessageStrip.ts index d218a10b049c..dac0678d1360 100644 --- a/packages/main/src/MessageStrip.ts +++ b/packages/main/src/MessageStrip.ts @@ -146,7 +146,7 @@ class MessageStrip extends UI5Element { * @public */ @slot() - icon!: Slot<Array<IIcon>>; + icon!: Slot<IIcon[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MultiComboBox.ts b/packages/main/src/MultiComboBox.ts index bb31080e7530..1394836777d5 100644 --- a/packages/main/src/MultiComboBox.ts +++ b/packages/main/src/MultiComboBox.ts @@ -517,7 +517,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { invalidateOnChildChange: true, individualSlots: true, }) - items!: DefaultSlot<Array<IMultiComboBoxItem>>; + items!: DefaultSlot<IMultiComboBoxItem[]>; /** * Defines the icon to be displayed in the component. @@ -525,7 +525,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { * @since 1.0.0-rc.9 */ @slot() - icon!: Slot<Array<IIcon>>; + icon!: Slot<IIcon[]>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -539,7 +539,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; selectedValues: Array<IMultiComboBoxItem>; _inputLastValue: string; diff --git a/packages/main/src/MultiComboBoxItemGroup.ts b/packages/main/src/MultiComboBoxItemGroup.ts index be670ab60552..eeb1629c2905 100644 --- a/packages/main/src/MultiComboBoxItemGroup.ts +++ b/packages/main/src/MultiComboBoxItemGroup.ts @@ -33,7 +33,7 @@ class MultiComboBoxItemGroup extends ComboBoxItemGroup implements IMultiComboBox individualSlots: true, type: HTMLElement, }) - items!: DefaultSlot<Array<MultiComboBoxItem>>; + items!: DefaultSlot<MultiComboBoxItem[]>; /** * Used to avoid tag name checks diff --git a/packages/main/src/MultiInput.ts b/packages/main/src/MultiInput.ts index 8fc37b97c79f..5d9a6882b238 100644 --- a/packages/main/src/MultiInput.ts +++ b/packages/main/src/MultiInput.ts @@ -152,7 +152,7 @@ class MultiInput extends Input implements IFormInputElement { * @public */ @slot({ type: HTMLElement, individualSlots: true }) - tokens!: Slot<Array<IToken>>; + tokens!: Slot<IToken[]>; _skipOpenSuggestions: boolean; _valueHelpIconPressed: boolean; diff --git a/packages/main/src/Option.ts b/packages/main/src/Option.ts index 5169899ce6ff..5dee908ee0ad 100644 --- a/packages/main/src/Option.ts +++ b/packages/main/src/Option.ts @@ -48,7 +48,7 @@ class Option extends ListItemBase implements IOption { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - text!: DefaultSlot<Array<Node>>; + text!: DefaultSlot<Node[]>; /** * Defines the value of the `ui5-select` inside an HTML Form element when this component is selected. diff --git a/packages/main/src/OptionCustom.ts b/packages/main/src/OptionCustom.ts index 22367849bc63..171c6d191832 100644 --- a/packages/main/src/OptionCustom.ts +++ b/packages/main/src/OptionCustom.ts @@ -63,7 +63,7 @@ class OptionCustom extends ListItemBase implements IOption { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - content!: DefaultSlot<Array<Node>>; + content!: DefaultSlot<Node[]>; /** * Defines the tooltip of the option. diff --git a/packages/main/src/Panel.ts b/packages/main/src/Panel.ts index ed78fed56ce2..a8f74ca5d455 100644 --- a/packages/main/src/Panel.ts +++ b/packages/main/src/Panel.ts @@ -206,7 +206,7 @@ class Panel extends UI5Element { * @public */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Popover.ts b/packages/main/src/Popover.ts index 6c9065070118..61a62112e664 100644 --- a/packages/main/src/Popover.ts +++ b/packages/main/src/Popover.ts @@ -209,14 +209,14 @@ class Popover extends Popup { * @public */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; /** * Defines the footer HTML Element. * @public */ @slot() - footer!: Slot<Array<HTMLElement>>; + footer!: Slot<HTMLElement[]>; _opener?: HTMLElement | string | null | undefined; _openerRect?: DOMRect; diff --git a/packages/main/src/Popup.ts b/packages/main/src/Popup.ts index 615f010ea33d..5d4128d23d0d 100644 --- a/packages/main/src/Popup.ts +++ b/packages/main/src/Popup.ts @@ -234,7 +234,7 @@ abstract class Popup extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Array<HTMLElement>>; + content!: DefaultSlot<HTMLElement[]>; /** * @private diff --git a/packages/main/src/SegmentedButton.ts b/packages/main/src/SegmentedButton.ts index 3eb1a210f914..b7bd2dcf4f2e 100644 --- a/packages/main/src/SegmentedButton.ts +++ b/packages/main/src/SegmentedButton.ts @@ -150,7 +150,7 @@ class SegmentedButton extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<Array<ISegmentedButtonItem>>; + items!: DefaultSlot<ISegmentedButtonItem[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/SegmentedButtonItem.ts b/packages/main/src/SegmentedButtonItem.ts index 5edaa8bd23df..80d1b3a300de 100644 --- a/packages/main/src/SegmentedButtonItem.ts +++ b/packages/main/src/SegmentedButtonItem.ts @@ -176,7 +176,7 @@ class SegmentedButtonItem extends UI5Element implements IButton, ISegmentedButto * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Array<Node>>; + text!: DefaultSlot<Node[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Select.ts b/packages/main/src/Select.ts index 10f819da7737..69220f8d8c95 100644 --- a/packages/main/src/Select.ts +++ b/packages/main/src/Select.ts @@ -400,7 +400,7 @@ class Select extends UI5Element implements IFormInputElement { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - options!: DefaultSlot<Array<IOption>>; + options!: DefaultSlot<IOption[]>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -415,7 +415,7 @@ class Select extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; /** * Defines the HTML element that will be displayed in the component input part, @@ -430,7 +430,7 @@ class Select extends UI5Element implements IFormInputElement { * @since 1.17.0 */ @slot() - label!: Slot<Array<HTMLElement>>; + label!: Slot<HTMLElement[]>; get formValidityMessage() { return Select.i18nBundle.getText(FORM_SELECTABLE_REQUIRED); diff --git a/packages/main/src/SplitButton.ts b/packages/main/src/SplitButton.ts index 1f91f6b6c4a1..3bc360ab150e 100644 --- a/packages/main/src/SplitButton.ts +++ b/packages/main/src/SplitButton.ts @@ -249,7 +249,7 @@ class SplitButton extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Array<Node>>; + text!: DefaultSlot<Node[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/StepInput.ts b/packages/main/src/StepInput.ts index 391ada07cf01..7e7a0143577f 100644 --- a/packages/main/src/StepInput.ts +++ b/packages/main/src/StepInput.ts @@ -297,7 +297,7 @@ class StepInput extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; _initialValueState?: `${ValueState}`; diff --git a/packages/main/src/SuggestionItemCustom.ts b/packages/main/src/SuggestionItemCustom.ts index 90e6633c8fcd..6735900a529f 100644 --- a/packages/main/src/SuggestionItemCustom.ts +++ b/packages/main/src/SuggestionItemCustom.ts @@ -50,7 +50,7 @@ class SuggestionItemCustom extends ListItemBase implements IInputSuggestionItemS * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - content!: DefaultSlot<Array<Node>>; + content!: DefaultSlot<Node[]>; get _effectiveTabIndex() { return -1; diff --git a/packages/main/src/SuggestionItemGroup.ts b/packages/main/src/SuggestionItemGroup.ts index 416be280bdd8..3ab63beabb34 100644 --- a/packages/main/src/SuggestionItemGroup.ts +++ b/packages/main/src/SuggestionItemGroup.ts @@ -28,7 +28,7 @@ class SuggestionItemGroup extends ListItemGroup { invalidateOnChildChange: true, type: HTMLElement, }) - items!: DefaultSlot<Array<SuggestionListItem>>; + items!: DefaultSlot<SuggestionListItem[]>; } SuggestionItemGroup.define(); diff --git a/packages/main/src/SuggestionListItem.ts b/packages/main/src/SuggestionListItem.ts index b318e15e1afb..01dc53ee95e0 100644 --- a/packages/main/src/SuggestionListItem.ts +++ b/packages/main/src/SuggestionListItem.ts @@ -28,14 +28,14 @@ class SuggestionListItem extends ListItemStandard { * @public */ @slot() - richDescription!: Slot<Array<HTMLElement>>; + richDescription!: Slot<HTMLElement[]>; /** * Defines the title text of the suggestion item. * @public */ @slot({ type: Node, "default": true }) - titleText!: DefaultSlot<Array<Node>>; + titleText!: DefaultSlot<Node[]>; onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/main/src/Tab.ts b/packages/main/src/Tab.ts index 7bae11f2504f..c90f94ec86b2 100644 --- a/packages/main/src/Tab.ts +++ b/packages/main/src/Tab.ts @@ -163,7 +163,7 @@ class Tab extends UI5Element implements ITabbable, ITab { slots: false, }, }) - content!: DefaultSlot<Array<Node>>; + content!: DefaultSlot<Node[]>; /** * Defines hierarchies with nested sub tabs. @@ -179,7 +179,7 @@ class Tab extends UI5Element implements ITabbable, ITab { slots: false, }, }) - items!: Slot<Array<ITab>>; + items!: Slot<ITab[]>; _isInline?: boolean; _forcedMixedMode?: boolean; diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index 843f8d785ac8..a149940c9fc6 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -332,7 +332,7 @@ class TabContainer extends UI5Element { slots: true, }, }) - items!: DefaultSlot<Array<ITab>>; + items!: DefaultSlot<ITab[]>; /** * Defines the button which will open the overflow menu. If nothing is provided to this slot, @@ -341,7 +341,7 @@ class TabContainer extends UI5Element { * @since 1.0.0-rc.9 */ @slot() - overflowButton!: Slot<Array<IButton>>; + overflowButton!: Slot<IButton[]>; /** * Defines the button which will open the start overflow menu if available. If nothing is provided to this slot, @@ -350,7 +350,7 @@ class TabContainer extends UI5Element { * @since 1.1.0 */ @slot() - startOverflowButton!: Slot<Array<IButton>>; + startOverflowButton!: Slot<IButton[]>; _itemNavigation: ItemNavigation; _itemsFlat: Array<ITab> = []; diff --git a/packages/main/src/Table.ts b/packages/main/src/Table.ts index 0c4dbfde0d60..2ef3c3887c08 100644 --- a/packages/main/src/Table.ts +++ b/packages/main/src/Table.ts @@ -279,7 +279,7 @@ class Table extends UI5Element { slots: false, }, }) - rows!: DefaultSlot<Array<TableRow>>; + rows!: DefaultSlot<TableRow[]>; /** * Defines the header row of the component. @@ -289,7 +289,7 @@ class Table extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: { properties: false, slots: true } }) - headerRow!: Slot<Array<TableHeaderRow>>; + headerRow!: Slot<TableHeaderRow[]>; /** * Defines the custom visualization if there is no data available. @@ -297,7 +297,7 @@ class Table extends UI5Element { * @public */ @slot() - noData!: Slot<Array<HTMLElement>>; + noData!: Slot<HTMLElement[]>; /** * Defines the features of the component. @@ -305,7 +305,7 @@ class Table extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true }) - features!: Slot<Array<ITableFeature>>; + features!: Slot<ITableFeature[]>; /** * Defines the accessible ARIA name of the component. diff --git a/packages/main/src/TableCellBase.ts b/packages/main/src/TableCellBase.ts index 6b2e61cab708..e26416803e14 100644 --- a/packages/main/src/TableCellBase.ts +++ b/packages/main/src/TableCellBase.ts @@ -28,7 +28,7 @@ abstract class TableCellBase extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - content!: DefaultSlot<Array<Node>>; + content!: DefaultSlot<Node[]>; /** * Determines the horizontal alignment of table cells. diff --git a/packages/main/src/TableHeaderCell.ts b/packages/main/src/TableHeaderCell.ts index 605f2018dffe..d79dd8eaa5cc 100644 --- a/packages/main/src/TableHeaderCell.ts +++ b/packages/main/src/TableHeaderCell.ts @@ -121,7 +121,7 @@ class TableHeaderCell extends TableCellBase { * @since 2.8.0 */ @slot() - action!: Slot<Array<TableHeaderCellActionBase>>; + action!: Slot<TableHeaderCellActionBase[]>; @query("slot:not([name])") _defaultSlot!: HTMLSlotElement; diff --git a/packages/main/src/TableHeaderRow.ts b/packages/main/src/TableHeaderRow.ts index 28c27d4c14f6..12f0d460ac15 100644 --- a/packages/main/src/TableHeaderRow.ts +++ b/packages/main/src/TableHeaderRow.ts @@ -63,7 +63,7 @@ class TableHeaderRow extends TableRowBase<TableHeaderCell> { }, individualSlots: true, }) - cells!: DefaultSlot<Array<TableHeaderCell>>; + cells!: DefaultSlot<TableHeaderCell[]>; /** * Sticks the `ui5-table-header-row` to the top of a table. diff --git a/packages/main/src/TableRow.ts b/packages/main/src/TableRow.ts index 0d89cd898ca9..251d216ac844 100644 --- a/packages/main/src/TableRow.ts +++ b/packages/main/src/TableRow.ts @@ -53,7 +53,7 @@ class TableRow extends TableRowBase<TableCell> { slots: false, }, }) - cells!: DefaultSlot<Array<TableCell>>; + cells!: DefaultSlot<TableCell[]>; /** * Defines the actions of the component. @@ -67,7 +67,7 @@ class TableRow extends TableRowBase<TableCell> { type: HTMLElement, individualSlots: true, }) - actions!: Slot<Array<TableRowActionBase>>; + actions!: Slot<TableRowActionBase[]>; /** * Unique identifier of the row. diff --git a/packages/main/src/Tag.ts b/packages/main/src/Tag.ts index 9419d1a56d33..00819f7dc7ba 100644 --- a/packages/main/src/Tag.ts +++ b/packages/main/src/Tag.ts @@ -160,14 +160,14 @@ class Tag extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Array<Node>>; + text!: DefaultSlot<Node[]>; /** * Defines the icon to be displayed in the component. * @public */ @slot() - icon!: Slot<Array<IIcon>>; + icon!: Slot<IIcon[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Text.ts b/packages/main/src/Text.ts index dbce0ebbf803..445017458e29 100644 --- a/packages/main/src/Text.ts +++ b/packages/main/src/Text.ts @@ -77,7 +77,7 @@ class Text extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Array<Node>>; + text!: DefaultSlot<Node[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/TextArea.ts b/packages/main/src/TextArea.ts index 8ab1343468f4..29580843f691 100644 --- a/packages/main/src/TextArea.ts +++ b/packages/main/src/TextArea.ts @@ -338,7 +338,7 @@ class TextArea extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; _fnOnResize: ResizeObserverCallback; _firstRendering: boolean; diff --git a/packages/main/src/TimePicker.ts b/packages/main/src/TimePicker.ts index dd4b1f4736ed..0c997231af8a 100644 --- a/packages/main/src/TimePicker.ts +++ b/packages/main/src/TimePicker.ts @@ -340,7 +340,7 @@ class TimePicker extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<Array<HTMLElement>>; + valueStateMessage!: Slot<HTMLElement[]>; @query("[ui5-time-selection-clocks]") _timeSelectionClocks?: TimeSelectionClocks; diff --git a/packages/main/src/Token.ts b/packages/main/src/Token.ts index ef10b9eb1044..0c59dcebc37b 100644 --- a/packages/main/src/Token.ts +++ b/packages/main/src/Token.ts @@ -141,7 +141,7 @@ class Token extends UI5Element implements IToken { * @since 1.0.0-rc.9 */ @slot() - closeIcon!: Slot<Array<IIcon>>; + closeIcon!: Slot<IIcon[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Tokenizer.ts b/packages/main/src/Tokenizer.ts index 9b94fdd74cfb..cbf1565b64c4 100644 --- a/packages/main/src/Tokenizer.ts +++ b/packages/main/src/Tokenizer.ts @@ -351,7 +351,7 @@ class Tokenizer extends UI5Element implements IFormInputElement { slots: false, }, }) - tokens!: DefaultSlot<Array<Token>>; + tokens!: DefaultSlot<Token[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Toolbar.ts b/packages/main/src/Toolbar.ts index 25fc2e3989af..e5574d93aaec 100644 --- a/packages/main/src/Toolbar.ts +++ b/packages/main/src/Toolbar.ts @@ -157,7 +157,7 @@ class Toolbar extends UI5Element { @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true, individualSlots: true, }) - items!: DefaultSlot<Array<ToolbarItem>> + items!: DefaultSlot<ToolbarItem[]> _onResize!: ResizeObserverCallback; _onCloseOverflow!: EventListener; diff --git a/packages/main/src/ToolbarSelect.ts b/packages/main/src/ToolbarSelect.ts index 77c31c4d197f..647d7a765ef9 100644 --- a/packages/main/src/ToolbarSelect.ts +++ b/packages/main/src/ToolbarSelect.ts @@ -94,7 +94,7 @@ class ToolbarSelect extends ToolbarItem { type: HTMLElement, invalidateOnChildChange: true, }) - options!: DefaultSlot<Array<ToolbarSelectOption>>; + options!: DefaultSlot<ToolbarSelectOption[]>; /** * Defines the HTML element that will be displayed in the component input part, @@ -103,7 +103,7 @@ class ToolbarSelect extends ToolbarItem { * @since 2.15.0 */ @slot() - label!: Slot<Array<HTMLElement>>; + label!: Slot<HTMLElement[]>; /** * Defines the value state of the component. diff --git a/packages/main/src/ToolbarSelectOption.ts b/packages/main/src/ToolbarSelectOption.ts index 4151c3053033..ac65e2df0918 100644 --- a/packages/main/src/ToolbarSelectOption.ts +++ b/packages/main/src/ToolbarSelectOption.ts @@ -59,7 +59,7 @@ class ToolbarSelectOption extends UI5Element { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - text!: DefaultSlot<Array<Node>>; + text!: DefaultSlot<Node[]>; } ToolbarSelectOption.define(); diff --git a/packages/main/src/Tree.ts b/packages/main/src/Tree.ts index 8d1c64b8fe76..2ccc16ac3370 100644 --- a/packages/main/src/Tree.ts +++ b/packages/main/src/Tree.ts @@ -296,7 +296,7 @@ class Tree extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<Array<TreeItemBase>>; + items!: DefaultSlot<TreeItemBase[]>; /** * Defines the component header. @@ -306,7 +306,7 @@ class Tree extends UI5Element { * @public */ @slot() - header!: Slot<Array<HTMLElement>>; + header!: Slot<HTMLElement[]>; _dragAndDropHandler: DragAndDropHandler; diff --git a/packages/main/src/TreeItemBase.ts b/packages/main/src/TreeItemBase.ts index 6f7344dfdb83..8258d622badb 100644 --- a/packages/main/src/TreeItemBase.ts +++ b/packages/main/src/TreeItemBase.ts @@ -216,7 +216,7 @@ class TreeItemBase extends ListItem { }, "default": true, }) - items!: DefaultSlot<Array<TreeItemBase>>; + items!: DefaultSlot<TreeItemBase[]>; /** * **Note:** While the slot allows option for setting custom avatar, to match the @@ -228,7 +228,7 @@ class TreeItemBase extends ListItem { * @public */ @slot() - image!: Slot<Array<HTMLElement>>; + image!: Slot<HTMLElement[]>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/TreeItemCustom.ts b/packages/main/src/TreeItemCustom.ts index e75ad2f87c91..fff945e2a639 100644 --- a/packages/main/src/TreeItemCustom.ts +++ b/packages/main/src/TreeItemCustom.ts @@ -56,7 +56,7 @@ class TreeItemCustom extends TreeItemBase { * @public */ @slot() - content!: Slot<Array<HTMLElement>>; + content!: Slot<HTMLElement[]>; _onkeydown(e: KeyboardEvent) { if (isDown(e) && this.content?.some(el => el.contains(e.target as Node))) { From c901979904f69e9e6dcc63cb10d83805e288f786 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Wed, 28 Jan 2026 11:37:06 +0200 Subject: [PATCH 06/14] chore: lint --- packages/main/src/Tab.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/main/src/Tab.ts b/packages/main/src/Tab.ts index c90f94ec86b2..fd1df11b1634 100644 --- a/packages/main/src/Tab.ts +++ b/packages/main/src/Tab.ts @@ -530,7 +530,7 @@ TabContainer.registerTabStyles(overflowCss); export default Tab; export { isInstanceOfTab, -} +}; export type { TabInStrip, TabInOverflow, From 2403fe7d32cf2d2ff84f713960b7ef4d21c4b735 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Wed, 28 Jan 2026 14:13:20 +0200 Subject: [PATCH 07/14] chore: update cem generator to remove (Default)Slot from the slot types --- packages/tools/lib/cem/utils.mjs | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/tools/lib/cem/utils.mjs b/packages/tools/lib/cem/utils.mjs index b78e31d13013..6de2e5e89300 100644 --- a/packages/tools/lib/cem/utils.mjs +++ b/packages/tools/lib/cem/utils.mjs @@ -396,7 +396,10 @@ const displayDocumentationErrors = () => { } const formatArrays = (typeText) => { - return typeText?.replaceAll(/(\S+)\[\]/g, "Array<$1>") + return typeText?.replace(/(Default)?Slot<(.+?)\[\]>/g, (match, prefix, innerType) => { + const cleanedType = innerType.replace(/^\((.+)\)$/, '$1'); + return `Array<${cleanedType}>`; + }).replaceAll(/(\S+)\[\]/g, "Array<$1>"); } export { From b7a260923ce906bdf0abb5c29e5625dfb29e6175 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Thu, 29 Jan 2026 11:57:38 +0200 Subject: [PATCH 08/14] chore: minor update --- packages/fiori/src/SideNavigation.ts | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index 741ea8ba6f18..cd37a4cf1f30 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -562,24 +562,24 @@ class SideNavigation extends UI5Element { this._flexibleItemNavigation._init(); } - _findFocusedItem(items: Array<SideNavigationItem | SideNavigationGroup>) : SideNavigationItemBase | undefined { + _findFocusedItem(items: Array<SideNavigationItemBase>) : SideNavigationItemBase | undefined { return this._getFocusableItems(items).find(item => item.forcedTabIndex === "0"); } _getSelectableItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationSelectableItemBase> { - return items.filter(isInstanceOfSideNavigationItem).reduce((result, item) => { + return items.filter(instanceOfItemOrGroup).reduce((result, item) => { return result.concat(item.selectableItems); }, new Array<SideNavigationSelectableItemBase>()); } _getFocusableItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationItemBase> { - return items.filter(isInstanceOfSideNavigationItem).reduce((result, item) => { + return items.filter(instanceOfItemOrGroup).reduce((result, item) => { return result.concat(item.focusableItems); }, new Array<SideNavigationItemBase>()); } _getAllItems(items: Array<SideNavigationItemBase>) : Array<SideNavigationItemBase> { - return items.filter(isInstanceOfSideNavigationItem).reduce((result, item) => { + return items.filter(instanceOfItemOrGroup).reduce((result, item) => { return result.concat(item.allItems); }, new Array<SideNavigationItemBase>()); } @@ -589,7 +589,7 @@ class SideNavigation extends UI5Element { } get overflowItems() : Array<HTMLElement> { - return this.items.filter(isInstanceOfSideNavigationItem).reduce((result, item) => { + return this.items.filter(instanceOfItemOrGroup).reduce((result, item) => { return result.concat(item.overflowItems); }, new Array<HTMLElement>()); } @@ -718,6 +718,10 @@ class SideNavigation extends UI5Element { } } +const instanceOfItemOrGroup = (item: SideNavigationItemBase): item is SideNavigationItem | SideNavigationGroup => { + return isInstanceOfSideNavigationItem(item) || isInstanceOfSideNavigationGroup(item); +}; + SideNavigation.define(); export default SideNavigation; From 120e2bb38cc5c01cda7f3ea1498f6714aff66321 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Thu, 29 Jan 2026 15:38:51 +0200 Subject: [PATCH 09/14] chore: update --- packages/base/src/types.ts | 6 ++++++ packages/main/src/Tab.ts | 7 ------- packages/main/src/TabContainer.ts | 6 +++--- 3 files changed, 9 insertions(+), 10 deletions(-) diff --git a/packages/base/src/types.ts b/packages/base/src/types.ts index 03c60a361d42..a4717ea02053 100644 --- a/packages/base/src/types.ts +++ b/packages/base/src/types.ts @@ -1,9 +1,15 @@ import type { JSX } from "./jsx-runtime.d.ts"; +import type { Slot, DefaultSlot } from "./UI5Element.js"; // General utils export type LowercaseString<T> = T extends string ? Lowercase<T> : never; // Core Framework types +export type { + Slot, + DefaultSlot, +}; + export type PromiseResolve = (value: void | PromiseLike<void>) => void; export type Timeout = ReturnType<typeof setTimeout>; export type Interval = ReturnType<typeof setInterval>; diff --git a/packages/main/src/Tab.ts b/packages/main/src/Tab.ts index fd1df11b1634..e2277466e6a7 100644 --- a/packages/main/src/Tab.ts +++ b/packages/main/src/Tab.ts @@ -517,10 +517,6 @@ class Tab extends UI5Element implements ITabbable, ITab { } } -const isInstanceOfTab = (object: any): object is TabInOverflow => { - return "realTabReference" in object; -}; - Tab.define(); TabContainer.registerTabStyles(stripCss); @@ -528,9 +524,6 @@ TabContainer.registerTabStyles(draggableElementStyles); TabContainer.registerTabStyles(overflowCss); export default Tab; -export { - isInstanceOfTab, -}; export type { TabInStrip, TabInOverflow, diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index a149940c9fc6..2cd40e6e85ce 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -1,6 +1,6 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; -import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; -import type { AccessibilityAttributes } from "@ui5/webcomponents-base/dist/types.js"; +import type { Slot, DefaultSlot, AccessibilityAttributes } from "@ui5/webcomponents-base"; +import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; @@ -49,7 +49,6 @@ import type Button from "./Button.js"; import type List from "./List.js"; import type DropIndicator from "./DropIndicator.js"; import type Tab from "./Tab.js"; -import { isInstanceOfTab } from "./Tab.js"; import type { TabInStrip, TabInOverflow } from "./Tab.js"; import type { TabSeparatorInStrip } from "./TabSeparator.js"; import type { ListItemClickEventDetail, ListMoveEventDetail } from "./List.js"; @@ -1561,6 +1560,7 @@ const walk = (items: Array<ITab>, callback: (arg0: ITab, arg1: number) => void) TabContainer.define(); export default TabContainer; +export const isInstanceOfTab = createInstanceChecker<TabInOverflow>("realTabReference"); export type { TabContainerTabSelectEventDetail, TabContainerMoveEventDetail, From 2496490574f0dd054c313f0bfb1587f9ab6737b9 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Thu, 29 Jan 2026 18:01:50 +0200 Subject: [PATCH 10/14] chore: fix tests --- .../base/src/util/createInstanceChecker.ts | 22 +++++++++++++++++++ packages/fiori/src/SideNavigation.ts | 5 ++--- packages/main/src/TabContainer.ts | 9 ++++++-- 3 files changed, 31 insertions(+), 5 deletions(-) diff --git a/packages/base/src/util/createInstanceChecker.ts b/packages/base/src/util/createInstanceChecker.ts index 9a0b52fe67de..0d22d6a81903 100644 --- a/packages/base/src/util/createInstanceChecker.ts +++ b/packages/base/src/util/createInstanceChecker.ts @@ -1,7 +1,29 @@ +// createInstanceChecker<A>("isAItem") function createChecker<T, P extends keyof T = keyof T>(prop: P) { return (object: any): object is T => { return object !== undefined && prop in object && object[prop] === true; }; } +// TBD: Discuss if required +// +// (1) Filter multiple types at once +// const isInstanceOfAOrB = createMultiInstanceChecker<A | B>(["isAItem", "isBItem"]) +// const filteredItems = items.filter(isInstanceOfAOrB) +// +// (2) Or, filter separately: +// const isInstanceOfA = createInstanceChecker<A>("isAItem"); +// const isInstanceOfB = createInstanceChecker<A>("isBItem") +// const filteredItems = [...items.filter(isInstanceOfA), ...items.filter(isInstanceOfB)]; +export const createMultiInstanceChecker = <T>(props: string[] | string) => { + return (object: any): object is T => { + if (!object) { + return false; + } + + const propsArray = Array.isArray(props) ? props : [props]; + return propsArray.some(prop => prop in object && object[prop] === true); + }; +}; + export default createChecker; diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index cd37a4cf1f30..3a5c2dfe1c57 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -1,5 +1,6 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import { createMultiInstanceChecker } from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -718,9 +719,7 @@ class SideNavigation extends UI5Element { } } -const instanceOfItemOrGroup = (item: SideNavigationItemBase): item is SideNavigationItem | SideNavigationGroup => { - return isInstanceOfSideNavigationItem(item) || isInstanceOfSideNavigationGroup(item); -}; +const instanceOfItemOrGroup = createMultiInstanceChecker<SideNavigationItem | SideNavigationGroup>(["isSideNavigationItem", "isSideNavigationGroup"]); SideNavigation.define(); diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index 2cd40e6e85ce..c94f3fffcf61 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -1,6 +1,5 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { Slot, DefaultSlot, AccessibilityAttributes } from "@ui5/webcomponents-base"; -import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; @@ -1560,7 +1559,13 @@ const walk = (items: Array<ITab>, callback: (arg0: ITab, arg1: number) => void) TabContainer.define(); export default TabContainer; -export const isInstanceOfTab = createInstanceChecker<TabInOverflow>("realTabReference"); + +// TBD: currently, the createInstanceChecker could not be used +// as it expects the checked property to be a boolean and true - (object[prop] === true); +const isInstanceOfTab = (object: any): object is TabInOverflow => { + return object !== undefined && "realTabReference" in object; +}; + export type { TabContainerTabSelectEventDetail, TabContainerMoveEventDetail, From 81aba7da82262fe9d7a8692019f1f0d7e3a37108 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Wed, 4 Feb 2026 12:44:21 +0200 Subject: [PATCH 11/14] chore: make Array part of the (Default)Slot --- docs/4-development/04-slots.md | 17 ++++++++------- .../11-deep-dive-and-best-practices.md | 2 +- packages/ai/src/Button.ts | 2 +- packages/ai/src/Input.ts | 2 +- packages/ai/src/PromptInput.ts | 4 ++-- packages/ai/src/TextArea.ts | 2 +- packages/base/src/UI5Element.ts | 4 ++-- .../base/src/util/createInstanceChecker.ts | 21 ------------------- .../src/util/createMultiInstanceChecker.ts | 20 ++++++++++++++++++ packages/compat/src/Table.ts | 4 ++-- packages/compat/src/TableCell.ts | 2 +- packages/compat/src/TableRow.ts | 2 +- packages/fiori/src/BarcodeScannerDialog.ts | 4 ++-- packages/fiori/src/DynamicPage.ts | 8 +++---- packages/fiori/src/DynamicPageHeader.ts | 2 +- packages/fiori/src/DynamicPageTitle.ts | 18 ++++++++-------- packages/fiori/src/DynamicSideContent.ts | 2 +- packages/fiori/src/FilterItem.ts | 2 +- packages/fiori/src/FlexibleColumnLayout.ts | 6 +++--- packages/fiori/src/IllustratedMessage.ts | 6 +++--- packages/fiori/src/MediaGallery.ts | 2 +- packages/fiori/src/MediaGalleryItem.ts | 4 ++-- packages/fiori/src/NavigationLayout.ts | 6 +++--- packages/fiori/src/NavigationMenu.ts | 2 +- packages/fiori/src/NotificationList.ts | 2 +- .../fiori/src/NotificationListGroupItem.ts | 2 +- packages/fiori/src/NotificationListItem.ts | 8 +++---- packages/fiori/src/Page.ts | 6 +++--- packages/fiori/src/ProductSwitch.ts | 2 +- packages/fiori/src/ProductSwitchItem.ts | 2 +- packages/fiori/src/Search.ts | 8 +++---- packages/fiori/src/SearchField.ts | 4 ++-- packages/fiori/src/SearchItem.ts | 4 ++-- packages/fiori/src/ShellBar.ts | 20 +++++++++--------- packages/fiori/src/ShellBarBranding.ts | 4 ++-- packages/fiori/src/SideNavigation.ts | 8 +++---- packages/fiori/src/SideNavigationGroup.ts | 2 +- packages/fiori/src/SideNavigationItem.ts | 2 +- packages/fiori/src/Timeline.ts | 2 +- packages/fiori/src/TimelineGroupItem.ts | 2 +- packages/fiori/src/TimelineItem.ts | 2 +- packages/fiori/src/UploadCollection.ts | 4 ++-- packages/fiori/src/UploadCollectionItem.ts | 2 +- packages/fiori/src/UserMenu.ts | 4 ++-- packages/fiori/src/UserMenuItem.ts | 2 +- packages/fiori/src/UserSettingsAccountView.ts | 2 +- .../fiori/src/UserSettingsAppearanceView.ts | 4 ++-- .../src/UserSettingsAppearanceViewGroup.ts | 2 +- packages/fiori/src/UserSettingsDialog.ts | 4 ++-- packages/fiori/src/UserSettingsItem.ts | 4 ++-- packages/fiori/src/UserSettingsView.ts | 2 +- packages/fiori/src/ViewSettingsDialog.ts | 6 +++--- packages/fiori/src/Wizard.ts | 2 +- packages/main/src/Avatar.ts | 4 ++-- packages/main/src/AvatarGroup.ts | 4 ++-- packages/main/src/Bar.ts | 6 +++--- packages/main/src/Breadcrumbs.ts | 2 +- packages/main/src/BreadcrumbsItem.ts | 2 +- packages/main/src/Button.ts | 4 ++-- packages/main/src/Calendar.ts | 8 +++---- packages/main/src/CalendarLegend.ts | 2 +- packages/main/src/Card.ts | 4 ++-- packages/main/src/CardHeader.ts | 4 ++-- packages/main/src/Carousel.ts | 2 +- packages/main/src/ColorPalette.ts | 2 +- packages/main/src/ColorPalettePopover.ts | 2 +- packages/main/src/ComboBox.ts | 6 +++--- packages/main/src/ComboBoxItemGroup.ts | 2 +- packages/main/src/DatePicker.ts | 2 +- packages/main/src/Dialog.ts | 4 ++-- packages/main/src/FileUploader.ts | 4 ++-- packages/main/src/Form.ts | 4 ++-- packages/main/src/FormGroup.ts | 2 +- packages/main/src/FormItem.ts | 4 ++-- packages/main/src/Input.ts | 6 +++--- packages/main/src/List.ts | 4 ++-- packages/main/src/ListItem.ts | 2 +- packages/main/src/ListItemGroup.ts | 4 ++-- packages/main/src/ListItemGroupHeader.ts | 2 +- packages/main/src/ListItemStandard.ts | 4 ++-- packages/main/src/Menu.ts | 2 +- packages/main/src/MenuItem.ts | 4 ++-- packages/main/src/MenuItemGroup.ts | 2 +- packages/main/src/MessageStrip.ts | 2 +- packages/main/src/MultiComboBox.ts | 6 +++--- packages/main/src/MultiComboBoxItemGroup.ts | 2 +- packages/main/src/MultiInput.ts | 2 +- packages/main/src/Option.ts | 2 +- packages/main/src/OptionCustom.ts | 2 +- packages/main/src/Panel.ts | 2 +- packages/main/src/Popover.ts | 4 ++-- packages/main/src/Popup.ts | 2 +- packages/main/src/SegmentedButton.ts | 2 +- packages/main/src/SegmentedButtonItem.ts | 2 +- packages/main/src/Select.ts | 6 +++--- packages/main/src/SplitButton.ts | 2 +- packages/main/src/StepInput.ts | 2 +- packages/main/src/SuggestionItemCustom.ts | 2 +- packages/main/src/SuggestionItemGroup.ts | 2 +- packages/main/src/SuggestionListItem.ts | 4 ++-- packages/main/src/Tab.ts | 4 ++-- packages/main/src/TabContainer.ts | 6 +++--- packages/main/src/Table.ts | 8 +++---- packages/main/src/TableCellBase.ts | 2 +- packages/main/src/TableHeaderCell.ts | 2 +- packages/main/src/TableHeaderRow.ts | 2 +- packages/main/src/TableRow.ts | 4 ++-- packages/main/src/Tag.ts | 4 ++-- packages/main/src/Text.ts | 2 +- packages/main/src/TextArea.ts | 2 +- packages/main/src/TimePicker.ts | 2 +- packages/main/src/Token.ts | 2 +- packages/main/src/Tokenizer.ts | 2 +- packages/main/src/Toolbar.ts | 2 +- packages/main/src/ToolbarSelect.ts | 4 ++-- packages/main/src/ToolbarSelectOption.ts | 2 +- packages/main/src/Tree.ts | 4 ++-- packages/main/src/TreeItemBase.ts | 4 ++-- packages/main/src/TreeItemCustom.ts | 2 +- 119 files changed, 237 insertions(+), 235 deletions(-) create mode 100644 packages/base/src/util/createMultiInstanceChecker.ts diff --git a/docs/4-development/04-slots.md b/docs/4-development/04-slots.md index 3ec7e62f4335..172e236531bc 100644 --- a/docs/4-development/04-slots.md +++ b/docs/4-development/04-slots.md @@ -52,7 +52,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot() - mySlot!: Slot<HTMLElement[]>; + mySlot!: Slot<HTMLElement>; } ``` @@ -69,7 +69,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement }) - mySlot!: Slot<HTMLElement[]>;; + mySlot!: Slot<HTMLElement>;; } ``` @@ -96,10 +96,13 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, "default": true }) - mySlot!: Slot<HTMLElement[]>;; + mySlot!: Slot<HTMLElement>;; } ``` +**Note:** The `Slot<T>` and `DefaultSlot<T>` marker types were introduced in version 2.20. In previous versions, slots were typed as `Array<T>` (e.g., `mySlot!: Array<HTMLElement>`). The new types enable better slot discoverability in TypeScript environments while the array is now part of the type itself. + + ### Individual Slots The `individualSlots` option accepts a boolean value and determines whether each child will have its own slot, allowing you to arrange or wrap the children arbitrarily. This means that you need to handle the rendering on your own. @@ -112,7 +115,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, individualSlots: true }) - mySlot!: Slot<HTMLElement[]>;; + mySlot!: Slot<HTMLElement>;; } ``` @@ -144,12 +147,12 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-demo-component") class MyDemoComponent extends UI5Element { @slot({ type: HTMLElement, invalidateOnChildChange: true }) - mySlot!: Slot<HTMLElement[]>;; + mySlot!: Slot<HTMLElement>;; @slot({ type: HTMLElement, invalidateOnChildChange: { properties: true, slots: false }}) - mySlot2!: Slot<HTMLElement[]>;; + mySlot2!: Slot<HTMLElement>;; @slot({ type: HTMLElement, invalidateOnChildChange: { properties: ["myProp"], slots: ["anotherSlot"] }}) - mySlot3!: Slot<HTMLElement[]>;; + mySlot3!: Slot<HTMLElement>;; } ``` \ No newline at end of file diff --git a/docs/4-development/11-deep-dive-and-best-practices.md b/docs/4-development/11-deep-dive-and-best-practices.md index 065e60bf132d..7cb52467f0fa 100644 --- a/docs/4-development/11-deep-dive-and-best-practices.md +++ b/docs/4-development/11-deep-dive-and-best-practices.md @@ -442,7 +442,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @customElement("my-component") class MyComponent extends UI5Element { @slot() - items!: Slot<HTMLElement[]>;; + items!: Slot<HTMLElement>;; } ``` diff --git a/packages/ai/src/Button.ts b/packages/ai/src/Button.ts index 64dbdb524843..aaa897fde48b 100644 --- a/packages/ai/src/Button.ts +++ b/packages/ai/src/Button.ts @@ -184,7 +184,7 @@ class Button extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - states!: DefaultSlot<ButtonState[]>; + states!: DefaultSlot<ButtonState>; @query("[ui5-split-button]") _splitButton?: SplitButton; diff --git a/packages/ai/src/Input.ts b/packages/ai/src/Input.ts index 633ab0da3268..0474df526c13 100644 --- a/packages/ai/src/Input.ts +++ b/packages/ai/src/Input.ts @@ -165,7 +165,7 @@ class Input extends BaseInput { type: HTMLElement, invalidateOnChildChange: true, }) - actions!: Slot<HTMLElement[]>; + actions!: Slot<HTMLElement>; _previousCurrentStep = 0; _previousTotalSteps = 0; diff --git a/packages/ai/src/PromptInput.ts b/packages/ai/src/PromptInput.ts index 6f02f2be6620..3ffe16f8eaa6 100644 --- a/packages/ai/src/PromptInput.ts +++ b/packages/ai/src/PromptInput.ts @@ -203,7 +203,7 @@ class PromptInput extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - suggestionItems!: DefaultSlot<IInputSuggestionItem[]>; + suggestionItems!: DefaultSlot<IInputSuggestionItem>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -221,7 +221,7 @@ class PromptInput extends UI5Element { type: HTMLElement, invalidateOnChildChange: true, }) - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; @i18n("@ui5/webcomponents-ai") static i18nBundle: I18nBundle; diff --git a/packages/ai/src/TextArea.ts b/packages/ai/src/TextArea.ts index 786868525a01..4ddf7f4bb573 100644 --- a/packages/ai/src/TextArea.ts +++ b/packages/ai/src/TextArea.ts @@ -132,7 +132,7 @@ class TextArea extends BaseTextArea { focused = false; @slot({ type: HTMLElement }) - menu!: Slot<HTMLElement[]>; + menu!: Slot<HTMLElement>; static i18nBundle: I18nBundle; diff --git a/packages/base/src/UI5Element.ts b/packages/base/src/UI5Element.ts index 1a432e85b019..9a6baefebfd3 100644 --- a/packages/base/src/UI5Element.ts +++ b/packages/base/src/UI5Element.ts @@ -174,8 +174,8 @@ type Convert<T, K extends UI5Element> = { [Property in keyof T as `on${KebabToPa declare const SlotMarker: unique symbol; declare const DefaultSlotMarker: unique symbol; -export type Slot<T> = T & { [SlotMarker]: true }; -export type DefaultSlot<T> = T & { [DefaultSlotMarker]: true }; +export type Slot<T> = T[] & { [SlotMarker]: true }; +export type DefaultSlot<T> = T[] & { [DefaultSlotMarker]: true }; export type IsSlot<T> = T extends { [SlotMarker]: true } ? true : T extends { [DefaultSlotMarker]: true } ? true : false; export type IsDefaultSlot<T> = T extends { [DefaultSlotMarker]: true } ? true : false; diff --git a/packages/base/src/util/createInstanceChecker.ts b/packages/base/src/util/createInstanceChecker.ts index 0d22d6a81903..b6a72f34299f 100644 --- a/packages/base/src/util/createInstanceChecker.ts +++ b/packages/base/src/util/createInstanceChecker.ts @@ -5,25 +5,4 @@ function createChecker<T, P extends keyof T = keyof T>(prop: P) { }; } -// TBD: Discuss if required -// -// (1) Filter multiple types at once -// const isInstanceOfAOrB = createMultiInstanceChecker<A | B>(["isAItem", "isBItem"]) -// const filteredItems = items.filter(isInstanceOfAOrB) -// -// (2) Or, filter separately: -// const isInstanceOfA = createInstanceChecker<A>("isAItem"); -// const isInstanceOfB = createInstanceChecker<A>("isBItem") -// const filteredItems = [...items.filter(isInstanceOfA), ...items.filter(isInstanceOfB)]; -export const createMultiInstanceChecker = <T>(props: string[] | string) => { - return (object: any): object is T => { - if (!object) { - return false; - } - - const propsArray = Array.isArray(props) ? props : [props]; - return propsArray.some(prop => prop in object && object[prop] === true); - }; -}; - export default createChecker; diff --git a/packages/base/src/util/createMultiInstanceChecker.ts b/packages/base/src/util/createMultiInstanceChecker.ts new file mode 100644 index 000000000000..a1a845ec8e74 --- /dev/null +++ b/packages/base/src/util/createMultiInstanceChecker.ts @@ -0,0 +1,20 @@ +// Allows filtering of multiple types at once +// const isInstanceOfAOrB = createMultiInstanceChecker<A | B>(["isAItem", "isBItem"]) +// const filteredItems = items.filter(isInstanceOfAOrB) +// +// Alternatively, use "createInstanceChecker" and filter separately: +// const isInstanceOfA = createInstanceChecker<A>("isAItem"); +// const isInstanceOfB = createInstanceChecker<A>("isBItem") +// const filteredItems = [...items.filter(isInstanceOfA), ...items.filter(isInstanceOfB)]; +export const createMultiInstanceChecker = <T>(props: string[] | string) => { + return (object: any): object is T => { + if (!object) { + return false; + } + + const propsArray = Array.isArray(props) ? props : [props]; + return propsArray.some(prop => prop in object && object[prop] === true); + }; +}; + +export default createMultiInstanceChecker; diff --git a/packages/compat/src/Table.ts b/packages/compat/src/Table.ts index 03b1232bd8a8..f2406ca98167 100644 --- a/packages/compat/src/Table.ts +++ b/packages/compat/src/Table.ts @@ -400,7 +400,7 @@ class Table extends UI5Element { individualSlots: true, invalidateOnChildChange: true, }) - rows!: DefaultSlot<ITableRow[]>; + rows!: DefaultSlot<ITableRow>; /** * Defines the configuration for the columns of the component. @@ -416,7 +416,7 @@ class Table extends UI5Element { slots: false, }, }) - columns!: Slot<TableColumn[]>; + columns!: Slot<TableColumn>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/compat/src/TableCell.ts b/packages/compat/src/TableCell.ts index d70d0a440050..b140055a8fb9 100644 --- a/packages/compat/src/TableCell.ts +++ b/packages/compat/src/TableCell.ts @@ -59,7 +59,7 @@ class TableCell extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/compat/src/TableRow.ts b/packages/compat/src/TableRow.ts index c8f48f4200d7..78ed73f98f40 100644 --- a/packages/compat/src/TableRow.ts +++ b/packages/compat/src/TableRow.ts @@ -190,7 +190,7 @@ class TableRow extends UI5Element implements ITableRow { * @public */ @slot({ type: HTMLElement, "default": true, individualSlots: true }) - cells!: DefaultSlot<TableCell[]>; + cells!: DefaultSlot<TableCell>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/BarcodeScannerDialog.ts b/packages/fiori/src/BarcodeScannerDialog.ts index 5113d2865338..ea3cbf8617bb 100644 --- a/packages/fiori/src/BarcodeScannerDialog.ts +++ b/packages/fiori/src/BarcodeScannerDialog.ts @@ -124,7 +124,7 @@ class BarcodeScannerDialog extends UI5Element { * @since 2.4.0 */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; /** * Defines the footer HTML Element. @@ -140,7 +140,7 @@ class BarcodeScannerDialog extends UI5Element { * @since 2.4.0 */ @slot() - footer!: Slot<HTMLElement[]>; + footer!: Slot<HTMLElement>; /** * Indicates whether the dialog is open. diff --git a/packages/fiori/src/DynamicPage.ts b/packages/fiori/src/DynamicPage.ts index 117bf594000a..011145823eba 100644 --- a/packages/fiori/src/DynamicPage.ts +++ b/packages/fiori/src/DynamicPage.ts @@ -158,7 +158,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * Defines the title HTML Element. @@ -166,7 +166,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ type: DynamicPageTitle }) - titleArea!: Slot<DynamicPageTitle[]>; + titleArea!: Slot<DynamicPageTitle>; /** * Defines the header HTML Element. @@ -174,7 +174,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ type: DynamicPageHeader }) - headerArea!: Slot<DynamicPageHeader[]>; + headerArea!: Slot<DynamicPageHeader>; /** * Defines the footer HTML Element. @@ -182,7 +182,7 @@ class DynamicPage extends UI5Element { * @public */ @slot({ type: HTMLElement }) - footerArea!: Slot<HTMLElement[]>; + footerArea!: Slot<HTMLElement>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/DynamicPageHeader.ts b/packages/fiori/src/DynamicPageHeader.ts index af16c379b0d2..0bb6b4fc1e47 100644 --- a/packages/fiori/src/DynamicPageHeader.ts +++ b/packages/fiori/src/DynamicPageHeader.ts @@ -64,7 +64,7 @@ class DynamicPageHeader extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * Defines if the header is snapped. diff --git a/packages/fiori/src/DynamicPageTitle.ts b/packages/fiori/src/DynamicPageTitle.ts index 9f2a51f877d9..cc1bfaf2f933 100644 --- a/packages/fiori/src/DynamicPageTitle.ts +++ b/packages/fiori/src/DynamicPageTitle.ts @@ -136,7 +136,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - heading!: Slot<HTMLElement[]>; + heading!: Slot<HTMLElement>; /** * Defines the heading that is shown only when the header is snapped. @@ -144,7 +144,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - snappedHeading!: Slot<HTMLElement[]>; + snappedHeading!: Slot<HTMLElement>; /** * Defines the content of the snapped title on mobile devices. @@ -160,7 +160,7 @@ class DynamicPageTitle extends UI5Element { * @since 2.3.0 */ @slot({ type: HTMLElement }) - snappedTitleOnMobile!: Slot<Title[]>; + snappedTitleOnMobile!: Slot<Title>; /** * Defines the bar with actions in the Dynamic page title. @@ -168,7 +168,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - actionsBar!: Slot<HTMLElement[]>; + actionsBar!: Slot<HTMLElement>; /** * Defines the bar with navigation actions in the Dynamic page title. @@ -176,7 +176,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - navigationBar!: Slot<Toolbar[]>; + navigationBar!: Slot<Toolbar>; /** * Defines the content of the Dynamic page title. @@ -184,7 +184,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * Defines the content of the title that is shown only when the header is not snapped. @@ -192,7 +192,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - subheading!: Slot<HTMLElement[]>; + subheading!: Slot<HTMLElement>; /** * Defines the content of the title that is shown only when the header is snapped. @@ -200,7 +200,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - snappedSubheading!: Slot<HTMLElement[]>; + snappedSubheading!: Slot<HTMLElement>; /** * Defines the content of the breadcrumbs inside Dynamic Page Title. @@ -208,7 +208,7 @@ class DynamicPageTitle extends UI5Element { * @public */ @slot({ type: HTMLElement }) - breadcrumbs!: Slot<HTMLElement[]>; + breadcrumbs!: Slot<HTMLElement>; /** * @private diff --git a/packages/fiori/src/DynamicSideContent.ts b/packages/fiori/src/DynamicSideContent.ts index 70592df9adc0..10b67edb8173 100644 --- a/packages/fiori/src/DynamicSideContent.ts +++ b/packages/fiori/src/DynamicSideContent.ts @@ -234,7 +234,7 @@ class DynamicSideContent extends UI5Element { * @public */ @slot() - sideContent!: Slot<HTMLElement[]>; + sideContent!: Slot<HTMLElement>; @query(".ui5-dsc-main") _mainContent!: HTMLElement; diff --git a/packages/fiori/src/FilterItem.ts b/packages/fiori/src/FilterItem.ts index 72b69dfea5a8..e035fb9b8d4e 100644 --- a/packages/fiori/src/FilterItem.ts +++ b/packages/fiori/src/FilterItem.ts @@ -50,7 +50,7 @@ class FilterItem extends UI5Element { * @public */ @slot() - values!: Slot<FilterItemOption[]>; + values!: Slot<FilterItemOption>; } FilterItem.define(); diff --git a/packages/fiori/src/FlexibleColumnLayout.ts b/packages/fiori/src/FlexibleColumnLayout.ts index 811888ff7f94..365c48f9c11c 100644 --- a/packages/fiori/src/FlexibleColumnLayout.ts +++ b/packages/fiori/src/FlexibleColumnLayout.ts @@ -348,21 +348,21 @@ class FlexibleColumnLayout extends UI5Element { * @public */ @slot() - startColumn!: Slot<HTMLElement[]>; + startColumn!: Slot<HTMLElement>; /** * Defines the content in the middle column. * @public */ @slot() - midColumn!: Slot<HTMLElement[]>; + midColumn!: Slot<HTMLElement>; /** * Defines the content in the end column. * @public */ @slot() - endColumn!: Slot<HTMLElement[]>; + endColumn!: Slot<HTMLElement>; initialRendering: boolean; _handleResize: () => void; diff --git a/packages/fiori/src/IllustratedMessage.ts b/packages/fiori/src/IllustratedMessage.ts index 4d7e7606a40c..73652773cd9d 100644 --- a/packages/fiori/src/IllustratedMessage.ts +++ b/packages/fiori/src/IllustratedMessage.ts @@ -249,7 +249,7 @@ class IllustratedMessage extends UI5Element { * @since 1.7.0 */ @slot({ type: HTMLElement }) - title!: Slot<HTMLElement[]> & string; + title!: Slot<HTMLElement> & string; /** * Defines the subtitle of the component. @@ -259,7 +259,7 @@ class IllustratedMessage extends UI5Element { * @since 1.0.0-rc.16 */ @slot({ type: HTMLElement }) - subtitle!: Slot<HTMLElement[]>; + subtitle!: Slot<HTMLElement>; /** * Defines the component actions. @@ -268,7 +268,7 @@ class IllustratedMessage extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - actions!: DefaultSlot<IButton[]>; + actions!: DefaultSlot<IButton>; illustrationTitle?: string; illustrationSubtitle?: string; diff --git a/packages/fiori/src/MediaGallery.ts b/packages/fiori/src/MediaGallery.ts index 5c5a44b4a971..1c41ef2f396e 100644 --- a/packages/fiori/src/MediaGallery.ts +++ b/packages/fiori/src/MediaGallery.ts @@ -216,7 +216,7 @@ class MediaGallery extends UI5Element { invalidateOnChildChange: true, "default": true, }) - items!: DefaultSlot<IMediaGalleryItem[]>; + items!: DefaultSlot<IMediaGalleryItem>; _itemNavigation: ItemNavigation; _onResize: () => void; diff --git a/packages/fiori/src/MediaGalleryItem.ts b/packages/fiori/src/MediaGalleryItem.ts index 6b4dfc6eb954..43c927907908 100644 --- a/packages/fiori/src/MediaGalleryItem.ts +++ b/packages/fiori/src/MediaGalleryItem.ts @@ -126,14 +126,14 @@ class MediaGalleryItem extends UI5Element implements IMediaGalleryItem { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * Defines the content of the thumbnail. * @public */ @slot() - thumbnail!: Slot<HTMLElement[]>; + thumbnail!: Slot<HTMLElement>; _monitoredThumbnail: HTMLElement | null; _monitoredContent: HTMLElement | null; diff --git a/packages/fiori/src/NavigationLayout.ts b/packages/fiori/src/NavigationLayout.ts index 7f3fb0ca6113..302e00a1793e 100644 --- a/packages/fiori/src/NavigationLayout.ts +++ b/packages/fiori/src/NavigationLayout.ts @@ -93,21 +93,21 @@ class NavigationLayout extends UI5Element { * @public */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; /** * Defines the side content. * @public */ @slot() - sideContent!: Slot<SideNavigation[]>; + sideContent!: Slot<SideNavigation>; /** * Defines the content. * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; onBeforeRendering() { this.calcSideCollapsed(); diff --git a/packages/fiori/src/NavigationMenu.ts b/packages/fiori/src/NavigationMenu.ts index f1697b8b2b19..ecaccd52e6f0 100644 --- a/packages/fiori/src/NavigationMenu.ts +++ b/packages/fiori/src/NavigationMenu.ts @@ -55,7 +55,7 @@ class NavigationMenu extends Menu { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - declare items: DefaultSlot<NavigationMenuItem[]>; + declare items: DefaultSlot<NavigationMenuItem>; @i18n("@ui5/webcomponents-fiori") static i18nBundleFiori: I18nBundle; diff --git a/packages/fiori/src/NotificationList.ts b/packages/fiori/src/NotificationList.ts index b21d97ba2eab..4b4e35d61131 100644 --- a/packages/fiori/src/NotificationList.ts +++ b/packages/fiori/src/NotificationList.ts @@ -117,7 +117,7 @@ class NotificationList extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: DefaultSlot<NotificationListItemBase[]>; + items!: DefaultSlot<NotificationListItemBase>; /** * Defines the text that is displayed when the component contains no items. diff --git a/packages/fiori/src/NotificationListGroupItem.ts b/packages/fiori/src/NotificationListGroupItem.ts index 692344a92674..cad99a7c58ff 100644 --- a/packages/fiori/src/NotificationListGroupItem.ts +++ b/packages/fiori/src/NotificationListGroupItem.ts @@ -125,7 +125,7 @@ class NotificationListGroupItem extends NotificationListItemBase { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: DefaultSlot<NotificationListItem[]> + items!: DefaultSlot<NotificationListItem> onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/fiori/src/NotificationListItem.ts b/packages/fiori/src/NotificationListItem.ts index e2ded30c9b76..a63dcf109bc6 100644 --- a/packages/fiori/src/NotificationListItem.ts +++ b/packages/fiori/src/NotificationListItem.ts @@ -226,7 +226,7 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot() - avatar!: Slot<HTMLElement[]>; + avatar!: Slot<HTMLElement>; /** * Defines the menu, displayed in the `ui5-li-notification`. @@ -237,14 +237,14 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot() - menu!: Slot<HTMLElement[]>; + menu!: Slot<HTMLElement>; /** * Defines the elements, displayed in the footer of the of the component. * @public */ @slot({ type: HTMLElement, individualSlots: true }) - footnotes!: Slot<HTMLElement[]>; + footnotes!: Slot<HTMLElement>; /** * Defines the content of the `ui5-li-notification`, @@ -254,7 +254,7 @@ class NotificationListItem extends NotificationListItemBase { * @public */ @slot({ type: Node, "default": true }) - description!: DefaultSlot<Node[]>; + description!: DefaultSlot<Node>; @query(".ui5-nli-title-text") titleTextDOM?: HTMLElement; diff --git a/packages/fiori/src/Page.ts b/packages/fiori/src/Page.ts index 12d2d2756e92..ded8dec4026d 100644 --- a/packages/fiori/src/Page.ts +++ b/packages/fiori/src/Page.ts @@ -95,21 +95,21 @@ class Page extends UI5Element { * @public */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; /** * Defines the content HTML Element. * @public */ @slot({ type: Node, "default": true }) - content!: DefaultSlot<Node[]>; + content!: DefaultSlot<Node>; /** * Defines the footer HTML Element. * @public */ @slot() - footer!: Slot<HTMLElement[]>; + footer!: Slot<HTMLElement>; constructor() { super(); diff --git a/packages/fiori/src/ProductSwitch.ts b/packages/fiori/src/ProductSwitch.ts index eb9d0fa39fdc..84d38306502e 100644 --- a/packages/fiori/src/ProductSwitch.ts +++ b/packages/fiori/src/ProductSwitch.ts @@ -82,7 +82,7 @@ class ProductSwitch extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true, invalidateOnChildChange: true }) - items!: DefaultSlot<IProductSwitchItem[]> + items!: DefaultSlot<IProductSwitchItem> _itemNavigation: ItemNavigation; _currentIndex: number; diff --git a/packages/fiori/src/ProductSwitchItem.ts b/packages/fiori/src/ProductSwitchItem.ts index 7bbfb5cb6762..0d1d79dd34bd 100644 --- a/packages/fiori/src/ProductSwitchItem.ts +++ b/packages/fiori/src/ProductSwitchItem.ts @@ -145,7 +145,7 @@ class ProductSwitchItem extends UI5Element implements IProductSwitchItem { * @since 2.14.0 */ @slot({ type: HTMLElement }) - image!: Slot<HTMLElement[]>; + image!: Slot<HTMLElement>; _deactivate: () => void; diff --git a/packages/fiori/src/Search.ts b/packages/fiori/src/Search.ts index 9dd05354271e..c0604a9e8764 100755 --- a/packages/fiori/src/Search.ts +++ b/packages/fiori/src/Search.ts @@ -133,7 +133,7 @@ class Search extends SearchField { "default": true, invalidateOnChildChange: true, }) - items!: DefaultSlot<(SearchItem | SearchItemGroup)[]>; + items!: DefaultSlot<SearchItem | SearchItemGroup>; /** * Defines the popup footer action button. @@ -141,7 +141,7 @@ class Search extends SearchField { * @public */ @slot() - action!: Slot<Button[]>; + action!: Slot<Button>; /** * Defines the illustrated message to be shown in the popup. @@ -149,7 +149,7 @@ class Search extends SearchField { * @public */ @slot() - illustration!: Slot<IllustratedMessage[]>; + illustration!: Slot<IllustratedMessage>; /** * Defines the illustrated message to be shown in the popup. @@ -157,7 +157,7 @@ class Search extends SearchField { * @public */ @slot() - messageArea!: Slot<SearchMessageArea[]>; + messageArea!: Slot<SearchMessageArea>; /** * Indicates whether the items picker is open. diff --git a/packages/fiori/src/SearchField.ts b/packages/fiori/src/SearchField.ts index 7360ed9ea94f..c64fe8338cfb 100644 --- a/packages/fiori/src/SearchField.ts +++ b/packages/fiori/src/SearchField.ts @@ -182,7 +182,7 @@ class SearchField extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true, invalidateOnChildChange: true }) - scopes!: Slot<ISearchScope[]>; + scopes!: Slot<ISearchScope>; /** * Defines the filter button slot, used to display an additional filtering button. @@ -193,7 +193,7 @@ class SearchField extends UI5Element { * @since 2.11.0 */ @slot() - filterButton!: Slot<Button[]>; + filterButton!: Slot<Button>; /** * @private diff --git a/packages/fiori/src/SearchItem.ts b/packages/fiori/src/SearchItem.ts index fcb28157fd07..65d3f86c2ba5 100644 --- a/packages/fiori/src/SearchItem.ts +++ b/packages/fiori/src/SearchItem.ts @@ -126,7 +126,7 @@ class SearchItem extends ListItemBase { * @since 2.12.0 */ @slot() - image!: Slot<HTMLElement[]>; + image!: Slot<HTMLElement>; /** * Defines the actionable elements. @@ -140,7 +140,7 @@ class SearchItem extends ListItemBase { * @since 2.16.0 */ @slot() - actions!: Slot<HTMLElement[]>; + actions!: Slot<HTMLElement>; _markupText = ""; diff --git a/packages/fiori/src/ShellBar.ts b/packages/fiori/src/ShellBar.ts index f7ae3b930cf3..a911e435e5eb 100644 --- a/packages/fiori/src/ShellBar.ts +++ b/packages/fiori/src/ShellBar.ts @@ -482,7 +482,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - assistant!: Slot<IButton[]>; + assistant!: Slot<IButton>; /** * Defines the branding slot. @@ -495,7 +495,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - branding!: Slot<ShellBarBranding[]>; + branding!: Slot<ShellBarBranding>; /** * Defines the `ui5-shellbar` additional items. @@ -505,7 +505,7 @@ class ShellBar extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true, invalidateOnChildChange: true }) - items!: DefaultSlot<ShellBarItem[]>; + items!: DefaultSlot<ShellBarItem>; /** * You can pass `ui5-avatar` to set the profile image/icon. @@ -517,7 +517,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - profile!: Slot<HTMLElement[]>; + profile!: Slot<HTMLElement>; /** * Defines the logo of the `ui5-shellbar`. @@ -526,7 +526,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - logo!: Slot<HTMLElement[]>; + logo!: Slot<HTMLElement>; /** * Defines the items displayed in menu after a click on a start button. @@ -536,7 +536,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - menuItems!: Slot<ListItemBase[]>; + menuItems!: Slot<ListItemBase>; /** * Defines the `ui5-input`, that will be used as a search field. @@ -546,7 +546,7 @@ class ShellBar extends UI5Element { type: HTMLElement, invalidateOnChildChange: true, }) - searchField!: Slot<IShellBarSearchField[]>; + searchField!: Slot<IShellBarSearchField>; /** * Defines a `ui5-button` in the bar that will be placed in the beginning. @@ -555,7 +555,7 @@ class ShellBar extends UI5Element { * @public */ @slot() - startButton!: Slot<IButton[]>; + startButton!: Slot<IButton>; /** * The container is positioned in the center of the `ui5-shellbar` and occupies one-third of the total length of the `ui5-shellbar`. @@ -564,7 +564,7 @@ class ShellBar extends UI5Element { * @private */ @slot() - midContent!: Slot<HTMLElement[]>; + midContent!: Slot<HTMLElement>; /** * Define the items displayed in the content area. @@ -578,7 +578,7 @@ class ShellBar extends UI5Element { * @since 2.7.0 */ @slot({ type: HTMLElement, individualSlots: true }) - content!: Slot<HTMLElement[]>; + content!: Slot<HTMLElement>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/ShellBarBranding.ts b/packages/fiori/src/ShellBarBranding.ts index 290d3cfc63ab..5809f854c162 100644 --- a/packages/fiori/src/ShellBarBranding.ts +++ b/packages/fiori/src/ShellBarBranding.ts @@ -103,7 +103,7 @@ class ShellBarBranding extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * Defines the logo of the `ui5-shellbar`. @@ -111,7 +111,7 @@ class ShellBarBranding extends UI5Element { * @public */ @slot({ type: HTMLElement }) - logo!: Slot<HTMLElement[]>; + logo!: Slot<HTMLElement>; get parsedRef() { return (this.href && this.href.length > 0) ? this.href : undefined; diff --git a/packages/fiori/src/SideNavigation.ts b/packages/fiori/src/SideNavigation.ts index 3a5c2dfe1c57..ecc6ea098e70 100644 --- a/packages/fiori/src/SideNavigation.ts +++ b/packages/fiori/src/SideNavigation.ts @@ -1,6 +1,6 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js"; -import { createMultiInstanceChecker } from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js"; +import { createMultiInstanceChecker } from "@ui5/webcomponents-base/dist/util/createMultiInstanceChecker.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js"; import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js"; @@ -154,7 +154,7 @@ class SideNavigation extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<SideNavigationItemBase[]>; + items!: DefaultSlot<SideNavigationItemBase>; /** * Defines the fixed items at the bottom of the component. @@ -164,7 +164,7 @@ class SideNavigation extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - fixedItems!: Slot<SideNavigationItemBase[]>; + fixedItems!: Slot<SideNavigationItemBase>; /** * Defines the header of the `ui5-side-navigation`. @@ -175,7 +175,7 @@ class SideNavigation extends UI5Element { * @since 1.0.0-rc.11 */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; /** * @private diff --git a/packages/fiori/src/SideNavigationGroup.ts b/packages/fiori/src/SideNavigationGroup.ts index 3603dd6b400f..5897e2675883 100644 --- a/packages/fiori/src/SideNavigationGroup.ts +++ b/packages/fiori/src/SideNavigationGroup.ts @@ -68,7 +68,7 @@ class SideNavigationGroup extends SideNavigationItemBase { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<SideNavigationItem[]>; + items!: DefaultSlot<SideNavigationItem>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/SideNavigationItem.ts b/packages/fiori/src/SideNavigationItem.ts index b14423d2b3b5..bf2699ad4583 100644 --- a/packages/fiori/src/SideNavigationItem.ts +++ b/packages/fiori/src/SideNavigationItem.ts @@ -79,7 +79,7 @@ class SideNavigationItem extends SideNavigationSelectableItemBase { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<SideNavigationSubItem[]>; + items!: DefaultSlot<SideNavigationSubItem>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/Timeline.ts b/packages/fiori/src/Timeline.ts index 61d859deb484..db60574f78f8 100644 --- a/packages/fiori/src/Timeline.ts +++ b/packages/fiori/src/Timeline.ts @@ -165,7 +165,7 @@ class Timeline extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true, "default": true }) - items!: DefaultSlot<ITimelineItem[]>; + items!: DefaultSlot<ITimelineItem>; @query(".ui5-timeline-end-marker") timelineEndMarker!: HTMLElement; diff --git a/packages/fiori/src/TimelineGroupItem.ts b/packages/fiori/src/TimelineGroupItem.ts index f939c4e6e86d..2cc70f9d3a24 100644 --- a/packages/fiori/src/TimelineGroupItem.ts +++ b/packages/fiori/src/TimelineGroupItem.ts @@ -69,7 +69,7 @@ class TimelineGroupItem extends UI5Element implements ITimelineItem { * @public */ @slot({ type: HTMLElement, individualSlots: true, "default": true }) - items!: DefaultSlot<ITimelineItem[]>; + items!: DefaultSlot<ITimelineItem>; /** * Defines the items orientation. diff --git a/packages/fiori/src/TimelineItem.ts b/packages/fiori/src/TimelineItem.ts index bc52e2d42b1d..4b0a26dce81f 100644 --- a/packages/fiori/src/TimelineItem.ts +++ b/packages/fiori/src/TimelineItem.ts @@ -115,7 +115,7 @@ class TimelineItem extends UI5Element implements ITimelineItem { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<Node[]>; + content!: DefaultSlot<Node>; /** * @private diff --git a/packages/fiori/src/UploadCollection.ts b/packages/fiori/src/UploadCollection.ts index 795078ca7e8f..24b0704e8064 100644 --- a/packages/fiori/src/UploadCollection.ts +++ b/packages/fiori/src/UploadCollection.ts @@ -170,7 +170,7 @@ class UploadCollection extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: DefaultSlot<UploadCollectionItem[]>; + items!: DefaultSlot<UploadCollectionItem>; /** * Defines the `ui5-upload-collection` header. @@ -181,7 +181,7 @@ class UploadCollection extends UI5Element { * @public */ @slot({ type: HTMLElement }) - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; _bodyDnDHandler: DnDEventListener; diff --git a/packages/fiori/src/UploadCollectionItem.ts b/packages/fiori/src/UploadCollectionItem.ts index 9275ec3d17b4..7d77739817e9 100644 --- a/packages/fiori/src/UploadCollectionItem.ts +++ b/packages/fiori/src/UploadCollectionItem.ts @@ -226,7 +226,7 @@ class UploadCollectionItem extends ListItem { * @public */ @slot({ type: HTMLElement }) - thumbnail!: Slot<HTMLElement[]>; + thumbnail!: Slot<HTMLElement>; @i18n("@ui5/webcomponents-fiori") static i18nFioriBundle: I18nBundle; diff --git a/packages/fiori/src/UserMenu.ts b/packages/fiori/src/UserMenu.ts index 77a0fb82ca19..d5b56488dde0 100644 --- a/packages/fiori/src/UserMenu.ts +++ b/packages/fiori/src/UserMenu.ts @@ -206,7 +206,7 @@ class UserMenu extends UI5Element { type: HTMLElement, "default": true, }) - menuItems!: DefaultSlot<UserMenuItem[]>; + menuItems!: DefaultSlot<UserMenuItem>; /** * Defines the user accounts. @@ -222,7 +222,7 @@ class UserMenu extends UI5Element { slots: false, }, }) - accounts!: Slot<UserMenuAccount[]>; + accounts!: Slot<UserMenuAccount>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/UserMenuItem.ts b/packages/fiori/src/UserMenuItem.ts index 0061867a69cb..f459a2a08037 100644 --- a/packages/fiori/src/UserMenuItem.ts +++ b/packages/fiori/src/UserMenuItem.ts @@ -43,7 +43,7 @@ class UserMenuItem extends MenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - declare items: DefaultSlot<UserMenuItem[]>; + declare items: DefaultSlot<UserMenuItem>; get _menuItems() { return this.items.filter(isInstanceOfMenuItem); diff --git a/packages/fiori/src/UserSettingsAccountView.ts b/packages/fiori/src/UserSettingsAccountView.ts index 58b1438d5e44..b4166613edeb 100644 --- a/packages/fiori/src/UserSettingsAccountView.ts +++ b/packages/fiori/src/UserSettingsAccountView.ts @@ -64,7 +64,7 @@ class UserSettingsAccountView extends UserSettingsView { slots: false, }, }) - account!: Slot<UserMenuAccount[]>; + account!: Slot<UserMenuAccount>; /** * Defines if the User Menu shows the `Manage Account` option. diff --git a/packages/fiori/src/UserSettingsAppearanceView.ts b/packages/fiori/src/UserSettingsAppearanceView.ts index 61b160db0749..7d4cc822d042 100644 --- a/packages/fiori/src/UserSettingsAppearanceView.ts +++ b/packages/fiori/src/UserSettingsAppearanceView.ts @@ -64,7 +64,7 @@ class UserSettingsAppearanceView extends UserSettingsView { "default": true, invalidateOnChildChange: true, }) - items!: DefaultSlot<(UserSettingsAppearanceViewGroup | UserSettingsAppearanceViewItem)[]>; + items!: DefaultSlot<UserSettingsAppearanceViewGroup | UserSettingsAppearanceViewItem>; /** * Defines additional content displayed below the items list. @@ -74,7 +74,7 @@ class UserSettingsAppearanceView extends UserSettingsView { @slot({ type: HTMLElement, }) - additionalContent!: Slot<HTMLElement[]>; + additionalContent!: Slot<HTMLElement>; _getAllItems(): Array<UserSettingsAppearanceViewItem> { const allItems: Array<UserSettingsAppearanceViewItem> = []; diff --git a/packages/fiori/src/UserSettingsAppearanceViewGroup.ts b/packages/fiori/src/UserSettingsAppearanceViewGroup.ts index 2fc6a975a15e..97fb5652e914 100644 --- a/packages/fiori/src/UserSettingsAppearanceViewGroup.ts +++ b/packages/fiori/src/UserSettingsAppearanceViewGroup.ts @@ -35,7 +35,7 @@ class UserSettingsAppearanceViewGroup extends ListItemGroup { invalidateOnChildChange: true, type: HTMLElement, }) - declare items: DefaultSlot<UserSettingsAppearanceViewItem[]>; + declare items: DefaultSlot<UserSettingsAppearanceViewItem>; get isUserSettingsAppearanceViewGroup(): boolean { return true; diff --git a/packages/fiori/src/UserSettingsDialog.ts b/packages/fiori/src/UserSettingsDialog.ts index 7919935e82af..7564a5f05ae0 100644 --- a/packages/fiori/src/UserSettingsDialog.ts +++ b/packages/fiori/src/UserSettingsDialog.ts @@ -133,7 +133,7 @@ class UserSettingsDialog extends UI5Element { slots: true, }, }) - items!: DefaultSlot<UserSettingsItem[]>; + items!: DefaultSlot<UserSettingsItem>; /** * Defines the fixed user settings items. @@ -148,7 +148,7 @@ class UserSettingsDialog extends UI5Element { slots: true, }, }) - fixedItems!: Slot<UserSettingsItem[]>; + fixedItems!: Slot<UserSettingsItem>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/fiori/src/UserSettingsItem.ts b/packages/fiori/src/UserSettingsItem.ts index 1ba4b82cd906..91b022781109 100644 --- a/packages/fiori/src/UserSettingsItem.ts +++ b/packages/fiori/src/UserSettingsItem.ts @@ -168,7 +168,7 @@ class UserSettingsItem extends UI5Element { slots: false, }, }) - pages!: DefaultSlot<UserSettingsView[]>; + pages!: DefaultSlot<UserSettingsView>; /** * Defines the tab views of the user settings item. @@ -183,7 +183,7 @@ class UserSettingsItem extends UI5Element { slots: false, }, }) - tabs!: Slot<UserSettingsView[]>; + tabs!: Slot<UserSettingsView>; /** * Indicates whether any of the element siblings have icon. diff --git a/packages/fiori/src/UserSettingsView.ts b/packages/fiori/src/UserSettingsView.ts index c20a60e18133..c2c78899a77b 100644 --- a/packages/fiori/src/UserSettingsView.ts +++ b/packages/fiori/src/UserSettingsView.ts @@ -61,7 +61,7 @@ class UserSettingsView extends UI5Element { type: HTMLElement, "default": true, }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; } UserSettingsView.define(); diff --git a/packages/fiori/src/ViewSettingsDialog.ts b/packages/fiori/src/ViewSettingsDialog.ts index 897a1204b80c..2cfae5ed43fa 100644 --- a/packages/fiori/src/ViewSettingsDialog.ts +++ b/packages/fiori/src/ViewSettingsDialog.ts @@ -271,7 +271,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - sortItems!: Slot<SortItem[]>; + sortItems!: Slot<SortItem>; /** * Defines the `filterItems` list. @@ -280,7 +280,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - filterItems!: Slot<FilterItem[]>; + filterItems!: Slot<FilterItem>; /** * Defines the list of items against which the user could group data. @@ -289,7 +289,7 @@ class ViewSettingsDialog extends UI5Element { * @public */ @slot() - groupItems!: Slot<GroupItem[]>; + groupItems!: Slot<GroupItem>; @query("[ui5-list]") _list!: List; diff --git a/packages/fiori/src/Wizard.ts b/packages/fiori/src/Wizard.ts index 958f867dbcad..be4d7aa9dc73 100644 --- a/packages/fiori/src/Wizard.ts +++ b/packages/fiori/src/Wizard.ts @@ -260,7 +260,7 @@ class Wizard extends UI5Element { "individualSlots": true, invalidateOnChildChange: true, }) - steps!: DefaultSlot<WizardStep[]>; + steps!: DefaultSlot<WizardStep>; @i18n("@ui5/webcomponents-fiori") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Avatar.ts b/packages/main/src/Avatar.ts index a7748a2fdd60..e081924be043 100644 --- a/packages/main/src/Avatar.ts +++ b/packages/main/src/Avatar.ts @@ -237,7 +237,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { * @since 1.0.0-rc.15 */ @slot({ type: HTMLElement, "default": true }) - image!: DefaultSlot<HTMLElement[]>; + image!: DefaultSlot<HTMLElement>; /** * Defines the optional badge that will be used for visual affordance. @@ -248,7 +248,7 @@ class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem { * @since 1.7.0 */ @slot() - badge!: Slot<HTMLElement[]>; + badge!: Slot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/AvatarGroup.ts b/packages/main/src/AvatarGroup.ts index 20d67b6621c0..63de652011a6 100644 --- a/packages/main/src/AvatarGroup.ts +++ b/packages/main/src/AvatarGroup.ts @@ -238,7 +238,7 @@ class AvatarGroup extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - items!: DefaultSlot<IAvatarGroupItem[]>; + items!: DefaultSlot<IAvatarGroupItem>; /** * Defines the overflow button of the component. @@ -250,7 +250,7 @@ class AvatarGroup extends UI5Element { * @since 1.0.0-rc.13 */ @slot() - overflowButton!: Slot<IButton[]>; + overflowButton!: Slot<IButton>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Bar.ts b/packages/main/src/Bar.ts index 377f75f46cc8..682849ad1186 100644 --- a/packages/main/src/Bar.ts +++ b/packages/main/src/Bar.ts @@ -109,21 +109,21 @@ class Bar extends UI5Element { * @public */ @slot() - startContent!: Slot<HTMLElement[]>; + startContent!: Slot<HTMLElement>; /** * Defines the content in the middle of the bar. * @public */ @slot() - middleContent!: Slot<HTMLElement[]> + middleContent!: Slot<HTMLElement> /** * Defines the content at the end of the bar. * @public */ @slot() - endContent!: Slot<HTMLElement[]> + endContent!: Slot<HTMLElement> _handleResizeBound: () => void; diff --git a/packages/main/src/Breadcrumbs.ts b/packages/main/src/Breadcrumbs.ts index 816c91c78a8e..989092db4a80 100644 --- a/packages/main/src/Breadcrumbs.ts +++ b/packages/main/src/Breadcrumbs.ts @@ -148,7 +148,7 @@ class Breadcrumbs extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<BreadcrumbsItem[]>; + items!: DefaultSlot<BreadcrumbsItem>; _itemNavigation: ItemNavigation _onResizeHandler: ResizeObserverCallback; diff --git a/packages/main/src/BreadcrumbsItem.ts b/packages/main/src/BreadcrumbsItem.ts index e0051094adce..b1175a109be1 100644 --- a/packages/main/src/BreadcrumbsItem.ts +++ b/packages/main/src/BreadcrumbsItem.ts @@ -63,7 +63,7 @@ class BreadcrumbsItem extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Node[]>; + text!: DefaultSlot<Node>; _accessibleNameText?: string; _isCurrentPageItem?: boolean; diff --git a/packages/main/src/Button.ts b/packages/main/src/Button.ts index c1cc65d1a0b3..472add2425d4 100644 --- a/packages/main/src/Button.ts +++ b/packages/main/src/Button.ts @@ -382,7 +382,7 @@ class Button extends UI5Element implements IButton { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Node[]>; + text!: DefaultSlot<Node>; /** * Adds a badge to the button. @@ -390,7 +390,7 @@ class Button extends UI5Element implements IButton { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - badge!: Slot<ButtonBadge[]>; + badge!: Slot<ButtonBadge>; _deactivate: () => void; _onclickBound: (e: MouseEvent) => void; diff --git a/packages/main/src/Calendar.ts b/packages/main/src/Calendar.ts index 383c71837d16..7089649be053 100644 --- a/packages/main/src/Calendar.ts +++ b/packages/main/src/Calendar.ts @@ -321,7 +321,7 @@ class Calendar extends CalendarPart { * @since 1.23.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - calendarLegend!: Slot<CalendarLegend[]>; + calendarLegend!: Slot<CalendarLegend>; /** * Defines the selected date or dates (depending on the `selectionMode` property) @@ -330,7 +330,7 @@ class Calendar extends CalendarPart { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - dates!: DefaultSlot<ICalendarSelectedDates[]>; + dates!: DefaultSlot<ICalendarSelectedDates>; /** * Defines the special dates, visually emphasized in the calendar. @@ -338,7 +338,7 @@ class Calendar extends CalendarPart { * @since 1.23.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - specialDates!: Slot<SpecialCalendarDate[]>; + specialDates!: Slot<SpecialCalendarDate>; /** * Defines the disabled date ranges that cannot be selected in the calendar. @@ -348,7 +348,7 @@ class Calendar extends CalendarPart { * @since 2.16.0 */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - disabledDates!: Slot<CalendarDateRange[]>; + disabledDates!: Slot<CalendarDateRange>; /** * Defines the selected item type of the calendar legend item (if such exists). diff --git a/packages/main/src/CalendarLegend.ts b/packages/main/src/CalendarLegend.ts index 938ab807f572..cde10c6f05e6 100644 --- a/packages/main/src/CalendarLegend.ts +++ b/packages/main/src/CalendarLegend.ts @@ -104,7 +104,7 @@ class CalendarLegend extends UI5Element { individualSlots: true, "default": true, }) - items!: DefaultSlot<CalendarLegendItem[]>; + items!: DefaultSlot<CalendarLegendItem>; _itemNavigation!: ItemNavigation; _lastFocusedItemIndex: number | null; diff --git a/packages/main/src/Card.ts b/packages/main/src/Card.ts index ccaee1259e9d..b5b40de43ad1 100644 --- a/packages/main/src/Card.ts +++ b/packages/main/src/Card.ts @@ -73,7 +73,7 @@ class Card extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * Defines the header of the component. @@ -83,7 +83,7 @@ class Card extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true }) - header!: Slot<CardHeader[]>; + header!: Slot<CardHeader>; /** * Defines if a loading indicator would be displayed over the card. diff --git a/packages/main/src/CardHeader.ts b/packages/main/src/CardHeader.ts index e56f5f4fa554..dea46d4467f5 100644 --- a/packages/main/src/CardHeader.ts +++ b/packages/main/src/CardHeader.ts @@ -114,14 +114,14 @@ class CardHeader extends UI5Element { * @public */ @slot() - avatar!: Slot<HTMLElement[]>; + avatar!: Slot<HTMLElement>; /** * Defines an action, displayed in the right most part of the header. * @public */ @slot() - action!: Slot<HTMLElement[]>; + action!: Slot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Carousel.ts b/packages/main/src/Carousel.ts index df2421261fd7..cb04767dc8ef 100644 --- a/packages/main/src/Carousel.ts +++ b/packages/main/src/Carousel.ts @@ -321,7 +321,7 @@ class Carousel extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, individualSlots: true }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ColorPalette.ts b/packages/main/src/ColorPalette.ts index 07e8cdb11635..6d72f0e72ebb 100644 --- a/packages/main/src/ColorPalette.ts +++ b/packages/main/src/ColorPalette.ts @@ -184,7 +184,7 @@ class ColorPalette extends UI5Element { invalidateOnChildChange: true, individualSlots: true, }) - colors!: DefaultSlot<IColorPaletteItem[]>; + colors!: DefaultSlot<IColorPaletteItem>; _itemNavigation: ItemNavigation; _itemNavigationRecentColors: ItemNavigation; diff --git a/packages/main/src/ColorPalettePopover.ts b/packages/main/src/ColorPalettePopover.ts index 782f5e72cd04..004c96421145 100644 --- a/packages/main/src/ColorPalettePopover.ts +++ b/packages/main/src/ColorPalettePopover.ts @@ -139,7 +139,7 @@ class ColorPalettePopover extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, individualSlots: true }) - colors!: DefaultSlot<IColorPaletteItem[]>; + colors!: DefaultSlot<IColorPaletteItem>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts index 37a192c97089..1763e784a512 100644 --- a/packages/main/src/ComboBox.ts +++ b/packages/main/src/ComboBox.ts @@ -424,7 +424,7 @@ class ComboBox extends UI5Element implements IFormInputElement { individualSlots: true, invalidateOnChildChange: true, }) - items!: DefaultSlot<IComboBoxItem[]>; + items!: DefaultSlot<IComboBoxItem>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -438,7 +438,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; /** * Defines the icon to be displayed in the input field. @@ -446,7 +446,7 @@ class ComboBox extends UI5Element implements IFormInputElement { * @since 1.0.0-rc.9 */ @slot() - icon!: Slot<IIcon[]>; + icon!: Slot<IIcon>; _initialRendering = true; _itemFocused = false; diff --git a/packages/main/src/ComboBoxItemGroup.ts b/packages/main/src/ComboBoxItemGroup.ts index 4f2c4afbac11..f00c8846fa95 100644 --- a/packages/main/src/ComboBoxItemGroup.ts +++ b/packages/main/src/ComboBoxItemGroup.ts @@ -34,7 +34,7 @@ class ComboBoxItemGroup extends ListItemGroup implements IComboBoxItem { individualSlots: true, type: HTMLElement, }) - items!: DefaultSlot<ComboBoxItem[]>; + items!: DefaultSlot<ComboBoxItem>; get isGroupItem(): boolean { return true; diff --git a/packages/main/src/DatePicker.ts b/packages/main/src/DatePicker.ts index 9bc082bf4369..6f036621439e 100644 --- a/packages/main/src/DatePicker.ts +++ b/packages/main/src/DatePicker.ts @@ -388,7 +388,7 @@ class DatePicker extends DateComponentBase implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; responsivePopover?: ResponsivePopover; diff --git a/packages/main/src/Dialog.ts b/packages/main/src/Dialog.ts index d794190d876e..d74c8f4f6bdd 100644 --- a/packages/main/src/Dialog.ts +++ b/packages/main/src/Dialog.ts @@ -209,7 +209,7 @@ class Dialog extends Popup { * @public */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; /** * Defines the footer HTML Element. @@ -218,7 +218,7 @@ class Dialog extends Popup { * @public */ @slot() - footer!: Slot<HTMLElement[]>; + footer!: Slot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/FileUploader.ts b/packages/main/src/FileUploader.ts index d6abe4dcca8a..1c55c49063d3 100644 --- a/packages/main/src/FileUploader.ts +++ b/packages/main/src/FileUploader.ts @@ -272,7 +272,7 @@ class FileUploader extends UI5Element implements IFormInputElement { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -285,7 +285,7 @@ class FileUploader extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; @query(".ui5-file-uploader-form") _form!: HTMLFormElement; diff --git a/packages/main/src/Form.ts b/packages/main/src/Form.ts index 328b73047dbd..0ba83a4f5b20 100644 --- a/packages/main/src/Form.ts +++ b/packages/main/src/Form.ts @@ -345,7 +345,7 @@ class Form extends UI5Element { * @public */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; /** * Defines the component content - FormGroups or FormItems. @@ -360,7 +360,7 @@ class Form extends UI5Element { individualSlots: true, invalidateOnChildChange: true, }) - items!: DefaultSlot<IFormItem[]>; + items!: DefaultSlot<IFormItem>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/FormGroup.ts b/packages/main/src/FormGroup.ts index ff5f5fbc9c13..ad4fca57e719 100644 --- a/packages/main/src/FormGroup.ts +++ b/packages/main/src/FormGroup.ts @@ -100,7 +100,7 @@ class FormGroup extends UI5Element implements IFormItem { type: HTMLElement, "default": true, }) - items!: DefaultSlot<FormItem[]>; + items!: DefaultSlot<FormItem>; /** * @private diff --git a/packages/main/src/FormItem.ts b/packages/main/src/FormItem.ts index 1e450f61f3c2..2615cb0b2ce1 100644 --- a/packages/main/src/FormItem.ts +++ b/packages/main/src/FormItem.ts @@ -67,7 +67,7 @@ class FormItem extends UI5Element implements IFormItem { * @public */ @slot() - labelContent!: Slot<HTMLElement[]>; + labelContent!: Slot<HTMLElement>; /** * Defines the content of the component, @@ -79,7 +79,7 @@ class FormItem extends UI5Element implements IFormItem { "default": true, individualSlots: true, }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * @private diff --git a/packages/main/src/Input.ts b/packages/main/src/Input.ts index 4cb9d5be6d1c..6837995bff4e 100644 --- a/packages/main/src/Input.ts +++ b/packages/main/src/Input.ts @@ -586,14 +586,14 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement * @public */ @slot({ type: HTMLElement, "default": true }) - suggestionItems!: DefaultSlot<IInputSuggestionItem[]>; + suggestionItems!: DefaultSlot<IInputSuggestionItem>; /** * Defines the icon to be displayed in the component. * @public */ @slot() - icon!: Slot<IIcon[]>; + icon!: Slot<IIcon>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -613,7 +613,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement type: HTMLElement, invalidateOnChildChange: true, }) - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; hasSuggestionItemSelected: boolean; valueBeforeItemSelection: string; diff --git a/packages/main/src/List.ts b/packages/main/src/List.ts index 0602f6dbd8d5..e081e5f419c0 100644 --- a/packages/main/src/List.ts +++ b/packages/main/src/List.ts @@ -523,7 +523,7 @@ class List extends UI5Element { "default": true, invalidateOnChildChange: true, }) - items!: DefaultSlot<(ListItemBase | ListItemGroup)[]>; + items!: DefaultSlot<ListItemBase | ListItemGroup>; /** * Defines the component header. @@ -533,7 +533,7 @@ class List extends UI5Element { * @public */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ListItem.ts b/packages/main/src/ListItem.ts index 84cf9c2348a6..6e78fea4e0eb 100644 --- a/packages/main/src/ListItem.ts +++ b/packages/main/src/ListItem.ts @@ -211,7 +211,7 @@ abstract class ListItem extends ListItemBase { * @public */ @slot() - deleteButton!: Slot<IButton[]>; + deleteButton!: Slot<IButton>; deactivateByKey: (e: KeyboardEvent) => void; deactivate: () => void; diff --git a/packages/main/src/ListItemGroup.ts b/packages/main/src/ListItemGroup.ts index 44b43df4cc19..81b74e0ef46e 100644 --- a/packages/main/src/ListItemGroup.ts +++ b/packages/main/src/ListItemGroup.ts @@ -110,7 +110,7 @@ class ListItemGroup extends UI5Element { invalidateOnChildChange: true, type: HTMLElement, }) - items!: DefaultSlot<ListItemBase[]>; + items!: DefaultSlot<ListItemBase>; /** * Defines if the text of the component should wrap when it's too long. @@ -146,7 +146,7 @@ class ListItemGroup extends UI5Element { * @public */ @slot() - header!: Slot<ListItemBase[]>; + header!: Slot<ListItemBase>; _dragAndDropHandler: DragAndDropHandler; diff --git a/packages/main/src/ListItemGroupHeader.ts b/packages/main/src/ListItemGroupHeader.ts index adce8ce1fcd2..c38531e25710 100644 --- a/packages/main/src/ListItemGroupHeader.ts +++ b/packages/main/src/ListItemGroupHeader.ts @@ -99,7 +99,7 @@ class ListItemGroupHeader extends ListItemBase { expandableTextTemplate?: ExpandableTextTemplate; @slot() - subItems!: Slot<HTMLElement[]>; + subItems!: Slot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/ListItemStandard.ts b/packages/main/src/ListItemStandard.ts index 9e5c8166bf85..5cb370644fd4 100644 --- a/packages/main/src/ListItemStandard.ts +++ b/packages/main/src/ListItemStandard.ts @@ -181,7 +181,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * @public */ @slot({ type: Node, "default": true }) - content!: DefaultSlot<Node[]>; + content!: DefaultSlot<Node>; /** * **Note:** While the slot allows option for setting custom avatar, to match the @@ -193,7 +193,7 @@ class ListItemStandard extends ListItem implements IAccessibleListItem { * @public */ @slot() - image!: Slot<HTMLElement[]>; + image!: Slot<HTMLElement>; onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/main/src/Menu.ts b/packages/main/src/Menu.ts index 577a56e0b7ea..1f3e1c1f6521 100644 --- a/packages/main/src/Menu.ts +++ b/packages/main/src/Menu.ts @@ -255,7 +255,7 @@ class Menu extends UI5Element { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: DefaultSlot<IMenuItem[]>; + items!: DefaultSlot<IMenuItem>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MenuItem.ts b/packages/main/src/MenuItem.ts index 470e7735d68d..c80800c7f11b 100644 --- a/packages/main/src/MenuItem.ts +++ b/packages/main/src/MenuItem.ts @@ -292,7 +292,7 @@ class MenuItem extends ListItem implements IMenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: DefaultSlot<IMenuItem[]>; + items!: DefaultSlot<IMenuItem>; /** * Defines the components that should be displayed at the end of the menu item. @@ -312,7 +312,7 @@ class MenuItem extends ListItem implements IMenuItem { * @since 2.0.0 */ @slot() - endContent!: Slot<HTMLElement[]>; + endContent!: Slot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MenuItemGroup.ts b/packages/main/src/MenuItemGroup.ts index e0eb38e9c1a5..f86009808202 100644 --- a/packages/main/src/MenuItemGroup.ts +++ b/packages/main/src/MenuItemGroup.ts @@ -69,7 +69,7 @@ class MenuItemGroup extends UI5Element implements IMenuItem { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - items!: DefaultSlot<IMenuItem[]>; + items!: DefaultSlot<IMenuItem>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MessageStrip.ts b/packages/main/src/MessageStrip.ts index dac0678d1360..f891922552ca 100644 --- a/packages/main/src/MessageStrip.ts +++ b/packages/main/src/MessageStrip.ts @@ -146,7 +146,7 @@ class MessageStrip extends UI5Element { * @public */ @slot() - icon!: Slot<IIcon[]>; + icon!: Slot<IIcon>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/MultiComboBox.ts b/packages/main/src/MultiComboBox.ts index 917d15ca3200..6bc747525246 100644 --- a/packages/main/src/MultiComboBox.ts +++ b/packages/main/src/MultiComboBox.ts @@ -516,7 +516,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { invalidateOnChildChange: true, individualSlots: true, }) - items!: DefaultSlot<IMultiComboBoxItem[]>; + items!: DefaultSlot<IMultiComboBoxItem>; /** * Defines the icon to be displayed in the component. @@ -524,7 +524,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { * @since 1.0.0-rc.9 */ @slot() - icon!: Slot<IIcon[]>; + icon!: Slot<IIcon>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -538,7 +538,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; selectedValues: Array<IMultiComboBoxItem>; _inputLastValue: string; diff --git a/packages/main/src/MultiComboBoxItemGroup.ts b/packages/main/src/MultiComboBoxItemGroup.ts index 8490072cb693..6de62070b663 100644 --- a/packages/main/src/MultiComboBoxItemGroup.ts +++ b/packages/main/src/MultiComboBoxItemGroup.ts @@ -34,7 +34,7 @@ class MultiComboBoxItemGroup extends ComboBoxItemGroup implements IMultiComboBox individualSlots: true, type: HTMLElement, }) - items!: DefaultSlot<MultiComboBoxItem[]>; + items!: DefaultSlot<MultiComboBoxItem>; /** * Used to avoid tag name checks diff --git a/packages/main/src/MultiInput.ts b/packages/main/src/MultiInput.ts index 303899d19669..cdac243a580b 100644 --- a/packages/main/src/MultiInput.ts +++ b/packages/main/src/MultiInput.ts @@ -151,7 +151,7 @@ class MultiInput extends Input implements IFormInputElement { * @public */ @slot({ type: HTMLElement, individualSlots: true }) - tokens!: Slot<IToken[]>; + tokens!: Slot<IToken>; _skipOpenSuggestions: boolean; _valueHelpIconPressed: boolean; diff --git a/packages/main/src/Option.ts b/packages/main/src/Option.ts index 5dee908ee0ad..7d7d2eaeec20 100644 --- a/packages/main/src/Option.ts +++ b/packages/main/src/Option.ts @@ -48,7 +48,7 @@ class Option extends ListItemBase implements IOption { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - text!: DefaultSlot<Node[]>; + text!: DefaultSlot<Node>; /** * Defines the value of the `ui5-select` inside an HTML Form element when this component is selected. diff --git a/packages/main/src/OptionCustom.ts b/packages/main/src/OptionCustom.ts index 171c6d191832..daedc153314b 100644 --- a/packages/main/src/OptionCustom.ts +++ b/packages/main/src/OptionCustom.ts @@ -63,7 +63,7 @@ class OptionCustom extends ListItemBase implements IOption { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - content!: DefaultSlot<Node[]>; + content!: DefaultSlot<Node>; /** * Defines the tooltip of the option. diff --git a/packages/main/src/Panel.ts b/packages/main/src/Panel.ts index a8f74ca5d455..ff9ebba59eb9 100644 --- a/packages/main/src/Panel.ts +++ b/packages/main/src/Panel.ts @@ -206,7 +206,7 @@ class Panel extends UI5Element { * @public */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Popover.ts b/packages/main/src/Popover.ts index 7cbe92c11865..37d3379583d4 100644 --- a/packages/main/src/Popover.ts +++ b/packages/main/src/Popover.ts @@ -210,14 +210,14 @@ class Popover extends Popup { * @public */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; /** * Defines the footer HTML Element. * @public */ @slot() - footer!: Slot<HTMLElement[]>; + footer!: Slot<HTMLElement>; _opener?: HTMLElement | string | null | undefined; _openerRect?: DOMRect; diff --git a/packages/main/src/Popup.ts b/packages/main/src/Popup.ts index 5d4128d23d0d..3c89d5c86f9e 100644 --- a/packages/main/src/Popup.ts +++ b/packages/main/src/Popup.ts @@ -234,7 +234,7 @@ abstract class Popup extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - content!: DefaultSlot<HTMLElement[]>; + content!: DefaultSlot<HTMLElement>; /** * @private diff --git a/packages/main/src/SegmentedButton.ts b/packages/main/src/SegmentedButton.ts index e4bf140a3749..1dc3fa61cb00 100644 --- a/packages/main/src/SegmentedButton.ts +++ b/packages/main/src/SegmentedButton.ts @@ -149,7 +149,7 @@ class SegmentedButton extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<ISegmentedButtonItem[]>; + items!: DefaultSlot<ISegmentedButtonItem>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/SegmentedButtonItem.ts b/packages/main/src/SegmentedButtonItem.ts index 80d1b3a300de..1bcb0e005c1a 100644 --- a/packages/main/src/SegmentedButtonItem.ts +++ b/packages/main/src/SegmentedButtonItem.ts @@ -176,7 +176,7 @@ class SegmentedButtonItem extends UI5Element implements IButton, ISegmentedButto * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Node[]>; + text!: DefaultSlot<Node>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Select.ts b/packages/main/src/Select.ts index 59f4fd26475f..25fa0295329a 100644 --- a/packages/main/src/Select.ts +++ b/packages/main/src/Select.ts @@ -399,7 +399,7 @@ class Select extends UI5Element implements IFormInputElement { * @public */ @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true }) - options!: DefaultSlot<IOption[]>; + options!: DefaultSlot<IOption>; /** * Defines the value state message that will be displayed as pop up under the component. @@ -414,7 +414,7 @@ class Select extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; /** * Defines the HTML element that will be displayed in the component input part, @@ -429,7 +429,7 @@ class Select extends UI5Element implements IFormInputElement { * @since 1.17.0 */ @slot() - label!: Slot<HTMLElement[]>; + label!: Slot<HTMLElement>; get formValidityMessage() { return Select.i18nBundle.getText(FORM_SELECTABLE_REQUIRED); diff --git a/packages/main/src/SplitButton.ts b/packages/main/src/SplitButton.ts index 3bc360ab150e..1af8e659a46c 100644 --- a/packages/main/src/SplitButton.ts +++ b/packages/main/src/SplitButton.ts @@ -249,7 +249,7 @@ class SplitButton extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Node[]>; + text!: DefaultSlot<Node>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/StepInput.ts b/packages/main/src/StepInput.ts index 7e7a0143577f..1c451e2210af 100644 --- a/packages/main/src/StepInput.ts +++ b/packages/main/src/StepInput.ts @@ -297,7 +297,7 @@ class StepInput extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; _initialValueState?: `${ValueState}`; diff --git a/packages/main/src/SuggestionItemCustom.ts b/packages/main/src/SuggestionItemCustom.ts index 6735900a529f..4069cc611eb6 100644 --- a/packages/main/src/SuggestionItemCustom.ts +++ b/packages/main/src/SuggestionItemCustom.ts @@ -50,7 +50,7 @@ class SuggestionItemCustom extends ListItemBase implements IInputSuggestionItemS * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - content!: DefaultSlot<Node[]>; + content!: DefaultSlot<Node>; get _effectiveTabIndex() { return -1; diff --git a/packages/main/src/SuggestionItemGroup.ts b/packages/main/src/SuggestionItemGroup.ts index 3ab63beabb34..3c03ff18fd73 100644 --- a/packages/main/src/SuggestionItemGroup.ts +++ b/packages/main/src/SuggestionItemGroup.ts @@ -28,7 +28,7 @@ class SuggestionItemGroup extends ListItemGroup { invalidateOnChildChange: true, type: HTMLElement, }) - items!: DefaultSlot<SuggestionListItem[]>; + items!: DefaultSlot<SuggestionListItem>; } SuggestionItemGroup.define(); diff --git a/packages/main/src/SuggestionListItem.ts b/packages/main/src/SuggestionListItem.ts index 01dc53ee95e0..c8db0e49e072 100644 --- a/packages/main/src/SuggestionListItem.ts +++ b/packages/main/src/SuggestionListItem.ts @@ -28,14 +28,14 @@ class SuggestionListItem extends ListItemStandard { * @public */ @slot() - richDescription!: Slot<HTMLElement[]>; + richDescription!: Slot<HTMLElement>; /** * Defines the title text of the suggestion item. * @public */ @slot({ type: Node, "default": true }) - titleText!: DefaultSlot<Node[]>; + titleText!: DefaultSlot<Node>; onBeforeRendering() { super.onBeforeRendering(); diff --git a/packages/main/src/Tab.ts b/packages/main/src/Tab.ts index e2277466e6a7..2ca1a6e2fe29 100644 --- a/packages/main/src/Tab.ts +++ b/packages/main/src/Tab.ts @@ -163,7 +163,7 @@ class Tab extends UI5Element implements ITabbable, ITab { slots: false, }, }) - content!: DefaultSlot<Node[]>; + content!: DefaultSlot<Node>; /** * Defines hierarchies with nested sub tabs. @@ -179,7 +179,7 @@ class Tab extends UI5Element implements ITabbable, ITab { slots: false, }, }) - items!: Slot<ITab[]>; + items!: Slot<ITab>; _isInline?: boolean; _forcedMixedMode?: boolean; diff --git a/packages/main/src/TabContainer.ts b/packages/main/src/TabContainer.ts index e641754208e0..58805fae48ee 100644 --- a/packages/main/src/TabContainer.ts +++ b/packages/main/src/TabContainer.ts @@ -329,7 +329,7 @@ class TabContainer extends UI5Element { slots: true, }, }) - items!: DefaultSlot<ITab[]>; + items!: DefaultSlot<ITab>; /** * Defines the button which will open the overflow menu. If nothing is provided to this slot, @@ -338,7 +338,7 @@ class TabContainer extends UI5Element { * @since 1.0.0-rc.9 */ @slot() - overflowButton!: Slot<IButton[]>; + overflowButton!: Slot<IButton>; /** * Defines the button which will open the start overflow menu if available. If nothing is provided to this slot, @@ -347,7 +347,7 @@ class TabContainer extends UI5Element { * @since 1.1.0 */ @slot() - startOverflowButton!: Slot<IButton[]>; + startOverflowButton!: Slot<IButton>; _itemNavigation: ItemNavigation; _itemsFlat: Array<ITab> = []; diff --git a/packages/main/src/Table.ts b/packages/main/src/Table.ts index e955a8afe255..501bddd81677 100644 --- a/packages/main/src/Table.ts +++ b/packages/main/src/Table.ts @@ -278,7 +278,7 @@ class Table extends UI5Element { slots: false, }, }) - rows!: DefaultSlot<TableRow[]>; + rows!: DefaultSlot<TableRow>; /** * Defines the header row of the component. @@ -288,7 +288,7 @@ class Table extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: { properties: false, slots: true } }) - headerRow!: Slot<TableHeaderRow[]>; + headerRow!: Slot<TableHeaderRow>; /** * Defines the custom visualization if there is no data available. @@ -296,7 +296,7 @@ class Table extends UI5Element { * @public */ @slot() - noData!: Slot<HTMLElement[]>; + noData!: Slot<HTMLElement>; /** * Defines the features of the component. @@ -304,7 +304,7 @@ class Table extends UI5Element { * @public */ @slot({ type: HTMLElement, individualSlots: true }) - features!: Slot<ITableFeature[]>; + features!: Slot<ITableFeature>; /** * Defines the accessible ARIA name of the component. diff --git a/packages/main/src/TableCellBase.ts b/packages/main/src/TableCellBase.ts index e26416803e14..97b179dbcebc 100644 --- a/packages/main/src/TableCellBase.ts +++ b/packages/main/src/TableCellBase.ts @@ -28,7 +28,7 @@ abstract class TableCellBase extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - content!: DefaultSlot<Node[]>; + content!: DefaultSlot<Node>; /** * Determines the horizontal alignment of table cells. diff --git a/packages/main/src/TableHeaderCell.ts b/packages/main/src/TableHeaderCell.ts index d79dd8eaa5cc..b6065cd016d5 100644 --- a/packages/main/src/TableHeaderCell.ts +++ b/packages/main/src/TableHeaderCell.ts @@ -121,7 +121,7 @@ class TableHeaderCell extends TableCellBase { * @since 2.8.0 */ @slot() - action!: Slot<TableHeaderCellActionBase[]>; + action!: Slot<TableHeaderCellActionBase>; @query("slot:not([name])") _defaultSlot!: HTMLSlotElement; diff --git a/packages/main/src/TableHeaderRow.ts b/packages/main/src/TableHeaderRow.ts index 12f0d460ac15..b74ed87b799a 100644 --- a/packages/main/src/TableHeaderRow.ts +++ b/packages/main/src/TableHeaderRow.ts @@ -63,7 +63,7 @@ class TableHeaderRow extends TableRowBase<TableHeaderCell> { }, individualSlots: true, }) - cells!: DefaultSlot<TableHeaderCell[]>; + cells!: DefaultSlot<TableHeaderCell>; /** * Sticks the `ui5-table-header-row` to the top of a table. diff --git a/packages/main/src/TableRow.ts b/packages/main/src/TableRow.ts index 251d216ac844..2ccab661520b 100644 --- a/packages/main/src/TableRow.ts +++ b/packages/main/src/TableRow.ts @@ -53,7 +53,7 @@ class TableRow extends TableRowBase<TableCell> { slots: false, }, }) - cells!: DefaultSlot<TableCell[]>; + cells!: DefaultSlot<TableCell>; /** * Defines the actions of the component. @@ -67,7 +67,7 @@ class TableRow extends TableRowBase<TableCell> { type: HTMLElement, individualSlots: true, }) - actions!: Slot<TableRowActionBase[]>; + actions!: Slot<TableRowActionBase>; /** * Unique identifier of the row. diff --git a/packages/main/src/Tag.ts b/packages/main/src/Tag.ts index 00819f7dc7ba..472c8cf9363f 100644 --- a/packages/main/src/Tag.ts +++ b/packages/main/src/Tag.ts @@ -160,14 +160,14 @@ class Tag extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Node[]>; + text!: DefaultSlot<Node>; /** * Defines the icon to be displayed in the component. * @public */ @slot() - icon!: Slot<IIcon[]>; + icon!: Slot<IIcon>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Text.ts b/packages/main/src/Text.ts index 58ebe671abe8..99ee046f7c5b 100644 --- a/packages/main/src/Text.ts +++ b/packages/main/src/Text.ts @@ -76,7 +76,7 @@ class Text extends UI5Element { * @public */ @slot({ type: Node, "default": true }) - text!: DefaultSlot<Node[]>; + text!: DefaultSlot<Node>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/TextArea.ts b/packages/main/src/TextArea.ts index 29580843f691..9de830fe48f8 100644 --- a/packages/main/src/TextArea.ts +++ b/packages/main/src/TextArea.ts @@ -338,7 +338,7 @@ class TextArea extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; _fnOnResize: ResizeObserverCallback; _firstRendering: boolean; diff --git a/packages/main/src/TimePicker.ts b/packages/main/src/TimePicker.ts index 0c997231af8a..e9f0697984e4 100644 --- a/packages/main/src/TimePicker.ts +++ b/packages/main/src/TimePicker.ts @@ -340,7 +340,7 @@ class TimePicker extends UI5Element implements IFormInputElement { * @public */ @slot() - valueStateMessage!: Slot<HTMLElement[]>; + valueStateMessage!: Slot<HTMLElement>; @query("[ui5-time-selection-clocks]") _timeSelectionClocks?: TimeSelectionClocks; diff --git a/packages/main/src/Token.ts b/packages/main/src/Token.ts index 0c59dcebc37b..352119238981 100644 --- a/packages/main/src/Token.ts +++ b/packages/main/src/Token.ts @@ -141,7 +141,7 @@ class Token extends UI5Element implements IToken { * @since 1.0.0-rc.9 */ @slot() - closeIcon!: Slot<IIcon[]>; + closeIcon!: Slot<IIcon>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Tokenizer.ts b/packages/main/src/Tokenizer.ts index cbf1565b64c4..f472da6c557f 100644 --- a/packages/main/src/Tokenizer.ts +++ b/packages/main/src/Tokenizer.ts @@ -351,7 +351,7 @@ class Tokenizer extends UI5Element implements IFormInputElement { slots: false, }, }) - tokens!: DefaultSlot<Token[]>; + tokens!: DefaultSlot<Token>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/Toolbar.ts b/packages/main/src/Toolbar.ts index 022e4f0e1dc5..39740f4f2415 100644 --- a/packages/main/src/Toolbar.ts +++ b/packages/main/src/Toolbar.ts @@ -156,7 +156,7 @@ class Toolbar extends UI5Element { @slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true, individualSlots: true, }) - items!: DefaultSlot<ToolbarItem[]> + items!: DefaultSlot<ToolbarItem> _onResize!: ResizeObserverCallback; _onCloseOverflow!: EventListener; diff --git a/packages/main/src/ToolbarSelect.ts b/packages/main/src/ToolbarSelect.ts index 647d7a765ef9..554e35135f8d 100644 --- a/packages/main/src/ToolbarSelect.ts +++ b/packages/main/src/ToolbarSelect.ts @@ -94,7 +94,7 @@ class ToolbarSelect extends ToolbarItem { type: HTMLElement, invalidateOnChildChange: true, }) - options!: DefaultSlot<ToolbarSelectOption[]>; + options!: DefaultSlot<ToolbarSelectOption>; /** * Defines the HTML element that will be displayed in the component input part, @@ -103,7 +103,7 @@ class ToolbarSelect extends ToolbarItem { * @since 2.15.0 */ @slot() - label!: Slot<HTMLElement[]>; + label!: Slot<HTMLElement>; /** * Defines the value state of the component. diff --git a/packages/main/src/ToolbarSelectOption.ts b/packages/main/src/ToolbarSelectOption.ts index ac65e2df0918..d89aed22e697 100644 --- a/packages/main/src/ToolbarSelectOption.ts +++ b/packages/main/src/ToolbarSelectOption.ts @@ -59,7 +59,7 @@ class ToolbarSelectOption extends UI5Element { * @public */ @slot({ type: Node, "default": true, invalidateOnChildChange: true }) - text!: DefaultSlot<Node[]>; + text!: DefaultSlot<Node>; } ToolbarSelectOption.define(); diff --git a/packages/main/src/Tree.ts b/packages/main/src/Tree.ts index 74bf869c4f79..480fc1d7846a 100644 --- a/packages/main/src/Tree.ts +++ b/packages/main/src/Tree.ts @@ -297,7 +297,7 @@ class Tree extends UI5Element { * @public */ @slot({ type: HTMLElement, invalidateOnChildChange: true, "default": true }) - items!: DefaultSlot<TreeItemBase[]>; + items!: DefaultSlot<TreeItemBase>; /** * Defines the component header. @@ -307,7 +307,7 @@ class Tree extends UI5Element { * @public */ @slot() - header!: Slot<HTMLElement[]>; + header!: Slot<HTMLElement>; _dragAndDropHandler: DragAndDropHandler; diff --git a/packages/main/src/TreeItemBase.ts b/packages/main/src/TreeItemBase.ts index 57f39fd8d538..ece12b368d7c 100644 --- a/packages/main/src/TreeItemBase.ts +++ b/packages/main/src/TreeItemBase.ts @@ -216,7 +216,7 @@ class TreeItemBase extends ListItem { }, "default": true, }) - items!: DefaultSlot<TreeItemBase[]>; + items!: DefaultSlot<TreeItemBase>; /** * **Note:** While the slot allows option for setting custom avatar, to match the @@ -228,7 +228,7 @@ class TreeItemBase extends ListItem { * @public */ @slot() - image!: Slot<HTMLElement[]>; + image!: Slot<HTMLElement>; @i18n("@ui5/webcomponents") static i18nBundle: I18nBundle; diff --git a/packages/main/src/TreeItemCustom.ts b/packages/main/src/TreeItemCustom.ts index fff945e2a639..b3cd2d02e4fa 100644 --- a/packages/main/src/TreeItemCustom.ts +++ b/packages/main/src/TreeItemCustom.ts @@ -56,7 +56,7 @@ class TreeItemCustom extends TreeItemBase { * @public */ @slot() - content!: Slot<HTMLElement[]>; + content!: Slot<HTMLElement>; _onkeydown(e: KeyboardEvent) { if (isDown(e) && this.content?.some(el => el.contains(e.target as Node))) { From 037d08c679cce5b72f1d0188d18737b721fad110 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Wed, 4 Feb 2026 16:01:15 +0200 Subject: [PATCH 12/14] chore: update cem handling of slot types --- .../tools/lib/cem/custom-elements-manifest.config.mjs | 2 ++ packages/tools/lib/cem/utils.mjs | 11 +++++++---- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/packages/tools/lib/cem/custom-elements-manifest.config.mjs b/packages/tools/lib/cem/custom-elements-manifest.config.mjs index ba7344ccb441..e624a00d3bcb 100644 --- a/packages/tools/lib/cem/custom-elements-manifest.config.mjs +++ b/packages/tools/lib/cem/custom-elements-manifest.config.mjs @@ -17,6 +17,7 @@ import { getTypeRefs, normalizeDescription, formatArrays, + formatSlotTypes, isClass, normalizeTagType, logDocumentationError, @@ -195,6 +196,7 @@ function processClass(ts, classNode, moduleDoc) { if (member.type?.text) { member.type.text = formatArrays(member.type.text); + member.type.text = formatSlotTypes(member.type.text); } if (member.type && typeRefs.length) { diff --git a/packages/tools/lib/cem/utils.mjs b/packages/tools/lib/cem/utils.mjs index 6de2e5e89300..6e27c25be65e 100644 --- a/packages/tools/lib/cem/utils.mjs +++ b/packages/tools/lib/cem/utils.mjs @@ -396,10 +396,12 @@ const displayDocumentationErrors = () => { } const formatArrays = (typeText) => { - return typeText?.replace(/(Default)?Slot<(.+?)\[\]>/g, (match, prefix, innerType) => { - const cleanedType = innerType.replace(/^\((.+)\)$/, '$1'); - return `Array<${cleanedType}>`; - }).replaceAll(/(\S+)\[\]/g, "Array<$1>"); + return typeText?.replaceAll(/(\S+)\[\]/g, "Array<$1>"); +} + +// Convert Slot<T> and DefaultSlot<T> to Array<T> (the array is built into these types) +const formatSlotTypes = (typeText) => { + return typeText?.replace(/(Default)?Slot<(.+?)>/g, 'Array<$2>'); } export { @@ -418,6 +420,7 @@ export { getTypeRefs, normalizeDescription, formatArrays, + formatSlotTypes, isClass, normalizeTagType, displayDocumentationErrors, From 4742369d5bcb6484fbf870b7097d67db54546a7a Mon Sep 17 00:00:00 2001 From: ilhan orhan <ilhan.orhan007@gmail.com> Date: Wed, 4 Feb 2026 17:09:56 +0200 Subject: [PATCH 13/14] chore: update bar middleContent slot type to DefaultSlot --- packages/main/src/Bar.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/main/src/Bar.ts b/packages/main/src/Bar.ts index 682849ad1186..ff79f6ec2903 100644 --- a/packages/main/src/Bar.ts +++ b/packages/main/src/Bar.ts @@ -1,5 +1,5 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js"; -import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; +import type { DefaultSlot, Slot } from "@ui5/webcomponents-base/dist/UI5Element.js"; import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js"; import property from "@ui5/webcomponents-base/dist/decorators/property.js"; import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js"; @@ -115,8 +115,8 @@ class Bar extends UI5Element { * Defines the content in the middle of the bar. * @public */ - @slot() - middleContent!: Slot<HTMLElement> + @slot({ type: HTMLElement, "default": true }) + middleContent!: DefaultSlot<HTMLElement> /** * Defines the content at the end of the bar. From 93b9d7114384f992077e0a177e2f1ef13d62c5c6 Mon Sep 17 00:00:00 2001 From: ilhan007 <ilhan.myumyun@sap.com> Date: Wed, 4 Feb 2026 17:12:01 +0200 Subject: [PATCH 14/14] chore: add ";" --- packages/main/src/Bar.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/main/src/Bar.ts b/packages/main/src/Bar.ts index ff79f6ec2903..f44614646925 100644 --- a/packages/main/src/Bar.ts +++ b/packages/main/src/Bar.ts @@ -116,14 +116,14 @@ class Bar extends UI5Element { * @public */ @slot({ type: HTMLElement, "default": true }) - middleContent!: DefaultSlot<HTMLElement> + middleContent!: DefaultSlot<HTMLElement>; /** * Defines the content at the end of the bar. * @public */ @slot() - endContent!: Slot<HTMLElement> + endContent!: Slot<HTMLElement>; _handleResizeBound: () => void;