@sapudex/web-components 2.36.0 → 2.37.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cypress/specs/Pagination.cy.tsx +52 -0
- package/cypress/specs/SelectBox.cy.tsx +1 -1
- package/cypress/specs/TabNavigation.cy.tsx +314 -0
- package/cypress/specs/Table.cy.tsx +170 -0
- package/cypress/support/component-imports.instrumented.ts +2 -0
- package/cypress/support/component-imports.src.ts +2 -0
- package/dist/CountrySelector.d.ts +2 -0
- package/dist/CountrySelector.js +12 -3
- package/dist/CountrySelector.js.map +1 -1
- package/dist/CountrySelectorTemplate.d.ts +2 -0
- package/dist/CountrySelectorTemplate.js +8 -0
- package/dist/CountrySelectorTemplate.js.map +1 -0
- package/dist/FilterMenu.d.ts +3 -3
- package/dist/FilterMenu.js +8 -9
- package/dist/FilterMenu.js.map +1 -1
- package/dist/FilterMenuTemplate.d.ts +2 -0
- package/dist/FilterMenuTemplate.js +27 -0
- package/dist/FilterMenuTemplate.js.map +1 -0
- package/dist/Pagination.js +1 -0
- package/dist/Pagination.js.map +1 -1
- package/dist/SearchableListBaseTemplate.d.ts +2 -0
- package/dist/SearchableListBaseTemplate.js +32 -0
- package/dist/SearchableListBaseTemplate.js.map +1 -0
- package/dist/SecondaryNavigation.d.ts +2 -0
- package/dist/SecondaryNavigation.js +20 -0
- package/dist/SecondaryNavigation.js.map +1 -1
- package/dist/SelectBase.d.ts +7 -6
- package/dist/SelectBase.js +2 -2
- package/dist/SelectBase.js.map +1 -1
- package/dist/SelectBox.d.ts +2 -0
- package/dist/SelectBox.js +11 -3
- package/dist/SelectBox.js.map +1 -1
- package/dist/SelectBoxTemplate.d.ts +2 -0
- package/dist/SelectBoxTemplate.js +27 -0
- package/dist/SelectBoxTemplate.js.map +1 -0
- package/dist/Tab.d.ts +9 -0
- package/dist/Tab.js +6 -0
- package/dist/Tab.js.map +1 -1
- package/dist/TabNavigation.js +32 -12
- package/dist/TabNavigation.js.map +1 -1
- package/dist/TableGroupRowTemplate.js +1 -1
- package/dist/TableGroupRowTemplate.js.map +1 -1
- package/dist/TableTemplate.js +1 -1
- package/dist/TableTemplate.js.map +1 -1
- package/dist/TagTemplate.js +2 -4
- package/dist/TagTemplate.js.map +1 -1
- package/dist/assets/{InputSuggestions-BIR_sdOv.js → InputSuggestions-CAJNg_KD.js} +1 -1
- package/dist/assets/{ListItemStandardExpandableTextTemplate-5xOuY0en.js → ListItemStandardExpandableTextTemplate-CTxLxjip.js} +1 -1
- package/dist/assets/{bundle.esm-C8GwJvJr.js → bundle.esm-AREsL-HM.js} +240 -240
- package/dist/css/themes/MastheadMenu.css +1 -1
- package/dist/css/themes/MastheadMobileMenu.css +1 -1
- package/dist/css/themes/MediaPlayer.css +1 -1
- package/dist/css/themes/RatingBar.css +1 -1
- package/dist/css/themes/RatingIndicator.css +1 -1
- package/dist/css/themes/Slider.css +1 -1
- package/dist/css/themes/TabNavigation.css +1 -1
- package/dist/css/themes/TableGroupRow.css +1 -1
- package/dist/custom-elements-internal.json +19 -0
- package/dist/custom-elements.json +19 -0
- package/dist/generated/templates/TabHeaderTemplate.lit.js +4 -4
- package/dist/generated/templates/TabHeaderTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TabInOverflowTemplate.lit.js +2 -2
- package/dist/generated/templates/TabInOverflowTemplate.lit.js.map +1 -1
- package/dist/generated/themes/MastheadMenu.css.d.ts +1 -1
- package/dist/generated/themes/MastheadMenu.css.js +1 -1
- package/dist/generated/themes/MastheadMenu.css.js.map +1 -1
- package/dist/generated/themes/MastheadMobileMenu.css.d.ts +1 -1
- package/dist/generated/themes/MastheadMobileMenu.css.js +1 -1
- package/dist/generated/themes/MastheadMobileMenu.css.js.map +1 -1
- package/dist/generated/themes/MediaPlayer.css.d.ts +1 -1
- package/dist/generated/themes/MediaPlayer.css.js +1 -1
- package/dist/generated/themes/MediaPlayer.css.js.map +1 -1
- package/dist/generated/themes/RatingBar.css.d.ts +1 -1
- package/dist/generated/themes/RatingBar.css.js +1 -1
- package/dist/generated/themes/RatingBar.css.js.map +1 -1
- package/dist/generated/themes/RatingIndicator.css.d.ts +1 -1
- package/dist/generated/themes/RatingIndicator.css.js +1 -1
- package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
- package/dist/generated/themes/Slider.css.d.ts +1 -1
- package/dist/generated/themes/Slider.css.js +1 -1
- package/dist/generated/themes/Slider.css.js.map +1 -1
- package/dist/generated/themes/TabNavigation.css.d.ts +1 -1
- package/dist/generated/themes/TabNavigation.css.js +1 -1
- package/dist/generated/themes/TabNavigation.css.js.map +1 -1
- package/dist/generated/themes/TableGroupRow.css.d.ts +1 -1
- package/dist/generated/themes/TableGroupRow.css.js +1 -1
- package/dist/generated/themes/TableGroupRow.css.js.map +1 -1
- package/dist/vscode.html-custom-data.json +5 -0
- package/dist/web-types.json +11 -1
- package/package.json +1 -1
- package/src/CountrySelector.ts +14 -3
- package/src/CountrySelectorTemplate.tsx +12 -0
- package/src/FilterMenu.ts +9 -10
- package/src/FilterMenuTemplate.tsx +104 -0
- package/src/Pagination.ts +1 -0
- package/src/SearchableListBaseTemplate.tsx +157 -0
- package/src/SecondaryNavigation.ts +20 -0
- package/src/SelectBase.ts +7 -6
- package/src/SelectBox.ts +13 -3
- package/src/SelectBoxTemplate.tsx +165 -0
- package/src/Tab.ts +14 -0
- package/src/TabHeader.hbs +6 -2
- package/src/TabInOverflow.hbs +2 -0
- package/src/TabNavigation.ts +34 -12
- package/src/TableGroupRowTemplate.tsx +26 -17
- package/src/TableTemplate.tsx +1 -1
- package/src/TagTemplate.tsx +2 -4
- package/src/generated/templates/TabHeaderTemplate.lit.ts +4 -4
- package/src/generated/templates/TabInOverflowTemplate.lit.ts +2 -2
- package/src/generated/themes/MastheadMenu.css.ts +1 -1
- package/src/generated/themes/MastheadMobileMenu.css.ts +1 -1
- package/src/generated/themes/MediaPlayer.css.ts +1 -1
- package/src/generated/themes/RatingBar.css.ts +1 -1
- package/src/generated/themes/RatingIndicator.css.ts +1 -1
- package/src/generated/themes/Slider.css.ts +1 -1
- package/src/generated/themes/TabNavigation.css.ts +1 -1
- package/src/generated/themes/TableGroupRow.css.ts +1 -1
- package/src/themes/MastheadMenu.css +4 -2
- package/src/themes/MastheadMobileMenu.css +4 -2
- package/src/themes/MediaPlayer.css +12 -0
- package/src/themes/RatingBar.css +14 -5
- package/src/themes/TabNavigation.css +6 -0
- package/src/themes/TableGroupRow.css +5 -0
- package/dist/generated/templates/CountrySelectorTemplate.lit.d.ts +0 -3
- package/dist/generated/templates/CountrySelectorTemplate.lit.js +0 -8
- package/dist/generated/templates/CountrySelectorTemplate.lit.js.map +0 -1
- package/dist/generated/templates/FilterMenuTemplate.lit.d.ts +0 -3
- package/dist/generated/templates/FilterMenuTemplate.lit.js +0 -13
- package/dist/generated/templates/FilterMenuTemplate.lit.js.map +0 -1
- package/dist/generated/templates/SearchableListBaseTemplate.lit.d.ts +0 -3
- package/dist/generated/templates/SearchableListBaseTemplate.lit.js +0 -19
- package/dist/generated/templates/SearchableListBaseTemplate.lit.js.map +0 -1
- package/dist/generated/templates/SelectBoxTemplate.lit.d.ts +0 -3
- package/dist/generated/templates/SelectBoxTemplate.lit.js +0 -20
- package/dist/generated/templates/SelectBoxTemplate.lit.js.map +0 -1
- package/src/CountrySelector.hbs +0 -6
- package/src/FilterMenu.hbs +0 -88
- package/src/SearchableListBase.hbs +0 -148
- package/src/SelectBox.hbs +0 -138
- package/src/generated/templates/CountrySelectorTemplate.lit.ts +0 -12
- package/src/generated/templates/FilterMenuTemplate.lit.ts +0 -17
- package/src/generated/templates/SearchableListBaseTemplate.lit.ts +0 -23
- package/src/generated/templates/SelectBoxTemplate.lit.ts +0 -24
package/src/FilterMenu.hbs
DELETED
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
<div>
|
|
2
|
-
<button
|
|
3
|
-
id="filterMenuTrigger"
|
|
4
|
-
@click="{{handleTriggerClick}}"
|
|
5
|
-
@keydown="{{handleTriggerKeydown}}"
|
|
6
|
-
aria-label="{{triggerButtonAccessibleName}}"
|
|
7
|
-
aria-labelledby="{{accessibleNameRef}}"
|
|
8
|
-
aria-expanded="{{_open}}"
|
|
9
|
-
aria-haspopup="true"
|
|
10
|
-
role="{{triggerAccessibleRole}}"
|
|
11
|
-
aria-controls="{{this._id}}_udex-filter-menu-dropdown"
|
|
12
|
-
?disabled="{{disabled}}"
|
|
13
|
-
class="udex-filter-menu__trigger"
|
|
14
|
-
tabindex="0">
|
|
15
|
-
{{#if hasFilterNamePrefix}}
|
|
16
|
-
<span class="udex-filter-menu__trigger-prefix">{{filterNamePrefix}}</span>
|
|
17
|
-
{{/if}}
|
|
18
|
-
<span class="udex-filter-menu__trigger-wrap" ?disabled="{{disabled}}">
|
|
19
|
-
<span class="udex-filter-menu__trigger-name">{{filterName}}</span>
|
|
20
|
-
{{#if badgeValue}}
|
|
21
|
-
<udex-badge
|
|
22
|
-
class="udex-filter-menu__badge"
|
|
23
|
-
type="Number"
|
|
24
|
-
design="Info"
|
|
25
|
-
size="Small">
|
|
26
|
-
{{badgeValue}}
|
|
27
|
-
</udex-badge>
|
|
28
|
-
{{/if}}
|
|
29
|
-
<ui5-icon
|
|
30
|
-
class="udex-filter-menu__trigger-icon"
|
|
31
|
-
name="navigation-down-arrow"
|
|
32
|
-
mode="Decorative"
|
|
33
|
-
accessible-name="{{_iconAccessibleNameText}}">
|
|
34
|
-
</ui5-icon>
|
|
35
|
-
</span>
|
|
36
|
-
</button>
|
|
37
|
-
<ui5-popover
|
|
38
|
-
id="{{this._id}}_udex-filter-menu-dropdown"
|
|
39
|
-
hide-arrow
|
|
40
|
-
?allow-target-overlap="{{disableAllowTargetOverlap}}"
|
|
41
|
-
accessible-role="{{accessibleRole}}"
|
|
42
|
-
placement="{{placement}}"
|
|
43
|
-
horizontal-align="{{horizontalAlign}}"
|
|
44
|
-
@ui5-item-press="{{handleItemPress}}"
|
|
45
|
-
@ui5-header-press="{{handleHeaderPress}}"
|
|
46
|
-
@keydown="{{handleKeyDownList}}"
|
|
47
|
-
@search-keydown="{{handleKeyDownSearch}}"
|
|
48
|
-
@ui5-before-open="{{_dropdownBeforeOpen}}"
|
|
49
|
-
@ui5-open="{{_dropdownAfterOpen}}"
|
|
50
|
-
@ui5-before-close="{{_dropdownBeforeClose}}"
|
|
51
|
-
@ui5-close="{{_dropdownAfterClose}}"
|
|
52
|
-
@ui5-select-all="{{handleSelectAll}}"
|
|
53
|
-
@ui5-submit-search-value="{{handleSubmitSearch}}"
|
|
54
|
-
@ui5-handle-value-search="{{handleValueSearch}}"
|
|
55
|
-
@ui5-handle-value-reset="{{handleResetSearch}}">
|
|
56
|
-
{{searchableList}}
|
|
57
|
-
{{#if modeMultiSelect}}
|
|
58
|
-
{{> buttons}}
|
|
59
|
-
{{/if}}
|
|
60
|
-
</ui5-popover>
|
|
61
|
-
</div>
|
|
62
|
-
|
|
63
|
-
{{#*inline "buttons"}}
|
|
64
|
-
{{#unless hideActionBar}}
|
|
65
|
-
<div class="udex-filter-menu__footer" slot="footer" name="footer">
|
|
66
|
-
{{#unless hideResultBtn}}
|
|
67
|
-
<udex-button
|
|
68
|
-
class="udex-filter-menu__result-btn"
|
|
69
|
-
size="Medium"
|
|
70
|
-
design="Primary"
|
|
71
|
-
@keydown="{{handleKeyDownResultBtn}}"
|
|
72
|
-
@click="{{handleResult}}">
|
|
73
|
-
{{getResultLabelText}}
|
|
74
|
-
</udex-button>
|
|
75
|
-
{{/unless}}
|
|
76
|
-
{{#unless hideResetBtn}}
|
|
77
|
-
<udex-button
|
|
78
|
-
class="udex-filter-menu__reset-btn"
|
|
79
|
-
size="Medium"
|
|
80
|
-
design="Tertiary"
|
|
81
|
-
@keydown="{{handleKeyDownResetBtn}}"
|
|
82
|
-
@click="{{handleReset}}">
|
|
83
|
-
{{getResetLabelText}}
|
|
84
|
-
</udex-button>
|
|
85
|
-
{{/unless}}
|
|
86
|
-
</div>
|
|
87
|
-
{{/unless}}
|
|
88
|
-
{{/inline}}
|
|
@@ -1,148 +0,0 @@
|
|
|
1
|
-
{{#if showSearch}}
|
|
2
|
-
<udex-search
|
|
3
|
-
slot="header"
|
|
4
|
-
mode="Standard"
|
|
5
|
-
class="udex-filter-menu__search"
|
|
6
|
-
label="{{searchPlaceholder}}"
|
|
7
|
-
label-animation-disabled
|
|
8
|
-
non-interactive-submit-button
|
|
9
|
-
show-submit-button>
|
|
10
|
-
</udex-search>
|
|
11
|
-
<span
|
|
12
|
-
aria-live="polite"
|
|
13
|
-
aria-atomic="true"
|
|
14
|
-
class="hidden">
|
|
15
|
-
{{_accSearchResultInfo}}
|
|
16
|
-
</span>
|
|
17
|
-
{{/if}}
|
|
18
|
-
{{#if isListEmpty}}
|
|
19
|
-
<div class="udex-no-result">
|
|
20
|
-
<ui5-illustrated-message
|
|
21
|
-
name="NoSearchResults"
|
|
22
|
-
design="Dot"
|
|
23
|
-
title-text=" "
|
|
24
|
-
subtitle-text=" ">
|
|
25
|
-
</ui5-illustrated-message>
|
|
26
|
-
<span>{{getNoResultText}}</span>
|
|
27
|
-
</div>
|
|
28
|
-
{{else if busy}}
|
|
29
|
-
<udex-busy-indicator
|
|
30
|
-
class="udex-busy-indicator"
|
|
31
|
-
size="M"
|
|
32
|
-
delay="{{busyDelay}}"
|
|
33
|
-
active>
|
|
34
|
-
</udex-busy-indicator>
|
|
35
|
-
{{else}}
|
|
36
|
-
<udex-list
|
|
37
|
-
id="udex-list"
|
|
38
|
-
role="{{roleForGroupList}}"
|
|
39
|
-
accessible-role="{{accessibleRoleForList}}"
|
|
40
|
-
class="udex-filter-menu__list"
|
|
41
|
-
?tab-navigation-enabled="{{tabNavigationEnabled}}"
|
|
42
|
-
?controlled="{{isControlled}}"
|
|
43
|
-
mode="{{mode}}">
|
|
44
|
-
{{#each _filteredItems}}
|
|
45
|
-
{{#if this.isGroup}}
|
|
46
|
-
{{#if this.item.isSelectAllHeader}}
|
|
47
|
-
<udex-list-select-all
|
|
48
|
-
_additional-class-name="{{../additionalClassName}}"
|
|
49
|
-
data-token-id="{{this.item._id}}"
|
|
50
|
-
label="{{this.item.label}}"
|
|
51
|
-
?controlled="{{this.item.controlled}}"
|
|
52
|
-
supporting-text="{{this.item.supportingText}}"
|
|
53
|
-
?disabled="{{this.item.disabled}}"
|
|
54
|
-
?selected="{{this.item.selected}}"
|
|
55
|
-
?indeterminate="{{this.item.indeterminate}}"
|
|
56
|
-
@ui5-first-icon-click="{{../fireFirstIconClickEvent}}"
|
|
57
|
-
@ui5-second-icon-click="{{../fireSecondIconClickEvent}}">
|
|
58
|
-
{{#each this.groupItems}}
|
|
59
|
-
<udex-list-item
|
|
60
|
-
role="{{../listItemRole}}"
|
|
61
|
-
data-role="{{../listItemRole}}"
|
|
62
|
-
data-token-id="{{this._id}}"
|
|
63
|
-
?controlled="{{this.controlled}}"
|
|
64
|
-
mode="{{this.mode}}"
|
|
65
|
-
@ui5-first-icon-click="{{../fireFirstIconClickEvent}}"
|
|
66
|
-
@ui5-second-icon-click="{{../fireSecondIconClickEvent}}"
|
|
67
|
-
supporting-text="{{this.supportingText}}"
|
|
68
|
-
additional-text="{{this.additionalText}}"
|
|
69
|
-
additional-text-state="{{this.additionalTextState}}"
|
|
70
|
-
?divider="{{this.divider}}"
|
|
71
|
-
?disabled="{{this.disabled}}"
|
|
72
|
-
?selected="{{this.selected}}"
|
|
73
|
-
rating="{{this.rating}}"
|
|
74
|
-
total-count="{{this.totalCount}}"
|
|
75
|
-
rating-count="{{this.ratingCount}}"
|
|
76
|
-
rating-max="{{this.ratingMax}}"
|
|
77
|
-
label="{{this.label}}">
|
|
78
|
-
{{{this.innerHTML}}}
|
|
79
|
-
</udex-list-item>
|
|
80
|
-
{{/each}}
|
|
81
|
-
</udex-list-select-all>
|
|
82
|
-
{{else}}
|
|
83
|
-
<udex-list-group-header
|
|
84
|
-
role="group"
|
|
85
|
-
_additional-class-name="udex-searchable-list__header"
|
|
86
|
-
class="{{../groupClassName}}"
|
|
87
|
-
?non-interactive="{{this.item.nonInteractive}}"
|
|
88
|
-
data-token-id="{{this.item._id}}"
|
|
89
|
-
label="{{this.item.label}}"
|
|
90
|
-
supporting-text="{{this.item.supportingText}}"
|
|
91
|
-
?controlled="{{this.item.controlled}}"
|
|
92
|
-
?collapsible="{{this.item.collapsible}}"
|
|
93
|
-
?collapsed="{{this.item.collapsed}}"
|
|
94
|
-
?_filtered="{{../_shouldFilterItems}}"
|
|
95
|
-
?disabled="{{this.item.disabled}}"
|
|
96
|
-
?selected="{{this.item.selected}}"
|
|
97
|
-
@ui5-first-icon-click="{{../fireFirstIconClickEvent}}"
|
|
98
|
-
@ui5-second-icon-click="{{../fireSecondIconClickEvent}}"
|
|
99
|
-
?indeterminate="{{this.item.indeterminate}}">
|
|
100
|
-
{{#each this.groupItems}}
|
|
101
|
-
<udex-list-item
|
|
102
|
-
role="none"
|
|
103
|
-
data-token-id="{{this._id}}"
|
|
104
|
-
?controlled="{{this.controlled}}"
|
|
105
|
-
mode="{{this.mode}}"
|
|
106
|
-
supporting-text="{{this.supportingText}}"
|
|
107
|
-
additional-text="{{this.additionalText}}"
|
|
108
|
-
additional-text-state="{{this.additionalTextState}}"
|
|
109
|
-
@ui5-first-icon-click="{{../fireFirstIconClickEvent}}"
|
|
110
|
-
@ui5-second-icon-click="{{../fireSecondIconClickEvent}}"
|
|
111
|
-
?divider="{{this.divider}}"
|
|
112
|
-
?disabled="{{this.disabled}}"
|
|
113
|
-
?selected="{{this.selected}}"
|
|
114
|
-
rating="{{this.rating}}"
|
|
115
|
-
total-count="{{this.totalCount}}"
|
|
116
|
-
rating-count="{{this.ratingCount}}"
|
|
117
|
-
rating-max="{{this.ratingMax}}"
|
|
118
|
-
label="{{this.label}}">
|
|
119
|
-
{{{this.innerHTML}}}
|
|
120
|
-
</udex-list-item>
|
|
121
|
-
{{/each}}
|
|
122
|
-
</udex-list-group-header>
|
|
123
|
-
{{/if}}
|
|
124
|
-
{{else}}
|
|
125
|
-
<udex-list-item
|
|
126
|
-
role="none"
|
|
127
|
-
@ui5-first-icon-click="{{../fireFirstIconClickEvent}}"
|
|
128
|
-
@ui5-second-icon-click="{{../fireSecondIconClickEvent}}"
|
|
129
|
-
data-token-id="{{this.item._id}}"
|
|
130
|
-
supporting-text="{{this.item.supportingText}}"
|
|
131
|
-
additional-text="{{this.item.additionalText}}"
|
|
132
|
-
additional-text-state="{{this.item.additionalTextState}}"
|
|
133
|
-
?disabled="{{this.item.disabled}}"
|
|
134
|
-
?controlled="{{this.controlled}}"
|
|
135
|
-
?divider="{{this.divider}}"
|
|
136
|
-
?selected="{{this.item.selected}}"
|
|
137
|
-
rating="{{this.item.rating}}"
|
|
138
|
-
total-count="{{this.item.totalCount}}"
|
|
139
|
-
rating-count="{{this.item.ratingCount}}"
|
|
140
|
-
rating-max="{{this.item.ratingMax}}"
|
|
141
|
-
label="{{this.item.label}}"
|
|
142
|
-
accessible-role="{{../listItemRole}}">
|
|
143
|
-
{{{this.item.innerHTML}}}
|
|
144
|
-
</udex-list-item>
|
|
145
|
-
{{/if}}
|
|
146
|
-
{{/each}}
|
|
147
|
-
</udex-list>
|
|
148
|
-
{{/if}}
|
package/src/SelectBox.hbs
DELETED
|
@@ -1,138 +0,0 @@
|
|
|
1
|
-
<div
|
|
2
|
-
class="{{_rootClass}}">
|
|
3
|
-
<div class="udex-text-field__container">
|
|
4
|
-
<div class="udex-text-field__wrap" ?displayonly="{{displayonly}}">
|
|
5
|
-
{{#if showMultiSelectedOptions}}
|
|
6
|
-
<udex-tag-group
|
|
7
|
-
class="udex-tag-group"
|
|
8
|
-
?displayonly="{{displayonly}}"
|
|
9
|
-
?readonly="{{readonly}}"
|
|
10
|
-
?disabled="{{disabled}}"
|
|
11
|
-
@focusout="{{resetTagsTabIndexes}}"
|
|
12
|
-
tooltip-placement="{{tooltipPlacement}}"
|
|
13
|
-
@ui5-tag-icon-click="{{handleRemoveTag}}"
|
|
14
|
-
@ui5-tag-click="{{handleTagClick}}"
|
|
15
|
-
@ui5-show-more-tags="{{handlerShowMoreItems}}"
|
|
16
|
-
@ui5-tag-keydown="{{handleKeyDownTag}}"
|
|
17
|
-
?tokenizer-expanded="{{tokenizerExpanded}}"
|
|
18
|
-
_skip-more-button-focus>
|
|
19
|
-
{{#each selectedItems}}
|
|
20
|
-
{{#unless this.isGroup}}
|
|
21
|
-
{{#if label}}
|
|
22
|
-
<udex-tag
|
|
23
|
-
text="{{this.label}}"
|
|
24
|
-
id="{{this._id}}"
|
|
25
|
-
icon="decline">
|
|
26
|
-
</udex-tag>
|
|
27
|
-
{{else}}
|
|
28
|
-
<udex-tag
|
|
29
|
-
text="{{this.rating}} {{../this.startsText}}"
|
|
30
|
-
id="{{this._id}}"
|
|
31
|
-
icon="decline">
|
|
32
|
-
</udex-tag>
|
|
33
|
-
{{/if}}
|
|
34
|
-
{{/unless}}
|
|
35
|
-
{{/each}}
|
|
36
|
-
</udex-tag-group>
|
|
37
|
-
{{/if}}
|
|
38
|
-
<div
|
|
39
|
-
class="udex-text-field__input"
|
|
40
|
-
@focusin="{{handleInputFocusIn}}"
|
|
41
|
-
@focusout="{{handleInputFocusOut}}"
|
|
42
|
-
?readonly="{{readonly}}"
|
|
43
|
-
?disabled="{{isDisabled}}"
|
|
44
|
-
?open="{{_open}}">
|
|
45
|
-
{{#if label}}
|
|
46
|
-
<label for="search-input" class="{{labelClass}}">
|
|
47
|
-
{{label}}
|
|
48
|
-
{{#if required}}*{{/if}}
|
|
49
|
-
</label>
|
|
50
|
-
<span class="hidden" id="{{this._id}}-aria-describedby">{{ariaDescribedbyText}}</span>
|
|
51
|
-
{{/if}}
|
|
52
|
-
{{#if showImageFlags}}
|
|
53
|
-
{{countryFlag}}
|
|
54
|
-
{{/if}}
|
|
55
|
-
<div class="udex-text-field__holder">
|
|
56
|
-
<input
|
|
57
|
-
role="combobox"
|
|
58
|
-
type="text"
|
|
59
|
-
id="search-input"
|
|
60
|
-
name="search"
|
|
61
|
-
class="udex-text-field__search"
|
|
62
|
-
.value="{{_inputValue}}"
|
|
63
|
-
@input="{{handleSearchChange}}"
|
|
64
|
-
@click="{{handleInputClick}}"
|
|
65
|
-
@keydown="{{handleKeyDownSearch}}"
|
|
66
|
-
?disabled="{{isDisabled}}"
|
|
67
|
-
?readonly="{{isReadOrDisplayOnly}}"
|
|
68
|
-
aria-label="{{accInfo.ariaLabel}}"
|
|
69
|
-
aria-readonly="{{isReadOrDisplayOnly}}"
|
|
70
|
-
aria-disabled="{{disabled}}"
|
|
71
|
-
aria-haspopup="{{listboxRole}}"
|
|
72
|
-
aria-controls="{{popoverId}}"
|
|
73
|
-
aria-expanded="{{this._open}}"
|
|
74
|
-
aria-autocomplete="{{_ariaAutoComplete}}"
|
|
75
|
-
aria-describedby="{{this._id}}-aria-describedby"
|
|
76
|
-
autocomplete="off"
|
|
77
|
-
/>
|
|
78
|
-
{{#if _selectedOption}}
|
|
79
|
-
<div class="udex-text-field__text-holder">
|
|
80
|
-
<span class="udex-text-field__single-label" aria-hidden="true">
|
|
81
|
-
{{{_selectedOption}}}
|
|
82
|
-
</span>
|
|
83
|
-
</div>
|
|
84
|
-
{{/if}}
|
|
85
|
-
</div>
|
|
86
|
-
{{#unless displayonly}}
|
|
87
|
-
<button
|
|
88
|
-
@click="{{handleButtonClick}}"
|
|
89
|
-
?disabled="{{isDisabled}}"
|
|
90
|
-
aria-label="{{accInfo.ariaLabel}}"
|
|
91
|
-
class="udex-text-field__trigger"
|
|
92
|
-
tabindex="-1">
|
|
93
|
-
<ui5-icon mode="Decorative" name="navigation-down-arrow"></ui5-icon>
|
|
94
|
-
</button>
|
|
95
|
-
{{/unless}}
|
|
96
|
-
<ui5-popover
|
|
97
|
-
id="{{popoverId}}"
|
|
98
|
-
?allow-target-overlap="{{allowTargetOverlap}}"
|
|
99
|
-
@keydown="{{handleKeyDownDropdown}}"
|
|
100
|
-
@ui5-select-all="{{handleSelectAll}}"
|
|
101
|
-
@ui5-item-press="{{handleItemPress}}"
|
|
102
|
-
@ui5-header-press="{{handleHeaderPress}}"
|
|
103
|
-
@ui5-before-open="{{handleDropdownBeforeOpen}}"
|
|
104
|
-
@ui5-open="{{fireEventDropdownOpen}}"
|
|
105
|
-
@ui5-before-close="{{handleDropdownBeforeClose}}"
|
|
106
|
-
@ui5-close="{{handleDropdownClose}}"
|
|
107
|
-
class="udex-select-box__dropdown"
|
|
108
|
-
horizontal-align="Start"
|
|
109
|
-
placement="Bottom"
|
|
110
|
-
prevent-focus-restore
|
|
111
|
-
prevent-initial-focus
|
|
112
|
-
hide-arrow>
|
|
113
|
-
{{#if _showTagsDropdownContent}}
|
|
114
|
-
<div class="udex-truncatable-tag-content">
|
|
115
|
-
<span class="udex-truncatable-tag-content__label">{{truncatableTagLabel}}</span>
|
|
116
|
-
<ui5-icon
|
|
117
|
-
@click="{{handleRemoveTruncatableTag}}"
|
|
118
|
-
class="udex-truncatable-tag-content__icon"
|
|
119
|
-
mode="Decorative"
|
|
120
|
-
name="decline">
|
|
121
|
-
</ui5-icon>
|
|
122
|
-
</div>
|
|
123
|
-
{{else}}
|
|
124
|
-
{{searchableList}}
|
|
125
|
-
{{/if}}
|
|
126
|
-
</ui5-popover>
|
|
127
|
-
<span aria-live="polite" aria-atomic="true" class="hidden">{{_accSearchResultInfo}}</span>
|
|
128
|
-
</div>
|
|
129
|
-
</div>
|
|
130
|
-
{{#if supportingText}}
|
|
131
|
-
<udex-status-message
|
|
132
|
-
?disabled="{{disabled}}"
|
|
133
|
-
supporting-text="{{supportingText}}"
|
|
134
|
-
value-state="{{valueState}}">
|
|
135
|
-
</udex-status-message>
|
|
136
|
-
{{/if}}
|
|
137
|
-
</div>
|
|
138
|
-
</div>
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
/* eslint no-unused-vars: 0 */
|
|
2
|
-
import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
|
|
3
|
-
import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
|
|
4
|
-
import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
|
|
5
|
-
import type CountrySelector from "../../CountrySelector.js";
|
|
6
|
-
import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
|
|
7
|
-
|
|
8
|
-
function block0 (this: CountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ !this.hideFlagImages ? block1.call(this, context, tags, suffix) : undefined } `;}
|
|
9
|
-
function block1 (this: CountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img class="udex-text-field__image" aria-label="${ifDefined(this.flagAriaLabel)}" style="background-position-x: ${ifDefined(this.selectedCountryFlagX)}; background-position-y: ${ifDefined(this.selectedCountryFlagY)}">`;}
|
|
10
|
-
|
|
11
|
-
function template(this: CountrySelector) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
|
|
12
|
-
export default template;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/* eslint no-unused-vars: 0 */
|
|
2
|
-
import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
|
|
3
|
-
import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
|
|
4
|
-
import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
|
|
5
|
-
import type FilterMenu from "../../FilterMenu.js";
|
|
6
|
-
import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
|
|
7
|
-
|
|
8
|
-
function block0 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div><button id="filterMenuTrigger" @click="${this.handleTriggerClick}" @keydown="${this.handleTriggerKeydown}" aria-label="${ifDefined(this.triggerButtonAccessibleName)}" aria-labelledby="${ifDefined(this.accessibleNameRef)}" aria-expanded="${ifDefined(this._open)}" aria-haspopup="true" role="${ifDefined(this.triggerAccessibleRole)}" aria-controls="${ifDefined(this._id)}_udex-filter-menu-dropdown" ?disabled="${this.disabled}" class="udex-filter-menu__trigger" tabindex="0">${ this.hasFilterNamePrefix ? block1.call(this, context, tags, suffix) : undefined }<span class="udex-filter-menu__trigger-wrap" ?disabled="${this.disabled}"><span class="udex-filter-menu__trigger-name">${ifDefined(this.filterName)}</span>${ this.badgeValue ? block2.call(this, context, tags, suffix) : undefined }<${scopeTag("ui5-icon", tags, suffix)} class="udex-filter-menu__trigger-icon" name="navigation-down-arrow" mode="Decorative" accessible-name="${ifDefined(this._iconAccessibleNameText)}"></${scopeTag("ui5-icon", tags, suffix)}></span></button><${scopeTag("ui5-popover", tags, suffix)} id="${ifDefined(this._id)}_udex-filter-menu-dropdown" hide-arrow ?allow-target-overlap="${this.disableAllowTargetOverlap}" accessible-role="${ifDefined(this.accessibleRole)}" placement="${ifDefined(this.placement)}" horizontal-align="${ifDefined(this.horizontalAlign)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @keydown="${this.handleKeyDownList}" @search-keydown="${this.handleKeyDownSearch}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-close="${ifDefined(this._dropdownAfterClose)}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}">${ifDefined(this.searchableList)}${ this.modeMultiSelect ? block3.call(this, context, tags, suffix) : undefined }</${scopeTag("ui5-popover", tags, suffix)}></div> ` : html`<div><button id="filterMenuTrigger" @click="${this.handleTriggerClick}" @keydown="${this.handleTriggerKeydown}" aria-label="${ifDefined(this.triggerButtonAccessibleName)}" aria-labelledby="${ifDefined(this.accessibleNameRef)}" aria-expanded="${ifDefined(this._open)}" aria-haspopup="true" role="${ifDefined(this.triggerAccessibleRole)}" aria-controls="${ifDefined(this._id)}_udex-filter-menu-dropdown" ?disabled="${this.disabled}" class="udex-filter-menu__trigger" tabindex="0">${ this.hasFilterNamePrefix ? block1.call(this, context, tags, suffix) : undefined }<span class="udex-filter-menu__trigger-wrap" ?disabled="${this.disabled}"><span class="udex-filter-menu__trigger-name">${ifDefined(this.filterName)}</span>${ this.badgeValue ? block2.call(this, context, tags, suffix) : undefined }<ui5-icon class="udex-filter-menu__trigger-icon" name="navigation-down-arrow" mode="Decorative" accessible-name="${ifDefined(this._iconAccessibleNameText)}"></ui5-icon></span></button><ui5-popover id="${ifDefined(this._id)}_udex-filter-menu-dropdown" hide-arrow ?allow-target-overlap="${this.disableAllowTargetOverlap}" accessible-role="${ifDefined(this.accessibleRole)}" placement="${ifDefined(this.placement)}" horizontal-align="${ifDefined(this.horizontalAlign)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @keydown="${this.handleKeyDownList}" @search-keydown="${this.handleKeyDownSearch}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-close="${ifDefined(this._dropdownAfterClose)}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}">${ifDefined(this.searchableList)}${ this.modeMultiSelect ? block3.call(this, context, tags, suffix) : undefined }</ui5-popover></div> `;}
|
|
9
|
-
function block1 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-filter-menu__trigger-prefix">${ifDefined(this.filterNamePrefix)}</span>`;}
|
|
10
|
-
function block2 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-badge", tags, suffix)} class="udex-filter-menu__badge" type="Number" design="Info" size="Small">${ifDefined(this.badgeValue)}</${scopeTag("udex-badge", tags, suffix)}>` : html`<udex-badge class="udex-filter-menu__badge" type="Number" design="Info" size="Small">${ifDefined(this.badgeValue)}</udex-badge>`;}
|
|
11
|
-
function block3 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ !this.hideActionBar ? block4.call(this, context, tags, suffix) : undefined }`;}
|
|
12
|
-
function block4 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-filter-menu__footer" slot="footer" name="footer">${ !this.hideResultBtn ? block5.call(this, context, tags, suffix) : undefined }${ !this.hideResetBtn ? block6.call(this, context, tags, suffix) : undefined }</div>`;}
|
|
13
|
-
function block5 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-filter-menu__result-btn" size="Medium" design="Primary" @keydown="${this.handleKeyDownResultBtn}" @click="${this.handleResult}">${ifDefined(this.getResultLabelText)}</${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-filter-menu__result-btn" size="Medium" design="Primary" @keydown="${this.handleKeyDownResultBtn}" @click="${this.handleResult}">${ifDefined(this.getResultLabelText)}</udex-button>`;}
|
|
14
|
-
function block6 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-filter-menu__reset-btn" size="Medium" design="Tertiary" @keydown="${this.handleKeyDownResetBtn}" @click="${this.handleReset}">${ifDefined(this.getResetLabelText)}</${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-filter-menu__reset-btn" size="Medium" design="Tertiary" @keydown="${this.handleKeyDownResetBtn}" @click="${this.handleReset}">${ifDefined(this.getResetLabelText)}</udex-button>`;}
|
|
15
|
-
|
|
16
|
-
function template(this: FilterMenu) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
|
|
17
|
-
export default template;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
/* eslint no-unused-vars: 0 */
|
|
2
|
-
import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
|
|
3
|
-
import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
|
|
4
|
-
import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
|
|
5
|
-
import type SearchableListBase from "../../SearchableListBase.js";
|
|
6
|
-
import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
|
|
7
|
-
|
|
8
|
-
function block0 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.showSearch ? block1.call(this, context, tags, suffix) : undefined }${ this.isListEmpty ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) } `;}
|
|
9
|
-
function block1 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-search", tags, suffix)} slot="header" mode="Standard" class="udex-filter-menu__search" label="${ifDefined(this.searchPlaceholder)}" label-animation-disabled non-interactive-submit-button show-submit-button></${scopeTag("udex-search", tags, suffix)}><span aria-live="polite" aria-atomic="true" class="hidden">${ifDefined(this._accSearchResultInfo)}</span>` : html`<udex-search slot="header" mode="Standard" class="udex-filter-menu__search" label="${ifDefined(this.searchPlaceholder)}" label-animation-disabled non-interactive-submit-button show-submit-button></udex-search><span aria-live="polite" aria-atomic="true" class="hidden">${ifDefined(this._accSearchResultInfo)}</span>`;}
|
|
10
|
-
function block2 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-no-result"><${scopeTag("ui5-illustrated-message", tags, suffix)} name="NoSearchResults" design="Dot" title-text=" " subtitle-text=" "></${scopeTag("ui5-illustrated-message", tags, suffix)}><span>${ifDefined(this.getNoResultText)}</span></div>` : html`<div class="udex-no-result"><ui5-illustrated-message name="NoSearchResults" design="Dot" title-text=" " subtitle-text=" "></ui5-illustrated-message><span>${ifDefined(this.getNoResultText)}</span></div>`;}
|
|
11
|
-
function block3 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.busy ? block4.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix) }`;}
|
|
12
|
-
function block4 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-busy-indicator", tags, suffix)} class="udex-busy-indicator" size="M" delay="${ifDefined(this.busyDelay)}" active></${scopeTag("udex-busy-indicator", tags, suffix)}>` : html`<udex-busy-indicator class="udex-busy-indicator" size="M" delay="${ifDefined(this.busyDelay)}" active></udex-busy-indicator>`;}
|
|
13
|
-
function block5 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-list", tags, suffix)} id="udex-list" role="${ifDefined(this.roleForGroupList)}" accessible-role="${ifDefined(this.accessibleRoleForList)}" class="udex-filter-menu__list" ?tab-navigation-enabled="${this.tabNavigationEnabled}" ?controlled="${this.isControlled}" mode="${ifDefined(this.mode)}">${ repeat(this._filteredItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block6.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list", tags, suffix)}>` : html`<udex-list id="udex-list" role="${ifDefined(this.roleForGroupList)}" accessible-role="${ifDefined(this.accessibleRoleForList)}" class="udex-filter-menu__list" ?tab-navigation-enabled="${this.tabNavigationEnabled}" ?controlled="${this.isControlled}" mode="${ifDefined(this.mode)}">${ repeat(this._filteredItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block6.call(this, context, tags, suffix, item, index)) }</udex-list>`;}
|
|
14
|
-
function block6 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.isGroup ? block7.call(this, context, tags, suffix, item, index) : block12.call(this, context, tags, suffix, item, index) }`;}
|
|
15
|
-
function block7 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.item.isSelectAllHeader ? block8.call(this, context, tags, suffix, item, index) : block10.call(this, context, tags, suffix, item, index) }`;}
|
|
16
|
-
function block8 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-select-all", tags, suffix)} _additional-class-name="${ifDefined(this.additionalClassName)}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" ?controlled="${item.item.controlled}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}" @ui5-first-icon-click="${ifDefined(this.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(this.fireSecondIconClickEvent)}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list-select-all", tags, suffix)}>` : html`<udex-list-select-all _additional-class-name="${ifDefined(this.additionalClassName)}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" ?controlled="${item.item.controlled}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}" @ui5-first-icon-click="${ifDefined(this.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(this.fireSecondIconClickEvent)}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</udex-list-select-all>`;}
|
|
17
|
-
function block9 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} role="${ifDefined(this.listItemRole)}" data-role="${ifDefined(this.listItemRole)}" data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" @ui5-first-icon-click="${ifDefined(this.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(this.fireSecondIconClickEvent)}" supporting-text="${ifDefined(item.supportingText)}" additional-text="${ifDefined(item.additionalText)}" additional-text-state="${ifDefined(item.additionalTextState)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" rating="${ifDefined(item.rating)}" total-count="${ifDefined(item.totalCount)}" rating-count="${ifDefined(item.ratingCount)}" rating-max="${ifDefined(item.ratingMax)}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item role="${ifDefined(this.listItemRole)}" data-role="${ifDefined(this.listItemRole)}" data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" @ui5-first-icon-click="${ifDefined(this.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(this.fireSecondIconClickEvent)}" supporting-text="${ifDefined(item.supportingText)}" additional-text="${ifDefined(item.additionalText)}" additional-text-state="${ifDefined(item.additionalTextState)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" rating="${ifDefined(item.rating)}" total-count="${ifDefined(item.totalCount)}" rating-count="${ifDefined(item.ratingCount)}" rating-max="${ifDefined(item.ratingMax)}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</udex-list-item>`;}
|
|
18
|
-
function block10 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-group-header", tags, suffix)} role="group" _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?collapsible="${item.item.collapsible}" ?collapsed="${item.item.collapsed}" ?_filtered="${ifDefined(this._shouldFilterItems)}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" @ui5-first-icon-click="${ifDefined(this.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(this.fireSecondIconClickEvent)}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block11.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list-group-header", tags, suffix)}>` : html`<udex-list-group-header role="group" _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?collapsible="${item.item.collapsible}" ?collapsed="${item.item.collapsed}" ?_filtered="${ifDefined(this._shouldFilterItems)}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" @ui5-first-icon-click="${ifDefined(this.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(this.fireSecondIconClickEvent)}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block11.call(this, context, tags, suffix, item, index)) }</udex-list-group-header>`;}
|
|
19
|
-
function block11 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} role="none" data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" additional-text="${ifDefined(item.additionalText)}" additional-text-state="${ifDefined(item.additionalTextState)}" @ui5-first-icon-click="${ifDefined(item.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(item.fireSecondIconClickEvent)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" rating="${ifDefined(item.rating)}" total-count="${ifDefined(item.totalCount)}" rating-count="${ifDefined(item.ratingCount)}" rating-max="${ifDefined(item.ratingMax)}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item role="none" data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" additional-text="${ifDefined(item.additionalText)}" additional-text-state="${ifDefined(item.additionalTextState)}" @ui5-first-icon-click="${ifDefined(item.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(item.fireSecondIconClickEvent)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" rating="${ifDefined(item.rating)}" total-count="${ifDefined(item.totalCount)}" rating-count="${ifDefined(item.ratingCount)}" rating-max="${ifDefined(item.ratingMax)}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</udex-list-item>`;}
|
|
20
|
-
function block12 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} role="none" @ui5-first-icon-click="${ifDefined(this.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(this.fireSecondIconClickEvent)}" data-token-id="${ifDefined(item.item._id)}" supporting-text="${ifDefined(item.item.supportingText)}" additional-text="${ifDefined(item.item.additionalText)}" additional-text-state="${ifDefined(item.item.additionalTextState)}" ?disabled="${item.item.disabled}" ?controlled="${item.controlled}" ?divider="${item.divider}" ?selected="${item.item.selected}" rating="${ifDefined(item.item.rating)}" total-count="${ifDefined(item.item.totalCount)}" rating-count="${ifDefined(item.item.ratingCount)}" rating-max="${ifDefined(item.item.ratingMax)}" label="${ifDefined(item.item.label)}" accessible-role="${ifDefined(this.listItemRole)}">${unsafeHTML(item.item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item role="none" @ui5-first-icon-click="${ifDefined(this.fireFirstIconClickEvent)}" @ui5-second-icon-click="${ifDefined(this.fireSecondIconClickEvent)}" data-token-id="${ifDefined(item.item._id)}" supporting-text="${ifDefined(item.item.supportingText)}" additional-text="${ifDefined(item.item.additionalText)}" additional-text-state="${ifDefined(item.item.additionalTextState)}" ?disabled="${item.item.disabled}" ?controlled="${item.controlled}" ?divider="${item.divider}" ?selected="${item.item.selected}" rating="${ifDefined(item.item.rating)}" total-count="${ifDefined(item.item.totalCount)}" rating-count="${ifDefined(item.item.ratingCount)}" rating-max="${ifDefined(item.item.ratingMax)}" label="${ifDefined(item.item.label)}" accessible-role="${ifDefined(this.listItemRole)}">${unsafeHTML(item.item.innerHTML)}</udex-list-item>`;}
|
|
21
|
-
|
|
22
|
-
function template(this: SearchableListBase) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
|
|
23
|
-
export default template;
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
/* eslint no-unused-vars: 0 */
|
|
2
|
-
import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
|
|
3
|
-
import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
|
|
4
|
-
import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
|
|
5
|
-
import type SelectBox from "../../SelectBox.js";
|
|
6
|
-
import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
|
|
7
|
-
|
|
8
|
-
function block0 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="${ifDefined(this._rootClass)}"><div class="udex-text-field__container"><div class="udex-text-field__wrap" ?displayonly="${this.displayonly}">${ this.showMultiSelectedOptions ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-text-field__input" @focusin="${this.handleInputFocusIn}" @focusout="${this.handleInputFocusOut}" ?readonly="${this.readonly}" ?disabled="${this.isDisabled}" ?open="${this._open}">${ this.label ? block6.call(this, context, tags, suffix) : undefined }${ this.showImageFlags ? block8.call(this, context, tags, suffix) : undefined }<div class="udex-text-field__holder"><input role="combobox" type="text" id="search-input" name="search" class="udex-text-field__search" .value="${ifDefined(this._inputValue)}" @input="${this.handleSearchChange}" @click="${this.handleInputClick}" @keydown="${this.handleKeyDownSearch}" ?disabled="${this.isDisabled}" ?readonly="${this.isReadOrDisplayOnly}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-readonly="${ifDefined(this.isReadOrDisplayOnly)}" aria-disabled="${ifDefined(this.disabled)}" aria-haspopup="${ifDefined(this.listboxRole)}" aria-controls="${ifDefined(this.popoverId)}" aria-expanded="${ifDefined(this._open)}" aria-autocomplete="${ifDefined(this._ariaAutoComplete)}" aria-describedby="${ifDefined(this._id)}-aria-describedby" autocomplete="off" />${ this._selectedOption ? block9.call(this, context, tags, suffix) : undefined }</div>${ !this.displayonly ? block10.call(this, context, tags, suffix) : undefined }<${scopeTag("ui5-popover", tags, suffix)} id="${ifDefined(this.popoverId)}" ?allow-target-overlap="${this.allowTargetOverlap}" @keydown="${this.handleKeyDownDropdown}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-before-open="${ifDefined(this.handleDropdownBeforeOpen)}" @ui5-open="${ifDefined(this.fireEventDropdownOpen)}" @ui5-before-close="${ifDefined(this.handleDropdownBeforeClose)}" @ui5-close="${ifDefined(this.handleDropdownClose)}" class="udex-select-box__dropdown" horizontal-align="Start" placement="Bottom" prevent-focus-restore prevent-initial-focus hide-arrow>${ this._showTagsDropdownContent ? block11.call(this, context, tags, suffix) : block12.call(this, context, tags, suffix) }</${scopeTag("ui5-popover", tags, suffix)}><span aria-live="polite" aria-atomic="true" class="hidden">${ifDefined(this._accSearchResultInfo)}</span></div></div>${ this.supportingText ? block13.call(this, context, tags, suffix) : undefined }</div></div>` : html`<div class="${ifDefined(this._rootClass)}"><div class="udex-text-field__container"><div class="udex-text-field__wrap" ?displayonly="${this.displayonly}">${ this.showMultiSelectedOptions ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-text-field__input" @focusin="${this.handleInputFocusIn}" @focusout="${this.handleInputFocusOut}" ?readonly="${this.readonly}" ?disabled="${this.isDisabled}" ?open="${this._open}">${ this.label ? block6.call(this, context, tags, suffix) : undefined }${ this.showImageFlags ? block8.call(this, context, tags, suffix) : undefined }<div class="udex-text-field__holder"><input role="combobox" type="text" id="search-input" name="search" class="udex-text-field__search" .value="${ifDefined(this._inputValue)}" @input="${this.handleSearchChange}" @click="${this.handleInputClick}" @keydown="${this.handleKeyDownSearch}" ?disabled="${this.isDisabled}" ?readonly="${this.isReadOrDisplayOnly}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-readonly="${ifDefined(this.isReadOrDisplayOnly)}" aria-disabled="${ifDefined(this.disabled)}" aria-haspopup="${ifDefined(this.listboxRole)}" aria-controls="${ifDefined(this.popoverId)}" aria-expanded="${ifDefined(this._open)}" aria-autocomplete="${ifDefined(this._ariaAutoComplete)}" aria-describedby="${ifDefined(this._id)}-aria-describedby" autocomplete="off" />${ this._selectedOption ? block9.call(this, context, tags, suffix) : undefined }</div>${ !this.displayonly ? block10.call(this, context, tags, suffix) : undefined }<ui5-popover id="${ifDefined(this.popoverId)}" ?allow-target-overlap="${this.allowTargetOverlap}" @keydown="${this.handleKeyDownDropdown}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-before-open="${ifDefined(this.handleDropdownBeforeOpen)}" @ui5-open="${ifDefined(this.fireEventDropdownOpen)}" @ui5-before-close="${ifDefined(this.handleDropdownBeforeClose)}" @ui5-close="${ifDefined(this.handleDropdownClose)}" class="udex-select-box__dropdown" horizontal-align="Start" placement="Bottom" prevent-focus-restore prevent-initial-focus hide-arrow>${ this._showTagsDropdownContent ? block11.call(this, context, tags, suffix) : block12.call(this, context, tags, suffix) }</ui5-popover><span aria-live="polite" aria-atomic="true" class="hidden">${ifDefined(this._accSearchResultInfo)}</span></div></div>${ this.supportingText ? block13.call(this, context, tags, suffix) : undefined }</div></div>`;}
|
|
9
|
-
function block1 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-tag-group", tags, suffix)} class="udex-tag-group" ?displayonly="${this.displayonly}" ?readonly="${this.readonly}" ?disabled="${this.disabled}" @focusout="${this.resetTagsTabIndexes}" tooltip-placement="${ifDefined(this.tooltipPlacement)}" @ui5-tag-icon-click="${ifDefined(this.handleRemoveTag)}" @ui5-tag-click="${ifDefined(this.handleTagClick)}" @ui5-show-more-tags="${ifDefined(this.handlerShowMoreItems)}" @ui5-tag-keydown="${ifDefined(this.handleKeyDownTag)}" ?tokenizer-expanded="${this.tokenizerExpanded}" _skip-more-button-focus>${ repeat(this.selectedItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-tag-group", tags, suffix)}>` : html`<udex-tag-group class="udex-tag-group" ?displayonly="${this.displayonly}" ?readonly="${this.readonly}" ?disabled="${this.disabled}" @focusout="${this.resetTagsTabIndexes}" tooltip-placement="${ifDefined(this.tooltipPlacement)}" @ui5-tag-icon-click="${ifDefined(this.handleRemoveTag)}" @ui5-tag-click="${ifDefined(this.handleTagClick)}" @ui5-show-more-tags="${ifDefined(this.handlerShowMoreItems)}" @ui5-tag-keydown="${ifDefined(this.handleKeyDownTag)}" ?tokenizer-expanded="${this.tokenizerExpanded}" _skip-more-button-focus>${ repeat(this.selectedItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }</udex-tag-group>`;}
|
|
10
|
-
function block2 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ !item.isGroup ? block3.call(this, context, tags, suffix, item, index) : undefined }`;}
|
|
11
|
-
function block3 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.label ? block4.call(this, context, tags, suffix, item, index) : block5.call(this, context, tags, suffix, item, index) }`;}
|
|
12
|
-
function block4 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-tag", tags, suffix)} text="${ifDefined(item.label)}" id="${ifDefined(item._id)}" icon="decline"></${scopeTag("udex-tag", tags, suffix)}>` : html`<udex-tag text="${ifDefined(item.label)}" id="${ifDefined(item._id)}" icon="decline"></udex-tag>`;}
|
|
13
|
-
function block5 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-tag", tags, suffix)} text="${ifDefined(item.rating)} ${ifDefined(this.startsText)}" id="${ifDefined(item._id)}" icon="decline"></${scopeTag("udex-tag", tags, suffix)}>` : html`<udex-tag text="${ifDefined(item.rating)} ${ifDefined(this.startsText)}" id="${ifDefined(item._id)}" icon="decline"></udex-tag>`;}
|
|
14
|
-
function block6 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<label for="search-input" class="${ifDefined(this.labelClass)}">${ifDefined(this.label)}${ this.required ? block7.call(this, context, tags, suffix) : undefined }</label><span class="hidden" id="${ifDefined(this._id)}-aria-describedby">${ifDefined(this.ariaDescribedbyText)}</span>`;}
|
|
15
|
-
function block7 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`*`;}
|
|
16
|
-
function block8 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ifDefined(this.countryFlag)}`;}
|
|
17
|
-
function block9 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-text-field__text-holder"><span class="udex-text-field__single-label" aria-hidden="true">${unsafeHTML(this._selectedOption)}</span></div>`;}
|
|
18
|
-
function block10 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<button @click="${this.handleButtonClick}" ?disabled="${this.isDisabled}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" class="udex-text-field__trigger" tabindex="-1"><${scopeTag("ui5-icon", tags, suffix)} mode="Decorative" name="navigation-down-arrow"></${scopeTag("ui5-icon", tags, suffix)}></button>` : html`<button @click="${this.handleButtonClick}" ?disabled="${this.isDisabled}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" class="udex-text-field__trigger" tabindex="-1"><ui5-icon mode="Decorative" name="navigation-down-arrow"></ui5-icon></button>`;}
|
|
19
|
-
function block11 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-truncatable-tag-content"><span class="udex-truncatable-tag-content__label">${ifDefined(this.truncatableTagLabel)}</span><${scopeTag("ui5-icon", tags, suffix)} @click="${this.handleRemoveTruncatableTag}" class="udex-truncatable-tag-content__icon" mode="Decorative" name="decline"></${scopeTag("ui5-icon", tags, suffix)}></div>` : html`<div class="udex-truncatable-tag-content"><span class="udex-truncatable-tag-content__label">${ifDefined(this.truncatableTagLabel)}</span><ui5-icon @click="${this.handleRemoveTruncatableTag}" class="udex-truncatable-tag-content__icon" mode="Decorative" name="decline"></ui5-icon></div>`;}
|
|
20
|
-
function block12 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ifDefined(this.searchableList)}`;}
|
|
21
|
-
function block13 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-status-message", tags, suffix)} ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></${scopeTag("udex-status-message", tags, suffix)}>` : html`<udex-status-message ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></udex-status-message>`;}
|
|
22
|
-
|
|
23
|
-
function template(this: SelectBox) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
|
|
24
|
-
export default template;
|