Add appropriate classes to notices

This commit is contained in:
Josh Johnson 2017-08-03 13:15:49 +01:00
parent bfa7b1d97f
commit 8fa852e4b8
2 changed files with 19 additions and 10 deletions

View file

@ -107,25 +107,28 @@ Or include Choices directly:
itemSelectable: 'choices__item--selectable',
itemDisabled: 'choices__item--disabled',
itemChoice: 'choices__item--choice',
placeholder: 'choices__placeholder',
group: 'choices__group',
groupHeading : 'choices__heading',
groupHeading: 'choices__heading',
button: 'choices__button',
activeState: 'is-active',
focusState: 'is-focused',
openState: 'is-open',
disabledState: 'is-disabled',
disabledState: 'is-disaqbled',
highlightedState: 'is-highlighted',
hiddenState: 'is-hidden',
flippedState: 'is-flipped',
loadingState: 'is-loading',
noResults: 'has-no-results',
noChoices: 'has-no-choices'
},
// Choices uses the great Fuse library for searching. You
// can find more options here: https://github.com/krisk/Fuse#options
fuseOptions: {
include: 'score',
include: 'score'
},
callbackOnInit: null,
callbackOnCreateTemplates: null,
callbackOnCreateTemplates: null
});
```

View file

@ -115,12 +115,14 @@ class Choices {
hiddenState: 'is-hidden',
flippedState: 'is-flipped',
loadingState: 'is-loading',
noResults: 'has-no-results',
noChoices: 'has-no-choices'
},
fuseOptions: {
include: 'score',
include: 'score'
},
callbackOnInit: null,
callbackOnCreateTemplates: null,
callbackOnCreateTemplates: null
};
this.idNames = {
@ -534,13 +536,13 @@ class Choices {
this.config.noResultsText() :
this.config.noResultsText;
dropdownItem = this._getTemplate('notice', notice);
dropdownItem = this._getTemplate('notice', notice, 'no-results');
} else {
notice = isType('Function', this.config.noChoicesText) ?
this.config.noChoicesText() :
this.config.noChoicesText;
dropdownItem = this._getTemplate('notice', notice);
dropdownItem = this._getTemplate('notice', notice, 'no-choices');
}
this.choiceList.appendChild(dropdownItem);
@ -2655,10 +2657,14 @@ class Choices {
</div>
`);
},
notice: (label) => {
notice: (label, type) => {
let localClasses = classNames(
globalClasses.item,
globalClasses.itemChoice
globalClasses.itemChoice,
{
[globalClasses.noResults]: (type === 'no-results'),
[globalClasses.noChoices]: (type === 'no-choices'),
}
);
return strToEl(`