From b6663b7bc29bcaa3dd30904b7a528891f75a2ccb Mon Sep 17 00:00:00 2001
From: Sergey Belozyorcev <nextdrift@gmail.com>
Date: Fri, 23 Mar 2018 18:14:27 +0300
Subject: [PATCH] Customized button in select

---
 .../select/__button/select__button.bemhtml.js | 46 ++++++++++++-------
 1 file changed, 29 insertions(+), 17 deletions(-)

diff --git a/common.blocks/select/__button/select__button.bemhtml.js b/common.blocks/select/__button/select__button.bemhtml.js
index cb1a2d389..3adbe958b 100644
--- a/common.blocks/select/__button/select__button.bemhtml.js
+++ b/common.blocks/select/__button/select__button.bemhtml.js
@@ -1,25 +1,34 @@
 block('select').elem('button')(
-    replace()(function() {
-        var select = this._select,
-            mods = this.mods;
+    mode('button-attrs')(function() {
+        var mods = this.mods;
+
+        return {
+            role : 'listbox',
+            'aria-owns' : this._optionIds.join(' '),
+            'aria-multiselectable' : mods.mode === 'check'? 'true' : undefined,
+            'aria-labelledby' : this._selectTextId
+        };
+    }),
+    mode('button-mods')(function() {
+        var mods = this.mods;
+
+        return {
+            size : mods.size,
+            theme : mods.theme,
+            view : mods.view,
+            focused : mods.focused,
+            disabled : mods.disabled,
+            checked : mods.mode !== 'radio' && !!this._checkedOptions.length
+        };
+    }),
+    mode('button')(function() {
+        var select = this._select;
 
         return {
             block : 'button',
             mix : { block : this.block, elem : this.elem },
-            mods : {
-                size : mods.size,
-                theme : mods.theme,
-                view : mods.view,
-                focused : mods.focused,
-                disabled : mods.disabled,
-                checked : mods.mode !== 'radio' && !!this._checkedOptions.length
-            },
-            attrs : {
-                role : 'listbox',
-                'aria-owns' : this._optionIds.join(' '),
-                'aria-multiselectable' : mods.mode === 'check'? 'true' : undefined,
-                'aria-labelledby' : this._selectTextId
-            },
+            mods : apply('button-mods'),
+            attrs : apply('button-attrs'),
             id : select.id,
             tabIndex : select.tabIndex,
             content : [
@@ -28,6 +37,9 @@ block('select').elem('button')(
             ]
         };
     }),
+    replace()(function() {
+        return apply('button');
+    }),
     def()(function() {
         return applyNext({ _selectTextId : this.generateId() });
     })