@sapui5/ts-types 1.106.1 → 1.107.0

package/types/sap.f.d.ts

@@ -1,4 +1,4 @@
-// For Library Version: 1.106.0
+// For Library Version: 1.107.1
 
 declare namespace sap {
   /**
@@ -6804,33 +6804,6 @@ declare namespace sap {
      */
     interface ICard {
       __implements__sap_f_ICard: boolean;
-
-      /**
-       * @SINCE 1.62
-       *
-       * The function is used to allow for a common content renderer between different implementations of the
-       * {@link sap.f.ICard} interface.
-       *
-       * @returns The content of the card
-       */
-      getCardContent(): sap.ui.core.Control;
-      /**
-       * @SINCE 1.62
-       *
-       * The function is used to allow for a common header renderer between different implementations of the {@link
-       * sap.f.ICard} interface.
-       *
-       * @returns The header of the card
-       */
-      getCardHeader(): sap.f.cards.IHeader;
-      /**
-       * @SINCE 1.65
-       *
-       * Allows for a common header renderer between different implementations of the {@link sap.f.ICard} interface.
-       *
-       * @returns The position of the header of the card
-       */
-      getCardHeaderPosition(): sap.f.cards.HeaderPosition;
     }
 
     /**
@@ -8299,6 +8272,87 @@ declare namespace sap {
       avatarPressed?: (oEvent: sap.ui.base.Event) => void;
     }
 
+    interface $SidePanelSettings extends sap.ui.core.$ControlSettings {
+      /**
+       * Determines whether the action bar is expanded or collapsed.
+       */
+      actionBarExpanded?:
+        | boolean
+        | sap.ui.base.ManagedObject.PropertyBindingInfo
+        | `{${string}}`;
+
+      /**
+       * Description for aria-label.
+       */
+      ariaLabel?: string | sap.ui.base.ManagedObject.PropertyBindingInfo;
+
+      /**
+       * Determines the side panel width (Side Content width + Action Bar width). **Note:** if the width is given
+       * in percent(%), it is calculated as given percent from the Side Panel parent container width, otherwise
+       * it's calculated in absolute units.
+       */
+      sidePanelWidth?:
+        | sap.ui.core.CSSSize
+        | sap.ui.base.ManagedObject.PropertyBindingInfo
+        | `{${string}}`;
+
+      /**
+       * The list of controls for the main content.
+       */
+      mainContent?:
+        | sap.ui.core.Control[]
+        | sap.ui.core.Control
+        | sap.ui.base.ManagedObject.AggregationBindingInfo
+        | `{${string}}`;
+
+      /**
+       * The list of action items. Each action items can have different side content added to its `content` aggregation.
+       */
+      items?:
+        | sap.f.SidePanelItem[]
+        | sap.f.SidePanelItem
+        | sap.ui.base.ManagedObject.AggregationBindingInfo
+        | `{${string}}`;
+
+      /**
+       * The action item that is currently selected.
+       */
+      selectedItem?: sap.f.SidePanelItem | string;
+
+      /**
+       * Fires on expand and collapse of the side content.
+       *
+       *
+       * 	 - If the event fired as a result of action item selection (`expanded` parameter contains `true`) is
+       * 			prevented, the display of the side content will be blocked.
+       * 	 - If the event fired as a result of action item deselection, selection of different action item, pressing
+       * 			the `Close` button, or pressing the `Escape` key (`expanded` parameter contains `false`) is prevented,
+       * 			this will block closing of the currently displayed side content, and if the event is fired by selection
+       * 			of a different action item, the selection will be cancelled, and the next event (for expansion of a new
+       * 			action item) will not be fired and the new side content will not be displayed.
+       */
+      toggle?: (oEvent: sap.ui.base.Event) => void;
+    }
+
+    interface $SidePanelItemSettings extends sap.ui.core.$ItemSettings {
+      /**
+       * Specifies the icon for the item.
+       */
+      icon?:
+        | sap.ui.core.URI
+        | sap.ui.base.ManagedObject.PropertyBindingInfo
+        | `{${string}}`;
+
+      /**
+       * The list of controls for side content of the action item.
+       */
+      content?:
+        | sap.ui.core.Control[]
+        | sap.ui.core.Control
+        | sap.ui.base.ManagedObject.AggregationBindingInfo
+        | `{${string}}`;
+    }
+
     /**
      * @SINCE 1.88
      * @deprecated (since 1.98) - Use the {@link sap.m.IllustrationPool} instead.
@@ -9052,26 +9106,6 @@ declare namespace sap {
        * @returns Reference to `this` in order to allow method chaining
        */
       destroyHeader(): this;
