@ui5/webcomponents 0.0.0-c6c04c609 → 0.0.0-c8721b8d2

package/src/CheckBox.hbs

@@ -35,7 +35,7 @@
 		</div>
 
 		{{#if text}}
-			<ui5-label id="{{_id}}-label" class="ui5-checkbox-label" wrapping-type="{{wrappingType}}">{{text}}</ui5-label>
+			<ui5-label part="label" id="{{_id}}-label" class="ui5-checkbox-label" wrapping-type="{{wrappingType}}">{{text}}</ui5-label>
 		{{/if}}
 
 		{{#if hasValueState}}

package/src/ColorPalettePopover.hbs

@@ -2,6 +2,9 @@
 	hide-arrow
 	content-only-on-desktop
 	placement-type="Bottom"
+	?open="{{_open}}"
+	.opener="{{opener}}"
+	@ui5-after-close="{{onAfterClose}}"
 >
 	<div slot="header" class="ui5-cp-header">
 		<ui5-title

package/src/ComboBoxPopover.hbs

@@ -46,14 +46,14 @@
 					/>
 				</div>
 			</div>
-
-			{{#if hasValueStateText}}
-				<div class="{{classes.popoverValueState}}" style="{{styles.popoverValueStateMessage}}">
-					<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageIcon}}"></ui5-icon>
-					{{> valueStateMessage}}
-				</div>
-			{{/if}}
 		</div>
+		
+		{{#if hasValueStateText}}
+			<div class="{{classes.popoverValueState}}" style="{{styles.popoverValueStateMessage}}">
+				<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageIcon}}"></ui5-icon>
+				{{> valueStateMessage}}
+			</div>
+		{{/if}}
 	{{/if}}
 
 	{{#unless _isPhone}}
@@ -66,6 +66,7 @@
 	{{/unless}}
 
 	<ui5-list
+		class="ui5-combobox-items-list"
 		separators="None"
 		@ui5-item-click={{_selectItem}}
 		@ui5-item-focused={{_onItemFocus}}

package/src/DateTimePickerPopover.hbs

@@ -39,16 +39,18 @@
 			<span class="ui5-dt-picker-separator"></span>
 		{{/unless}}
 
-		<ui5-time-selection
-				id="{{_id}}-time-sel"
-				class="ui5-dt-time {{classes.dateTimeView}}"
-				value="{{_timeSelectionValue}}"
-				format-pattern="{{_formatPattern}}"
-				._currentSlider="{{_currentTimeSlider}}"
-				._calendarType="{{_primaryCalendarType}}"
-				@ui5-change="{{onTimeSelectionChange}}"
-				@ui5-slider-change="{{onTimeSliderChange}}"
-		></ui5-time-selection>
+		{{#if showTimeView}}
+			<ui5-time-selection
+					id="{{_id}}-time-sel"
+					class="ui5-dt-time {{classes.dateTimeView}}"
+					value="{{_timeSelectionValue}}"
+					format-pattern="{{_formatPattern}}"
+					._currentSlider="{{_currentTimeSlider}}"
+					._calendarType="{{_primaryCalendarType}}"
+					@ui5-change="{{onTimeSelectionChange}}"
+					@ui5-slider-change="{{onTimeSliderChange}}"
+			></ui5-time-selection>
+		{{/if}}
 	</div>
 {{/inline}}
 

package/src/InputPopover.hbs

@@ -35,13 +35,13 @@
 					></ui5-input>
 				</div>
 			</div>
-			{{#if hasValueStateMessage}}
-				<div class="{{classes.popoverValueState}}" style="{{styles.suggestionPopoverHeader}}">
-					<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageInputIcon}}"></ui5-icon>
-					{{> valueStateMessage}}
-				</div>
-			{{/if}}
 		</div>
+		{{#if hasValueStateMessage}}
+			<div class="{{classes.popoverValueState}}" style="{{styles.suggestionPopoverHeader}}">
+				<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageInputIcon}}"></ui5-icon>
+					{{> valueStateMessage}}
+			</div>
+		{{/if}}
 	{{/if}}
 
 	{{#unless _isPhone}}

package/src/Menu.hbs

@@ -75,6 +75,7 @@
 				@mouseout={{../_itemMouseOut}}
 				@keydown={{../_itemKeyDown}}
 			>
+				<div class="ui5-menu-item-text">
 				{{#if this.item.hasDummyIcon}}
 					<div
 						class="ui5-menu-item-dummy-icon"
@@ -83,18 +84,23 @@
 				{{/if}}
 				{{this.item.text}}
 				{{#if this.item.hasSubmenu}}
-					<ui5-icon
-						part="icon"
-						name="slim-arrow-right"
-						class="ui5-menu-item-icon-end"
+					<div
+						class="ui5-menu-item-submenu-icon"
 					>
-					</ui5-icon>
+						<ui5-icon
+							part="subicon"
+							name="slim-arrow-right"
+							class="ui5-menu-item-icon-end"
+						>
+						</ui5-icon>
+					</div>
 				{{else if this.item._siblingsWithChildren}}
 					<div
 						class="ui5-menu-item-no-icon-end"
 					>
 					</div>
 				{{/if}}
+				</div>
 			</ui5-li>
 		{{/each}}
 		</ui5-list>

package/src/MultiComboBoxPopover.hbs

@@ -38,24 +38,23 @@
 						@keydown={{_onkeydown}}
 						aria-autocomplete="both"
 						/>
-					</div>
-					<ui5-toggle-button
+				</div>
+				<ui5-toggle-button
 						slot="header"
 						class="ui5-multi-combobox-toggle-button"
 						icon="multiselect-all"
 						design="Transparent"
 						?pressed={{_showAllItemsButtonPressed}}
-						@click="{{filterSelectedItems}}"
-					></ui5-toggle-button>
-				</div>
-			{{#if hasValueStateMessage}}
-				<div class="{{classes.popoverValueState}}" style="{{styles.popoverValueStateMessage}}">
-					<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageIcon}}"></ui5-icon>
-					{{> valueStateMessage}}
-				</div>
-			{{/if}}
+						@click="{{filterSelectedItems}}">
+				</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>
+				{{> valueStateMessage}}
+			</div>
+		{{/if}}
 	{{/if}}
 
 	{{#unless _isPhone}}

package/src/Select.hbs

@@ -19,6 +19,7 @@
 		aria-describedby="{{valueStateTextId}}"
 		aria-disabled="{{isDisabled}}"
 		aria-required="{{required}}"
+		aria-readonly="{{readonly}}"
 		aria-expanded="{{_isPickerOpen}}"
 		aria-roledescription="{{_ariaRoleDescription}}"
 		@keydown="{{_onkeydown}}"
@@ -34,11 +35,13 @@
 		{{/if}}
 	</div>
 
-	<ui5-icon
-		name="slim-arrow-down"
-		input-icon
-		?pressed="{{_iconPressed}}"
-	></ui5-icon>
+	{{#unless readonly}}
+		<ui5-icon
+			name="slim-arrow-down"
+			input-icon
+			?pressed="{{_iconPressed}}"
+		></ui5-icon>
+	{{/unless}}
 
 	{{#if hasValueState}}
 		<span id="{{_id}}-valueStateDesc" class="ui5-hidden-text">{{valueStateText}}</span>

package/src/SelectMenu.hbs

@@ -30,7 +30,7 @@
 		{{/if}}
 		{{#unless _isPhone}}
 				{{#if hasValueState}}
-					<div class="{{classes.popoverValueState}}" style={{styles.responsivePopoverHeader}}>
+					<div class="{{classes.popoverValueState}}" style={{styles.valueStatePopover}}>
 						<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageInputIcon}}"></ui5-icon>
 						{{> valueStateMessage}}
 					</div>

package/src/SplitButton.hbs

@@ -17,11 +17,11 @@
 		tabindex="-1"
 		?disabled="{{disabled}}"
 		?active="{{_textButtonActive}}"
-		@click="{{_fireClick}}"
+		@click="{{_handleMouseClick}}"
 		@touchstart={{_textButtonPress}}
 		@mousedown={{_textButtonPress}}
 		@mouseup={{_textButtonRelease}}
-		@focusin={{_setTabIndexValue}}
+		@focusin={{_textButtonFocusIn}}
 		@focusout={{_onFocusOut}}
 	>
 		{{#if isTextButton}}
@@ -39,12 +39,14 @@
 			icon="slim-arrow-down"
 			tabindex="-1"
 			?disabled="{{disabled}}"
-			?active="{{_arrowButtonActive}}"
+			?active="{{effectiveActiveArrowButton}}"
 			aria-expanded="{{accessibilityInfo.ariaExpanded}}"
 			aria-haspopup="{{accessibilityInfo.ariaHaspopup}}"
-			@click="{{_fireArrowClick}}"
+			@click="{{_handleArrowButtonAction}}"
+			@mousedown={{_arrowButtonPress}}
+			@mouseup={{_arrowButtonRelease}}
 			@focusin={{_setTabIndexValue}}
-			@focusout={{_onFocusOut}}
+			@ui5-_active-state-change={{_onArrowButtonActiveStateChange}}
 		>
 		</ui5-button>
 	</div>

package/src/TabContainer.hbs

@@ -6,6 +6,7 @@
 		class="{{classes.header}}"
 		id="{{_id}}-header"
 		@focusin="{{_onHeaderFocusin}}"
+		part="tabstrip"
 	>
 		<div
 			class="ui5-tc__overflow ui5-tc__overflow--start"

package/src/TokenizerPopover.hbs

@@ -1,15 +1,29 @@
 <ui5-responsive-popover
 	tokenizer-popover="true"
 	style={{styles.popover}}
-	?content-only-on-desktop="{{hasValueState}}"
+	class={{classes.popover}}
+	?content-only-on-desktop="{{noValueStatePopover}}"
 	hide-arrow
 	placement-type="Bottom"
 	horizontal-align="Left"
 	@before-close={{handleBeforeClose}}
 	@before-open="{{handleBeforeOpen}}"
 >
-	<div slot="header" class="ui5-responsive-popover-header" style="{{styles.popoverHeader}}">
-		{{#if _isPhone}}
+	{{#unless _isPhone}}
+		<div slot="header" class="ui5-responsive-popover-header" style="{{styles.popoverHeader}}">
+			{{#unless noValueStatePopover}}
+				<div class="{{classes.popoverValueState}}" style="{{styles.popoverValueStateMessage}}">
+					<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageIcon}}"></ui5-icon>
+					{{#each valueStateMessageText}}
+						{{this}}
+					{{/each}}
+				</div>
+			{{/unless}}
+		</div>
+	{{/unless}}
+
+	{{#if _isPhone}}
+		<div slot="header" class="ui5-responsive-popover-header" style="{{styles.popoverHeader}}">
 			<div class="row" style="{{styles.popoverHeaderTitle}}">
 				<ui5-title level="H5" class="ui5-responsive-popover-header-text">{{morePopoverTitle}}</ui5-title>
 				<ui5-button
@@ -20,8 +34,8 @@
 				>
 				</ui5-button>
 			</div>
-		{{/if}}
-		{{#unless hasValueState}}
+		</div>
+		{{#unless noValueStatePopover}}
 			<div class="{{classes.popoverValueState}}" style="{{styles.popoverValueStateMessage}}">
 				<ui5-icon class="ui5-input-value-state-message-icon" name="{{_valueStateMessageIcon}}"></ui5-icon>
 				{{#each valueStateMessageText}}
@@ -29,7 +43,7 @@
 				{{/each}}
 			</div>
 		{{/unless}}
-	</div>
+	{{/if}}
 	<ui5-list
 		class="ui5-tokenizer-list"
 		mode="Delete"