2020-08-26 00:10:31 +00:00
|
|
|
export class GitLabDropdownInput {
|
|
|
|
constructor(input, options) {
|
|
|
|
this.input = input;
|
|
|
|
this.options = options;
|
|
|
|
this.fieldName = this.options.fieldName || 'field-name';
|
|
|
|
const $inputContainer = this.input.parent();
|
|
|
|
const $clearButton = $inputContainer.find('.js-dropdown-input-clear');
|
2020-12-23 21:10:24 +00:00
|
|
|
$clearButton.on('click', (e) => {
|
2020-08-26 00:10:31 +00:00
|
|
|
// Clear click
|
|
|
|
e.preventDefault();
|
|
|
|
e.stopPropagation();
|
2020-12-23 12:10:26 +00:00
|
|
|
return this.input.val('').trigger('input').focus();
|
2020-08-26 00:10:31 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
this.input
|
2020-12-23 21:10:24 +00:00
|
|
|
.on('keydown', (e) => {
|
2020-08-26 00:10:31 +00:00
|
|
|
const keyCode = e.which;
|
|
|
|
if (keyCode === 13 && !options.elIsInput) {
|
|
|
|
e.preventDefault();
|
|
|
|
}
|
|
|
|
})
|
2020-12-23 21:10:24 +00:00
|
|
|
.on('input', (e) => {
|
2020-08-26 00:10:31 +00:00
|
|
|
let val = e.currentTarget.value || this.options.inputFieldName;
|
|
|
|
val = val
|
|
|
|
.split(' ')
|
|
|
|
.join('-') // replaces space with dash
|
|
|
|
.replace(/[^a-zA-Z0-9 -]/g, '')
|
|
|
|
.toLowerCase() // replace non alphanumeric
|
|
|
|
.replace(/(-)\1+/g, '-'); // replace repeated dashes
|
|
|
|
this.cb(this.options.fieldName, val, {}, true);
|
2020-12-23 12:10:26 +00:00
|
|
|
this.input.closest('.dropdown').find('.dropdown-toggle-text').text(val);
|
2020-08-26 00:10:31 +00:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
onInput(cb) {
|
|
|
|
this.cb = cb;
|
|
|
|
}
|
|
|
|
}
|