@skbkontur/side-menu 0.2.1 → 0.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [0.2.2](https://git.skbkontur.ru/ui/ui-parking/compare/@skbkontur/side-menu@0.2.1...@skbkontur/side-menu@0.2.2) (2022-10-11)
7
+
8
+ **Note:** Version bump only for package @skbkontur/side-menu
9
+
10
+
11
+
12
+
13
+
6
14
  ## [0.2.1](https://git.skbkontur.ru/ui/ui-parking/compare/@skbkontur/side-menu@0.2.0...@skbkontur/side-menu@0.2.1) (2022-09-30)
7
15
 
8
16
 
package/README.md CHANGED
@@ -3,10 +3,10 @@
3
3
  SideMenu в фирменном стиле (макеты живут [здесь](https://www.figma.com/file/XA8Ytcx8bxemYAkF7eGVSv/%D0%9A%D0%BE%D0%BC%D0%BF%D0%BE%D0%BD%D0%B5%D0%BD%D1%82-%D0%BB%D0%B5%D0%B2%D0%BE%D0%B3%D0%BE-%D0%BC%D0%B5%D0%BD%D1%8E?node-id=0%3A1)).
4
4
 
5
5
  ```jsx harmony
6
- import {getKonturAvatarUrl} from '@skbkontur/react-ui-addons';
7
- import {Kontur, Ofd} from '@skbkontur/logos';
8
- import {MenuItem, ThemeContext, ThemeFactory} from '@skbkontur/react-ui';
9
- import {SideMenu} from './index';
6
+ import { getKonturAvatarUrl } from '@skbkontur/react-ui-addons';
7
+ import { Kontur, Ofd } from '@skbkontur/logos';
8
+ import { MenuItem } from '@skbkontur/react-ui';
9
+ import { SideMenu } from './index';
10
10
  import {
11
11
  DocTextIcon24Regular,
12
12
  CommentRectTextIcon24Regular,
@@ -17,66 +17,61 @@ import {
17
17
  SettingsGearIcon24Regular,
18
18
  } from '@skbkontur/icons';
19
19
 
20
-
21
- const myTheme = ThemeFactory.create({addonsSideMenuHeaderPosition: 'sticky', addonsSideMenuBodyMarginTop: '0px'});
22
-
23
20
  <div style={{height: '600px'}}>
24
- <ThemeContext.Provider value={myTheme}>
25
- <SideMenu>
26
- <SideMenu.Header konturLogo={<Kontur/>} productLogo={<Ofd/>}/>
27
- <SideMenu.Body>
28
- <SideMenu.Item icon={<DocTextIcon24Regular/>} caption={'Документы к подписанию'} marker={'новое'}>
29
- <SideMenu.SubItem caption={'Входящие'}/>
30
- <SideMenu.SubItem caption={'Исходящие'} marker={'2'}>
31
- <SideMenu.SubItem caption={'Исходящие1'}/>
32
- <SideMenu.SubItem caption={'Исходящие2'}/>
33
- </SideMenu.SubItem>
34
- <SideMenu.SubItem caption={'Внутренние'}/>
35
- <SideMenu.SubItem caption={'Черновики'}/>
36
- <SideMenu.SubItem caption={'Удаленные'}/>
37
- <SideMenu.SubItemHeader>Согласованные</SideMenu.SubItemHeader>
38
- <SideMenu.SubItem caption={'Требуют обработки'}/>
39
- <SideMenu.SubItem caption={'Обработанные'}/>
40
- </SideMenu.Item>
41
- <SideMenu.Item caption={'Контрагенты'}/>
42
- <SideMenu.Item icon={<CommentRectTextIcon24Regular/>} caption={'Сообщения'} marker={'5'}>
43
- <SideMenu.SubItem caption={'Входящие'} marker={'5'}/>
44
- <SideMenu.SubItem caption={'Исходящие'}/>
45
- <SideMenu.SubItem caption={'Внутренние'}/>
46
- <SideMenu.SubItem caption={'Черновики'}/>
47
- <SideMenu.SubItem caption={'Удаленные'}/>
48
- </SideMenu.Item>
49
- <SideMenu.Item icon={<LightbulbIcon24Regular/>} caption={'Справочная'}/>
21
+ <SideMenu>
22
+ <SideMenu.Header konturLogo={<Kontur/>} productLogo={<Ofd/>}/>
23
+ <SideMenu.Body>
24
+ <SideMenu.Item icon={<DocTextIcon24Regular/>} caption={'Документы к подписанию'} marker={'новое'}>
25
+ <SideMenu.SubItem caption={'Входящие'}/>
26
+ <SideMenu.SubItem caption={'Исходящие'} marker={'2'}>
27
+ <SideMenu.SubItem caption={'Исходящие1'}/>
28
+ <SideMenu.SubItem caption={'Исходящие2'}/>
29
+ </SideMenu.SubItem>
30
+ <SideMenu.SubItem caption={'Внутренние'}/>
31
+ <SideMenu.SubItem caption={'Черновики'}/>
32
+ <SideMenu.SubItem caption={'Удаленные'}/>
33
+ <SideMenu.SubItemHeader>Согласованные</SideMenu.SubItemHeader>
34
+ <SideMenu.SubItem caption={'Требуют обработки'}/>
35
+ <SideMenu.SubItem caption={'Обработанные'}/>
36
+ </SideMenu.Item>
37
+ <SideMenu.Item caption={'Контрагенты'}/>
38
+ <SideMenu.Item icon={<CommentRectTextIcon24Regular/>} caption={'Сообщения'} marker={'5'}>
39
+ <SideMenu.SubItem caption={'Входящие'} marker={'5'}/>
40
+ <SideMenu.SubItem caption={'Исходящие'}/>
41
+ <SideMenu.SubItem caption={'Внутренние'}/>
42
+ <SideMenu.SubItem caption={'Черновики'}/>
43
+ <SideMenu.SubItem caption={'Удаленные'}/>
44
+ </SideMenu.Item>
45
+ <SideMenu.Item icon={<LightbulbIcon24Regular/>} caption={'Справочная'}/>
46
+ <SideMenu.Divider/>
47
+ <SideMenu.Item icon={<BookOpenTextIcon24Regular/>} caption={'Еще раздел'}/>
48
+ <SideMenu.Item icon={<BookmarkIcon24Regular/>} caption={'Отчетность'}/>
49
+ </SideMenu.Body>
50
+ <SideMenu.Footer>
51
+ <SideMenu.Organisations icon={<StackHDownIcon24Regular/>}>
52
+ <MenuItem>СКБ Контур</MenuItem>
53
+ <MenuItem>Сириус Базинес</MenuItem>
54
+ <MenuItem>Контур НТТ</MenuItem>
55
+ <MenuItem>Промэлектроника</MenuItem>
50
56
  <SideMenu.Divider/>
51
- <SideMenu.Item icon={<BookOpenTextIcon24Regular/>} caption={'Еще раздел'}/>
52
- <SideMenu.Item icon={<BookmarkIcon24Regular/>} caption={'Отчетность'}/>
53
- </SideMenu.Body>
54
- <SideMenu.Footer>
55
- <SideMenu.Organisations icon={<StackHDownIcon24Regular/>}>
56
- <MenuItem>СКБ Контур</MenuItem>
57
- <MenuItem>Сириус Базинес</MenuItem>
58
- <MenuItem>Контур НТТ</MenuItem>
59
- <MenuItem>Промэлектроника</MenuItem>
60
- <SideMenu.Divider/>
61
- <MenuItem>Список организаций</MenuItem>
62
- </SideMenu.Organisations>
63
- <SideMenu.Item icon={<SettingsGearIcon24Regular/>} caption={'Реквизиты и настройки'}/>
64
- <SideMenu.Avatar
65
- userName={'Ишматова Елена'}
66
- avatarUrl={getKonturAvatarUrl({
67
- userId: '992408aa-050e-41e9-9a48-6bf2f2f20d94'
68
- })}
69
- >
70
- <MenuItem href={'https://cabinet.kontur.ru'} target="_blank">
71
- Личный кабинет
72
- </MenuItem>
73
- <MenuItem >Безопасность</MenuItem>
74
- <SideMenu.Divider />
75
- <MenuItem >Выйти</MenuItem>
76
- </SideMenu.Avatar>
77
- </SideMenu.Footer>
78
- </SideMenu>
79
- </ThemeContext.Provider>
57
+ <MenuItem>Список организаций</MenuItem>
58
+ </SideMenu.Organisations>
59
+ <SideMenu.Item icon={<SettingsGearIcon24Regular/>} caption={'Реквизиты и настройки'}/>
60
+ <SideMenu.Avatar
61
+ userName={'Ишматова Елена'}
62
+ avatarUrl={getKonturAvatarUrl({
63
+ userId: '992408aa-050e-41e9-9a48-6bf2f2f20d94'
64
+ })}
65
+ >
66
+ <MenuItem href={'https://cabinet.kontur.ru'} target="_blank">
67
+ Личный кабинет
68
+ </MenuItem>
69
+ <MenuItem >Безопасность</MenuItem>
70
+ <SideMenu.Divider />
71
+ <MenuItem >Выйти</MenuItem>
72
+ </SideMenu.Avatar>
73
+ </SideMenu.Footer>
74
+ </SideMenu>
80
75
  </div>
81
76
  ```
82
77
 
@@ -85,7 +80,7 @@ SideMenu с меню второго уровня в отдельной коло
85
80
  ```jsx harmony
86
81
  import { getKonturAvatarUrl } from '@skbkontur/react-ui-addons';
87
82
  import { Buhgalteria, Kontur } from '@skbkontur/logos';
88
- import { MenuItem, Modal, Input, ThemeContext, ThemeFactory} from '@skbkontur/react-ui';
83
+ import { MenuItem, Modal, Input } from '@skbkontur/react-ui';
89
84
  import { SideMenu } from './index';
90
85
  import {
91
86
  StackHDownIcon24Regular,
@@ -115,77 +110,73 @@ const renderModal = () => {
115
110
  );
116
111
  }
117
112
 
118
- const myTheme = ThemeFactory.create({ addonsSideMenuHeaderPosition: 'sticky', addonsSideMenuBodyMarginTop: '0px' });
119
-
120
- <div style={{height: '600px', width: '100%', background: '#E5E5E5'}}>
121
- <ThemeContext.Provider value={myTheme} >
122
- <SideMenu isSeparatedMenu={true}>
123
- <SideMenu.Header konturLogo={<Kontur/>} productLogo={<Buhgalteria/>}/>
124
- <SideMenu.Body>
125
- <SideMenu.Item caption={'Документы'} marker={'новое'}>
126
- <SideMenu.SubItem caption={'Входящие'} marker={'5'}>
127
- <SideMenu.SubItem caption={'Входящие бла-бла-бла'}>
128
- <SideMenu.SubItem caption={'Входящие11'}>
129
- <SideMenu.SubItem caption={'Входящие111'}/>
130
- <SideMenu.SubItem caption={'Входящие112'}/>
131
- <SideMenu.SubItem caption={'Входящие113'}/>
132
- </SideMenu.SubItem>
133
- <SideMenu.SubItem caption={'Входящие12'}/>
134
- <SideMenu.SubItem caption={'Входящие13'}/>
113
+ <div style={{height: '600px', width: '100%'}}>
114
+ <SideMenu isSeparatedMenu={true}>
115
+ <SideMenu.Header konturLogo={<Kontur/>} productLogo={<Buhgalteria/>}/>
116
+ <SideMenu.Body>
117
+ <SideMenu.Item caption={'Документы'} marker={'новое'}>
118
+ <SideMenu.SubItem caption={'Входящие'} marker={'5'}>
119
+ <SideMenu.SubItem caption={'Входящие бла-бла-бла'}>
120
+ <SideMenu.SubItem caption={'Входящие11'}>
121
+ <SideMenu.SubItem caption={'Входящие111'}/>
122
+ <SideMenu.SubItem caption={'Входящие112'}/>
123
+ <SideMenu.SubItem caption={'Входящие113'}/>
135
124
  </SideMenu.SubItem>
136
- <SideMenu.SubItem caption={'Входящие2'}>
137
- <SideMenu.SubItem caption={'Входящие21'}>
138
- <SideMenu.SubItem caption={'Входящие211'}/>
139
- <SideMenu.SubItem caption={'Входящие212'}/>
140
- <SideMenu.SubItem caption={'Входящие213'}/>
141
- </SideMenu.SubItem>
142
- <SideMenu.SubItem caption={'Входящие22'}/>
143
- <SideMenu.SubItem caption={'Входящие23'}/>
125
+ <SideMenu.SubItem caption={'Входящие12'}/>
126
+ <SideMenu.SubItem caption={'Входящие13'}/>
127
+ </SideMenu.SubItem>
128
+ <SideMenu.SubItem caption={'Входящие2'}>
129
+ <SideMenu.SubItem caption={'Входящие21'}>
130
+ <SideMenu.SubItem caption={'Входящие211'}/>
131
+ <SideMenu.SubItem caption={'Входящие212'}/>
132
+ <SideMenu.SubItem caption={'Входящие213'}/>
144
133
  </SideMenu.SubItem>
145
- <SideMenu.SubItem caption={'Входящие3'}/>
134
+ <SideMenu.SubItem caption={'Входящие22'}/>
135
+ <SideMenu.SubItem caption={'Входящие23'}/>
146
136
  </SideMenu.SubItem>
147
- <SideMenu.SubItem caption={'Исходящие'}/>
148
- <SideMenu.SubItem caption={'Внутренние'}/>
149
- <SideMenu.SubItem caption={'Черновики'}/>
150
- <SideMenu.SubItem caption={'Удаленные'}/>
151
- <SideMenu.SubItemHeader>Согласованные</SideMenu.SubItemHeader>
152
- <SideMenu.SubItem caption={'Требуют обработки'}/>
153
- <SideMenu.SubItem caption={'Обработанные'}/>
154
- </SideMenu.Item>
155
- <SideMenu.Item caption={'Контрагенты'}/>
156
- <SideMenu.Item caption={'Сообщения'} marker={'5'}>
157
- <SideMenu.SubItem caption={'Входящие'} marker={'5'}/>
158
- <SideMenu.SubItem caption={'Исходящие'}/>
159
- <SideMenu.SubItem caption={'Внутренние'}/>
160
- <SideMenu.SubItem caption={'Черновики'}/>
161
- <SideMenu.SubItem caption={'Удаленные'}/>
162
- </SideMenu.Item>
163
- <SideMenu.Item caption={'Справочная'}/>
137
+ <SideMenu.SubItem caption={'Входящие3'}/>
138
+ </SideMenu.SubItem>
139
+ <SideMenu.SubItem caption={'Исходящие'}/>
140
+ <SideMenu.SubItem caption={'Внутренние'}/>
141
+ <SideMenu.SubItem caption={'Черновики'}/>
142
+ <SideMenu.SubItem caption={'Удаленные'}/>
143
+ <SideMenu.SubItemHeader>Согласованные</SideMenu.SubItemHeader>
144
+ <SideMenu.SubItem caption={'Требуют обработки'}/>
145
+ <SideMenu.SubItem caption={'Обработанные'}/>
146
+ </SideMenu.Item>
147
+ <SideMenu.Item caption={'Контрагенты'}/>
148
+ <SideMenu.Item caption={'Сообщения'} marker={'5'}>
149
+ <SideMenu.SubItem caption={'Входящие'} marker={'5'}/>
150
+ <SideMenu.SubItem caption={'Исходящие'}/>
151
+ <SideMenu.SubItem caption={'Внутренние'}/>
152
+ <SideMenu.SubItem caption={'Черновики'}/>
153
+ <SideMenu.SubItem caption={'Удаленные'}/>
154
+ </SideMenu.Item>
155
+ <SideMenu.Item caption={'Справочная'}/>
156
+ <SideMenu.Divider />
157
+ <SideMenu.Item caption={'Еще раздел'}/>
158
+ <SideMenu.Item caption={'Отчетность'}/>
159
+ </SideMenu.Body>
160
+ <SideMenu.Footer>
161
+ <div>
162
+ {opened && renderModal()}
163
+ <SideMenu.Item icon={<StackHDownIcon24Regular/>} caption={'СКБ Контур'} onClick={open}/>
164
+ </div>
165
+ <SideMenu.Item icon={<SettingsGearIcon24Regular/>} caption={'Реквизиты и настройки'}/>
166
+ <SideMenu.Avatar
167
+ userName={'Ишматова Елена'}
168
+ avatarUrl={getKonturAvatarUrl({
169
+ userId: '992408aa-050e-41e9-9a48-6bf2f2f20d94'
170
+ })}
171
+ >
172
+ <MenuItem href={'https://cabinet.kontur.ru'} target="_blank">
173
+ Личный кабинет
174
+ </MenuItem>
175
+ <MenuItem >Безопасность</MenuItem>
164
176
  <SideMenu.Divider />
165
- <SideMenu.Item caption={'Еще раздел'}/>
166
- <SideMenu.Item caption={'Отчетность'}/>
167
- </SideMenu.Body>
168
- <SideMenu.Footer>
169
- <div>
170
- {opened && renderModal()}
171
- <SideMenu.Item icon={<StackHDownIcon24Regular/>} caption={'СКБ Контур'} onClick={open}/>
172
- </div>
173
- <SideMenu.Item icon={<SettingsGearIcon24Regular/>} caption={'Реквизиты и настройки'}/>
174
- <SideMenu.Avatar
175
- userName={'Ишматова Елена'}
176
- avatarUrl={getKonturAvatarUrl({
177
- userId: '992408aa-050e-41e9-9a48-6bf2f2f20d94'
178
- })}
179
- >
180
- <MenuItem href={'https://cabinet.kontur.ru'} target="_blank">
181
- Личный кабинет
182
- </MenuItem>
183
- <MenuItem >Безопасность</MenuItem>
184
- <SideMenu.Divider />
185
- <MenuItem >Выйти</MenuItem>
186
- </SideMenu.Avatar>
187
- </SideMenu.Footer>
188
- </SideMenu>
189
- </ThemeContext.Provider>
177
+ <MenuItem >Выйти</MenuItem>
178
+ </SideMenu.Avatar>
179
+ </SideMenu.Footer>
180
+ </SideMenu>
190
181
  </div>
191
182
  ```
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skbkontur/side-menu",
3
- "version": "0.2.1",
3
+ "version": "0.2.2",
4
4
  "publishConfig": {
5
5
  "access": "public",
6
6
  "registry": "https://registry.npmjs.org/"
@@ -25,7 +25,17 @@ var SeparatedSubMenu = forwardRef(function (_a, ref) {
25
25
  });
26
26
  };
27
27
  return (React.createElement("div", { className: cx((_b = {}, _b[jsStyles.root()] = true, _b[jsStyles.separatedMenu()] = true, _b)), ref: ref },
28
- React.createElement(SideMenuContext.Provider, { value: __assign({ hasSubIcons: hasSubItems(children) }, context) }, children)));
28
+ React.createElement(SideMenuContext.Provider, { value: __assign({ hasSubIcons: hasSubItems(children) }, context) }, React.Children.map(children, function (child) {
29
+ if (React.isValidElement(child)) {
30
+ // @ts-expect-error: accessing private property
31
+ if ((child === null || child === void 0 ? void 0 : child.type.__KONTUR_REACT_UI__) === 'SideMenuSubItemHeader' && !hasSubItems(children)) {
32
+ return React.cloneElement(child, {
33
+ className: jsStyles.subItemHeaderWithoutIcons(),
34
+ });
35
+ }
36
+ return child;
37
+ }
38
+ }))));
29
39
  });
