@gitlab/ui 49.0.1 → 49.0.3
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/CHANGELOG.md +14 -0
- package/dist/components/base/accordion/accordion.js +2 -8
- package/dist/components/base/accordion/accordion_item.js +0 -14
- package/dist/components/base/alert/alert.js +4 -22
- package/dist/components/base/avatar/avatar.js +0 -7
- package/dist/components/base/avatar_labeled/avatar_labeled.js +0 -2
- package/dist/components/base/avatars_inline/avatars_inline.js +2 -10
- package/dist/components/base/badge/badge.js +0 -8
- package/dist/components/base/banner/banner.js +0 -10
- package/dist/components/base/breadcrumb/breadcrumb.js +0 -12
- package/dist/components/base/breadcrumb/breadcrumb_item.js +0 -2
- package/dist/components/base/broadcast_message/broadcast_message.js +0 -3
- package/dist/components/base/button/button.js +0 -11
- package/dist/components/base/card/card.js +1 -2
- package/dist/components/base/datepicker/datepicker.js +7 -42
- package/dist/components/base/daterange_picker/daterange_picker.js +0 -23
- package/dist/components/base/drawer/drawer.js +0 -13
- package/dist/components/base/dropdown/dropdown.js +3 -17
- package/dist/components/base/dropdown/dropdown_item.js +2 -8
- package/dist/components/base/filtered_search/common_story_options.js +1 -2
- package/dist/components/base/filtered_search/filtered_search.js +9 -61
- package/dist/components/base/filtered_search/filtered_search_suggestion.js +0 -6
- package/dist/components/base/filtered_search/filtered_search_suggestion_list.js +0 -16
- package/dist/components/base/filtered_search/filtered_search_term.js +0 -9
- package/dist/components/base/filtered_search/filtered_search_token.js +10 -49
- package/dist/components/base/filtered_search/filtered_search_token_segment.js +3 -56
- package/dist/components/base/filtered_search/filtered_search_utils.js +7 -24
- package/dist/components/base/form/form_checkbox/form_checkbox.js +0 -2
- package/dist/components/base/form/form_checkbox_tree/checkbox_tree_node.js +0 -4
- package/dist/components/base/form/form_checkbox_tree/form_checkbox_tree.js +0 -10
- package/dist/components/base/form/form_checkbox_tree/models/node.js +1 -10
- package/dist/components/base/form/form_checkbox_tree/models/tree.js +16 -37
- package/dist/components/base/form/form_combobox/form_combobox.js +2 -36
- package/dist/components/base/form/form_group/form_group.js +2 -7
- package/dist/components/base/form/form_input/form_input.js +2 -8
- package/dist/components/base/form/form_input_group/form_input_group.js +0 -5
- package/dist/components/base/form/form_input_group/form_input_group_mixin.js +0 -8
- package/dist/components/base/form/form_radio_group/form_radio_group.js +0 -2
- package/dist/components/base/form/form_select/form_select.js +0 -3
- package/dist/components/base/form/form_textarea/form_textarea.js +2 -7
- package/dist/components/base/icon/icon.js +4 -14
- package/dist/components/base/infinite_scroll/infinite_scroll.js +7 -21
- package/dist/components/base/keyset_pagination/keyset_pagination.js +0 -9
- package/dist/components/base/label/label.js +0 -12
- package/dist/components/base/loading_icon/loading_icon.js +7 -10
- package/dist/components/base/markdown/markdown.js +1 -0
- package/dist/components/base/modal/modal.js +7 -27
- package/dist/components/base/new_dropdowns/base_dropdown/base_dropdown.js +0 -25
- package/dist/components/base/new_dropdowns/constants.js +4 -2
- package/dist/components/base/new_dropdowns/listbox/listbox.js +0 -63
- package/dist/components/base/new_dropdowns/listbox/listbox_group.js +0 -2
- package/dist/components/base/new_dropdowns/listbox/listbox_item.js +0 -5
- package/dist/components/base/new_dropdowns/listbox/utils.js +0 -7
- package/dist/components/base/paginated_list/paginated_list.js +0 -15
- package/dist/components/base/pagination/pagination.js +14 -72
- package/dist/components/base/path/path.js +0 -29
- package/dist/components/base/popover/popover.js +0 -5
- package/dist/components/base/search_box_by_click/search_box_by_click.js +1 -26
- package/dist/components/base/search_box_by_type/search_box_by_type.js +2 -12
- package/dist/components/base/segmented_control/segmented_control.js +0 -10
- package/dist/components/base/skeleton_loader/skeleton_loader.js +0 -19
- package/dist/components/base/skeleton_loading/skeleton_loading.js +0 -3
- package/dist/components/base/sorting/sorting.js +1 -9
- package/dist/components/base/sorting/sorting_item.js +4 -6
- package/dist/components/base/table/table.js +0 -4
- package/dist/components/base/tabs/tab/tab.js +2 -6
- package/dist/components/base/tabs/tabs/scrollable_tabs.js +0 -21
- package/dist/components/base/tabs/tabs/tabs.js +8 -33
- package/dist/components/base/toast/toast.js +4 -15
- package/dist/components/base/toggle/toggle.js +0 -18
- package/dist/components/base/token/token.js +0 -4
- package/dist/components/base/token_selector/token_container.js +0 -24
- package/dist/components/base/token_selector/token_selector.js +10 -61
- package/dist/components/base/token_selector/token_selector_dropdown.js +4 -32
- package/dist/components/charts/area/area.js +8 -32
- package/dist/components/charts/bar/bar.js +7 -19
- package/dist/components/charts/chart/chart.js +1 -22
- package/dist/components/charts/column/column.js +8 -18
- package/dist/components/charts/discrete_scatter/discrete_scatter.js +2 -13
- package/dist/components/charts/gauge/gauge.js +0 -15
- package/dist/components/charts/heatmap/heatmap.js +3 -16
- package/dist/components/charts/legend/legend.js +2 -24
- package/dist/components/charts/line/line.js +8 -34
- package/dist/components/charts/series_label/series_label.js +0 -12
- package/dist/components/charts/single_stat/single_stat.js +0 -8
- package/dist/components/charts/sparkline/sparkline.js +1 -16
- package/dist/components/charts/stacked_column/stacked_column.js +8 -26
- package/dist/components/charts/tooltip/tooltip.js +0 -6
- package/dist/components/mixins/button_mixin.js +0 -1
- package/dist/components/mixins/safe_link_mixin.js +0 -1
- package/dist/components/mixins/toolbox_mixin.js +0 -1
- package/dist/components/mixins/tooltip_mixin.js +1 -2
- package/dist/components/regions/empty_state/empty_state.js +0 -12
- package/dist/components/utilities/animated_number/animated_number.js +0 -16
- package/dist/components/utilities/friendly_wrap/friendly_wrap.js +0 -3
- package/dist/components/utilities/intersection_observer/intersection_observer.js +0 -7
- package/dist/components/utilities/intersperse/intersperse.js +3 -9
- package/dist/components/utilities/sprintf/sprintf.js +9 -23
- package/dist/components/utilities/truncate/truncate.js +0 -10
- package/dist/config.js +3 -4
- package/dist/directives/hover_load/hover_load.js +2 -8
- package/dist/directives/outside/get_event_like_time_stamp.js +4 -2
- package/dist/directives/outside/outside.js +5 -20
- package/dist/directives/resize_observer/resize_observer.js +0 -10
- package/dist/directives/safe_html/safe_html.js +5 -6
- package/dist/directives/safe_link/mock_data.js +1 -1
- package/dist/directives/safe_link/safe_link.js +0 -13
- package/dist/utils/breakpoints.js +0 -3
- package/dist/utils/charts/config.js +29 -42
- package/dist/utils/charts/constants.js +8 -8
- package/dist/utils/charts/mock_data.js +2 -2
- package/dist/utils/charts/story_config.js +1 -1
- package/dist/utils/charts/theme.js +1 -3
- package/dist/utils/charts/utils.js +2 -6
- package/dist/utils/constants.js +10 -7
- package/dist/utils/data_utils.js +5 -4
- package/dist/utils/datetime_utility.js +4 -4
- package/dist/utils/number_utils.js +7 -11
- package/dist/utils/stories_utils.js +1 -1
- package/dist/utils/story_decorators/container.js +0 -1
- package/dist/utils/string_utils.js +0 -14
- package/dist/utils/test_utils.js +3 -2
- package/dist/utils/use_fake_date.js +0 -4
- package/dist/utils/use_mock_intersection_observer.js +4 -19
- package/dist/utils/utils.js +5 -14
- package/package.json +3 -3
- package/src/components/base/pagination/pagination.vue +2 -2
- package/src/components/base/toast/toast.js +1 -0
|
@@ -11,11 +11,9 @@ import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
|
|
|
11
11
|
|
|
12
12
|
Vue.use(PortalVue);
|
|
13
13
|
let portalUuid = 0;
|
|
14
|
-
|
|
15
14
|
function initialState() {
|
|
16
15
|
return [createTerm()];
|
|
17
16
|
}
|
|
18
|
-
|
|
19
17
|
var script = {
|
|
20
18
|
name: 'GlFilteredSearch',
|
|
21
19
|
components: {
|
|
@@ -25,7 +23,6 @@ var script = {
|
|
|
25
23
|
directives: {
|
|
26
24
|
GlTooltip: GlTooltipDirective
|
|
27
25
|
},
|
|
28
|
-
|
|
29
26
|
provide() {
|
|
30
27
|
portalUuid += 1;
|
|
31
28
|
this.portalName = `filters_portal_${portalUuid}`;
|
|
@@ -38,7 +35,6 @@ var script = {
|
|
|
38
35
|
suggestionsListClass: () => this.suggestionsListClass
|
|
39
36
|
};
|
|
40
37
|
},
|
|
41
|
-
|
|
42
38
|
inheritAttrs: false,
|
|
43
39
|
props: {
|
|
44
40
|
/**
|
|
@@ -49,7 +45,6 @@ var script = {
|
|
|
49
45
|
type: Array,
|
|
50
46
|
default: () => []
|
|
51
47
|
},
|
|
52
|
-
|
|
53
48
|
/**
|
|
54
49
|
* Available tokens
|
|
55
50
|
*/
|
|
@@ -57,32 +52,27 @@ var script = {
|
|
|
57
52
|
type: Array,
|
|
58
53
|
required: false,
|
|
59
54
|
default: () => [],
|
|
60
|
-
|
|
61
55
|
validator(value) {
|
|
62
56
|
// eslint-disable-next-line no-underscore-dangle
|
|
63
57
|
if (!value.__v_raw) {
|
|
64
58
|
// This is Vue 2
|
|
65
59
|
return true;
|
|
66
|
-
}
|
|
67
|
-
|
|
60
|
+
}
|
|
68
61
|
|
|
62
|
+
// eslint-disable-next-line no-underscore-dangle
|
|
69
63
|
const isOk = Array.isArray(value) && value.every(_ref => {
|
|
70
64
|
let {
|
|
71
65
|
token
|
|
72
66
|
} = _ref;
|
|
73
67
|
return token.__v_skip;
|
|
74
68
|
});
|
|
75
|
-
|
|
76
69
|
if (!isOk) {
|
|
77
70
|
// eslint-disable-next-line no-console
|
|
78
71
|
console.warn('You are using Vue3. In Vue3 each token component passed to filtered search must be wrapped into markRaw');
|
|
79
72
|
}
|
|
80
|
-
|
|
81
73
|
return isOk;
|
|
82
74
|
}
|
|
83
|
-
|
|
84
75
|
},
|
|
85
|
-
|
|
86
76
|
/**
|
|
87
77
|
* If provided, used as history items for this component
|
|
88
78
|
*/
|
|
@@ -101,7 +91,6 @@ var script = {
|
|
|
101
91
|
required: false,
|
|
102
92
|
default: null
|
|
103
93
|
},
|
|
104
|
-
|
|
105
94
|
/**
|
|
106
95
|
* Additional classes to add to the suggestion list menu. NOTE: this not reactive, and the value
|
|
107
96
|
* must be available and fixed when the component is instantiated
|
|
@@ -111,7 +100,6 @@ var script = {
|
|
|
111
100
|
required: false,
|
|
112
101
|
default: null
|
|
113
102
|
},
|
|
114
|
-
|
|
115
103
|
/**
|
|
116
104
|
* Display operators' descriptions instead of their values (e.g., "is" instead of "=").
|
|
117
105
|
*/
|
|
@@ -120,7 +108,6 @@ var script = {
|
|
|
120
108
|
required: false,
|
|
121
109
|
default: false
|
|
122
110
|
},
|
|
123
|
-
|
|
124
111
|
/**
|
|
125
112
|
* HTML attributes to add to the search button
|
|
126
113
|
*/
|
|
@@ -129,7 +116,6 @@ var script = {
|
|
|
129
116
|
required: false,
|
|
130
117
|
default: () => ({})
|
|
131
118
|
},
|
|
132
|
-
|
|
133
119
|
/**
|
|
134
120
|
* HTML attributes to add to the search input
|
|
135
121
|
*/
|
|
@@ -144,7 +130,6 @@ var script = {
|
|
|
144
130
|
default: false
|
|
145
131
|
}
|
|
146
132
|
},
|
|
147
|
-
|
|
148
133
|
data() {
|
|
149
134
|
return {
|
|
150
135
|
tokens: initialState(),
|
|
@@ -153,66 +138,53 @@ var script = {
|
|
|
153
138
|
intendedCursorPosition: 'end'
|
|
154
139
|
};
|
|
155
140
|
},
|
|
156
|
-
|
|
157
141
|
computed: {
|
|
158
142
|
activeToken() {
|
|
159
143
|
return this.tokens[this.activeTokenIdx];
|
|
160
144
|
},
|
|
161
|
-
|
|
162
145
|
lastTokenIdx() {
|
|
163
146
|
return this.tokens.length - 1;
|
|
164
147
|
},
|
|
165
|
-
|
|
166
148
|
isLastTokenActive() {
|
|
167
149
|
return this.activeTokenIdx === this.lastTokenIdx;
|
|
168
150
|
},
|
|
169
|
-
|
|
170
151
|
hasValue() {
|
|
171
152
|
return this.tokens.length > 1 || this.tokens[0].value.data !== '';
|
|
172
153
|
},
|
|
173
|
-
|
|
174
154
|
termPlaceholder() {
|
|
175
155
|
return this.hasValue ? null : this.placeholder;
|
|
176
156
|
},
|
|
177
|
-
|
|
178
157
|
currentAvailableTokens() {
|
|
179
158
|
return this.availableTokens.filter(token => {
|
|
180
159
|
if (token.disabled) {
|
|
181
160
|
return false;
|
|
182
161
|
}
|
|
183
|
-
|
|
184
162
|
if (token.unique) {
|
|
185
163
|
return !this.tokens.find(t => t.type === token.type);
|
|
186
164
|
}
|
|
187
|
-
|
|
188
165
|
return true;
|
|
189
166
|
});
|
|
190
167
|
}
|
|
191
|
-
|
|
192
168
|
},
|
|
193
169
|
watch: {
|
|
194
170
|
tokens: {
|
|
195
171
|
handler() {
|
|
196
172
|
if (process.env.NODE_ENV !== 'production') {
|
|
197
173
|
const invalidToken = this.tokens.find(token => !token.id);
|
|
198
|
-
|
|
199
174
|
if (invalidToken) {
|
|
200
175
|
throw new Error(`Token does not have an id:\n${JSON.stringify(invalidToken)}`);
|
|
201
176
|
}
|
|
202
177
|
}
|
|
203
|
-
|
|
204
178
|
if ((this.tokens.length === 0 || !this.isLastTokenEmpty()) && !this.viewOnly) {
|
|
205
179
|
this.tokens.push(createTerm());
|
|
206
180
|
}
|
|
181
|
+
|
|
207
182
|
/**
|
|
208
183
|
* Emitted when the tokens (value) changes
|
|
209
184
|
* @property {array} tokens
|
|
210
185
|
*/
|
|
211
|
-
|
|
212
|
-
|
|
213
186
|
this.$emit('input', this.tokens);
|
|
214
187
|
},
|
|
215
|
-
|
|
216
188
|
deep: true,
|
|
217
189
|
immediate: true
|
|
218
190
|
},
|
|
@@ -222,7 +194,6 @@ var script = {
|
|
|
222
194
|
this.applyNewValue(_cloneDeep(newValue));
|
|
223
195
|
}
|
|
224
196
|
},
|
|
225
|
-
|
|
226
197
|
deep: true,
|
|
227
198
|
immediate: true
|
|
228
199
|
}
|
|
@@ -231,53 +202,42 @@ var script = {
|
|
|
231
202
|
applyNewValue(newValue) {
|
|
232
203
|
this.tokens = needDenormalization(newValue) ? denormalizeTokens(newValue) : newValue;
|
|
233
204
|
},
|
|
234
|
-
|
|
235
205
|
isActiveToken(idx) {
|
|
236
206
|
return this.activeTokenIdx === idx;
|
|
237
207
|
},
|
|
238
|
-
|
|
239
208
|
isLastToken(idx) {
|
|
240
209
|
return !this.activeTokenIdx && idx === this.lastTokenIdx;
|
|
241
210
|
},
|
|
242
|
-
|
|
243
211
|
isLastTokenEmpty() {
|
|
244
212
|
return isEmptyTerm(this.tokens[this.lastTokenIdx]);
|
|
245
213
|
},
|
|
246
|
-
|
|
247
214
|
getTokenEntry(type) {
|
|
248
215
|
return this.availableTokens.find(t => t.type === type);
|
|
249
216
|
},
|
|
250
|
-
|
|
251
217
|
getTokenComponent(type) {
|
|
252
218
|
var _this$getTokenEntry;
|
|
253
|
-
|
|
254
219
|
return ((_this$getTokenEntry = this.getTokenEntry(type)) === null || _this$getTokenEntry === void 0 ? void 0 : _this$getTokenEntry.token) || GlFilteredSearchTerm;
|
|
255
220
|
},
|
|
256
|
-
|
|
257
221
|
getLastTokenClassList(idx) {
|
|
258
222
|
return this.isLastToken(idx) && !this.viewOnly ? 'gl-filtered-search-last-item' : '';
|
|
259
223
|
},
|
|
260
|
-
|
|
261
224
|
activate(idx) {
|
|
262
225
|
if (!this.viewOnly) {
|
|
263
226
|
this.activeTokenIdx = idx;
|
|
264
227
|
}
|
|
265
228
|
},
|
|
266
|
-
|
|
267
229
|
activatePreviousToken() {
|
|
268
230
|
if (this.activeTokenIdx > 0) {
|
|
269
231
|
this.activeTokenIdx -= 1;
|
|
270
232
|
this.intendedCursorPosition = 'end';
|
|
271
233
|
}
|
|
272
234
|
},
|
|
273
|
-
|
|
274
235
|
activateNextToken() {
|
|
275
236
|
if (this.activeTokenIdx < this.value.length) {
|
|
276
237
|
this.activeTokenIdx += 1;
|
|
277
238
|
this.intendedCursorPosition = 'start';
|
|
278
239
|
}
|
|
279
240
|
},
|
|
280
|
-
|
|
281
241
|
alignSuggestions(ref) {
|
|
282
242
|
const offsetRef = ref.getBoundingClientRect().left;
|
|
283
243
|
const offsetMenu = this.$el.getBoundingClientRect().left;
|
|
@@ -286,40 +246,33 @@ var script = {
|
|
|
286
246
|
transform
|
|
287
247
|
};
|
|
288
248
|
},
|
|
289
|
-
|
|
290
249
|
deactivate(token) {
|
|
291
250
|
this.intendedCursorPosition = 'end';
|
|
292
251
|
const tokenIdx = this.tokens.indexOf(token);
|
|
293
|
-
|
|
294
252
|
if (tokenIdx === -1 || this.activeTokenIdx !== tokenIdx) {
|
|
295
253
|
return;
|
|
296
254
|
}
|
|
297
|
-
|
|
298
255
|
if (!this.isLastTokenEmpty()) {
|
|
299
256
|
this.tokens.push(createTerm());
|
|
300
257
|
}
|
|
301
|
-
|
|
302
258
|
if (!this.isLastTokenActive && isEmptyTerm(this.activeToken)) {
|
|
303
259
|
this.tokens.splice(tokenIdx, 1);
|
|
304
260
|
}
|
|
305
|
-
|
|
306
261
|
this.activeTokenIdx = null;
|
|
307
262
|
},
|
|
308
|
-
|
|
309
263
|
destroyToken(idx) {
|
|
310
264
|
let {
|
|
311
265
|
intent
|
|
312
266
|
} = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
313
|
-
|
|
314
267
|
if (this.tokens.length === 1) {
|
|
315
268
|
return;
|
|
316
269
|
}
|
|
270
|
+
this.tokens.splice(idx, 1);
|
|
317
271
|
|
|
318
|
-
|
|
272
|
+
// First, attempt to honor the user's activation intent behind the
|
|
319
273
|
// destruction of the token, if any. Otherwise, try to maintain the
|
|
320
274
|
// active state for the token that was active at the time. If that's not
|
|
321
275
|
// possible, make sure no token is active.
|
|
322
|
-
|
|
323
276
|
if (intent === INTENT_ACTIVATE_PREVIOUS) {
|
|
324
277
|
// If there is a previous token, activate it; else, activate the first token
|
|
325
278
|
this.activeTokenIdx = Math.max(idx - 1, 0);
|
|
@@ -329,13 +282,14 @@ var script = {
|
|
|
329
282
|
} else if (idx === this.activeTokenIdx) {
|
|
330
283
|
// User destroyed the active token; don't activate another one.
|
|
331
284
|
this.activeTokenIdx = null;
|
|
332
|
-
}
|
|
285
|
+
}
|
|
286
|
+
// Do nothing if there was no active token, or if idx > this.activeTokenIdx,
|
|
333
287
|
// to preserve the active state of the remaining tokens.
|
|
334
|
-
|
|
335
288
|
},
|
|
336
289
|
|
|
337
290
|
replaceToken(idx, token) {
|
|
338
|
-
this.$set(this.tokens, idx, ensureTokenId({
|
|
291
|
+
this.$set(this.tokens, idx, ensureTokenId({
|
|
292
|
+
...token,
|
|
339
293
|
value: {
|
|
340
294
|
data: '',
|
|
341
295
|
...token.value
|
|
@@ -343,20 +297,16 @@ var script = {
|
|
|
343
297
|
}));
|
|
344
298
|
this.activeTokenIdx = idx;
|
|
345
299
|
},
|
|
346
|
-
|
|
347
300
|
createTokens(idx) {
|
|
348
301
|
let newStrings = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [''];
|
|
349
|
-
|
|
350
302
|
if (this.activeTokenIdx !== this.lastTokenIdx && newStrings.length === 1 && newStrings[0] === '') {
|
|
351
303
|
this.activeTokenIdx = this.lastTokenIdx;
|
|
352
304
|
return;
|
|
353
305
|
}
|
|
354
|
-
|
|
355
306
|
const newTokens = newStrings.map(data => createTerm(data));
|
|
356
307
|
this.tokens.splice(idx + 1, 0, ...newTokens);
|
|
357
308
|
this.activeTokenIdx = idx + newStrings.length;
|
|
358
309
|
},
|
|
359
|
-
|
|
360
310
|
completeToken() {
|
|
361
311
|
if (this.activeTokenIdx === this.lastTokenIdx - 1) {
|
|
362
312
|
this.activeTokenIdx = this.lastTokenIdx;
|
|
@@ -364,7 +314,6 @@ var script = {
|
|
|
364
314
|
this.activeTokenIdx = null;
|
|
365
315
|
}
|
|
366
316
|
},
|
|
367
|
-
|
|
368
317
|
submit() {
|
|
369
318
|
/**
|
|
370
319
|
* Emitted when search is submitted
|
|
@@ -372,7 +321,6 @@ var script = {
|
|
|
372
321
|
*/
|
|
373
322
|
this.$emit('submit', normalizeTokens(_cloneDeep(this.tokens)));
|
|
374
323
|
}
|
|
375
|
-
|
|
376
324
|
}
|
|
377
325
|
};
|
|
378
326
|
|
|
@@ -21,7 +21,6 @@ var script = {
|
|
|
21
21
|
isActive() {
|
|
22
22
|
return this.filteredSearchSuggestionListInstance.activeItem === this;
|
|
23
23
|
}
|
|
24
|
-
|
|
25
24
|
},
|
|
26
25
|
watch: {
|
|
27
26
|
isActive(newValue) {
|
|
@@ -34,24 +33,19 @@ var script = {
|
|
|
34
33
|
});
|
|
35
34
|
}
|
|
36
35
|
}
|
|
37
|
-
|
|
38
36
|
},
|
|
39
|
-
|
|
40
37
|
created() {
|
|
41
38
|
this.filteredSearchSuggestionListInstance.register(this);
|
|
42
39
|
},
|
|
43
|
-
|
|
44
40
|
beforeDestroy() {
|
|
45
41
|
this.filteredSearchSuggestionListInstance.unregister(this);
|
|
46
42
|
},
|
|
47
|
-
|
|
48
43
|
methods: {
|
|
49
44
|
emitValue() {
|
|
50
45
|
// We use href argument for gl-dropdown-item to use <a> instead of <button>
|
|
51
46
|
// due to https://bugs.webkit.org/show_bug.cgi?id=22261
|
|
52
47
|
this.filteredSearchSuggestionListInstance.$emit('suggestion', this.value);
|
|
53
48
|
}
|
|
54
|
-
|
|
55
49
|
}
|
|
56
50
|
};
|
|
57
51
|
|
|
@@ -3,13 +3,11 @@ import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
|
|
|
3
3
|
var script = {
|
|
4
4
|
name: 'GlFilteredSearchSuggestionList',
|
|
5
5
|
inject: ['suggestionsListClass'],
|
|
6
|
-
|
|
7
6
|
provide() {
|
|
8
7
|
return {
|
|
9
8
|
filteredSearchSuggestionListInstance: this
|
|
10
9
|
};
|
|
11
10
|
},
|
|
12
|
-
|
|
13
11
|
props: {
|
|
14
12
|
/**
|
|
15
13
|
* Value to be initially selected in list.
|
|
@@ -20,56 +18,45 @@ var script = {
|
|
|
20
18
|
default: null
|
|
21
19
|
}
|
|
22
20
|
},
|
|
23
|
-
|
|
24
21
|
data() {
|
|
25
22
|
return {
|
|
26
23
|
activeIdx: -1,
|
|
27
24
|
registeredItems: []
|
|
28
25
|
};
|
|
29
26
|
},
|
|
30
|
-
|
|
31
27
|
computed: {
|
|
32
28
|
activeItem() {
|
|
33
29
|
return this.activeIdx > -1 && this.activeIdx < this.registeredItems.length ? this.registeredItems[this.activeIdx] : null;
|
|
34
30
|
},
|
|
35
|
-
|
|
36
31
|
listClasses() {
|
|
37
32
|
return [this.suggestionsListClass(), 'dropdown-menu gl-filtered-search-suggestion-list'];
|
|
38
33
|
}
|
|
39
|
-
|
|
40
34
|
},
|
|
41
35
|
watch: {
|
|
42
36
|
initialValue(newValue) {
|
|
43
37
|
this.activeIdx = this.registeredItems.findIndex(item => this.valuesMatch(item.value, newValue));
|
|
44
38
|
}
|
|
45
|
-
|
|
46
39
|
},
|
|
47
40
|
methods: {
|
|
48
41
|
valuesMatch(firstValue, secondValue) {
|
|
49
42
|
if (!firstValue || !secondValue) return false;
|
|
50
43
|
return typeof firstValue === 'string' ? firstValue.toLowerCase() === secondValue.toLowerCase() : firstValue === secondValue;
|
|
51
44
|
},
|
|
52
|
-
|
|
53
45
|
register(item) {
|
|
54
46
|
this.registeredItems.push(item);
|
|
55
|
-
|
|
56
47
|
if (this.valuesMatch(item.value, this.initialValue)) {
|
|
57
48
|
this.activeIdx = this.registeredItems.length - 1;
|
|
58
49
|
}
|
|
59
50
|
},
|
|
60
|
-
|
|
61
51
|
unregister(item) {
|
|
62
52
|
const idx = this.registeredItems.indexOf(item);
|
|
63
|
-
|
|
64
53
|
if (idx !== -1) {
|
|
65
54
|
this.registeredItems.splice(idx, 1);
|
|
66
|
-
|
|
67
55
|
if (idx === this.activeIdx) {
|
|
68
56
|
this.activeIdx = -1;
|
|
69
57
|
}
|
|
70
58
|
}
|
|
71
59
|
},
|
|
72
|
-
|
|
73
60
|
nextItem() {
|
|
74
61
|
if (this.activeIdx < this.registeredItems.length) {
|
|
75
62
|
this.activeIdx += 1;
|
|
@@ -77,7 +64,6 @@ var script = {
|
|
|
77
64
|
this.activeIdx = 0;
|
|
78
65
|
}
|
|
79
66
|
},
|
|
80
|
-
|
|
81
67
|
prevItem() {
|
|
82
68
|
if (this.activeIdx >= 0) {
|
|
83
69
|
this.activeIdx -= 1;
|
|
@@ -85,11 +71,9 @@ var script = {
|
|
|
85
71
|
this.activeIdx = this.registeredItems.length - 1;
|
|
86
72
|
}
|
|
87
73
|
},
|
|
88
|
-
|
|
89
74
|
getValue() {
|
|
90
75
|
return this.activeItem ? this.activeItem.value : null;
|
|
91
76
|
}
|
|
92
|
-
|
|
93
77
|
}
|
|
94
78
|
};
|
|
95
79
|
|
|
@@ -18,7 +18,6 @@ var script = {
|
|
|
18
18
|
type: Array,
|
|
19
19
|
required: true
|
|
20
20
|
},
|
|
21
|
-
|
|
22
21
|
/**
|
|
23
22
|
* Determines if the term is being edited or not.
|
|
24
23
|
*/
|
|
@@ -27,7 +26,6 @@ var script = {
|
|
|
27
26
|
required: false,
|
|
28
27
|
default: false
|
|
29
28
|
},
|
|
30
|
-
|
|
31
29
|
/**
|
|
32
30
|
* Current term value.
|
|
33
31
|
*/
|
|
@@ -43,7 +41,6 @@ var script = {
|
|
|
43
41
|
required: false,
|
|
44
42
|
default: ''
|
|
45
43
|
},
|
|
46
|
-
|
|
47
44
|
/**
|
|
48
45
|
* HTML attributes to add to the search input.
|
|
49
46
|
*/
|
|
@@ -52,7 +49,6 @@ var script = {
|
|
|
52
49
|
required: false,
|
|
53
50
|
default: () => ({})
|
|
54
51
|
},
|
|
55
|
-
|
|
56
52
|
/**
|
|
57
53
|
* If this is the last token.
|
|
58
54
|
*/
|
|
@@ -61,7 +57,6 @@ var script = {
|
|
|
61
57
|
required: false,
|
|
62
58
|
default: false
|
|
63
59
|
},
|
|
64
|
-
|
|
65
60
|
/**
|
|
66
61
|
* The current `value` (tokens) of the ancestor GlFilteredSearch component.
|
|
67
62
|
*/
|
|
@@ -86,12 +81,10 @@ var script = {
|
|
|
86
81
|
suggestedTokens() {
|
|
87
82
|
return this.availableTokens.filter(item => item.title.toLowerCase().includes(this.value.data.toLowerCase()));
|
|
88
83
|
},
|
|
89
|
-
|
|
90
84
|
internalValue: {
|
|
91
85
|
get() {
|
|
92
86
|
return this.value.data;
|
|
93
87
|
},
|
|
94
|
-
|
|
95
88
|
set(data) {
|
|
96
89
|
/**
|
|
97
90
|
* Emitted when the token changes its value.
|
|
@@ -103,7 +96,6 @@ var script = {
|
|
|
103
96
|
data
|
|
104
97
|
});
|
|
105
98
|
}
|
|
106
|
-
|
|
107
99
|
}
|
|
108
100
|
},
|
|
109
101
|
methods: {
|
|
@@ -119,7 +111,6 @@ var script = {
|
|
|
119
111
|
intent: INTENT_ACTIVATE_PREVIOUS
|
|
120
112
|
});
|
|
121
113
|
}
|
|
122
|
-
|
|
123
114
|
}
|
|
124
115
|
};
|
|
125
116
|
|