-      /**
-       * Implements sap.f.ICard interface.
-       *
-       * @returns The content of the card.
-       */
-      getCardContent(): sap.ui.core.Control;
-      /**
-       * Implements sap.f.ICard interface.
-       *
-       * @returns The header of the card.
-       */
-      getCardHeader(): sap.f.cards.IHeader;
-      /**
-       * @SINCE 1.65
-       *
-       * Implements sap.f.ICard interface.
-       *
-       * @returns The position of the header of the card.
-       */
-      getCardHeaderPosition(): sap.f.cards.HeaderPosition;
       /**
        * Gets content of aggregation {@link #getContent content}.
        *
@@ -9206,26 +9240,6 @@ declare namespace sap {
        * @returns Metadata object describing this class
        */
       static getMetadata(): sap.ui.core.ElementMetadata;
-      /**
-       * Implements sap.f.ICard interface.
-       *
-       * @returns The content of the card.
-       */
-      getCardContent(): sap.ui.core.Control;
-      /**
-       * Implements sap.f.ICard interface.
-       *
-       * @returns The header of the card.
-       */
-      getCardHeader(): sap.f.cards.IHeader;
-      /**
-       * @SINCE 1.65
-       *
-       * Implements sap.f.ICard interface.
-       *
-       * @returns The position of the header of the card.
-       */
-      getCardHeaderPosition(): sap.f.cards.HeaderPosition;
       /**
        * Returns the DOM Element that should get the focus.
        *
@@ -18114,131 +18128,760 @@ declare namespace sap {
       ): this;
     }
     /**
-     * @SINCE 1.73
-     * @EXPERIMENTAL (since 1.73)
+     * @SINCE 1.107
+     * @EXPERIMENTAL (since 1.107)
      *
-     * Group modes for the {@link sap.f.AvatarGroup} control.
-     */
-    enum AvatarGroupType {
-      /**
-       * The avatars are displayed as partially overlapped on top of each other and the entire group has one click/tap
-       * area.
-       */
-      Group = "Group",
-      /**
-       * The avatars are displayed side-by-side and each avatar has its own click/tap area.
-       */
-      Individual = "Individual",
-    }
-    /**
-     * @SINCE 1.50
-     * @deprecated (since 1.54) - Consumers of the {@link sap.f.DynamicPageTitle} control should now use the
-     * `areaShrinkRatio` property instead of the `primaryArea` property.
+     * Overview:
      *
-     * Defines the areas within the `sap.f.DynamicPageTitle` control.
-     */
-    enum DynamicPageTitleArea {
-      /**
-       * The area includes the `heading`, `expandedContent` and `snappedContent` aggregations, positioned in the
-       * beginning area of the {@link sap.f.DynamicPageTitle}.
-       */
-      Begin = "Begin",
-      /**
-       * The area includes the `content` aggregation, positioned in the middle part of the {@link sap.f.DynamicPageTitle}.
-       */
-      Middle = "Middle",
-    }
-    /**
-     * @SINCE 1.46
+     * `SidePanel` is a layout control that allows primary and additional content to be displayed by clicking/tapping
+     * the action items from its action bar.
      *
-     * Layouts, representing the number of columns to be displayed and their relative widths for a {@link sap.f.FlexibleColumnLayout}
-     * control.
+     * Usage:
      *
-     * Each layout has a predefined ratio for the three columns, depending on device size. Based on the device
-     * and layout, some columns are hidden. For more information, refer to the ratios (in %) for each value,
-     * listed below: (dash "-" means non-accessible columns).
+     * Action bar with action items have two states - collapsed and expanded. In collapsed state only icons
+     * are displayed, and in expanded state both icons and titles are displayed.
      *
-     * **Note:** Please note that on a phone device, due to the limited screen size, only one column can be
-     * displayed at a time. For all two-column layouts, this column is the `Mid` column, and for all three-column
-     * layouts - the `End` column, even though the respective column may be hidden on desktop and tablet for
-     * that particular layout. Therefore some of the names (such as `ThreeColumnsMidExpandedEndHidden` for example)
-     * are representative of the desktop scenario only.
+     * Each action item can have a content and click/tap on action item toggles the display of its content.
+     * The content can be added to the action item's `content` aggregation, or can be added or changed later.
      *
-     * For more information, see {@link topic:3b9f760da5b64adf8db7f95247879086 Types of Layout} in the documentation.
+     * Each click/tap fires an event, and in the event handler specific content can be added/changed to the
+     * `content` aggregation of the clicked/tapped action item or data can be retreived from the same aggregation
+     * depending on the state of the action item.
+     *
+     * If the side content is displayed, there is automatically generated header of the side content which contains
+     * the icon and title of the selected action item and a close button that closes the area where side content
+     * is displayed.
+     *
+     * Responsive Behavior:
+     *
+     * **On desktop/tablet device**
+     *
+     * The side panel contains action bar that have action items placed vertically, and when expanded, the side
+     * content is displayed next to the action bar. If there is not enough space for all available action items,
+     * an overflow icon is displayed, and it toggles ON/OFF an overflow menu with the rest of the action items
+     * that are not visible at the moment.
+     *
+     * Screen width > 1440 px
+     *
+     *
+     * 	 - When expanded, the side content shrinks the main content.
+     *
+     * Screen width <= 1440 px
+     *
+     *
+     * 	 - When expanded, the side content is placed over the main content.
+     *
+     * **On mobile device**
+     *
+     * The side panel contains action bar that have action items placed horizontally at the bottom of the display,
+     * and when expanded, the side content is displayed above the action bar. If there is not enough room for
+     * all action items, the action bar can be swiped to access the rest of the action items.
+     *
+     * Keyboard shortcuts:
+     *
+     *
+     * 	 - [Shift] + [Command] + [p] (Mac) / [Shift] + [Control] + [p] (Windows) - Expand/Collapse side panel
+     *
+     * 	 - [Arrow Up], [Arrow Down] - Move to the next or previous action item
+     * 	 - [Enter], [Space] - Choose the selected action item
+     * 	 - [Command] + [Arrow Left] (Mac) / [Control] + [Arrow Left] (Windows) / [Tab]- Move from action items
+     * 			to the opened side content panel
+     * 	 - [Command] + [Arrow Right] (Mac) / [Control] + [Arrow Right] (Windows) / [Shift] + [Tab]- Move from
+     * 			opened side content panel to the action items
+     * 	 - [F6] / [Shift] + [F6] - Navigate back and forth between main content, side panel and side content
+     * 			groups [Esc] - Close the opened side content panel and set focus back to main content
      */
