Update defaults for classnames

This commit is contained in:
Xon 2024-08-04 10:02:41 +08:00
commit ce4c07b2fa
3 changed files with 57 additions and 50 deletions

View file

@ -5,6 +5,9 @@
### Bug Fixes (from 10.2.0)
* Fix search did not trigger to copy&paste events [#860](https://github.com/Choices-js/Choices/issues/860) [#174](https://github.com/Choices-js/Choices/issues/174)
### Chore
* Update defaults for classnames to be arrays instead of strings
## [11.0.0 RC2] (2024-08-03)
### Bug Fixes (from 10.2.0)

View file

@ -701,29 +701,33 @@ const example = new Choices(element, {
```
classNames: {
containerOuter: 'choices',
containerInner: 'choices__inner',
input: 'choices__input',
inputCloned: 'choices__input--cloned',
list: 'choices__list',
listItems: 'choices__list--multiple',
listSingle: 'choices__list--single',
listDropdown: 'choices__list--dropdown',
item: 'choices__item',
itemSelectable: 'choices__item--selectable',
itemDisabled: 'choices__item--disabled',
itemOption: 'choices__item--choice',
group: 'choices__group',
groupHeading : 'choices__heading',
button: 'choices__button',
activeState: 'is-active',
focusState: 'is-focused',
openState: 'is-open',
disabledState: 'is-disabled',
highlightedState: 'is-highlighted',
selectedState: 'is-selected',
flippedState: 'is-flipped',
selectedState: 'is-highlighted',
containerOuter: ['choices'],
containerInner: ['choices__inner'],
input: ['choices__input'],
inputCloned: ['choices__input--cloned'],
list: ['choices__list'],
listItems: ['choices__list--multiple'],
listSingle: ['choices__list--single'],
listDropdown: ['choices__list--dropdown'],
item: ['choices__item'],
itemSelectable: ['choices__item--selectable'],
itemDisabled: ['choices__item--disabled'],
itemChoice: ['choices__item--choice'],
description: ['choices__description'],
placeholder: ['choices__placeholder'],
group: ['choices__group'],
groupHeading: ['choices__heading'],
button: ['choices__button'],
activeState: ['is-active'],
focusState: ['is-focused'],
openState: ['is-open'],
disabledState: ['is-disabled'],
highlightedState: ['is-highlighted'],
selectedState: ['is-selected'],
flippedState: ['is-flipped'],
loadingState: ['is-loading'],
noResults: ['has-no-results'],
noChoices: ['has-no-choices'],
}
```

View file

@ -1,57 +1,57 @@
/** Classes added to HTML generated by By default classnames follow the BEM notation. */
export interface ClassNames {
/** @default 'choices' */
/** @default ['choices'] */
containerOuter: string | Array<string>;
/** @default 'choices__inner' */
/** @default ['choices__inner'] */
containerInner: string | Array<string>;
/** @default 'choices__input' */
/** @default ['choices__input'] */
input: string | Array<string>;
/** @default 'choices__input--cloned' */
/** @default ['choices__input--cloned'] */
inputCloned: string | Array<string>;
/** @default 'choices__list' */
/** @default ['choices__list'] */
list: string | Array<string>;
/** @default 'choices__list--multiple' */
/** @default ['choices__list--multiple'] */
listItems: string | Array<string>;
/** @default 'choices__list--single' */
/** @default ['choices__list--single'] */
listSingle: string | Array<string>;
/** @default 'choices__list--dropdown' */
/** @default ['choices__list--dropdown'] */
listDropdown: string | Array<string>;
/** @default 'choices__item' */
/** @default ['choices__item'] */
item: string | Array<string>;
/** @default 'choices__item--selectable' */
/** @default ['choices__item--selectable'] */
itemSelectable: string | Array<string>;
/** @default 'choices__item--disabled' */
/** @default ['choices__item--disabled'] */
itemDisabled: string | Array<string>;
/** @default 'choices__item--choice' */
/** @default ['choices__item--choice'] */
itemChoice: string | Array<string>;
/** @default 'choices__description' */
/** @default ['choices__description'] */
description: string | Array<string>;
/** @default 'choices__placeholder' */
/** @default ['choices__placeholder'] */
placeholder: string | Array<string>;
/** @default 'choices__group' */
/** @default ['choices__group'] */
group: string | Array<string>;
/** @default 'choices__heading' */
/** @default ['choices__heading'] */
groupHeading: string | Array<string>;
/** @default 'choices__button' */
/** @default ['choices__button'] */
button: string | Array<string>;
/** @default 'is-active' */
/** @default ['is-active'] */
activeState: string | Array<string>;
/** @default 'is-focused' */
/** @default ['is-focused'] */
focusState: string | Array<string>;
/** @default 'is-open' */
/** @default ['is-open'] */
openState: string | Array<string>;
/** @default 'is-disabled' */
/** @default ['is-disabled'] */
disabledState: string | Array<string>;
/** @default 'is-highlighted' */
/** @default ['is-highlighted'] */
highlightedState: string | Array<string>;
/** @default 'is-selected' */
/** @default ['is-selected'] */
selectedState: string | Array<string>;
/** @default 'is-flipped' */
/** @default ['is-flipped'] */
flippedState: string | Array<string>;
/** @default 'is-loading' */
/** @default ['is-loading'] */
loadingState: string | Array<string>;
/** @default 'has-no-results' */
/** @default ['has-no-results'] */
noResults: string | Array<string>;
/** @default 'has-no-choices' */
/** @default ['has-no-choices'] */
noChoices: string | Array<string>;
}