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()
```
This commit is contained in:
Joffrey JAFFEUX
2017-11-21 11:53:09 +01:00
committed by GitHub
parent edc4b30f82
commit 39f3dbd945
191 changed files with 3160 additions and 2788 deletions
@@ -33,7 +33,7 @@ QUnit.test("Share Popup", assert => {
QUnit.test("Showing and hiding the edit controls", assert => {
visit("/t/internationalization-localization/280");
click('#topic-title .d-icon-pencil');
click('#topic-title .d-pencil');
andThen(() => {
assert.ok(exists('#edit-title'), 'it shows the editing controls');
@@ -49,13 +49,13 @@ QUnit.test("Showing and hiding the edit controls", assert => {
QUnit.test("Updating the topic title and category", assert => {
visit("/t/internationalization-localization/280");
click('#topic-title .d-icon-pencil');
click('#topic-title .d-pencil');
fillIn('#edit-title', 'this is the new title');
expandSelectBoxKit('.title-wrapper .category-chooser');
expandSelectKit('.title-wrapper .category-chooser');
selectBoxKitSelectRow(4, {selector: '.title-wrapper .category-chooser'});
selectKitSelectRow(4, {selector: '.title-wrapper .category-chooser'});
click('#topic-title .submit-edit');
@@ -103,7 +103,7 @@ QUnit.test("Reply as new topic", assert => {
"it fills composer with the ring string"
);
assert.equal(
selectBox('.category-chooser').header.name(), "feature",
selectKit('.category-chooser').header.name(), "feature",
"it fills category selector with the right category"
);
});
@@ -164,7 +164,7 @@ QUnit.test("Visit topic routes", assert => {
QUnit.test("Updating the topic title with emojis", assert => {
visit("/t/internationalization-localization/280");
click('#topic-title .d-icon-pencil');
click('#topic-title .d-pencil');
fillIn('#edit-title', 'emojis title :bike: :blonde_woman:t6:');