@sapudex/web-components 2.57.0 → 2.58.0

package/src/MastheadProfileMenu.hbs

@@ -1,121 +0,0 @@
-<div
-  @keydown="{{handleKeydown}}"
-  class="{{rootClass}}">
-  {{#if _openIdentities}}
-    {{> account-indetities}}
-  {{else}}
-    {{> account-profile}}
-  {{/if}}
-</div>
-
-{{#*inline "account-profile"}}
-    {{#if hasUserData}}
-      <div class="udex-masthead-profile-menu__header">
-          <udex-avatar
-            aria-hidden="true"
-            size="L"
-            initials="{{userData.avatarInitials}}"
-            fallback-icon="{{userData.fallbackIcon}}">
-            {{#if userData.avatarUrl}}
-              <img src="{{userData.avatarUrl}}" alt="avatar"/>
-            {{/if}}
-          </udex-avatar>
-          <div>
-            <p class="udex-profile-menu__account-name">{{userData.name}}</p>
-            <p class="udex-profile-menu__account-email">{{userData.email}}</p>
-            {{#if hasIdentities}}
-              <udex-button
-                @click="{{handleSwitcherClick}}"
-                class="udex-masthead-profile-menu__btn-switcher"
-                size="Large"
-                end-icon="slim-arrow-right"
-                design="Invisible">
-                {{switcherAccountText}}
-              </udex-button>
-            {{/if}}
-          </div>
-      </div>
-    {{/if}}
-  {{#if messageAvailable}}
-    <div class="udex-masthead-profile-menu__message">
-      <slot name="message"></slot>
-    </div>
-  {{/if}}
-  <div class="udex-masthead-profile-menu__content">
-      <div
-          class="udex-masthead-profile-menu__links"
-          @scroll="{{handleProfileMenuShadowVisible}}">
-          <udex-masthead-menu
-            exportparts="badge, menu-item"
-            part="menu"
-            sub-items='{{linksList}}'
-            @ui5-menu-item-click="{{handleProfileMenuItemClick}}"
-            _scroll-into-view="Center">
-          </udex-masthead-menu>
-      </div>
-  </div>
-  {{#if hasActionButton}}
-      <div class="udex-masthead-profile-menu__actions">
-          {{#if hasLogoutButton}}
-              <div class="udex-masthead-profile-menu__btn">
-                <slot name="logoutButton"></slot>
-              </div>
-          {{else}}
-              <udex-link
-                  @click="{{handleUserLogoutClick}}"
-                  end-icon="action"
-                  design="Default"
-                  accessible-role="Link"
-                  href="{{logoutUrl}}">
-                  {{logoutText}}
-              </udex-link>
-          {{/if}}
-      </div>
-  {{/if}}
-{{/inline}}
- 
-{{#*inline "account-indetities"}}
-  <div class="udex-masthead-profile-menu__header-wrap back-btn">
-    <udex-masthead-menu-item
-      class="udex-masthead-profile-menu__btn-back"
-      @click="{{handleSwitcherClick}}"
-      label="{{btnBackText}}"
-      type="Button"
-      icon-start>
-    </udex-masthead-menu-item>
-    <span class="udex-masthead-profile-menu__switcher-title">{{switcherAccountText}}</span>
-  </div>
-  <span class="udex-masthead-profile-menu__identities-list-title">{{listTitleText}}</span>
-  <div class="udex-masthead-profile-menu__identities-list-wrap">
-    {{#if identitiesList.length}}
-      <udex-list
-        class="udex-masthead-profile-menu__identities-list"
-        mode="SingleSelect"
-        accessible-name="{{listTitleText}}"
-        @scroll="{{handleIdentitiesListShadowVisible}}"
-        _scroll-into-view="Center"
-        controlled>
-        {{#each identitiesList}}
-          <udex-list-item
-            id="{{this.idsUser}}"
-            class="udex-masthead-profile-menu__identities-list-item"
-            @ui5-item-press="{{../fireEventIdentityItemClick}}"
-            supporting-text="{{this.supportingText}}"
-            image-badge-state="{{this.statusBadge}}"
-            image="{{this.avatarUrl}}"
-            image-alt="{{this.name}}">
-            {{this.email}}
-          </udex-list-item>
-        {{/each}}
-      </udex-list>
-    {{/if}}
-  </div>
-  <udex-button
-    @click="{{fireEventAddOrRemoveAccountClick}}"
-    class="udex-masthead-profile-menu__add-remove-btn"
-    design="Primary"
-    end-icon="action"
-    size="Large">
-    {{addOrRemoveAccountText}}
-  </udex-button>
-{{/inline}}

package/src/MastheadShell.hbs

@@ -1,223 +0,0 @@
-<header
-    class="{{mainClass}}"
-    @keydown="{{handleKeyDown}}">
-    <div class="udex-masthead-shell__main-content">
-        <div class="udex-masthead-shell__landing-wrap">
-            {{#if logoUrl}}
-                {{>logo}}
-            {{/if}}
-
-            {{#if siteLabel}}
-                {{>siteLabel}}
-            {{/if}}
-
-            {{#if coBrandImage}}
-                {{>coBrand}}
-            {{/if}}
-        </div>
-
-        {{#if isMainMenuVisible}}
-            <nav
-                class="udex-masthead-shell__nav"
-                aria-label="{{mainNavigationAriaLabel}}">
-                <ul
-                    class="udex-masthead-shell__main-menu"
-                    aria-label="{{mainNavigationAriaLabel}}">
-                    {{#each menuItems}}
-                        {{>item}}
-                    {{/each}}
-                </ul>
-            </nav>
-        {{/if}}
-    </div>
-
-    {{#if isSearchVisible}}
-        <div
-            class="udex-masthead-shell__search-container"
-            @ui5-search-keydown="{{handleSearchKeyDown}}">
-            <slot name="search"></slot>
-        </div>
-        {{#if _isSearchOpened}}
-            <div class="udex-masthead-shell__btn-holder">
-                <udex-control-button
-                    class="udex-masthead-shell__close-search-btn"
-                    size="Small"
-                    icon="decline"
-                    part="search-close-button"
-                    tooltip="{{closeButtonAccessibleName}}"
-                    accessible-name="{{closeButtonAccessibleName}}"
-                    @click="{{handleCloseSearch}}">
-                </udex-control-button>
-            </div>
-        {{/if}}
-    {{/if}}
-
-    <div class="{{rightMenuClass}}">
-        {{#if hasExploreSAP}}
-            <div
-                class="udex-masthead-shell__explore"
-                @ui5-item-click="{{setSelectedItem}}">
-                <slot name="exploreSAP"></slot>
-            </div>
-        {{/if}}
-        {{#if hasSearch}}
-            <div class="udex-masthead-shell__search-icon udex-masthead-shell__item_icon">
-                <udex-masthead-item
-                    class="udex-masthead-shell__search-btn"
-                    icon="search"
-                    part="search-button"
-                    @click="{{handleSearchClick}}"
-                    accessible-name="{{openSearchButtonAccessibleNameText}}"
-                    icon-alt="{{openSearchButtonAccessibleNameText}}">
-                </udex-masthead-item>
-            </div>
-        {{/if}}
-        {{#if hasJoule}}
-            <div
-                class="udex-masthead-shell__joule udex-masthead-shell__item_icon"
-                @ui5-item-click="{{setSelectedItem}}"
-                @click="{{handleJouleClick}}">
-                <slot name="joule"></slot>
-            </div>
-        {{/if}}
-        {{#if hasCart}}
-            <div
-                class="udex-masthead-shell__cart udex-masthead-shell__item_icon"
-                @ui5-item-click="{{setSelectedItem}}"
-                @click="{{handleCartClick}}">
-                <slot name="cart"></slot>
-            </div>
-        {{/if}}
-        {{#if hasSupport}}
-            <div
-                class="udex-masthead-shell__support udex-masthead-shell__item_icon"
-                @ui5-item-click="{{setSelectedItem}}"
-                @click="{{handleSupportClick}}">
-                <slot name="support"></slot>
-            </div>
-        {{/if}}
-        {{#if hasProfile}}
-            <div
-                class="udex-masthead-shell__profile udex-masthead-shell__item_icon"
-                @ui5-item-click="{{setSelectedItem}}"
-                @click-default="{{handleProfileClick}}">
-                <slot name="profile"></slot>
-            </div>
-        {{/if}}
-        {{#if hasCountrySelector}}
-            <div
-                class="udex-masthead-shell__country-selector udex-masthead-shell__item_icon"
-                @ui5-item-click="{{setSelectedItem}}"
-                @click="{{handleCountrySelectorClick}}">
-                <slot name="countrySelector"></slot>
-            </div>
-        {{/if}}
-        {{#if hasMobileMenuButtons}}
-            <udex-masthead-item
-                @ui5-item-click="{{handleOpenMobileMenu}}"
-                class="udex-masthead-shell__menu-btn"
-                accessible-role="button"
-                icon="menu2"
-                part="menu-open-btn"
-                accessible-name="menu"
-                _is-menu-open-btn>
-                <slot slot="dropdown" name="mobileMenu"></slot>
-            </udex-masthead-item>
-            <udex-masthead-item
-                @keydown="{{handleEnterAndSpaceOnCloseBtn}}"
-                @ui5-item-click="{{closeMobileMenu}}"
-                class="udex-masthead-shell__close-btn"
-                accessible-role="button"
-                icon="decline"
-                accessible-name="{{mobileCloseButtonAccessibleName}}"
-                part="menu-close-btn"
-                hide-active-border
-                _is-menu-close-btn>
-            </udex-masthead-item>
-        {{/if}}
-    </div>
-</header>
-
-{{#*inline "item"}}
-    <li
-        class="udex-masthead-shell__item"
-        @ui5-item-click="{{../setSelectedItem}}">
-        <slot name="{{_individualSlot}}"></slot>
-    </li>
-{{/inline}}
-
-{{#*inline "logo"}}
-    {{#if homeUrl}}
-        <a
-            @click="{{handleLogoClick}}"
-            role="link"
-            href="{{homeUrl}}"
-            tabindex="0"
-            title="{{logoTitle}}"
-            target="_self"
-            aria-label="{{homepageAriaLabel}}"
-            class="udex-masthead-shell__logo udex-masthead-shell__logo--link">
-            <img
-                src="{{logoUrl}}"
-                class="udex-masthead-shell__logo-image"
-                alt="{{logoAlt}}"
-            />
-        </a>
-    {{else}}
-        <div class="udex-masthead-shell__logo">
-            <img
-                src="{{logoUrl}}"
-                class="udex-masthead-shell__logo-image"
-                alt="{{logoAlt}}"
-            />
-        </div>
-    {{/if}}
-{{/inline}}
-
-{{#*inline "siteLabel"}}
-    {{#if siteLabelUrl}}
-        <a
-            @click="{{handleSiteLabelClick}}"
-            role="link"
-            href="{{siteLabelUrl}}"
-            tabindex="0"
-            title="{{siteLabelTitle}}"
-            target="_self"
-            aria-label="{{siteLabelAriaLabel}}"
-            class="udex-masthead-shell__site-label udex-masthead-shell__site-label--link">
-            {{siteLabel}}
-        </a>
-    {{else}}
-        <div class="udex-masthead-shell__site-label">{{siteLabel}}</div>
-    {{/if}}
-{{/inline}}
-
-{{#*inline "coBrand"}}
-    {{#if coBrandUrl}}
-        <div class="udex-masthead-shell__co-brand">
-            <a
-                class="udex-masthead-shell__co-brand-link"
-                @click="{{handleCoBrandClick}}"
-                href="{{coBrandUrl}}"
-                tabindex="0"
-                title="{{coBrandTitle}}"
-                aria-label="{{coBrandAriaLabel}}"
-                target="_self"
-                role="link">
-                <img
-                    class="udex-masthead-shell__co-brand-image"
-                    src="{{coBrandImage}}"
-                    alt="{{coBrandAlt}}"
-                />
-            </a>
-        </div>
-    {{else}}
-        <div class="udex-masthead-shell__co-brand">
-            <img
-                class="udex-masthead-shell__co-brand-image"
-                src="{{coBrandImage}}"
-                alt="{{coBrandAlt}}"
-            />
-        </div>
-    {{/if}}
-{{/inline}}

package/src/Tab.hbs

@@ -1 +0,0 @@
-<slot></slot>

package/src/TabHeader.hbs

@@ -1,141 +0,0 @@
-{{#if hasBodyTextOrLink}}
-    <div class="udex-tab-navigation__tab-wrapper"
-        role="presentation"
-        ._realTab="{{this}}"
-        {{#if this.widthStyle}}style="{{this.widthStyle}}"{{/if}}>
-        {{#if hasNotHref}}
-            <button
-                id="{{this._id}}"
-                class="udex-tab-navigation__button-tab {{selectedClass}} {{classWithIconWithoutBackground}} {{buttonClassWithIcon}} {{processTabClass}}"
-                type="button"
-                role="tab"
-                tabindex="{{this._tabIndex}}"
-                aria-posinset="{{this._posinset}}"
-                aria-setsize="{{this._setsize}}"
-                aria-controls="{{this._contentId}}"
-                aria-selected="{{this.effectiveSelected}}"
-                aria-disabled="{{this.ariaDisabled}}">
-                {{>tab-content}}
-                {{#if this.ariaDescribedByBodyText}}
-                    <span class="visually-hidden">{{bodyText}}</span>
-                {{/if}}
-            </button>
-        {{else}}
-            <a
-                id="{{this._id}}"
-                class="udex-tab-navigation__button-tab {{selectedClass}} {{classWithIconWithoutBackground}} {{buttonClassWithIcon}} {{processTabClass}}"
-                href="{{href}}"
-                target="{{target}}"
-                role="tab"
-                tabindex="{{this.linkTabIndex}}"
-                aria-posinset="{{this._posinset}}"
-                aria-setsize="{{this._setsize}}"
-                aria-disabled="{{this.ariaDisabled}}">
-                {{>tab-content}}
-                {{#if this.ariaDescribedByBodyText}}
-                    <span class="visually-hidden">{{bodyText}}</span>
-                {{/if}}
-            </a>
-        {{/if}}
-        {{#if hasBodyText}}
-            <p class="udex-tab-navigation__button-body-text">{{bodyText}}</p>
-        {{/if}}
-        {{#if hasLinkSlot}}
-            <div class="udex-tab-navigation__button-links">
-                {{{linkSlotHtml}}}
-            </div>
-        {{/if}}
-    </div>
-{{else}}
-    {{#if hasNotHref}}
-        <button
-            id="{{this._id}}"
-            class="udex-tab-navigation__button-tab {{selectedClass}} {{classWithIconWithoutBackground}} {{buttonClassWithIcon}} {{processTabClass}}"
-            tabindex="{{this._tabIndex}}"
-            type="button"
-            role="tab"
-            aria-describedby="udex-tab-navigation__{{this._id}}__accessible-name"
-            aria-posinset="{{this._posinset}}"
-            aria-setsize="{{this._setsize}}"
-            aria-controls="{{this._contentId}}"
-            aria-selected="{{this.effectiveSelected}}"
-            aria-disabled="{{this.ariaDisabled}}"
-            ._realTab="{{this}}"
-            {{#if this.widthStyle}}style="{{this.widthStyle}}"{{/if}}>
-            {{>tab-content}}
-        </button>
-    {{else}}
-        <a
-            id="{{this._id}}"
-            class="udex-tab-navigation__button-tab {{selectedClass}} {{classWithIconWithoutBackground}} {{buttonClassWithIcon}} {{processTabClass}}"
-            tabindex="{{this.linkTabIndex}}"
-            role="tab"
-            aria-posinset="{{this._posinset}}"
-            aria-setsize="{{this._setsize}}"
-            href="{{href}}"
-            target="{{target}}"
-            aria-disabled="{{this.ariaDisabled}}"
-            {{#if this.widthStyle}}style="{{this.widthStyle}}"{{/if}}
-            ._realTab="{{this}}">
-            {{>tab-content}}
-        </a>
-    {{/if}}
-{{/if}}
-
-{{#*inline "tab-content"}}
-    {{#if hasIcon}}
-        <span class="udex-tab-navigation__button-icon-outer"
-            role="presentation"
-            aria-hidden="true">
-            <ui5-icon
-                class="udex-tab-navigation__button-icon"
-                name="{{icon}}"
-            ></ui5-icon>
-            {{#if showAttentionBadge}}
-                <span class="udex-tab-navigation__button-badge"></span>
-            {{/if}}
-        </span>
-    {{/if}}
-    {{#if _isProcessTab}}
-        <span class="udex-tab-navigation__button-text-block">
-            <span class="udex-tab-navigation__button-item-count">{{effectiveItemCountText}}</span>
-            <p class="udex-tab-navigation__button-text {{classWithIcon}}">
-                {{text}}
-                {{#if numberBadge}}
-                    <udex-badge
-                        class="udex-tab-navigation__badge"
-                        type="Number"
-                        number-design="Blue"
-                        size="Medium">
-                        {{numberBadge}}
-                    </udex-badge>
-                {{/if}}
-                {{#if hasNotIcon}}
-                    <span class="udex-tab-navigation__button-badge"></span>
-                {{/if}}
-            </p>
-        </span>
-    {{else}}
-        <p class="udex-tab-navigation__button-text {{classWithIcon}}">
-            {{text}}
-            {{#if numberBadge}}
-                <udex-badge
-                    class="udex-tab-navigation__badge"
-                    type="Number"
-                    number-design="Blue"
-                    size="Medium">
-                    {{numberBadge}}
-                </udex-badge>
-            {{/if}}
-            {{#if hasNotIcon}}
-                <span class="udex-tab-navigation__button-badge"></span>
-            {{/if}}
-        </p>
-    {{/if}}
-    <span
-        class="visually-hidden"
-        id="udex-tab-navigation__{{this._id}}__accessible-name"
-    >
-        {{accessibleNameText}}
-    </span>
-{{/inline}}

package/src/TabInOverflow.hbs

@@ -1,59 +0,0 @@
-{{#if hasNotHref}}
-    <button
-        id="{{this._id}}"
-        class="udex-tab-overflow__button"
-        role="tab"
-        aria-selected="{{this.effectiveSelected}}"
-        aria-disabled="{{this.ariaDisabled}}"
-        tabindex="{{_tabIndex}}">
-        {{#if hasIcon}}
-            <span class="udex-tab-overflow__button-icon"
-                role="presentation"
-                aria-hidden="true">
-                <ui5-icon
-                    name="{{icon}}"
-                ></ui5-icon>
-                {{#if showAttentionBadge}}
-                    <span class="udex-tab-overflow__button-badge"></span>
-                {{/if}}
-            </span>
-        {{/if}}
-        {{text}}
-        {{#if hasNotIcon}}
-            <span class="udex-tab-overflow__button-badge"
-                role="presentation"
-                aria-hidden="true">
-            </span>
-        {{/if}}
-    </button>
-{{else}}
-    <a
-        id="{{this._id}}"
-        href="{{href}}"
-        target="{{this.target}}"
-        class="udex-tab-overflow__button"
-        role="tab"
-        aria-selected="{{this.effectiveSelected}}"
-        aria-disabled="{{this.ariaDisabled}}"
-        tabindex="{{_tabIndex}}">
-        {{#if hasIcon}}
-            <span class="udex-tab-overflow__button-icon"
-                role="presentation"
-                aria-hidden="true">
-                <ui5-icon
-                    name="{{icon}}"
-                ></ui5-icon>
-                {{#if showAttentionBadge}}
-                    <span class="udex-tab-overflow__button-badge"></span>
-                {{/if}}
-            </span>
-        {{/if}}
-        {{text}}
-        {{#if hasNotIcon}}
-            <span class="udex-tab-overflow__button-badge"
-                role="presentation"
-                aria-hidden="true">
-            </span>
-        {{/if}}
-    </a>
-{{/if}}

package/src/TabNavigation.hbs

@@ -1,88 +0,0 @@
-<div class="udex-tab-navigation__root">
-    <div
-        id="{{_id}}-header"
-        class="udex-tab-navigation__header"
-        part="tab-navigation-header"
-        @keydown="{{handleKeyDown}}">
-        {{#if showPlayButton}}
-            <udex-button
-                class="udex-tab-navigation__play-button"
-                design="Tertiary"
-                size="Large"
-                icon="{{playBtnIcon}}"
-                tooltip="{{playBtnTooltipText}}"
-                @click="{{onPlayButtonClick}}">
-            </udex-button>
-        {{/if}}
-        <div
-            id="{{_id}}-header-tabs"
-            class="udex-tab-navigation__header-tabs"
-            role="tablist"
-            aria-labelledby="tablist-{{_id}}"
-            aria-orientation="{{ariaOrientationValue}}"
-            part="tab-navigation-header-tabs"
-            @click="{{onTabClick}}">
-            {{#each items}}
-                {{this.tabNavigation}}
-                {{#if this.isMobileVertical}}
-                    {{#if this.selected}}
-                        <div
-                            class="udex-tab-navigation__content"
-                            part="tab-navigation-content">
-                            <div
-                                class="udex-tab-navigation__content-item"
-                                id="{{_contentId}}-mobile"
-                                role="tabpanel"
-                                aria-labelledby="{{_id}}">
-                                <slot name="{{this._slotName}}"></slot>
-                            </div>
-                        </div>
-                    {{/if}}
-                {{/if}}
-            {{/each}}
-        </div>
-        <udex-button
-            class="udex-tab-navigation__button-more"
-            design="Tertiary"
-            size="{{sizeMoreButton}}"
-            end-icon="navigation-down-arrow"
-            @click="{{handleMoreButton}}"
-            @keydown="{{handleFocusMoreButton}}"
-            aria-haspopup="menu"
-            aria-expanded="{{_isExpanded}}"
-            hidden>
-            {{moreButtonText}}
-        </udex-button>
-        {{#if this._overflowItems.length}}
-            {{tabNavigationPopover}}
-        {{/if}}
-        {{#if showFooterSlot}}
-            <div class="udex-tab-navigation__footer" part="tab-navigation-footer">
-                <slot name="footer"></slot>
-            </div>
-        {{/if}}
-    </div>
-    <div
-        class="udex-tab-navigation__content"
-        id="udex-{{__id}}-content"
-        part="tab-navigation-content">
-        {{#each items}}
-            {{#if this.selected}}
-                <div
-                    class="udex-tab-navigation__content-item"
-                    id="{{_contentId}}"
-                    aria-hidden="{{this.IsMobile}}"
-                    role="tabpanel"
-                    aria-labelledby="{{_id}}">
-                    <slot name="{{this._slotName}}"></slot>
-                </div>
-            {{else}}
-                <div
-                    class="udex-tab-navigation__content-item"
-                    id="{{_contentId}}">
-                    <slot name="{{this._slotName}}"></slot>
-                </div>
-            {{/if}}
-        {{/each}}
-    </div>
-</div>

package/src/TabNavigationPopover.hbs

@@ -1,18 +0,0 @@
-<ui5-popover
-    id="{{_id}}-overflow-popover"
-    horizontal-align="End"
-    placement="Bottom"
-    aria-orientation="vertical"
-    @ui5-open="{{onFocusFirstItemPopover}}"
-    hide-arrow
-    _hideHeader>
-    <div
-        class="tab-navigation-popover"
-        @click="{{handleOverflowItemClick}}"
-        @keydown="{{handleFocusPopover}}"
-        role="tablist">
-        {{#each _overflowItems}}
-            {{tabInOverflow}}
-        {{/each}}
-    </div>
-</ui5-popover>