discourse/app/assets/javascripts/select-kit/components/multi-select/selected-name.js.es6
2019-11-08 12:28:11 -06:00

56 lines
1.5 KiB
JavaScript

import { default as computed, or, alias } from "@ember/object/computed";
import Component from "@ember/component";
import discourseComputed from "discourse-common/utils/decorators";
export default Component.extend({
attributeBindings: [
"tabindex",
"ariaLabel:aria-label",
"title",
"name:data-name",
"value:data-value",
"guid:data-guid"
],
classNames: ["selected-name", "choice"],
classNameBindings: ["isHighlighted", "isLocked"],
layoutName: "select-kit/templates/components/multi-select/selected-name",
tagName: "span",
tabindex: -1,
@discourseComputed("computedContent")
guid(computedContent) {
return Ember.guidFor(computedContent);
},
ariaLabel: or("computedContent.ariaLabel", "title"),
@discourseComputed("computedContent.title", "name")
title(computedContentTitle, name) {
if (computedContentTitle) return computedContentTitle;
if (name) return name;
return null;
},
label: or("computedContent.label", "title", "name"),
name: alias("computedContent.name"),
value: alias("computedContent.value"),
isLocked: computed("computedContent.locked", function() {
return this.getWithDefault("computedContent.locked", false);
}),
@discourseComputed("computedContent", "highlightedSelection.[]")
isHighlighted(computedContent, highlightedSelection) {
return highlightedSelection.includes(this.computedContent);
},
click() {
if (this.isLocked) return false;
this.onClickSelectionItem([this.computedContent]);
return false;
}
});