discourse/app/assets/javascripts/select-kit/addon/components/list-setting.js

47 lines
1.2 KiB
JavaScript

import { computed } from "@ember/object";
import { readOnly } from "@ember/object/computed";
import { classNames } from "@ember-decorators/component";
import { makeArray } from "discourse-common/lib/helpers";
import MultiSelectComponent from "select-kit/components/multi-select";
import {
MAIN_COLLECTION,
pluginApiIdentifiers,
selectKitOptions,
} from "select-kit/components/select-kit";
@classNames("list-setting")
@selectKitOptions({
filterable: true,
selectedChoiceComponent: "selectedChoiceComponent",
})
@pluginApiIdentifiers("list-setting")
export default class ListSetting extends MultiSelectComponent {
choices = null;
nameProperty = null;
valueProperty = null;
@readOnly("choices") content;
modifyComponentForRow(collection) {
if (collection === MAIN_COLLECTION && this.settingName?.includes("color")) {
return "create-color-row";
}
}
@computed("settingName")
get selectedChoiceComponent() {
if (this.settingName?.includes("color")) {
return "selected-choice-color";
} else {
return "selected-choice";
}
}
deselect(value) {
this.onChangeChoices &&
this.onChangeChoices([...new Set([value, ...makeArray(this.choices)])]);
super.deselect(...arguments);
}
}