Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Allow placeholder to be configured for `combo-box`.

This commit is contained in:
Guo Xiang Tan 2018-03-29 10:25:29 +08:00
parent a64cc9a990
commit 27f06505b1
4 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/assets/javascripts/select-kit/components/combo-box.js.es6
View File

@ -24,8 +24,11 @@ export default SingleSelectComponent.extend({
@on("didReceiveAttrs") @on("didReceiveAttrs")
_setComboBoxOptions() { _setComboBoxOptions() {
const placeholder = this.get('placeholder');
this.get("headerComponentOptions").setProperties({ this.get("headerComponentOptions").setProperties({
clearable: this.get("clearable"), clearable: this.get("clearable"),
placeholder: placeholder ? I18n.t(placeholder) : "",
}); });
} }
}); });

3
app/assets/javascripts/select-kit/components/combo-box/combo-box-header.js.es6
View File

@ -7,5 +7,6 @@ export default SelectKitHeaderComponent.extend({
clearable: Ember.computed.alias("options.clearable"), clearable: Ember.computed.alias("options.clearable"),
caretUpIcon: Ember.computed.alias("options.caretUpIcon"), caretUpIcon: Ember.computed.alias("options.caretUpIcon"),
caretDownIcon: Ember.computed.alias("options.caretDownIcon"), caretDownIcon: Ember.computed.alias("options.caretDownIcon"),
shouldDisplayClearableButton: Ember.computed.and("clearable", "computedContent.hasSelection") shouldDisplayClearableButton: Ember.computed.and("clearable", "computedContent.hasSelection"),
placeholder: Ember.computed.alias("options.placeholder"),
}); });

12
app/assets/javascripts/select-kit/templates/components/combo-box/combo-box-header.hbs
View File

@ -1,8 +1,14 @@
{{#each icons as |icon|}} {{d-icon icon}} {{/each}} {{#each icons as |icon|}} {{d-icon icon}} {{/each}}
<span class="selected-name"> {{#if label}}
{{{label}}} <span class="selected-name">
</span> {{{label}}}
</span>
{{else}}
<span class="combo-box-placeholder">
{{placeholder}}
</span>
{{/if}}
{{#if shouldDisplayClearableButton}} {{#if shouldDisplayClearableButton}}
<button class="btn-clear" {{action onClearSelection bubbles=false}}> <button class="btn-clear" {{action onClearSelection bubbles=false}}>

3
app/assets/stylesheets/common/select-kit/combo-box.scss
View File

@ -1,5 +1,8 @@
.select-kit { .select-kit {
&.combo-box { &.combo-box {
.combo-box-placeholder {
color: dark-light-choose($primary-high, $secondary-low);
}
.select-kit-body { .select-kit-body {
width: 100%; width: 100%;