UX: allows to copy/paste a list of | separated values in sk ()

* UX: allows to copy/paste a list of | separated values in sk

* fixes tests
This commit is contained in:
Joffrey JAFFEUX 2021-01-06 12:57:13 +01:00 committed by GitHub
parent 5f846531a5
commit 53f9a0883e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 66 additions and 4 deletions
app/assets/javascripts/select-kit/addon
components
mixins
templates/components/select-kit

View File

@ -29,6 +29,31 @@ export default SelectKitComponent.extend({
);
},
append(values) {
const existingItems = values
.map((value) => {
const defaultItem = this.defaultItem(value, value);
const existingItem =
this.findValue(this.mainCollection, defaultItem) ||
this.findName(this.mainCollection, defaultItem);
if (!existingItem) {
if (this.validateCreate(value, this.content)) {
return value;
}
} else if (this.validateSelect(existingItem)) {
return this.getValue(existingItem);
}
})
.filter(Boolean);
const newValues = makeArray(this.value).concat(existingItems);
const newContent = makeArray(this.selectedContent).concat(
makeArray(existingItems)
);
this.selectKit.change(newValues, newContent);
},
deselect(item) {
this.clearErrors();

View File

@ -15,4 +15,25 @@ export default SelectKitFilterComponent.extend({
}
return isEmpty(placeholder) ? "" : I18n.t(placeholder);
},
actions: {
onPaste(event) {
const data = event.originalEvent.clipboardData;
if (!data) {
return;
}
const parts = data.getData("text").split("|").filter(Boolean);
if (parts.length > 1) {
event.stopPropagation();
event.preventDefault();
this.selectKit.append(parts);
return false;
}
},
},
});

View File

@ -112,6 +112,7 @@ export default Component.extend(
change: bind(this, this._onChangeWrapper),
select: bind(this, this.select),
deselect: bind(this, this.deselect),
append: bind(this, this.append),
onOpen: bind(this, this._onOpenWrapper),
onClose: bind(this, this._onCloseWrapper),
@ -540,6 +541,10 @@ export default Component.extend(
this.selectKit.change(null, null);
},
append() {
// do nothing on general case
},
search(filter) {
let content = this.content || [];
if (filter) {

View File

@ -47,6 +47,8 @@ export default Component.extend(UtilsMixin, {
},
actions: {
onPaste() {},
onInput(event) {
this.selectKit.onInput(event);
return true;

View File

@ -57,18 +57,26 @@ export default Mixin.create({
},
findValue(content, item) {
const property = get(this.selectKit, "valueProperty");
return this._findInContent(content, item, "valueProperty", "getValue");
},
findName(content, item) {
return this._findInContent(content, item, "nameProperty", "getName");
},
_findInContent(content, item, type, getter) {
const property = get(this.selectKit, type);
if (!property) {
if (content.indexOf(item) > -1) {
return item;
}
} else if (typeof property === "string") {
return content.findBy(property, this.getValue(item));
return content.findBy(property, this[getter](item));
} else {
const value = this.getValue(item);
const name = this[getter](item);
return content.find((contentItem) => {
return this.getValue(contentItem) === value;
return this[getter](contentItem) === name;
});
}
},

View File

@ -9,6 +9,7 @@
spellcheck=false
value=(readonly selectKit.filter)
input=(action "onInput")
paste=(action "onPaste")
keyDown=(action "onKeydown")
}}