30
40
  SeparatedSubMenu.displayName = 'SeparatedSubMenu';
31
41
  var SeparatedSubMenuWithStaticFields = Object.assign(SeparatedSubMenu, { __KONTUR_REACT_UI__: 'SeparatedSubMenu' });
@@ -49,6 +49,7 @@ export declare const jsStyles: {
49
49
  textAndMarkerWrapper(): string;
50
50
  markerMultiline(): string;
51
51
  subItemHeader(): string;
52
+ subItemHeaderWithoutIcons(): string;
52
53
  separatedMenu(): string;
53
54
  dropdownWrapper(): string;
54
55
  dropdownLabel(): string;
@@ -142,26 +142,29 @@ var styles = {
142
142
  subItemHeader: function () {
143
143
  return css(templateObject_47 || (templateObject_47 = __makeTemplateObject(["\n font-size: 12px;\n color: rgba(0, 0, 0, 0.48);\n padding: 10px 8px 2px 40px;\n margin: 0;\n "], ["\n font-size: 12px;\n color: rgba(0, 0, 0, 0.48);\n padding: 10px 8px 2px 40px;\n margin: 0;\n "])));
144
144
  },
145
+ subItemHeaderWithoutIcons: function () {
146
+ return css(templateObject_48 || (templateObject_48 = __makeTemplateObject(["\n padding-left: 8px;\n "], ["\n padding-left: 8px;\n "])));
147
+ },
145
148
  separatedMenu: function () {
146
- return css(templateObject_48 || (templateObject_48 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n background: #fff;\n left: 100%;\n overflow: auto;\n justify-content: flex-start;\n padding-top: 24px;\n "], ["\n position: absolute;\n top: 0;\n background: #fff;\n left: 100%;\n overflow: auto;\n justify-content: flex-start;\n padding-top: 24px;\n "])));
149
+ return css(templateObject_49 || (templateObject_49 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n z-index: 8000;\n background: #fff;\n left: 100%;\n overflow: auto;\n justify-content: flex-start;\n padding-top: 24px;\n border-right: 1px solid #e5e5e5;\n "], ["\n position: absolute;\n top: 0;\n z-index: 8000;\n background: #fff;\n left: 100%;\n overflow: auto;\n justify-content: flex-start;\n padding-top: 24px;\n border-right: 1px solid #e5e5e5;\n "])));
147
150
  },
148
151
  dropdownWrapper: function () {
149
- return css(templateObject_49 || (templateObject_49 = __makeTemplateObject(["\n overflow-x: hidden;\n "], ["\n overflow-x: hidden;\n "])));
152
+ return css(templateObject_50 || (templateObject_50 = __makeTemplateObject(["\n overflow-x: hidden;\n "], ["\n overflow-x: hidden;\n "])));
150
153
  },
151
154
  dropdownLabel: function () {
152
- return css(templateObject_50 || (templateObject_50 = __makeTemplateObject(["\n width: 200px;\n "], ["\n width: 200px;\n "])));
155
+ return css(templateObject_51 || (templateObject_51 = __makeTemplateObject(["\n width: 200px;\n "], ["\n width: 200px;\n "])));
153
156
  },
154
157
  subItemMenu: function () {
155
- return css(templateObject_51 || (templateObject_51 = __makeTemplateObject(["\n padding-left: 16px;\n "], ["\n padding-left: 16px;\n "])));
158
+ return css(templateObject_52 || (templateObject_52 = __makeTemplateObject(["\n padding-left: 16px;\n "], ["\n padding-left: 16px;\n "])));
156
159
  },
157
160
  rightBorder: function () {
158
- return css(templateObject_52 || (templateObject_52 = __makeTemplateObject(["\n position: absolute;\n width: 20px;\n height: 100%;\n right: -10px;\n background: transparent;\n "], ["\n position: absolute;\n width: 20px;\n height: 100%;\n right: -10px;\n background: transparent;\n "])));
161
+ return css(templateObject_53 || (templateObject_53 = __makeTemplateObject(["\n position: absolute;\n width: 20px;\n height: 100%;\n right: -10px;\n background: transparent;\n "], ["\n position: absolute;\n width: 20px;\n height: 100%;\n right: -10px;\n background: transparent;\n "])));
159
162
  },
160
163
  };
161
164
  export var customStyles = {
162
165
  rightBorderHovered: function (color) {
163
- return css(templateObject_53 || (templateObject_53 = __makeTemplateObject(["\n position: absolute;\n width: 2px;\n background: ", ";\n height: 100%;\n left: 9px;\n "], ["\n position: absolute;\n width: 2px;\n background: ", ";\n height: 100%;\n left: 9px;\n "])), color);
166
+ return css(templateObject_54 || (templateObject_54 = __makeTemplateObject(["\n position: absolute;\n width: 2px;\n background: ", ";\n height: 100%;\n left: 9px;\n "], ["\n position: absolute;\n width: 2px;\n background: ", ";\n height: 100%;\n left: 9px;\n "])), color);
164
167
  },
165
168
  };
166
169
  export var jsStyles = memoizeStyle(styles);
167
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46, templateObject_47, templateObject_48, templateObject_49, templateObject_50, templateObject_51, templateObject_52, templateObject_53;
170
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46, templateObject_47, templateObject_48, templateObject_49, templateObject_50, templateObject_51, templateObject_52, templateObject_53, templateObject_54;