@ui5/webcomponents 2.7.3 → 2.8.0-rc.1

package/src/MultiComboBox.hbs

@@ -1,106 +0,0 @@
-<div class="ui5-multi-combobox-root ui5-input-focusable-element"
->
-	<span id="ui5-multi-combobox-hiddenText-nMore" class="ui5-hidden-text">{{_tokensCountText}}</span>
-
-	{{#if hasValueState}}
-		<span id="ui5-multi-combobox-valueStateDesc" class="ui5-hidden-text">{{ariaValueStateHiddenText}}</span>
-	{{/if}}
-
-	<ui5-tokenizer slot="_beginContent"
-		prevent-popover-open
-		hide-popover-arrow
-		?readonly="{{../readonly}}"
-		class="ui5-multi-combobox-tokenizer"
-		?disabled="{{disabled}}"
-		@ui5-show-more-items-press="{{_showFilteredItems}}"
-		.opener={{morePopoverOpener}}
-		.popoverMinWidth={{_inputWidth}}
-		@ui5-token-delete="{{_tokenDelete}}"
-		@ui5-before-more-popover-open="{{handleBeforeTokenizerPopoverOpen}}"
-		@focusout="{{_tokenizerFocusOut}}"
-		@focusin="{{_tokenizerFocusIn}}"
-		@click={{_click}}
-		@paste={{_handlePaste}}
-		@keydown="{{_onTokenizerKeydown}}"
-		?expanded="{{_tokenizerExpanded}}"
-		?open = "{{tokenizerOpen}}"
-	>
-		{{#each items}}
-			{{#if isGroupItem}}
-				{{#each this.items}}
-					{{#if selected}}
-						<ui5-token
-							?readonly="{{../readonly}}"
-							class="ui5-multi-combobox-token"
-							data-ui5-id="{{this._id}}"
-							part="token-{{@index}}"
-							text="{{this.text}}"
-						>
-					{{/if}}
-				{{/each}}
-			{{else}}
-				{{#if selected}}
-					<ui5-token
-						?readonly="{{../readonly}}"
-						class="ui5-multi-combobox-token"
-						data-ui5-id="{{this._id}}"
-						part="token-{{@index}}"
-						text="{{this.text}}"
-					>
-					</ui5-token>
-				{{/if}}
-			{{/if}}
-		{{/each}}
-	</ui5-tokenizer>
-
-	<input id="ui5-multi-combobox-input"
-		.value="{{value}}"
-		inner-input
-		placeholder={{_getPlaceholder}}
-		?disabled={{disabled}}
-		?readonly={{readonly}}
-		value-state="{{valueState}}"
-		@input="{{_inputLiveChange}}"
-		@change={{_inputChange}}
-		@keydown="{{_onkeydown}}"
-		@click={{_click}}
-		@focusin={{inputFocusIn}}
-		@focusout={{inputFocusOut}}
-		@paste={{_handlePaste}}
-		role="combobox"
-		aria-haspopup="dialog"
-		aria-expanded="{{open}}"
-		aria-autocomplete="both"
-		aria-describedby="{{ariaDescribedByText}}"
-		aria-required="{{required}}"
-		aria-label="{{ariaLabelText}}"
-		aria-controls="{{responsivePopoverId}}"
-		autocomplete="off"
-		data-sap-focus-ref
-	/>
-
-	{{#if _effectiveShowClearIcon}}
-		<div @click={{_clear}} class="ui5-input-clear-icon-wrapper inputIcon" tabindex="-1" @mousedown={{_iconMouseDown}}>
-			<ui5-icon tabindex="-1" class="ui5-input-clear-icon" name="decline" accessible-name="{{clearIconAccessibleName}}"></ui5-icon>
-		</div>
-	{{/if}}
-
-	{{#if icon}}
-		<slot name="icon"></slot>
-	{{/if}}
-
-	{{#unless readonly}}
-		<ui5-icon name="slim-arrow-down"
-			class="inputIcon"
-			slot="icon"
-			tabindex="-1"
-			@click="{{togglePopoverByDropdownIcon}}"
-			@mousedown="{{_onIconMousedown}}"
-			@focusin="{{_forwardFocusToInner}}"
-			?pressed="{{open}}"
-			accessible-name="{{_iconAccessibleNameText}}"
-		></ui5-icon>
-	{{/unless}}
-</div>
-
-{{>include "./MultiComboBoxPopover.hbs"}}

package/src/MultiComboBoxPopover.hbs

@@ -1,144 +0,0 @@
-<ui5-responsive-popover
-	placement="Bottom"
-	horizontal-align="Start"
-	class="{{classes.popover}}"
-	id="{{responsivePopoverId}}"
-	hide-arrow
-	prevent-initial-focus
-	style="{{styles.suggestionsPopover}}"
-	@ui5-selection-change={{_listSelectionChange}}
-	@ui5-close={{_afterClose}}
-	@ui5-before-open={{_beforeOpen}}
-	@ui5-before-close={{_beforeClose}}
-	@ui5-open={{_afterOpen}}
-	@focusout={{_onPopoverFocusOut}}
-	accessible-name="{{_popupLabel}}"
-	.open={{_open}}
-	.opener={{this}}
->
-	{{#if _isPhone}}
-		<div slot="header" class="ui5-responsive-popover-header" style="{{styles.popoverHeader}}">
-			<div class="row">
-				<span>{{_headerTitleText}}</span>
-				<ui5-button
-					class="ui5-responsive-popover-close-btn"
-					icon="decline"
-					design="Transparent"
-					@click="{{handleCancel}}"
-				>
-				</ui5-button>
-			</div>
-			<div class="row">
-				<ui5-input
-					@ui5-input="{{_handleMobileInput}}"
-					@keydown="{{_onMobileInputKeydown}}"
-					placeholder="{{placeholder}}"
-					value-state="{{_dialogInputValueState}}"
-					?show-clear-icon="{{showClearIcon}}"
-					?no-typeahead="{{noTypeahead}}"
-				>
-					{{#each _filteredItems}}
-						<ui5-suggestion-item text="{{this.text}}" additional-text="{{this.additionalText}}"></ui5-suggestion-item>
-					{{/each}}
-				</ui5-input>
-				<ui5-toggle-button
-						slot="header"
-						class="ui5-multi-combobox-toggle-button"
-						icon="multiselect-all"
-						design="Transparent"
-						?pressed={{_showAllItemsButtonPressed}}
-						@click="{{filterSelectedItems}}"
-						accessible-name="{{_showSelectedButtonAccessibleNameText}}">
-				</ui5-toggle-button>
-			</div>
-		</div>
-		{{#if hasValueStateMessage}}
-			<div class="{{classes.popoverValueState}}" style="{{styles.popoverValueStateMessage}}">
-				<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageIcon}}"></ui5-icon>
-				{{#if open}}
-					{{> valueStateMessage}}
-				{{/if}}
-			</div>
-		{{/if}}
-
-		{{> selectAllWrapper}}
-	{{/if}}
-
-	{{#unless _isPhone}}
-		{{#if hasValueStateMessage}}
-			<div slot="header" @keydown="{{_onListHeaderKeydown}}" tabindex="0" class="ui5-responsive-popover-header {{classes.popoverValueState}}" style={{styles.popoverValueStateMessage}}>
-				<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageIcon}}"></ui5-icon>
-				{{#if open}}
-					{{> valueStateMessage}}
-				{{/if}}			
-			</div>
-		{{/if}}
-
-		{{> selectAllWrapper}}
-	{{/unless}}
-
-	{{#if filterSelected}}
-		<ui5-list separators="None" selection-mode="Multiple" class="ui5-multi-combobox-all-items-list" accessible-role="ListBox">
-			{{#each selectedItems}}
-				{{> listItem}}
-			{{/each}}
-		</ui5-list>
-	{{else}}
-		<ui5-list separators="None" selection-mode="Multiple" class="ui5-multi-combobox-all-items-list" accessible-role="ListBox" @keydown="{{_onItemKeydown}}">
-			{{#each _filteredItems}}
-				{{> listItem}}
-			{{/each}}
-		</ui5-list>
-	{{/if}}
-
-	{{#if _isPhone}}
-		<div slot="footer" class="ui5-responsive-popover-footer">
-			<ui5-button
-				design="Transparent"
-				@click="{{handleOK}}"
-			>{{_dialogOkButton}}</ui5-button>
-		</div>
-	{{/if}}
-</ui5-responsive-popover>
-
-{{#if hasValueStateMessage}}
-	<ui5-popover
-		skip-registry-update
-		prevent-initial-focus
-		prevent-focus-restore
-		hide-arrow
-		class="ui5-valuestatemessage-popover"
-		placement="Bottom"
-		horizontal-align="{{_valueStatePopoverHorizontalAlign}}"
-		tabindex="-1"
-		.open="{{valueStateOpen}}"
-		.opener="{{this}}"
-	>
-		<div slot="header" class="{{classes.popoverValueState}}" style="{{styles.popoverHeader}}">
-			<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageIcon}}"></ui5-icon>
-			{{#if valueStateOpen}}
-				{{> valueStateMessage}}
-			{{/if}}
-		</div>
-	</ui5-popover>
-{{/if}}
-
-{{#*inline "valueStateMessage"}}
-	{{#if shouldDisplayDefaultValueStateMessage}}
-		{{valueStateDefaultText}}
-	{{else}}
-		<slot name="valueStateMessage"></slot>
-	{{/if}}
-{{/inline}}
-
-{{#*inline "listItem"}}
-	<slot name="{{this._individualSlot}}"></slot>
-{{/inline}}
-
-{{#*inline "selectAllWrapper"}}
-	{{#if showSelectAll}}
-		<div class="ui5-mcb-select-all-header" @keydown="{{_onListHeaderKeydown}}" tabindex="0">
-			<ui5-checkbox ?disabled={{this.readonly}} ?checked={{_allSelected}} class="ui5-mcb-select-all-checkbox" text="{{selectAllCheckboxLabel}}" @ui5-change="{{_handleSelectAllCheckboxClick}}"></ui5-checkbox>
-		</div>
-	{{/if}}
-{{/inline}}