@ui5/webcomponents 2.5.0 → 2.6.0-rc.0

package/src/Panel.hbs

@@ -1,77 +0,0 @@
-<div
-	class="ui5-panel-root"
-	role="{{accRole}}"
-	aria-label="{{effectiveAccessibleName}}"
-	aria-labelledby="{{fixedPanelAriaLabelledbyReference}}"
->
-
-	{{#if hasHeaderOrHeaderText}}
-		{{! header: either header or h1 with header text}}
-		<div
-			class="ui5-panel-heading-wrapper{{classes.stickyHeaderClass}}"
-			role="{{headingWrapperRole}}"
-			aria-level="{{headingWrapperAriaLevel}}"
-		>
-			<div
-				@click="{{_headerClick}}"
-				@keydown="{{_headerKeyDown}}"
-				@keyup="{{_headerKeyUp}}"
-				class="ui5-panel-header"
-				tabindex="{{headerTabIndex}}"
-				role="{{accInfo.role}}"
-				aria-expanded="{{accInfo.ariaExpanded}}"
-				aria-controls="{{accInfo.ariaControls}}"
-				aria-labelledby="{{accInfo.ariaLabelledby}}"
-				part="header"
-			>
-				{{#unless fixed}}
-					<div class="ui5-panel-header-button-root">
-						{{#if _hasHeader}}
-							<ui5-button
-								design="Transparent"
-								class="ui5-panel-header-button ui5-panel-header-button-with-icon"
-								@click="{{_toggleButtonClick}}"
-								.accessibilityAttributes={{accInfo.button.accessibilityAttributes}}
-								tooltip="{{accInfo.button.title}}"
-								accessible-name="{{accInfo.button.ariaLabelButton}}"
-							>
-								<div class="ui5-panel-header-icon-wrapper">
-									<ui5-icon class="ui5-panel-header-icon {{classes.headerBtn}}" name="slim-arrow-right"></ui5-icon>
-								</div>
-							</ui5-button>
-						{{else}}
-							<ui5-icon
-								class="ui5-panel-header-button ui5-panel-header-icon {{classes.headerBtn}}"
-								name="slim-arrow-right"
-								show-tooltip
-								accessible-name="{{toggleButtonTitle}}"
-							></ui5-icon>
-						{{/if}}
-					</div>
-				{{/unless}}
-
-				{{#if _hasHeader}}
-					<slot name="header"></slot>
-				{{else}}
-					<div
-						id="{{_id}}-header-title"
-						class="ui5-panel-header-title"
-					>
-						{{headerText}}
-					</div>
-				{{/if}}
-			</div>
-		</div>
-	{{/if}}
-
-	{{! content area}}
-	<div
-		class="ui5-panel-content"
-		id="{{_id}}-content"
-		tabindex="-1"
-		style="{{styles.content}}"
-		part="content"
-	>
-		<slot></slot>
-	</div>
-</div>

package/src/Popover.hbs

@@ -1,25 +0,0 @@
-{{>include "./Popup.hbs"}}
-
-{{#*inline "beforeContent"}}
-	<span class="ui5-popover-arrow" style="{{styles.arrow}}"></span>
-
-	{{#if _displayHeader}}
-		<header class="ui5-popup-header-root" id="ui5-popup-header" part="header">
-			{{#if header.length }}
-				<slot name="header"></slot>
-			{{else}}
-				<ui5-title level="H1" class="ui5-popup-header-text">{{headerText}}</ui5-title>
-			{{/if}}
-		</header>
-	{{/if}}
-{{/inline}}
-
-{{#*inline "afterContent"}}
-	{{#if _displayFooter}}
-		{{#if footer.length }}
-			<footer class="ui5-popup-footer-root" part="footer">
-				<slot name="footer"></slot>
-			</footer>
-		{{/if}}
-	{{/if}}
-{{/inline}}

package/src/Popup.hbs

@@ -1,34 +0,0 @@
-{{>include "./PopupBlockLayer.hbs"}}
-
-<section
-	root-element
-	style="{{styles.root}}"
-	class="{{classes.root}}"
-	role="{{_role}}"
-	aria-modal="{{_ariaModal}}"
-	aria-label="{{_ariaLabel}}"
-	aria-labelledby="{{_ariaLabelledBy}}"
-	@keydown={{_onkeydown}}
-	@focusout={{_onfocusout}}
-	@mouseup={{_onmouseup}}
-	@mousedown={{_onmousedown}}
->
-
-	<span class="first-fe" data-ui5-focus-trap role="none" tabindex="0" @focusin={{forwardToLast}}></span>
-
-	{{> beforeContent}}
-
-	<div style="{{styles.content}}" class="{{classes.content}}"  @scroll="{{_scroll}}" part="content">
-		<slot></slot>
-	</div>
-
-	{{> afterContent}}
-
-	<span class="last-fe" data-ui5-focus-trap role="none" tabindex="0" @focusin={{forwardToFirst}}></span>
-
-</section>
-
-
-{{#*inline "beforeContent"}}{{/inline}}
-
-{{#*inline "afterContent"}}{{/inline}}

package/src/PopupBlockLayer.hbs

@@ -1,4 +0,0 @@
-<div class="ui5-block-layer"
-	@keydown="{{_preventBlockLayerFocus}}"
-	@mousedown="{{_preventBlockLayerFocus}}">
-</div>

package/src/ProgressIndicator.hbs

@@ -1,34 +0,0 @@
-<div class="ui5-progress-indicator-root {{classes.root}}"
-     role="progressbar"
-     aria-valuemin="0"
-     aria-valuenow="{{validatedValue}}"
-     aria-valuemax="100"
-     aria-valuetext="{{valueStateText}}"
-     aria-label="{{accessibleName}}"
->
-    <div class="ui5-progress-indicator-bar" part="bar" style="{{styles.bar}}">
-        {{#unless showValueInRemainingBar}}
-           {{> valueLabel}}
-        {{/unless}}
-    </div>
-    <div class="ui5-progress-indicator-remaining-bar" part="remaining-bar">
-        {{#if showValueInRemainingBar}}
-           {{> valueLabel}}
-        {{/if}}
-    </div>
-</div>
-
-{{#*inline "valueLabel"}}
-    {{#if showIcon}}
-        <ui5-icon name="{{valueStateIcon}}" class="ui5-progress-indicator-icon"></ui5-icon>
-    {{/if}}
-    {{#unless hideValue}}
-        <span class="ui5-progress-indicator-value">
-            {{#if displayValue}}
-                {{displayValue}}
-            {{else}}
-                {{validatedValue}}%
-            {{/if}}
-        </span>
-    {{/unless}}
-{{/inline}}

package/src/RadioButton.hbs

@@ -1,30 +0,0 @@
-<div class="ui5-radio-root"
-	role="radio"
-	aria-checked="{{checked}}"
-	aria-disabled="{{effectiveAriaDisabled}}"
-	aria-describedby="{{effectiveAriaDescribedBy}}"
-	aria-label="{{ariaLabelText}}"
-	tabindex="{{effectiveTabIndex}}"
-	@click="{{_onclick}}"
-	@keydown="{{_onkeydown}}"
-	@keyup="{{_onkeyup}}"
-	@mousedown="{{_onmousedown}}"
-	@mouseup="{{_onmouseup}}"
-	@focusout="{{_onfocusout}}"
->
-	<div class='ui5-radio-inner {{classes.inner}}'>
-		<svg class="ui5-radio-svg" focusable="false" aria-hidden="true">
-			<circle part="outer-ring" class="ui5-radio-svg-outer" cx="50%" cy="50%" r="50%" />
-			<circle part="inner-ring" class="ui5-radio-svg-inner" cx="50%" cy="50%" />
-		</svg>
-		<input type='radio' ?required="{{required}}" ?checked="{{checked}}" ?readonly="{{readonly}}" ?disabled="{{disabled}}" name="{{name}}"  data-sap-no-tab-ref/>
-	</div>
-
-	{{#if text}}
-		<ui5-label id="{{_id}}-label" class="ui5-radio-label" for="{{_id}}" wrapping-type="{{wrappingType}}">{{text}}</ui5-label>
-	{{/if}}
-
-	{{#if hasValueState}}
-		<span id="{{_id}}-descr" class="ui5-hidden-text">{{valueStateText}}</span>
-	{{/if}}
-</div>

package/src/RangeSlider.hbs

@@ -1,111 +0,0 @@
-{{>include "./SliderBase.hbs"}}
-
-{{#*inline "handlesAriaText"}}
-	<span id="ui5-slider-startHandleDesc" class="ui5-hidden-text">{{_ariaHandlesText.startHandleText}}</span>
-	<span id="ui5-slider-endHandleDesc" class="ui5-hidden-text">{{_ariaHandlesText.endHandleText}}</span>
-{{/inline}}
-
-{{#*inline "progressBar"}}
-	<div
-		class="ui5-slider-progress-container"
-		part="progress-container"
-	>
-		<div class="ui5-slider-progress"
-			part="progress-bar"
-			style="{{styles.progress}}"
-			@focusin="{{_onfocusin}}"
-			@focusout="{{_onfocusout}}"
-			role="slider"
-			tabindex="{{_tabIndex}}"
-			aria-orientation="horizontal"
-			aria-valuemin="{{min}}"
-			aria-valuemax="{{max}}"
-			aria-valuenow="{{_ariaValueNow}}"
-			aria-valuetext="From {{startValue}} to {{endValue}}"
-			aria-labelledby="ui5-slider-sliderDesc"
-			aria-disabled="{{_ariaDisabled}}"
-		></div>
-	</div>
-{{/inline}}
-
-{{#*inline "handles"}}
-	<div class="ui5-slider-handle-container" style="{{styles.startHandle}}" part="handle-container">
-
-		<div class="ui5-slider-handle ui5-slider-handle--start"
-			part="handle"
-			@focusin="{{_onfocusin}}"
-			@focusout="{{_onfocusout}}"
-			role="slider"
-			tabindex="{{_tabIndex}}"
-			aria-orientation="horizontal"
-			aria-valuemin="{{min}}"
-			aria-valuemax="{{max}}"
-			aria-valuenow="{{startValue}}"
-			aria-labelledby="{{_ariaLabelledByStartHandleText}}"
-			aria-disabled="{{_ariaDisabled}}"
-			aria-describedby="{{_ariaDescribedByHandleText}}"
-			aria-keyshortcuts="F2"
-		>
-			<ui5-icon name="direction-arrows" mode="Decorative" slider-icon></ui5-icon>
-		</div>
-
-		{{#if showTooltip}}
-		<div class="ui5-slider-tooltip ui5-slider-tooltip--start" style="{{styles.tooltip}}">
-			{{#if editableTooltip}}
-				<ui5-input
-					type="Number"
-					value="{{startValue}}"
-					accessible-name-ref="ui5-slider-InputLabel"
-					@focusout="{{_onInputFocusOut}}"
-					@keydown="{{_onInputKeydown}}"
-					@ui5-change="{{_onInputChange}}"
-					@ui5-input="{{_onInputInput}}"
-					data-sap-ui-start-value
-					tabindex="-1"
-				></ui5-input>
-			{{else}}
-				<span class="ui5-slider-tooltip-value">{{tooltipStartValue}}</span>
-			{{/if}}
-		</div>
-		{{/if}}
-	</div>
-	<div class="ui5-slider-handle-container" style="{{styles.endHandle}}" part="handle-container">
-		<div class="ui5-slider-handle ui5-slider-handle--end"
-			part="handle"
-			@focusin="{{_onfocusin}}"
-			@focusout="{{_onfocusout}}"
-			role="slider"
-			tabindex="{{_tabIndex}}"
-			aria-orientation="horizontal"
-			aria-valuemin="{{min}}"
-			aria-valuemax="{{max}}"
-			aria-valuenow="{{endValue}}"
-			aria-labelledby="{{_ariaLabelledByEndHandleText}}"
-			aria-describedby="{{_ariaDescribedByHandleText}}"
-			aria-disabled="{{_ariaDisabled}}"
-			aria-keyshortcuts="F2"
-		>
-			<ui5-icon name="direction-arrows" mode="Decorative" slider-icon></ui5-icon>
-		</div>
-
-		{{#if showTooltip}}
-		<div class="ui5-slider-tooltip ui5-slider-tooltip--end" style="{{styles.tooltip}}">
-			{{#if editableTooltip}}
-				<ui5-input
-					type="Number"
-					value="{{endValue}}"
-					accessible-name-ref="ui5-slider-InputLabel"
-					@focusout="{{_onInputFocusOut}}"
-					@keydown="{{_onInputKeydown}}"
-					@ui5-change="{{_onInputChange}}"
-					@ui5-input="{{_onInputInput}}"
-					data-sap-ui-end-value
-					tabindex="-1"
-				></ui5-input>
-			{{else}}
-				<span class="ui5-slider-tooltip-value">{{tooltipEndValue}}</span>
-			{{/if}}
-		</div>
-		{{/if}}
-	</div>
-{{/inline}}

package/src/RatingIndicator.hbs

@@ -1,50 +0,0 @@
-<div class="ui5-rating-indicator-root"
-	role="slider"
-	aria-roledescription="{{_ariaRoleDescription}}"
-	aria-valuemin="0"
-	aria-valuenow="{{value}}"
-	aria-valuemax="{{max}}"
-	aria-valuetext="{{value}} of {{max}}"
-	aria-orientation="horizontal"
-	aria-disabled="{{_ariaDisabled}}"
-	aria-readonly="{{ariaReadonly}}"
-	aria-description="{{_ariaDescription}}"
-	tabindex="{{effectiveTabIndex}}"
-	@focusin="{{_onfocusin}}"
-	@focusout="{{_onfocusout}}"
-	@click="{{_onclick}}"
-	@keydown="{{_onkeydown}}"
-	title="{{ratingTooltip}}"
-	aria-label="{{_ariaLabel}}"
->
-	<ul class="ui5-rating-indicator-list"
-		aria-hidden="true"
-		>
-		{{#each _stars}}
-			{{#if this.selected}}
-				<li data-ui5-value="{{this.index}}" class="ui5-rating-indicator-item ui5-rating-indicator-item-sel">
-					<ui5-icon data-ui5-value="{{this.index}}" name="favorite"></ui5-icon>
-				</li>
-			{{else if this.halfStar}}
-				<li class="ui5-rating-indicator-item ui5-rating-indicator-item-half">
-					<ui5-icon data-ui5-value="{{this.index}}" name="{{../halfStarIconName}}"></ui5-icon>
-					<div class="ui5-rating-indicator-half-icon-wrapper">
-						<ui5-icon data-ui5-value="{{this.index}}" name="favorite" class="ui5-rating-indicator-half-icon"></ui5-icon>
-					</div>
-				</li>
-			{{else if ../readonly}}
-				<li class="ui5-rating-indicator-item ui5-rating-indicator-item-unsel">
-					<ui5-icon data-ui5-value="{{this.index}}" name="favorite"></ui5-icon>
-				</li>
-			{{else if ../disabled}}
-				<li class="ui5-rating-indicator-item ui5-rating-indicator-item-unsel">
-					<ui5-icon data-ui5-value="{{this.index}}" name="favorite"></ui5-icon>
-				</li>
-			{{else}}
-				<li data-ui5-value="{{this.index}}" class="ui5-rating-indicator-item ui5-rating-indicator-item-unsel">
-					<ui5-icon data-ui5-value="{{this.index}}" name="unfavorite"></ui5-icon>
-				</li>
-			{{/if}}
-		{{/each}}
-	</ul>
-</div>

package/src/ResponsivePopover.hbs

@@ -1,51 +0,0 @@
-{{#if _isPhone}}
-	<ui5-dialog
-		root-element
-		accessible-name={{accessibleName}}
-		accessible-name-ref={{accessibleNameRef}}
-		accessible-role={{accessibleRole}}
-		stretch
-		?prevent-initial-focus="{{preventInitialFocus}}"
-		initial-focus="{{initialFocus}}"
-		@ui5-before-open="{{_beforeDialogOpen}}"
-		@ui5-open="{{_afterDialogOpen}}"
-		@ui5-before-close="{{_beforeDialogClose}}"
-		@ui5-close="{{_afterDialogClose}}"
-		exportparts="content, header, footer"
-		.open={{open}}
-	>
-		{{!-- forward slot header to inner dialog slot header --}}
-		{{#unless _hideHeader}}
-			{{#if header.length}}
-				<slot slot="header" name="header"></slot>
-			{{else}}
-				<div class="{{classes.header}}" slot="header">
-					{{#if headerText }}
-						<ui5-title
-							level="H1"
-							wrapping-type="None"
-							class="ui5-popup-header-text ui5-responsive-popover-header-text"
-						>
-							{{headerText}}
-						</ui5-title>
-					{{/if}}
-					{{#unless _hideCloseButton}}
-						<ui5-button
-							icon="decline"
-							design="Transparent"
-							accessible-name="{{_closeDialogAriaLabel}}"
-							@click="{{closePopup}}"
-						>
-						</ui5-button>
-					{{/unless}}
-				</div>
-			{{/if}}
-		{{/unless}}
-
-		<slot></slot>
-		{{!-- forward slot footer to inner dialog slot footer --}}
-		<slot slot="footer" name="footer"></slot>
-	</ui5-dialog>
-{{else}}
-	{{>include "./Popover.hbs"}}
-{{/if}}

package/src/SegmentedButton.hbs

@@ -1,18 +0,0 @@
-<ul
-	@click="{{_onclick}}"
-	@mousedown="{{_onmousedown}}"
-	@keydown="{{_onkeydown}}"
-	@keyup="{{_onkeyup}}"
-	@focusin="{{_onfocusin}}"
-	class="ui5-segmented-button-root"
-	role="listbox"
-	aria-multiselectable="true"
-	aria-describedby="{{_id}}-invisibleText"
-	aria-roledescription={{ariaDescription}}
-	aria-label={{accessibleName}}
->
-	<slot></slot>
-
-	<span id="{{_id}}-invisibleText" class="ui5-hidden-text">{{ariaDescribedBy}}</span>
-
-</ul>

package/src/SegmentedButtonItem.hbs

@@ -1,31 +0,0 @@
-<li
-		role="option"
-		aria-roledescription="{{ariaDescription}}"
-		aria-posinset="{{posInSet}}"
-		aria-setsize="{{sizeOfSet}}"
-		aria-selected="{{selected}}"
-		class="ui5-segmented-button-item-root"
-		aria-disabled="{{disabled}}"
-		data-sap-focus-ref
-		@click={{_onclick}}
-		@keyup={{_onkeyup}}
-		tabindex={{tabIndexValue}}
-		aria-label="{{ariaLabelText}}"
-		title="{{tooltip}}"
->
-	{{#if icon}}
-		<ui5-icon
-			class="ui5-segmented-button-item-icon"
-			name="{{icon}}"
-			part="icon"
-			?show-tooltip={{showIconTooltip}}
-		></ui5-icon>
-	{{/if}}
-
-	<span id="{{_id}}-content" class="ui5-segmented-button-item-text">
-		<bdi>
-			<slot></slot>
-		</bdi>
-	</span>
-
-</li>

package/src/Slider.hbs

@@ -1,61 +0,0 @@
-{{>include "./SliderBase.hbs"}}
-
-{{#*inline "progressBar"}}
-	<div
-		class="ui5-slider-progress-container"
-		aria-hidden="true"
-		part="progress-container"
-	>
-		<div class="ui5-slider-progress"
-			style="{{styles.progress}}"
-			@focusout="{{_onfocusout}}"
-			@focusin="{{_onfocusin}}"
-			tabindex="-1"
-			part="progress-bar"
-		></div>
-	</div>
-{{/inline}}
-
-{{#*inline "handles"}}
-	<div class="ui5-slider-handle-container" style="{{styles.handle}}" part="handle-container">
-		<div class="ui5-slider-handle"
-			@focusout="{{_onfocusout}}"
-			@focusin="{{_onfocusin}}"
-			role="slider"
-			tabindex="{{_tabIndex}}"
-			aria-orientation="horizontal"
-			aria-valuemin="{{min}}"
-			aria-valuemax="{{max}}"
-			aria-valuenow="{{value}}"
-			aria-labelledby="{{_ariaLabelledByHandleText}}"
-			aria-disabled="{{_ariaDisabled}}"
-			aria-keyshortcuts="F2"
-			aria-describedby="{{_ariaDescribedByHandleText}}"
-
-			data-sap-focus-ref
-			part="handle"
-		>
-				<ui5-icon name="direction-arrows" mode="Decorative" part="icon-slider" slider-icon></ui5-icon>
-		</div>
-		{{#if showTooltip}}
-		<div class="ui5-slider-tooltip" style="{{styles.tooltip}}">
-			{{#if editableTooltip}}
-				<ui5-input
-					value="{{_tooltipInputValue}}"
-					value-state="{{_tooltipInputValueState}}"
-					type="Number"
-					accessible-name-ref="ui5-slider-InputLabel"
-					@focusout="{{_onInputFocusOut}}"
-					@keydown="{{_onInputKeydown}}"
-					@ui5-change="{{_onInputChange}}"
-					@ui5-input="{{_onInputInput}}"
-					data-sap-ui-end-value
-					tabindex="-1"
-				></ui5-input>
-			{{else}}
-				<span class="ui5-slider-tooltip-value">{{tooltipValue}}</span>
-			{{/if}}
-		</div>
-		{{/if}}
-	</div>
-{{/inline}}

package/src/SliderBase.hbs

@@ -1,56 +0,0 @@
-<div
-	class="ui5-slider-root {{classes.root}}"
-	@mousedown="{{_onmousedown}}"
-	@touchstart="{{_ontouchstart}}"
-	@mouseover="{{_onmouseover}}"
-	@mouseout="{{_onmouseout}}"
-	@keydown="{{_onkeydown}}"
-	@keyup="{{_onKeyupBase}}"
-	part="root-container"
->
-	{{> handlesAriaText}}
-
-	<div class="ui5-slider-inner">
-		{{#if step}}
-			{{#if showTickmarks}}
-				<ul class="ui5-slider-tickmarks">
-					{{#each tickmarksObject}}
-						{{#if this}}
-							<li class="ui5-slider-tickmark ui5-slider-tickmark-in-range"></li>
-						{{else}}
-							<li class="ui5-slider-tickmark"></li>
-						{{/if}}
-					{{/each}}
-				</ul>
-				{{#if labelInterval}}
-					<ul class="ui5-slider-labels {{classes.labelContainer}}" style="{{styles.labelContainer}}">
-						{{#each _labels}}
-							<li style="{{../styles.label}}">{{this}}</li>
-						{{/each}}
-					</ul>
-				{{/if}}
-			{{/if}}
-		{{/if}}
-
-		{{> progressBar}}
-
-		{{> handles}}
-	</div>
-
-	{{#if accessibleName}}
-		<span id="ui5-slider-accName" class="ui5-hidden-text">{{accessibleName}}</span>
-	{{/if}}
-
-	<span id="ui5-slider-sliderDesc" class="ui5-hidden-text">{{_ariaLabelledByText}}</span>
-
-	{{#if editableTooltip}}
-		<span id="ui5-slider-InputDesc" class="ui5-hidden-text">{{_ariaDescribedByInputText}}</span>
-		<span id="ui5-slider-InputLabel" class="ui5-hidden-text">{{_ariaLabelledByInputText}}</span>
-	{{/if}}
-
-</div>
-
-
-{{#*inline "handlesAriaText"}}{{/inline}}
-{{#*inline "progressBar"}}{{/inline}}
-{{#*inline "handles"}}{{/inline}}

package/src/SplitButton.hbs

@@ -1,49 +0,0 @@
-<div
-	class="ui5-split-button-root"
-	role="group"
-	tabindex={{_tabIndex}}
-	aria-labelledby="{{_id}}-invisibleTextDefault {{_id}}-invisibleText"
-	@focusout={{_onFocusOut}}
-	@focusin={{_onFocusIn}}
-	@keydown={{_onKeyDown}}
-	@keyup={{_onKeyUp}}
->
-
-	<ui5-button
-		class="ui5-split-text-button"
-		design="{{design}}"
-		icon="{{icon}}"
-		tabindex="-1"
-		?disabled="{{disabled}}"
-		?active="{{_textButtonActive}}"
-		@click="{{_handleMouseClick}}"
-		@touchstart={{_textButtonPress}}
-		@mousedown={{_textButtonPress}}
-		@mouseup={{_textButtonRelease}}
-		@focusin={{_onInnerButtonFocusIn}}
-		@focusout={{_onFocusOut}}
-	>
-		{{#if isTextButton}}
-			<slot></slot>
-		{{/if}}
-	</ui5-button>
-	<ui5-button
-		class="ui5-split-arrow-button"
-		design="{{design}}"
-		icon="slim-arrow-down"
-		tabindex="-1"
-		tooltip="{{accInfo.arrowButton.title}}"
-		.accessibilityAttributes={{accInfo.arrowButton.accessibilityAttributes}}
-		?disabled="{{disabled}}"
-		?active="{{effectiveActiveArrowButton}}"
-		@click="{{_handleArrowButtonAction}}"
-		@mousedown={{_arrowButtonPress}}
-		@mouseup={{_arrowButtonRelease}}
-		@focusin={{_onInnerButtonFocusIn}}
-		@ui5-_active-state-change={{_onArrowButtonActiveStateChange}}
-	>
-	</ui5-button>
-	<span id="{{_id}}-invisibleText" class="ui5-hidden-text">{{accInfo.root.description}} {{accInfo.root.keyboardHint}} {{accessibleName}}</span>
-	<span id="{{_id}}-invisibleTextDefault" class="ui5-hidden-text">{{textButtonAccText}}</span>
-
-</div>