@ui5/webcomponents-fiori 2.8.0-rc.1 → 2.8.0-rc.2

package/dist/ShellBar.d.ts

@@ -45,23 +45,27 @@ type ShellBarSearchButtonEventDetail = {
     targetRef: HTMLElement;
     searchFieldVisible: boolean;
 };
-interface IShelBarItemInfo {
+interface IShellBarHidableItem {
+    classes: string;
     id: string;
+    show: boolean;
+}
+interface IShelBarItemInfo extends IShellBarHidableItem {
     icon?: string;
     text?: string;
-    show: boolean;
     count?: string;
     custom?: boolean;
     title?: string;
     stableDomRef?: string;
     refItemid?: string;
     press: (e: MouseEvent) => void;
-    domOrder: number;
-    classes: string;
     order?: number;
     profile?: boolean;
     tooltip?: string;
 }
+interface IShellBarContentItem extends IShellBarHidableItem {
+    hideOrder: number;
+}
 /**
  * @class
  * ### Overview
@@ -190,10 +194,10 @@ declare class ShellBar extends UI5Element {
      */
     withLogo: boolean;
     _itemsInfo: Array<IShelBarItemInfo>;
+    _contentInfo: Array<IShellBarContentItem>;
     _menuPopoverExpanded: boolean;
     _overflowPopoverExpanded: boolean;
-    hasVisibleStartContent: boolean;
-    hasVisibleEndContent: boolean;
+    showFullWidthSearch: boolean;
     _cachedHiddenContent: Array<HTMLElement>;
     /**
      * Defines the assistant slot.
@@ -255,7 +259,11 @@ declare class ShellBar extends UI5Element {
      */
     midContent: Array<HTMLElement>;
     /**
-     * Define the items displayed in the additional content area.
+     * Define the items displayed in the content area.
+     *
+     * Use the `data-hide-order` attribute with numeric value to specify the order of the items to be hidden when the space is not enough.
+     * Lower values will be hidden first.
+     *
      * **Note:** The `content` slot is in an experimental state and is a subject to change.
      *
      * @public
@@ -267,25 +275,22 @@ declare class ShellBar extends UI5Element {
     menuPopover?: Popover | null;
     _isInitialRendering: boolean;
     _defaultItemPressPrevented: boolean;
-    additionalContextObserver: MutationObserver;
+    contentItemsObserver: MutationObserver;
     _hiddenIcons: Array<IShelBarItemInfo>;
     _handleResize: ResizeObserverCallback;
     _overflowNotifications: string | null;
     _lastOffsetWidth: number;
     _observableContent: Array<HTMLElement>;
-    _searchBarAutoOpen: boolean;
-    _searchBarAutoClosed: boolean;
-    _searchIconPressed: boolean;
+    _autoRestoreSearchField: boolean;
     _headerPress: () => void;
     static get FIORI_3_BREAKPOINTS(): number[];
     static get FIORI_3_BREAKPOINTS_MAP(): Record<string, string>;
     constructor();
-    _searchBarInitialState(): void;
+    _updateSearchFieldState(): void;
     _onKeyDown(e: KeyboardEvent): void;
     _focusNextItem(items: HTMLElement[], currentIndex: number): void;
     _focusPreviousItem(items: HTMLElement[], currentIndex: number): void;
     _isVisible(element: HTMLElement): boolean;
-    _isInteractive(element: HTMLElement | UI5Element): boolean;
     _getNavigableContent(): HTMLElement[];
     _getRightChildItems(): HTMLElement[];
     _getVisibleAndInteractiveItems(): HTMLElement[];
@@ -301,9 +306,8 @@ declare class ShellBar extends UI5Element {
     _parsePxValue(styleSet: CSSStyleDeclaration, propertyName: string): number;
     domCalculatedValues(cssVar: string): number;
     onBeforeRendering(): void;
-    get additionalContextSorted(): HTMLElement[];
-    get additionalContextContainer(): HTMLElement | null;
     onAfterRendering(): void;
+    onInitialRendering(): Promise<void>;
     /**
      * Closes the overflow area.
      * Useful to manually close the overflow after having suppressed automatic closing with preventDefault() of ShellbarItem's press event
@@ -311,12 +315,13 @@ declare class ShellBar extends UI5Element {
      */
     closeOverflow(): void;
     _handleBarBreakpoints(): void;
-    _hideOverflowItems(hiddenItems: number, items: IShelBarItemInfo[]): number;
-    _hideAdditionalContext(): void;
-    _handleActionsOverflow(): IShelBarItemInfo[];
+    _hideItems(items: IShellBarHidableItem[]): IShellBarHidableItem[];
+    _resetItemsVisibility(items: Array<HTMLElement>): void;
+    _handleActionsOverflow(): {
+        itemsInfo: IShelBarItemInfo[];
+        contentInfo: IShellBarContentItem[];
+    };
     _overflowActions(): void;
-    _updateAssistantIconVisibility(items: IShelBarItemInfo[]): void;
-    _updateSeparatorsVisibility(): void;
     _toggleActionPopover(): void;
     onEnterDOM(): void;
     onExitDOM(): void;
@@ -363,37 +368,30 @@ declare class ShellBar extends UI5Element {
      * @since 1.0.0-rc.16
      */
     get productSwitchDomRef(): HTMLElement | null;
+    _getContentInfo(): Array<IShellBarContentItem>;
     /**
      * Returns all items that will be placed in the right of the bar as icons / dom elements.
-     * @param showOverflowButton Determines if overflow button should be visible (not overflowing)
      */
-    _getAllItems(showOverflowButton: boolean, showSearchButton?: boolean): Array<IShelBarItemInfo>;
-    _updateItemsInfo(newItems: Array<IShelBarItemInfo>): void;
+    _getItemsInfo(): Array<IShelBarItemInfo>;
+    _updateItemsInfo(newItemsInfo: Array<IShelBarItemInfo>): void;
+    _updateContentInfo(newContentInfo: Array<IShellBarContentItem>): void;
+    _fireContentItemVisibilityChangeEvent(): void;
     _updateOverflowNotifications(): void;
-    _updateAdditionalContextItems(): void;
-    _observeAdditionalContextItems(): false | undefined;
+    _observeContentItems(): false | undefined;
     _getOverflowPopover(): Popover;
     _getMenuPopover(): Popover;
     isIconHidden(name: string): boolean;
+    get contentItemsSorted(): UI5Element[];
+    get contentItemsWrappersSorted(): HTMLElement[];
+    get autoSearchField(): boolean;
+    get showStartSeparatorInWrapper(): boolean;
+    get showEndSeparatorInWrapper(): boolean;
     get classes(): ClassMap;
     get styles(): {
         searchField: {
             display: string;
         };
-        additionalContext: {
-            start: {
-                separator: {
-                    visibility: string;
-                };
-            };
-            end: {
-                separator: {
-                    visibility: string;
-                };
-            };
-        };
     };
-    get correctSearchFieldStyles(): "none" | "flex";
     get customItemsInfo(): IShelBarItemInfo[];
     get hasLogo(): boolean;
     get showLogoInMenuButton(): boolean;
@@ -411,32 +409,27 @@ declare class ShellBar extends UI5Element {
     get _notificationsText(): string;
     get _cancelBtnText(): string;
     get _logoAreaText(): string;
-    get _additionalContextText(): string;
+    get _contentItemsText(): string;
     get _searchFieldDescription(): string;
-    get _additionalContextRole(): "group" | undefined;
-    get additionalContext(): UI5Element[];
+    get _contentItemsRole(): "group" | undefined;
+    get contentItems(): UI5Element[];
     get startContent(): UI5Element[];
     get endContent(): UI5Element[];
     get _rightChildRole(): "toolbar" | undefined;
-    get _searchFieldExpanded(): boolean;
     get _searchFieldText(): string;
     get _searchBtnOpen(): string;
     get _productSwitchBtnText(): string;
-    get _showFullWidthSearch(): boolean;
     get isSearchFieldVisible(): number;
     get _profileText(): string;
     get _productsText(): string;
     get _searchText(): string;
     get _overflowText(): string;
-    get hasAdditionalContext(): boolean;
-    get _hasVisibleStartContent(): boolean;
-    get _hasVisibleEndContent(): boolean;
-    get itemsToOverflow(): HTMLElement[];
-    get separatorsWidth(): number;
-    get searchFieldActualWidth(): number;
-    get separators(): HTMLElement[];
-    get additionalContextHidden(): UI5Element[];
-    get _lessSearchSpace(): boolean;
+    get hasContentItems(): boolean;
+    get hidableDomElements(): HTMLElement[];
+    get contentItemsHidden(): HTMLElement[];
+    get overflowWrapper(): HTMLElement | null;
+    get overflowInner(): HTMLElement | null;
+    get overflowed(): boolean;
     get accInfo(): {
         notifications: {
             title: string;