2017-11-21 18:53:09 +08:00
|
|
|
import SingleSelectComponent from "select-kit/components/single-select";
|
2018-03-22 18:29:55 +08:00
|
|
|
import { on, default as computed } from "ember-addons/ember-computed-decorators";
|
2017-10-20 03:51:08 +08:00
|
|
|
|
2017-11-21 18:53:09 +08:00
|
|
|
export default SingleSelectComponent.extend({
|
|
|
|
pluginApiIdentifiers: ["combo-box"],
|
2017-10-20 03:51:08 +08:00
|
|
|
classNames: "combobox combo-box",
|
|
|
|
autoFilterable: true,
|
|
|
|
headerComponent: "combo-box/combo-box-header",
|
|
|
|
|
2018-03-23 00:17:28 +08:00
|
|
|
caretUpIcon: "caret-up fa-fw",
|
|
|
|
caretDownIcon: "caret-down fa-fw",
|
2017-10-20 03:51:08 +08:00
|
|
|
clearable: false,
|
|
|
|
|
2017-11-21 18:53:09 +08:00
|
|
|
computeHeaderContent() {
|
2018-03-22 18:29:55 +08:00
|
|
|
let content = this._super();
|
2017-11-21 18:53:09 +08:00
|
|
|
content.hasSelection = this.get("hasSelection");
|
|
|
|
return content;
|
|
|
|
},
|
|
|
|
|
2018-03-22 18:29:55 +08:00
|
|
|
@computed("isExpanded", "caretUpIcon", "caretDownIcon")
|
|
|
|
caretIcon(isExpanded, caretUpIcon, caretDownIcon) {
|
|
|
|
return isExpanded ? caretUpIcon : caretDownIcon;
|
|
|
|
},
|
|
|
|
|
2017-10-20 03:51:08 +08:00
|
|
|
@on("didReceiveAttrs")
|
2017-10-20 21:41:00 +08:00
|
|
|
_setComboBoxOptions() {
|
2018-03-29 10:25:29 +08:00
|
|
|
const placeholder = this.get('placeholder');
|
|
|
|
|
2017-11-10 02:57:53 +08:00
|
|
|
this.get("headerComponentOptions").setProperties({
|
2017-10-20 03:51:08 +08:00
|
|
|
clearable: this.get("clearable"),
|
2018-03-29 10:25:29 +08:00
|
|
|
placeholder: placeholder ? I18n.t(placeholder) : "",
|
2017-11-10 02:57:53 +08:00
|
|
|
});
|
2017-10-20 03:51:08 +08:00
|
|
|
}
|
|
|
|
});
|