-    enum LayoutType {
+    class SidePanel extends sap.ui.core.Control {
       /**
-       * Desktop: -/-/100 only the End column is displayed
-       *
-       * Tablet: -/-/100 only the End column is displayed
-       *
-       * Phone: -/-/100 only the End column is displayed
+       * Constructor for a new `SidePanel`.
        *
-       * Use to display a detail-detail page only, when the user should focus entirely on it.
+       * Accepts an object literal `mSettings` that defines initial property values, aggregated and associated
+       * objects as well as event handlers. See {@link sap.ui.base.ManagedObject#constructor} for a general description
+       * of the syntax of the settings object.
        */
-      EndColumnFullScreen = "EndColumnFullScreen",
+      constructor(
+        /**
+         * Initial settings for the new control
+         */
+        mSettings?: sap.f.$SidePanelSettings
+      );
       /**
-       * Desktop: -/100/- only the Mid column is displayed
-       *
-       * Tablet: -/100/- only the Mid column is displayed
-       *
-       * Phone: -/100/- only the Mid column is displayed
+       * Constructor for a new `SidePanel`.
        *
-       * Use to display a detail page only, when the user should focus entirely on it.
+       * Accepts an object literal `mSettings` that defines initial property values, aggregated and associated
+       * objects as well as event handlers. See {@link sap.ui.base.ManagedObject#constructor} for a general description
+       * of the syntax of the settings object.
        */
-      MidColumnFullScreen = "MidColumnFullScreen",
+      constructor(
+        /**
+         * ID for the new control, generated automatically if no ID is given
+         */
+        sId?: string,
+        /**
+         * Initial settings for the new control
+         */
+        mSettings?: sap.f.$SidePanelSettings
+      );
+
       /**
-       * Desktop: 100/-/- only the Begin column is displayed
-       *
-       * Tablet: 100/-/- only the Begin column is displayed
+       * Creates a new subclass of class sap.f.SidePanel with name `sClassName` and enriches it with the information
+       * contained in `oClassInfo`.
        *
-       * Phone: 100/-/- only the Begin column is displayed
+       * `oClassInfo` might contain the same kind of information as described in {@link sap.ui.core.Control.extend}.
        *
-       * Use to start with a master page.
+       * @returns Created class / constructor function
        */
-      OneColumn = "OneColumn",
+      static extend<T extends Record<string, unknown>>(
+        /**
+         * Name of the class being created
+         */
+        sClassName: string,
+        /**
+         * Object literal with information about the class
+         */
+        oClassInfo?: sap.ClassInfo<T, sap.f.SidePanel>,
+        /**
+         * Constructor function for the metadata object; if not given, it defaults to the metadata implementation
+         * used by this class
+         */
+        FNMetaImpl?: Function
+      ): Function;
       /**
-       * Desktop: 67/33/0 Begin (expanded) and Mid columns are displayed, End is accessible by layout arrows
-       *
-       * Tablet: 67/33/0 Begin (expanded) and Mid columns are displayed, End is accessible by layout arrows
+       * Returns a metadata object for class sap.f.SidePanel.
        *
-       * Phone: -/-/100 only the End column is displayed
-       *
-       * Use to display the master and detail pages when the user should focus on the master. The detail-detail
-       * is still loaded and easily accessible with layout arrows.
+       * @returns Metadata object describing this class
        */
-      ThreeColumnsBeginExpandedEndHidden = "ThreeColumnsBeginExpandedEndHidden",
+      static getMetadata(): sap.ui.core.ElementMetadata;
       /**
-       * Desktop: 25/25/50 Begin, Mid and End (expanded) columns are displayed
-       *
-       * Tablet: 0/33/67 Mid and End (expanded) columns are displayed, Begin is accessible by layout arrows
-       *
-       * Phone: -/-/100 (only the End column is displayed)
+       * Adds some item to the aggregation {@link #getItems items}.
        *
-       * Use to display all three pages (master, detail, detail-detail) when the user should focus on the detail-detail.
+       * @returns Reference to `this` in order to allow method chaining
        */
-      ThreeColumnsEndExpanded = "ThreeColumnsEndExpanded",
+      addItem(
+        /**
+         * The item to add; if empty, nothing is inserted
+         */
+        oItem: sap.f.SidePanelItem
+      ): this;
       /**
-       * Desktop: 25/50/25 Begin, Mid (expanded) and End columns are displayed
-       *
-       * Tablet: 0/67/33 Mid (expanded) and End columns are displayed, Begin is accessible by a layout arrow
+       * Adds some mainContent to the aggregation {@link #getMainContent mainContent}.
        *
-       * Phone: -/-/100 only the End column is displayed
-       *
-       * Use to display all three pages (master, detail, detail-detail) when the user should focus on the detail.
+       * @returns Reference to `this` in order to allow method chaining
        */
-      ThreeColumnsMidExpanded = "ThreeColumnsMidExpanded",
+      addMainContent(
+        /**
+         * The mainContent to add; if empty, nothing is inserted
+         */
+        oMainContent: sap.ui.core.Control
+      ): this;
       /**
-       * Desktop: 33/67/0 Begin and Mid (expanded) columns are displayed, End is accessible by a layout arrow
+       * Attaches event handler `fnFunction` to the {@link #event:toggle toggle} event of this `sap.f.SidePanel`.
        *
-       * Tablet: 33/67/0 Begin and Mid (expanded) columns are displayed, End is accessible by a layout arrow
+       * When called, the context of the event handler (its `this`) will be bound to `oListener` if specified,
+       * otherwise it will be bound to this `sap.f.SidePanel` itself.
        *
-       * Phone: -/-/100 only the End column is displayed
+       * Fires on expand and collapse of the side content.
        *
-       * Use to display the master and detail pages when the user should focus on the detail. The detail-detail
-       * is still loaded and easily accessible with a layout arrow.
-       */
-      ThreeColumnsMidExpandedEndHidden = "ThreeColumnsMidExpandedEndHidden",
+       *
+       * 	 - If the event fired as a result of action item selection (`expanded` parameter contains `true`) is
+       * 			prevented, the display of the side content will be blocked.
+       * 	 - If the event fired as a result of action item deselection, selection of different action item, pressing
+       * 			the `Close` button, or pressing the `Escape` key (`expanded` parameter contains `false`) is prevented,
+       * 			this will block closing of the currently displayed side content, and if the event is fired by selection
+       * 			of a different action item, the selection will be cancelled, and the next event (for expansion of a new
+       * 			action item) will not be fired and the new side content will not be displayed.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      attachToggle(
+        /**
+         * An application-specific payload object that will be passed to the event handler along with the event
+         * object when firing the event
+         */
+        oData: object,
+        /**
+         * The function to be called when the event occurs
+         */
+        fnFunction: (p1: sap.ui.base.Event) => void,
+        /**
+         * Context object to call the event handler with. Defaults to this `sap.f.SidePanel` itself
+         */
+        oListener?: object
+      ): this;
+      /**
+       * Attaches event handler `fnFunction` to the {@link #event:toggle toggle} event of this `sap.f.SidePanel`.
+       *
+       * When called, the context of the event handler (its `this`) will be bound to `oListener` if specified,
+       * otherwise it will be bound to this `sap.f.SidePanel` itself.
+       *
+       * Fires on expand and collapse of the side content.
+       *
+       *
+       * 	 - If the event fired as a result of action item selection (`expanded` parameter contains `true`) is
+       * 			prevented, the display of the side content will be blocked.
+       * 	 - If the event fired as a result of action item deselection, selection of different action item, pressing
+       * 			the `Close` button, or pressing the `Escape` key (`expanded` parameter contains `false`) is prevented,
+       * 			this will block closing of the currently displayed side content, and if the event is fired by selection
+       * 			of a different action item, the selection will be cancelled, and the next event (for expansion of a new
+       * 			action item) will not be fired and the new side content will not be displayed.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      attachToggle(
+        /**
+         * The function to be called when the event occurs
+         */
+        fnFunction: (p1: sap.ui.base.Event) => void,
+        /**
+         * Context object to call the event handler with. Defaults to this `sap.f.SidePanel` itself
+         */
+        oListener?: object
+      ): this;
+      /**
+       * Destroys all the items in the aggregation {@link #getItems items}.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      destroyItems(): this;
+      /**
+       * Destroys all the mainContent in the aggregation {@link #getMainContent mainContent}.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      destroyMainContent(): this;
+      /**
+       * Detaches event handler `fnFunction` from the {@link #event:toggle toggle} event of this `sap.f.SidePanel`.
+       *
+       * The passed function and listener object must match the ones used for event registration.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      detachToggle(
+        /**
+         * The function to be called, when the event occurs
+         */
+        fnFunction: (p1: sap.ui.base.Event) => void,
+        /**
+         * Context object on which the given function had to be called
+         */
+        oListener?: object
+      ): this;
+      /**
+       * Fires event {@link #event:toggle toggle} to attached listeners.
+       *
+       * Listeners may prevent the default action of this event by calling the `preventDefault` method on the
+       * event object. The return value of this method indicates whether the default action should be executed.
+       *
+       * @returns Whether or not to prevent the default action
+       */
+      fireToggle(
+        /**
+         * Parameters to pass along with the event
+         */
+        mParameters?: {
+          /**
+           * The action item that triggers the event.
+           */
+          item?: sap.f.SidePanelItem;
+          /**
+           * State of the action item.
+           */
+          expanded?: boolean;
+        }
+      ): boolean;
+      /**
+       * Gets current value of property {@link #getActionBarExpanded actionBarExpanded}.
+       *
+       * Determines whether the action bar is expanded or collapsed.
+       *
+       * Default value is `false`.
+       *
+       * @returns Value of property `actionBarExpanded`
+       */
+      getActionBarExpanded(): boolean;
+      /**
+       * Gets current value of property {@link #getAriaLabel ariaLabel}.
+       *
+       * Description for aria-label.
+       *
+       * Default value is `"Side Panel"`.
+       *
+       * @returns Value of property `ariaLabel`
+       */
+      getAriaLabel(): string;
+      /**
+       * Gets content of aggregation {@link #getItems items}.
+       *
+       * The list of action items. Each action items can have different side content added to its `content` aggregation.
+       */
+      getItems(): sap.f.SidePanelItem[];
+      /**
+       * Gets content of aggregation {@link #getMainContent mainContent}.
+       *
+       * The list of controls for the main content.
+       */
+      getMainContent(): sap.ui.core.Control[];
+      /**
+       * ID of the element which is the current target of the association {@link #getSelectedItem selectedItem},
+       * or `null`.
+       */
+      getSelectedItem(): sap.ui.core.ID;
+      /**
+       * Gets current value of property {@link #getSidePanelWidth sidePanelWidth}.
+       *
+       * Determines the side panel width (Side Content width + Action Bar width). **Note:** if the width is given
+       * in percent(%), it is calculated as given percent from the Side Panel parent container width, otherwise
+       * it's calculated in absolute units.
+       *
+       * Default value is `"20rem"`.
+       *
+       * @returns Value of property `sidePanelWidth`
+       */
+      getSidePanelWidth(): sap.ui.core.CSSSize;
+      /**
+       * Checks for the provided `sap.f.SidePanelItem` in the aggregation {@link #getItems items}. and returns
+       * its index if found or -1 otherwise.
+       *
+       * @returns The index of the provided control in the aggregation if found, or -1 otherwise
+       */
+      indexOfItem(
+        /**
+         * The item whose index is looked for
+         */
+        oItem: sap.f.SidePanelItem
+      ): int;
+      /**
+       * Checks for the provided `sap.ui.core.Control` in the aggregation {@link #getMainContent mainContent}.
+       * and returns its index if found or -1 otherwise.
+       *
+       * @returns The index of the provided control in the aggregation if found, or -1 otherwise
+       */
+      indexOfMainContent(
+        /**
+         * The mainContent whose index is looked for
+         */
+        oMainContent: sap.ui.core.Control
+      ): int;
+      /**
+       * Inserts a item into the aggregation {@link #getItems items}.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      insertItem(
+        /**
+         * The item to insert; if empty, nothing is inserted
+         */
+        oItem: sap.f.SidePanelItem,
+        /**
+         * The `0`-based index the item should be inserted at; for a negative value of `iIndex`, the item is inserted
+         * at position 0; for a value greater than the current size of the aggregation, the item is inserted at
+         * the last position
+         */
+        iIndex: int
+      ): this;
+      /**
+       * Inserts a mainContent into the aggregation {@link #getMainContent mainContent}.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      insertMainContent(
+        /**
+         * The mainContent to insert; if empty, nothing is inserted
+         */
+        oMainContent: sap.ui.core.Control,
+        /**
+         * The `0`-based index the mainContent should be inserted at; for a negative value of `iIndex`, the mainContent
+         * is inserted at position 0; for a value greater than the current size of the aggregation, the mainContent
+         * is inserted at the last position
+         */
+        iIndex: int
+      ): this;
+      /**
+       * Removes all the controls from the aggregation {@link #getItems items}.
+       *
+       * Additionally, it unregisters them from the hosting UIArea.
+       *
+       * @returns An array of the removed elements (might be empty)
+       */
+      removeAllItems(): sap.f.SidePanelItem[];
+      /**
+       * Removes all the controls from the aggregation {@link #getMainContent mainContent}.
+       *
+       * Additionally, it unregisters them from the hosting UIArea.
+       *
+       * @returns An array of the removed elements (might be empty)
+       */
+      removeAllMainContent(): sap.ui.core.Control[];
+      /**
+       * Removes a item from the aggregation {@link #getItems items}.
+       *
+       * @returns The removed item or `null`
+       */
+      removeItem(
+        /**
+         * The item to remove or its index or id
+         */
+        vItem: int | string | sap.f.SidePanelItem
+      ): sap.f.SidePanelItem | null;
+      /**
+       * Removes a mainContent from the aggregation {@link #getMainContent mainContent}.
+       *
+       * @returns The removed mainContent or `null`
+       */
+      removeMainContent(
+        /**
+         * The mainContent to remove or its index or id
+         */
+        vMainContent: int | string | sap.ui.core.Control
+      ): sap.ui.core.Control | null;
+      /**
+       * Sets a new value for property {@link #getActionBarExpanded actionBarExpanded}.
+       *
+       * Determines whether the action bar is expanded or collapsed.
+       *
+       * When called with a value of `null` or `undefined`, the default value of the property will be restored.
+       *
+       * Default value is `false`.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      setActionBarExpanded(
+        /**
+         * New value for property `actionBarExpanded`
+         */
+        bActionBarExpanded?: boolean
+      ): this;
+      /**
+       * Sets a new value for property {@link #getAriaLabel ariaLabel}.
+       *
+       * Description for aria-label.
+       *
+       * When called with a value of `null` or `undefined`, the default value of the property will be restored.
+       *
+       * Default value is `"Side Panel"`.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      setAriaLabel(
+        /**
+         * New value for property `ariaLabel`
+         */
+        sAriaLabel?: string
+      ): this;
+      /**
+       * Sets a new value for property {@link #getSidePanelWidth sidePanelWidth}.
+       *
+       * Determines the side panel width (Side Content width + Action Bar width). **Note:** if the width is given
+       * in percent(%), it is calculated as given percent from the Side Panel parent container width, otherwise
+       * it's calculated in absolute units.
+       *
+       * When called with a value of `null` or `undefined`, the default value of the property will be restored.
+       *
+       * Default value is `"20rem"`.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      setSidePanelWidth(
+        /**
+         * New value for property `sidePanelWidth`
+         */
+        sSidePanelWidth?: sap.ui.core.CSSSize
+      ): this;
+    }
+    /**
+     * @SINCE 1.107
+     * @EXPERIMENTAL (since 1.107)
+     *
+     * Overview:
+     *
+     * The SidePanel Action Item.
+     */
+    class SidePanelItem extends sap.ui.core.Item {
+      /**
+       * Constructor for a new `SidePanelItem`.
+       *
+       * Accepts an object literal `mSettings` that defines initial property values, aggregated and associated
+       * objects as well as event handlers. See {@link sap.ui.base.ManagedObject#constructor} for a general description
+       * of the syntax of the settings object.
+       */
+      constructor(
+        /**
+         * Initial settings for the new control
+         */
+        mSettings?: sap.f.$SidePanelItemSettings
+      );
+      /**
+       * Constructor for a new `SidePanelItem`.
+       *
+       * Accepts an object literal `mSettings` that defines initial property values, aggregated and associated
+       * objects as well as event handlers. See {@link sap.ui.base.ManagedObject#constructor} for a general description
+       * of the syntax of the settings object.
+       */
+      constructor(
+        /**
+         * ID for the new control, generated automatically if no ID is given
+         */
+        sId?: string,
+        /**
+         * Initial settings for the new control
+         */
+        mSettings?: sap.f.$SidePanelItemSettings
+      );
+
+      /**
+       * Creates a new subclass of class sap.f.SidePanelItem with name `sClassName` and enriches it with the information
+       * contained in `oClassInfo`.
+       *
+       * `oClassInfo` might contain the same kind of information as described in {@link sap.ui.core.Item.extend}.
+       *
+       * @returns Created class / constructor function
+       */
+      static extend<T extends Record<string, unknown>>(
+        /**
+         * Name of the class being created
+         */
+        sClassName: string,
+        /**
+         * Object literal with information about the class
+         */
+        oClassInfo?: sap.ClassInfo<T, sap.f.SidePanelItem>,
+        /**
+         * Constructor function for the metadata object; if not given, it defaults to the metadata implementation
+         * used by this class
+         */
+        FNMetaImpl?: Function
+      ): Function;
+      /**
+       * Returns a metadata object for class sap.f.SidePanelItem.
+       *
+       * @returns Metadata object describing this class
+       */
+      static getMetadata(): sap.ui.core.ElementMetadata;
+      /**
+       * Adds some content to the aggregation {@link #getContent content}.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      addContent(
+        /**
+         * The content to add; if empty, nothing is inserted
+         */
+        oContent: sap.ui.core.Control
+      ): this;
+      /**
+       * Destroys all the content in the aggregation {@link #getContent content}.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      destroyContent(): this;
+      /**
+       * Gets content of aggregation {@link #getContent content}.
+       *
+       * The list of controls for side content of the action item.
+       */
+      getContent(): sap.ui.core.Control[];
+      /**
+       * Gets current value of property {@link #getIcon icon}.
+       *
+       * Specifies the icon for the item.
+       *
+       * Default value is `empty string`.
+       *
+       * @returns Value of property `icon`
+       */
+      getIcon(): sap.ui.core.URI;
+      /**
+       * Checks for the provided `sap.ui.core.Control` in the aggregation {@link #getContent content}. and returns
+       * its index if found or -1 otherwise.
+       *
+       * @returns The index of the provided control in the aggregation if found, or -1 otherwise
+       */
+      indexOfContent(
+        /**
+         * The content whose index is looked for
+         */
+        oContent: sap.ui.core.Control
+      ): int;
+      /**
+       * Inserts a content into the aggregation {@link #getContent content}.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      insertContent(
+        /**
+         * The content to insert; if empty, nothing is inserted
+         */
+        oContent: sap.ui.core.Control,
+        /**
+         * The `0`-based index the content should be inserted at; for a negative value of `iIndex`, the content
+         * is inserted at position 0; for a value greater than the current size of the aggregation, the content
+         * is inserted at the last position
+         */
+        iIndex: int
+      ): this;
+      /**
+       * Removes all the controls from the aggregation {@link #getContent content}.
+       *
+       * Additionally, it unregisters them from the hosting UIArea.
+       *
+       * @returns An array of the removed elements (might be empty)
+       */
+      removeAllContent(): sap.ui.core.Control[];
+      /**
+       * Removes a content from the aggregation {@link #getContent content}.
+       *
+       * @returns The removed content or `null`
+       */
+      removeContent(
+        /**
+         * The content to remove or its index or id
+         */
+        vContent: int | string | sap.ui.core.Control
+      ): sap.ui.core.Control | null;
+      /**
+       * Sets a new value for property {@link #getIcon icon}.
+       *
+       * Specifies the icon for the item.
+       *
+       * When called with a value of `null` or `undefined`, the default value of the property will be restored.
+       *
+       * Default value is `empty string`.
+       *
+       * @returns Reference to `this` in order to allow method chaining
+       */
+      setIcon(
+        /**
+         * New value for property `icon`
+         */
+        sIcon?: sap.ui.core.URI
+      ): this;
+    }
+    /**
+     * @SINCE 1.73
+     * @EXPERIMENTAL (since 1.73)
+     *
+     * Group modes for the {@link sap.f.AvatarGroup} control.
+     */
+    enum AvatarGroupType {
+      /**
+       * The avatars are displayed as partially overlapped on top of each other and the entire group has one click/tap
+       * area.
+       */
+      Group = "Group",
+      /**
+       * The avatars are displayed side-by-side and each avatar has its own click/tap area.
+       */
+      Individual = "Individual",
+    }
+    /**
+     * @SINCE 1.50
+     * @deprecated (since 1.54) - Consumers of the {@link sap.f.DynamicPageTitle} control should now use the
+     * `areaShrinkRatio` property instead of the `primaryArea` property.
+     *
+     * Defines the areas within the `sap.f.DynamicPageTitle` control.
+     */
+    enum DynamicPageTitleArea {
+      /**
+       * The area includes the `heading`, `expandedContent` and `snappedContent` aggregations, positioned in the
+       * beginning area of the {@link sap.f.DynamicPageTitle}.
+       */
+      Begin = "Begin",
+      /**
+       * The area includes the `content` aggregation, positioned in the middle part of the {@link sap.f.DynamicPageTitle}.
+       */
+      Middle = "Middle",
+    }
+    /**
+     * @SINCE 1.46
+     *
+     * Layouts, representing the number of columns to be displayed and their relative widths for a {@link sap.f.FlexibleColumnLayout}
+     * control.
+     *
+     * Each layout has a predefined ratio for the three columns, depending on device size. Based on the device
+     * and layout, some columns are hidden. For more information, refer to the ratios (in %) for each value,
+     * listed below: (dash "-" means non-accessible columns).
+     *
+     * **Note:** Please note that on a phone device, due to the limited screen size, only one column can be
+     * displayed at a time. For all two-column layouts, this column is the `Mid` column, and for all three-column
+     * layouts - the `End` column, even though the respective column may be hidden on desktop and tablet for
+     * that particular layout. Therefore some of the names (such as `ThreeColumnsMidExpandedEndHidden` for example)
+     * are representative of the desktop scenario only.
+     *
+     * For more information, see {@link topic:3b9f760da5b64adf8db7f95247879086 Types of Layout} in the documentation.
+     */
+    enum LayoutType {
+      /**
+       * Desktop: -/-/100 only the End column is displayed
+       *
+       * Tablet: -/-/100 only the End column is displayed
+       *
+       * Phone: -/-/100 only the End column is displayed
+       *
+       * Use to display a detail-detail page only, when the user should focus entirely on it.
+       */
+      EndColumnFullScreen = "EndColumnFullScreen",
+      /**
+       * Desktop: -/100/- only the Mid column is displayed
+       *
+       * Tablet: -/100/- only the Mid column is displayed
+       *
+       * Phone: -/100/- only the Mid column is displayed
+       *
+       * Use to display a detail page only, when the user should focus entirely on it.
+       */
+      MidColumnFullScreen = "MidColumnFullScreen",
+      /**
+       * Desktop: 100/-/- only the Begin column is displayed
+       *
+       * Tablet: 100/-/- only the Begin column is displayed
+       *
+       * Phone: 100/-/- only the Begin column is displayed
+       *
+       * Use to start with a master page.
+       */
+      OneColumn = "OneColumn",
+      /**
+       * Desktop: 67/33/0 Begin (expanded) and Mid columns are displayed, End is accessible by layout arrows
+       *
+       * Tablet: 67/33/0 Begin (expanded) and Mid columns are displayed, End is accessible by layout arrows
+       *
+       * Phone: -/-/100 only the End column is displayed
+       *
+       * Use to display the master and detail pages when the user should focus on the master. The detail-detail
+       * is still loaded and easily accessible with layout arrows.
+       */
+      ThreeColumnsBeginExpandedEndHidden = "ThreeColumnsBeginExpandedEndHidden",
+      /**
+       * Desktop: 25/25/50 Begin, Mid and End (expanded) columns are displayed
+       *
+       * Tablet: 0/33/67 Mid and End (expanded) columns are displayed, Begin is accessible by layout arrows
+       *
+       * Phone: -/-/100 (only the End column is displayed)
+       *
+       * Use to display all three pages (master, detail, detail-detail) when the user should focus on the detail-detail.
+       */
+      ThreeColumnsEndExpanded = "ThreeColumnsEndExpanded",
+      /**
+       * Desktop: 25/50/25 Begin, Mid (expanded) and End columns are displayed
+       *
+       * Tablet: 0/67/33 Mid (expanded) and End columns are displayed, Begin is accessible by a layout arrow
+       *
+       * Phone: -/-/100 only the End column is displayed
+       *
+       * Use to display all three pages (master, detail, detail-detail) when the user should focus on the detail.
+       */
+      ThreeColumnsMidExpanded = "ThreeColumnsMidExpanded",
+      /**
+       * Desktop: 33/67/0 Begin and Mid (expanded) columns are displayed, End is accessible by a layout arrow
+       *
+       * Tablet: 33/67/0 Begin and Mid (expanded) columns are displayed, End is accessible by a layout arrow
+       *
+       * Phone: -/-/100 only the End column is displayed
+       *
+       * Use to display the master and detail pages when the user should focus on the detail. The detail-detail
+       * is still loaded and easily accessible with a layout arrow.
+       */
+      ThreeColumnsMidExpandedEndHidden = "ThreeColumnsMidExpandedEndHidden",
       /**
        * Desktop: 67/33/- Begin (expanded) and Mid columns are displayed
        *
@@ -18489,6 +19132,10 @@ declare namespace sap {
 
     "sap/f/ShellBar": undefined;
 
+    "sap/f/SidePanel": undefined;
+
+    "sap/f/SidePanelItem": undefined;
+
     "sap/tnt/library": undefined;
   }
 }