discourse/app/assets/javascripts/select-kit/components/dropdown-select-box/dropdown-select-box-header....

import SelectKitHeaderComponent from "select-kit/components/select-kit/select-kit-header";
import computed from "ember-addons/ember-computed-decorators";

export default SelectKitHeaderComponent.extend({
  layoutName: "select-kit/templates/components/dropdown-select-box/dropdown-select-box-header",
  classNames: "dropdown-select-box-header",
  tagName: "button",

  classNameBindings: ["btnClassName"],

  @computed("options.showFullTitle")
  btnClassName(showFullTitle) {
    return `btn ${showFullTitle ? 'btn-icon-text' : 'no-text btn-icon'}`;
  }
});
Introduces select-kit * renames `select-box-kit` into `select-kit` * introduces `single-select` and `multi-select` as base components * introduces {{search-advanced-category-chooser}} as a better component for selecting category in advanced search * improves events handling in select-kit * recreates color selection inputs using {{multi-select}} and a custom {{selected-color}} component * replaces category-selector by a component using select-kit and based on multi-select * improves positioning of wrapper * removes the need for offscreen, and instead use `select-kit-header` as a base focus point for all select-kit based components * introduces a formal plugin api for select-kit based components * introduces a formal pattern for loading and updating select-kit based components: ``` computeValue() computeContent() mutateValue() ``` 2017-11-21 05:53:09 -05:00			`import SelectKitHeaderComponent from "select-kit/components/select-kit/select-kit-header";`
			`import computed from "ember-addons/ember-computed-decorators";`

			`export default SelectKitHeaderComponent.extend({`
			`layoutName: "select-kit/templates/components/dropdown-select-box/dropdown-select-box-header",`
			`classNames: "dropdown-select-box-header",`
			`tagName: "button",`

			`classNameBindings: ["btnClassName"],`

			`@computed("options.showFullTitle")`
			`btnClassName(showFullTitle) {`
			return `btn ${showFullTitle ? 'btn-icon-text' : 'no-text btn-icon'}`;
			`}`
			`});`