@salutejs/plasma-new-hope 0.78.0-canary.1201.8969250152.0 → 0.78.0-canary.1201.8985207823.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (138) hide show
  1. package/cjs/components/Combobox/Combobox.css +3 -0
  2. package/cjs/components/Combobox/ui/ComboboxDivider/ComboboxDivider.css +3 -0
  3. package/cjs/components/Combobox/ui/ComboboxFooter/ComboboxFooter.css +3 -0
  4. package/cjs/components/Combobox/ui/ComboboxGroup/ComboboxGroup.css +3 -0
  5. package/cjs/components/Combobox/ui/ComboboxHeader/ComboboxHeader.css +3 -0
  6. package/cjs/components/Dropdown/Dropdown.css +3 -0
  7. package/cjs/components/Dropdown/Dropdown.js +5 -2
  8. package/cjs/components/Dropdown/Dropdown.js.map +1 -1
  9. package/cjs/components/Dropdown/hooks/useHashMaps.js +2 -2
  10. package/cjs/components/Dropdown/hooks/useHashMaps.js.map +1 -1
  11. package/cjs/components/Dropdown/hooks/useKeyboardNavigation.js +185 -162
  12. package/cjs/components/Dropdown/hooks/useKeyboardNavigation.js.map +1 -1
  13. package/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js +4 -1
  14. package/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js.map +1 -1
  15. package/cjs/components/Dropdown/ui/DropdownOld/Dropdown.styles.js +29 -0
  16. package/cjs/components/Dropdown/ui/DropdownOld/Dropdown.styles.js.map +1 -0
  17. package/cjs/components/Dropdown/ui/DropdownOld/Dropdown.styles_3w3l45.css +2 -0
  18. package/cjs/components/Dropdown/ui/DropdownOld/DropdownOld.css +7 -0
  19. package/cjs/components/Dropdown/ui/DropdownOld/DropdownOld.js +99 -0
  20. package/cjs/components/Dropdown/ui/DropdownOld/DropdownOld.js.map +1 -0
  21. package/cjs/components/Dropdown/ui/DropdownOld/DropdownOld.tokens.js +115 -0
  22. package/cjs/components/Dropdown/ui/DropdownOld/DropdownOld.tokens.js.map +1 -0
  23. package/cjs/components/Dropdown/ui/DropdownOld/utils/index.js +23 -0
  24. package/cjs/components/Dropdown/ui/DropdownOld/utils/index.js.map +1 -0
  25. package/cjs/components/Dropdown/ui/DropdownOld/variations/_size/base.js +9 -0
  26. package/cjs/components/Dropdown/ui/DropdownOld/variations/_size/base.js.map +1 -0
  27. package/cjs/components/Dropdown/ui/DropdownOld/variations/_size/base_x642ct.css +1 -0
  28. package/cjs/components/Dropdown/ui/DropdownOld/variations/_view/base.js +9 -0
  29. package/cjs/components/Dropdown/ui/DropdownOld/variations/_view/base.js.map +1 -0
  30. package/cjs/components/Dropdown/ui/DropdownOld/variations/_view/base_x642ct.css +1 -0
  31. package/cjs/components/Pagination/Pagination.css +3 -0
  32. package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +3 -0
  33. package/cjs/components/Select/Select.css +3 -0
  34. package/cjs/components/Select/ui/SelectDivider/SelectDivider.css +3 -0
  35. package/cjs/components/Select/ui/SelectFooter/SelectFooter.css +3 -0
  36. package/cjs/components/Select/ui/SelectGroup/SelectGroup.css +3 -0
  37. package/cjs/components/Select/ui/SelectHeader/SelectHeader.css +3 -0
  38. package/cjs/components/Select/ui/SelectItem/SelectItem.css +3 -0
  39. package/cjs/index.css +3 -0
  40. package/cjs/index.js +5 -0
  41. package/cjs/index.js.map +1 -1
  42. package/es/components/Combobox/Combobox.css +3 -0
  43. package/es/components/Combobox/ui/ComboboxDivider/ComboboxDivider.css +3 -0
  44. package/es/components/Combobox/ui/ComboboxFooter/ComboboxFooter.css +3 -0
  45. package/es/components/Combobox/ui/ComboboxGroup/ComboboxGroup.css +3 -0
  46. package/es/components/Combobox/ui/ComboboxHeader/ComboboxHeader.css +3 -0
  47. package/es/components/Dropdown/Dropdown.css +3 -0
  48. package/es/components/Dropdown/Dropdown.js +5 -2
  49. package/es/components/Dropdown/Dropdown.js.map +1 -1
  50. package/es/components/Dropdown/hooks/useHashMaps.js +2 -2
  51. package/es/components/Dropdown/hooks/useHashMaps.js.map +1 -1
  52. package/es/components/Dropdown/hooks/useKeyboardNavigation.js +185 -162
  53. package/es/components/Dropdown/hooks/useKeyboardNavigation.js.map +1 -1
  54. package/es/components/Dropdown/ui/DropdownInner/DropdownInner.js +4 -1
  55. package/es/components/Dropdown/ui/DropdownInner/DropdownInner.js.map +1 -1
  56. package/es/components/Dropdown/ui/DropdownOld/Dropdown.styles.js +24 -0
  57. package/es/components/Dropdown/ui/DropdownOld/Dropdown.styles.js.map +1 -0
  58. package/es/components/Dropdown/ui/DropdownOld/Dropdown.styles_3w3l45.css +2 -0
  59. package/es/components/Dropdown/ui/DropdownOld/DropdownOld.css +7 -0
  60. package/es/components/Dropdown/ui/DropdownOld/DropdownOld.js +94 -0
  61. package/es/components/Dropdown/ui/DropdownOld/DropdownOld.js.map +1 -0
  62. package/es/components/Dropdown/ui/DropdownOld/DropdownOld.tokens.js +111 -0
  63. package/es/components/Dropdown/ui/DropdownOld/DropdownOld.tokens.js.map +1 -0
  64. package/es/components/Dropdown/ui/DropdownOld/utils/index.js +18 -0
  65. package/es/components/Dropdown/ui/DropdownOld/utils/index.js.map +1 -0
  66. package/es/components/Dropdown/ui/DropdownOld/variations/_size/base.js +5 -0
  67. package/es/components/Dropdown/ui/DropdownOld/variations/_size/base.js.map +1 -0
  68. package/es/components/Dropdown/ui/DropdownOld/variations/_size/base_x642ct.css +1 -0
  69. package/es/components/Dropdown/ui/DropdownOld/variations/_view/base.js +5 -0
  70. package/es/components/Dropdown/ui/DropdownOld/variations/_view/base.js.map +1 -0
  71. package/es/components/Dropdown/ui/DropdownOld/variations/_view/base_x642ct.css +1 -0
  72. package/es/components/Pagination/Pagination.css +3 -0
  73. package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +3 -0
  74. package/es/components/Select/Select.css +3 -0
  75. package/es/components/Select/ui/SelectDivider/SelectDivider.css +3 -0
  76. package/es/components/Select/ui/SelectFooter/SelectFooter.css +3 -0
  77. package/es/components/Select/ui/SelectGroup/SelectGroup.css +3 -0
  78. package/es/components/Select/ui/SelectHeader/SelectHeader.css +3 -0
  79. package/es/components/Select/ui/SelectItem/SelectItem.css +3 -0
  80. package/es/index.css +3 -0
  81. package/es/index.js +2 -0
  82. package/es/index.js.map +1 -1
  83. package/package.json +2 -2
  84. package/styled-components/cjs/components/Dropdown/Dropdown.js +2 -2
  85. package/styled-components/cjs/components/Dropdown/hooks/useHashMaps.js +2 -2
  86. package/styled-components/cjs/components/Dropdown/hooks/useKeyboardNavigation.js +189 -162
  87. package/styled-components/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js +1 -1
  88. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/Dropdown.styles.js +19 -0
  89. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/Dropdown.types.js +5 -0
  90. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/DropdownOld.js +101 -0
  91. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/DropdownOld.tokens.js +118 -0
  92. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/utils/index.js +21 -0
  93. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/variations/_size/base.js +8 -0
  94. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/variations/_size/tokens.json +1 -0
  95. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/variations/_view/base.js +8 -0
  96. package/styled-components/cjs/components/Dropdown/ui/DropdownOld/variations/_view/tokens.json +1 -0
  97. package/styled-components/cjs/components/Dropdown/ui/index.js +21 -1
  98. package/styled-components/cjs/examples/plasma_web/components/Dropdown/Dropdown.config.js +25 -0
  99. package/styled-components/cjs/examples/plasma_web/components/Dropdown/Dropdown.js +11 -0
  100. package/styled-components/cjs/examples/plasma_web/components/Dropdown/Dropdown.stories.tsx +292 -0
  101. package/styled-components/es/components/Dropdown/Dropdown.js +2 -2
  102. package/styled-components/es/components/Dropdown/hooks/useHashMaps.js +2 -2
  103. package/styled-components/es/components/Dropdown/hooks/useKeyboardNavigation.js +189 -162
  104. package/styled-components/es/components/Dropdown/ui/DropdownInner/DropdownInner.js +1 -1
  105. package/styled-components/es/components/Dropdown/ui/DropdownOld/Dropdown.styles.js +13 -0
  106. package/styled-components/es/components/Dropdown/ui/DropdownOld/Dropdown.types.js +1 -0
  107. package/styled-components/es/components/Dropdown/ui/DropdownOld/DropdownOld.js +92 -0
  108. package/styled-components/es/components/Dropdown/ui/DropdownOld/DropdownOld.tokens.js +112 -0
  109. package/styled-components/es/components/Dropdown/ui/DropdownOld/utils/index.js +15 -0
  110. package/styled-components/es/components/Dropdown/ui/DropdownOld/variations/_size/base.js +2 -0
  111. package/styled-components/es/components/Dropdown/ui/DropdownOld/variations/_size/tokens.json +1 -0
  112. package/styled-components/es/components/Dropdown/ui/DropdownOld/variations/_view/base.js +2 -0
  113. package/styled-components/es/components/Dropdown/ui/DropdownOld/variations/_view/tokens.json +1 -0
  114. package/styled-components/es/components/Dropdown/ui/index.js +3 -1
  115. package/styled-components/es/examples/plasma_web/components/Dropdown/Dropdown.config.js +19 -0
  116. package/styled-components/es/examples/plasma_web/components/Dropdown/Dropdown.js +5 -0
  117. package/styled-components/es/examples/plasma_web/components/Dropdown/Dropdown.stories.tsx +292 -0
  118. package/types/components/Dropdown/hooks/useKeyboardNavigation.d.ts.map +1 -1
  119. package/types/components/Dropdown/ui/DropdownOld/Dropdown.styles.d.ts +8 -0
  120. package/types/components/Dropdown/ui/DropdownOld/Dropdown.styles.d.ts.map +1 -0
  121. package/types/components/Dropdown/ui/DropdownOld/Dropdown.types.d.ts +76 -0
  122. package/types/components/Dropdown/ui/DropdownOld/Dropdown.types.d.ts.map +1 -0
  123. package/types/components/Dropdown/ui/DropdownOld/DropdownOld.d.ts +26 -0
  124. package/types/components/Dropdown/ui/DropdownOld/DropdownOld.d.ts.map +1 -0
  125. package/types/components/Dropdown/ui/DropdownOld/DropdownOld.tokens.d.ts +113 -0
  126. package/types/components/Dropdown/ui/DropdownOld/DropdownOld.tokens.d.ts.map +1 -0
  127. package/types/components/Dropdown/ui/DropdownOld/utils/index.d.ts +4 -0
  128. package/types/components/Dropdown/ui/DropdownOld/utils/index.d.ts.map +1 -0
  129. package/types/components/Dropdown/ui/DropdownOld/variations/_size/base.d.ts +2 -0
  130. package/types/components/Dropdown/ui/DropdownOld/variations/_size/base.d.ts.map +1 -0
  131. package/types/components/Dropdown/ui/DropdownOld/variations/_view/base.d.ts +2 -0
  132. package/types/components/Dropdown/ui/DropdownOld/variations/_view/base.d.ts.map +1 -0
  133. package/types/components/Dropdown/ui/index.d.ts +2 -0
  134. package/types/components/Dropdown/ui/index.d.ts.map +1 -1
  135. package/types/examples/plasma_web/components/Dropdown/Dropdown.config.d.ts +18 -0
  136. package/types/examples/plasma_web/components/Dropdown/Dropdown.config.d.ts.map +1 -0
  137. package/types/examples/plasma_web/components/Dropdown/Dropdown.d.ts +13 -0
  138. package/types/examples/plasma_web/components/Dropdown/Dropdown.d.ts.map +1 -0
@@ -33,180 +33,207 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
33
33
  var currentLength = pathMap.get(path === null || path === void 0 ? void 0 : path[path.length - 1]) || 0;
34
34
  var currentIndex = (focusedPath === null || focusedPath === void 0 ? void 0 : focusedPath[focusedPath.length - 1]) || 0;
35
35
  var onKeyDown = function onKeyDown(event) {
36
- var code = event.code;
37
- if (code === keys.ArrowUp) {
38
- if (focusedPath.length) {
39
- if (currentIndex <= 0) {
40
- return;
41
- }
42
- dispatchFocusedPath({
43
- type: 'change_last_focus',
44
- value: currentIndex - 1
45
- });
46
- } else {
47
- dispatchPath({
48
- type: 'opened_first_level'
49
- });
50
- dispatchFocusedPath({
51
- type: 'set_initial_focus'
52
- });
53
- handleGlobalToggle(true, event);
54
- }
55
- }
56
- if (code === keys.ArrowDown) {
57
- if (focusedPath.length) {
58
- if (currentIndex + 1 >= currentLength) {
59
- return;
60
- }
61
- dispatchFocusedPath({
62
- type: 'change_last_focus',
63
- value: currentIndex + 1
64
- });
65
- } else {
66
- dispatchPath({
67
- type: 'opened_first_level'
68
- });
69
- dispatchFocusedPath({
70
- type: 'set_initial_focus'
71
- });
72
- handleGlobalToggle(true, event);
73
- }
74
- }
75
- if (code === keys.ArrowLeft) {
76
- if (focusedPath.length) {
77
- dispatchPath({
78
- type: 'removed_last_level'
79
- });
80
- dispatchFocusedPath({
81
- type: 'return_prev_focus'
82
- });
83
- }
84
- if (focusedPath.length === 1) {
85
- handleGlobalToggle(false, event);
86
- }
87
- }
88
- if (code === keys.ArrowRight) {
89
- if (focusedPath.length) {
90
- var currentItem = getFurtherPath(focusedPath, focusedToValueMap);
91
- if (currentItem !== null && currentItem !== void 0 && currentItem.items) {
92
- dispatchPath({
93
- type: 'added_next_level',
94
- value: currentItem.value.toString()
95
- });
96
- dispatchFocusedPath({
97
- type: 'add_focus',
98
- value: 0
99
- });
36
+ switch (event.code) {
37
+ case keys.ArrowUp:
38
+ {
39
+ if (focusedPath.length) {
40
+ if (currentIndex > 0) {
41
+ dispatchFocusedPath({
42
+ type: 'change_last_focus',
43
+ value: currentIndex - 1
44
+ });
45
+ }
46
+ } else {
47
+ dispatchPath({
48
+ type: 'opened_first_level'
49
+ });
50
+ dispatchFocusedPath({
51
+ type: 'set_initial_focus'
52
+ });
53
+ handleGlobalToggle(true, event);
54
+ }
55
+ break;
100
56
  }
101
- }
102
- }
103
- if (code === keys.Enter || code === keys.Space) {
104
- event.preventDefault();
105
- if (path[0]) {
106
- var _currentItem = getFurtherPath(focusedPath, focusedToValueMap);
107
- if (_currentItem !== null && _currentItem !== void 0 && _currentItem.disabled || _currentItem !== null && _currentItem !== void 0 && _currentItem.isDisabled) {
108
- return;
57
+ case keys.ArrowDown:
58
+ {
59
+ if (focusedPath.length) {
60
+ if (currentIndex + 1 < currentLength) {
61
+ dispatchFocusedPath({
62
+ type: 'change_last_focus',
63
+ value: currentIndex + 1
64
+ });
65
+ }
66
+ } else {
67
+ dispatchPath({
68
+ type: 'opened_first_level'
69
+ });
70
+ dispatchFocusedPath({
71
+ type: 'set_initial_focus'
72
+ });
73
+ handleGlobalToggle(true, event);
74
+ }
75
+ break;
109
76
  }
110
- if (_currentItem !== null && _currentItem !== void 0 && _currentItem.items) {
111
- dispatchPath({
112
- type: 'added_next_level',
113
- value: _currentItem.value.toString()
114
- });
115
- dispatchFocusedPath({
116
- type: 'add_focus',
117
- value: 0
118
- });
119
- } else {
120
- if (closeOnSelect) {
77
+ case keys.ArrowLeft:
78
+ {
79
+ if (focusedPath.length) {
80
+ dispatchPath({
81
+ type: 'removed_last_level'
82
+ });
83
+ dispatchFocusedPath({
84
+ type: 'return_prev_focus'
85
+ });
86
+ }
87
+ if (focusedPath.length === 1) {
121
88
  handleGlobalToggle(false, event);
122
89
  }
123
- if (onItemSelect && _currentItem) {
124
- onItemSelect(_currentItem, event);
90
+ break;
91
+ }
92
+ case keys.ArrowRight:
93
+ {
94
+ if (focusedPath.length) {
95
+ var currentItem = getFurtherPath(focusedPath, focusedToValueMap);
96
+ if (currentItem !== null && currentItem !== void 0 && currentItem.items) {
97
+ dispatchPath({
98
+ type: 'added_next_level',
99
+ value: currentItem.value.toString()
100
+ });
101
+ dispatchFocusedPath({
102
+ type: 'add_focus',
103
+ value: 0
104
+ });
105
+ }
125
106
  }
126
- if (onItemClick && _currentItem) {
127
- onItemClick(_currentItem, event);
107
+ break;
108
+ }
109
+ case keys.Enter:
110
+ case keys.Space:
111
+ {
112
+ event.preventDefault();
113
+ if (path[0]) {
114
+ var _currentItem = getFurtherPath(focusedPath, focusedToValueMap);
115
+ if (_currentItem !== null && _currentItem !== void 0 && _currentItem.disabled || _currentItem !== null && _currentItem !== void 0 && _currentItem.isDisabled) {
116
+ break;
117
+ }
118
+ if (_currentItem !== null && _currentItem !== void 0 && _currentItem.items) {
119
+ dispatchPath({
120
+ type: 'added_next_level',
121
+ value: _currentItem.value.toString()
122
+ });
123
+ dispatchFocusedPath({
124
+ type: 'add_focus',
125
+ value: 0
126
+ });
127
+ } else {
128
+ if (closeOnSelect) {
129
+ handleGlobalToggle(false, event);
130
+ }
131
+ if (onItemSelect && _currentItem) {
132
+ onItemSelect(_currentItem, event);
133
+ }
134
+ if (onItemClick && _currentItem) {
135
+ onItemClick(_currentItem, event);
136
+ }
137
+ }
138
+ } else {
139
+ dispatchPath({
140
+ type: 'opened_first_level'
141
+ });
142
+ dispatchFocusedPath({
143
+ type: 'set_initial_focus'
144
+ });
128
145
  }
146
+ break;
129
147
  }
130
- } else {
131
- dispatchPath({
132
- type: 'opened_first_level'
133
- });
134
- dispatchFocusedPath({
135
- type: 'set_initial_focus'
136
- });
137
- }
138
- }
139
- if (code === keys.Tab || code === keys.Escape) {
140
- dispatchFocusedPath({
141
- type: 'reset'
142
- });
143
- dispatchPath({
144
- type: 'reset'
145
- });
146
- handleGlobalToggle(false, event);
147
- }
148
- if (code === keys.Home) {
149
- if (path[0]) {
150
- dispatchFocusedPath({
151
- type: 'change_last_focus',
152
- value: 0
153
- });
154
- } else {
155
- dispatchPath({
156
- type: 'opened_first_level'
157
- });
158
- dispatchFocusedPath({
159
- type: 'set_initial_focus'
160
- });
161
- handleGlobalToggle(true, event);
162
- }
163
- }
164
- if (code === keys.End) {
165
- if (path[0]) {
166
- dispatchFocusedPath({
167
- type: 'change_last_focus',
168
- value: currentLength - 1
169
- });
170
- } else {
171
- dispatchPath({
172
- type: 'opened_first_level'
173
- });
174
- dispatchFocusedPath({
175
- type: 'change_last_focus',
176
- value: (pathMap.get('root') || 0) - 1
177
- });
178
- handleGlobalToggle(true, event);
179
- }
180
- }
181
- if (code === keys.PageUp) {
182
- if (path[0]) {
183
- if (currentIndex <= JUMP_SIZE) {
148
+ case keys.Tab:
149
+ case keys.Escape:
150
+ {
184
151
  dispatchFocusedPath({
185
- type: 'change_last_focus',
186
- value: 0
152
+ type: 'reset'
187
153
  });
188
- } else {
189
- dispatchFocusedPath({
190
- type: 'change_last_focus',
191
- value: currentIndex - JUMP_SIZE
154
+ dispatchPath({
155
+ type: 'reset'
192
156
  });
157
+ handleGlobalToggle(false, event);
158
+ break;
193
159
  }
194
- }
195
- }
196
- if (code === keys.PageDown) {
197
- if (path[0]) {
198
- if (currentLength - currentIndex <= JUMP_SIZE) {
199
- dispatchFocusedPath({
200
- type: 'change_last_focus',
201
- value: currentLength - 1
202
- });
203
- } else {
204
- dispatchFocusedPath({
205
- type: 'change_last_focus',
206
- value: currentIndex + JUMP_SIZE
207
- });
160
+ case keys.Home:
161
+ {
162
+ if (path[0]) {
163
+ dispatchFocusedPath({
164
+ type: 'change_last_focus',
165
+ value: 0
166
+ });
167
+ } else {
168
+ dispatchPath({
169
+ type: 'opened_first_level'
170
+ });
171
+ dispatchFocusedPath({
172
+ type: 'set_initial_focus'
173
+ });
174
+ handleGlobalToggle(true, event);
175
+ }
176
+ break;
177
+ }
178
+ case keys.End:
179
+ {
180
+ if (path[0]) {
181
+ dispatchFocusedPath({
182
+ type: 'change_last_focus',
183
+ value: currentLength - 1
184
+ });
185
+ } else {
186
+ dispatchPath({
187
+ type: 'opened_first_level'
188
+ });
189
+ dispatchFocusedPath({
190
+ type: 'change_last_focus',
191
+ value: (pathMap.get('root') || 0) - 1
192
+ });
193
+ handleGlobalToggle(true, event);
194
+ }
195
+ break;
196
+ }
197
+ case keys.PageUp:
198
+ {
199
+ if (!path[0]) {
200
+ break;
201
+ }
202
+ if (currentIndex <= JUMP_SIZE) {
203
+ dispatchFocusedPath({
204
+ type: 'change_last_focus',
205
+ value: 0
206
+ });
207
+ } else {
208
+ dispatchFocusedPath({
209
+ type: 'change_last_focus',
210
+ value: currentIndex - JUMP_SIZE
211
+ });
212
+ }
213
+ break;
214
+ }
215
+ case keys.PageDown:
216
+ {
217
+ if (!path[0]) {
218
+ break;
219
+ }
220
+ if (currentLength - currentIndex <= JUMP_SIZE) {
221
+ dispatchFocusedPath({
222
+ type: 'change_last_focus',
223
+ value: currentLength - 1
224
+ });
225
+ } else {
226
+ dispatchFocusedPath({
227
+ type: 'change_last_focus',
228
+ value: currentIndex + JUMP_SIZE
229
+ });
230
+ }
231
+ break;
232
+ }
233
+ default:
234
+ {
235
+ break;
208
236
  }
209
- }
210
237
  }
211
238
  };
212
239
  return {
@@ -35,7 +35,7 @@ var DropdownInner = function DropdownInner(_ref) {
35
35
  }
36
36
  };
37
37
  var isCurrentListOpen = path[currentLevel + 1] === item.value.toString();
38
- var listId = "listbox".concat(currentLevel + 2);
38
+ var listId = "tree_level_".concat(currentLevel + 2);
39
39
  var nextLevel = currentLevel + 1;
40
40
  if (item !== null && item !== void 0 && item.items) {
41
41
  return /*#__PURE__*/React.createElement(StyledPopover, {
@@ -0,0 +1,13 @@
1
+ import styled from 'styled-components';
2
+ import { component } from '../../../../engines';
3
+ import { popoverConfig, popoverClasses } from '../../../Popover';
4
+ import { tokens } from './DropdownOld.tokens';
5
+
6
+ // issue #823
7
+ var Popover = /*#__PURE__*/component(popoverConfig);
8
+ export var StyledPopover = /*#__PURE__*/styled(Popover).withConfig({
9
+ componentId: "plasma-new-hope__sc-10adsb5-0"
10
+ })([".", "{display:block;}"], /*#__PURE__*/String(popoverClasses.target));
11
+ export var StyledDropdown = /*#__PURE__*/styled.div.withConfig({
12
+ componentId: "plasma-new-hope__sc-10adsb5-1"
13
+ })(["box-sizing:border-box;background:var(", ");box-shadow:var(", ");border-radius:var(", ");width:var(", ");height:var(", ");padding:var(", ") var(", ") var(", ") var(", ");"], tokens.background, tokens.boxShadow, tokens.borderRadius, tokens.width, tokens.height, tokens.paddingTop, tokens.paddingRight, tokens.paddingBottom, tokens.paddingLeft);
@@ -0,0 +1,92 @@
1
+ var _excluded = ["id", "target", "children", "hasArrow", "role", "view", "size", "frame", "onToggle", "isFocusTrapped", "isOpen", "placement", "trigger", "offset", "preventOverflow", "closeOnOverlayClick", "closeOnEsc"];
2
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
3
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
4
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
5
+ import React, { forwardRef, useRef } from 'react';
6
+ import { useFocusTrap, useForkRef, useUniqId } from '@salutejs/plasma-core';
7
+ import { base as viewCSS } from './variations/_view/base';
8
+ import { base as sizeCSS } from './variations/_size/base';
9
+ import { StyledDropdown, StyledPopover } from './Dropdown.styles';
10
+ import { getPlacements } from './utils';
11
+ /**
12
+ * Выпадающий список без внешнего контроля видимости.
13
+ */
14
+ export var dropdownOldRoot = function dropdownOldRoot(Root) {
15
+ return /*#__PURE__*/forwardRef(function (_ref, outerRootRef) {
16
+ var id = _ref.id,
17
+ target = _ref.target,
18
+ children = _ref.children,
19
+ hasArrow = _ref.hasArrow,
20
+ role = _ref.role,
21
+ view = _ref.view,
22
+ size = _ref.size,
23
+ frame = _ref.frame,
24
+ _onToggle = _ref.onToggle,
25
+ _ref$isFocusTrapped = _ref.isFocusTrapped,
26
+ isFocusTrapped = _ref$isFocusTrapped === void 0 ? true : _ref$isFocusTrapped,
27
+ _ref$isOpen = _ref.isOpen,
28
+ isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
29
+ _ref$placement = _ref.placement,
30
+ placement = _ref$placement === void 0 ? 'auto' : _ref$placement,
31
+ _ref$trigger = _ref.trigger,
32
+ trigger = _ref$trigger === void 0 ? 'click' : _ref$trigger,
33
+ _ref$offset = _ref.offset,
34
+ offset = _ref$offset === void 0 ? [0, 6] : _ref$offset,
35
+ _ref$preventOverflow = _ref.preventOverflow,
36
+ preventOverflow = _ref$preventOverflow === void 0 ? false : _ref$preventOverflow,
37
+ _ref$closeOnOverlayCl = _ref.closeOnOverlayClick,
38
+ closeOnOverlayClick = _ref$closeOnOverlayCl === void 0 ? false : _ref$closeOnOverlayCl,
39
+ _ref$closeOnEsc = _ref.closeOnEsc,
40
+ closeOnEsc = _ref$closeOnEsc === void 0 ? false : _ref$closeOnEsc,
41
+ rest = _objectWithoutProperties(_ref, _excluded);
42
+ var uniqId = useUniqId();
43
+ var innerId = id || uniqId;
44
+ var rootRef = useRef(null);
45
+ var dropdownRef = useRef(null);
46
+ var handleRef = useForkRef(rootRef, outerRootRef);
47
+ var trapRef = useFocusTrap(isOpen && isFocusTrapped);
48
+ var dropdownForkRef = useForkRef(dropdownRef, trapRef);
49
+ return /*#__PURE__*/React.createElement(StyledPopover, {
50
+ role: role,
51
+ isOpen: isOpen,
52
+ usePortal: false,
53
+ onToggle: function onToggle(is, event) {
54
+ return _onToggle === null || _onToggle === void 0 ? void 0 : _onToggle(is, event);
55
+ },
56
+ id: innerId,
57
+ ref: dropdownForkRef,
58
+ target: target,
59
+ offset: offset,
60
+ preventOverflow: preventOverflow,
61
+ hasArrow: hasArrow,
62
+ placement: getPlacements(placement),
63
+ trigger: trigger,
64
+ closeOnOverlayClick: closeOnOverlayClick,
65
+ closeOnEsc: closeOnEsc,
66
+ isFocusTrapped: isFocusTrapped,
67
+ frame: frame
68
+ }, /*#__PURE__*/React.createElement(Root, _extends({
69
+ ref: handleRef,
70
+ view: view,
71
+ size: size
72
+ }, rest), /*#__PURE__*/React.createElement(StyledDropdown, null, children)));
73
+ });
74
+ };
75
+ export var dropdownOldConfig = {
76
+ name: 'Dropdown',
77
+ tag: 'div',
78
+ layout: dropdownOldRoot,
79
+ base: '',
80
+ variations: {
81
+ view: {
82
+ css: viewCSS
83
+ },
84
+ size: {
85
+ css: sizeCSS
86
+ }
87
+ },
88
+ defaults: {
89
+ view: 'default',
90
+ size: 'm'
91
+ }
92
+ };
@@ -0,0 +1,112 @@
1
+ export var classes = {
2
+ dropdownItemIsSelected: 'dropdown-item-is-selected',
3
+ dropdownItemIsDisabled: 'dropdown-item-is-disabled'
4
+ };
5
+ export var tokens = {
6
+ background: '--plasma-dropdown-background',
7
+ boxShadow: '--plasma-dropdown-box-shadow',
8
+ width: '--plasma-dropdown-width',
9
+ height: '--plasma-dropdown-height',
10
+ borderRadius: '--plasma-dropdown-border-radius',
11
+ paddingTop: '--plasma-dropdown-padding-top',
12
+ paddingRight: '--plasma-dropdown-padding-right',
13
+ paddingBottom: '--plasma-dropdown-padding-bottom',
14
+ paddingLeft: '--plasma-dropdown-padding-left',
15
+ itemBackground: '--plasma-dropdown-item-background',
16
+ itemColor: '--plasma-dropdown-item-color',
17
+ itemBackgroundHover: '--plasma-dropdown-item-background-hover',
18
+ itemBackgroundSelected: '--plasma-dropdown-item-background-selected',
19
+ itemColorSelected: '--plasma-dropdown-item-color-selected',
20
+ itemBackgroundSelectedHover: '--plasma-dropdown-item-background-selected-hover',
21
+ itemColorSelectedHover: '--plasma-dropdown-item-color-selected-hover',
22
+ itemWidth: '--plasma-dropdown-item-width',
23
+ itemHeight: '--plasma-dropdown-item-height',
24
+ itemBorderRadius: '--plasma-dropdown-item-border-radius',
25
+ itemPaddingTop: '--plasma-dropdown-item-padding-top',
26
+ itemPaddingRight: '--plasma-dropdown-item-padding-right',
27
+ itemPaddingBottom: '--plasma-dropdown-item-padding-bottom',
28
+ itemPaddingLeft: '--plasma-dropdown-item-padding-left',
29
+ itemMarginTop: '--plasma-dropdown-item-margin-top',
30
+ itemMarginRight: '--plasma-dropdown-item-margin-right',
31
+ itemMarginBottom: '--plasma-dropdown-item-margin-bottom',
32
+ itemMarginLeft: '--plasma-dropdown-item-margin-left',
33
+ itemFontFamily: '--plasma-dropdown-item-font-family',
34
+ itemFontSize: '--plasma-dropdown-item-font-size',
35
+ itemFontStyle: '--plasma-dropdown-item-font-style',
36
+ itemFontWeightBold: '--plasma-dropdown-item-letter-spacing',
37
+ itemFontLetterSpacing: '--plasma-dropdown-item-line-height',
38
+ itemFontLineHeight: '--plasma-dropdown-item-font-weight',
39
+ itemContentLeftColor: '--plasma-dropdown-item-content-left-color',
40
+ itemContentRightColor: '--plasma-dropdown-item-content-right-color',
41
+ itemContentLeftWidth: '--plasma-dropdown-item-content-left-width',
42
+ itemContentRightWidth: '--plasma-dropdown-item-content-right-width',
43
+ footerBackground: '--plasma-dropdown-footer-background',
44
+ footerWidth: '--plasma-dropdown-footer-width',
45
+ footerHeight: '--plasma-dropdown-footer-height',
46
+ footerPaddingTop: '--plasma-dropdown-footer-padding-top',
47
+ footerPaddingRight: '--plasma-dropdown-footer-padding-right',
48
+ footerPaddingBottom: '--plasma-dropdown-footer-padding-bottom',
49
+ footerPaddingLeft: '--plasma-dropdown-footer-padding-left',
50
+ footerMarginTop: '--plasma-dropdown-footer-margin-top',
51
+ footerMarginRight: '--plasma-dropdown-footer-margin-right',
52
+ footerMarginBottom: '--plasma-dropdown-footer-margin-bottom',
53
+ footerMarginLeft: '--plasma-dropdown-footer-margin-left',
54
+ footerFontFamily: '--plasma-dropdown-footer-font-family',
55
+ footerFontSize: '--plasma-dropdown-footer-font-size',
56
+ footerFontStyle: '--plasma-dropdown-footer-font-style',
57
+ footerFontWeightBold: '--plasma-dropdown-footer-letter-spacing',
58
+ footerFontLetterSpacing: '--plasma-dropdown-footer-line-height',
59
+ footerFontLineHeight: '--plasma-dropdown-footer-font-weight',
60
+ headerBackground: '--plasma-dropdown-header-background',
61
+ headerWidth: '--plasma-dropdown-header-width',
62
+ headerHeight: '--plasma-dropdown-header-height',
63
+ headerPaddingTop: '--plasma-dropdown-header-padding-top',
64
+ headerPaddingRight: '--plasma-dropdown-header-padding-right',
65
+ headerPaddingBottom: '--plasma-dropdown-header-padding-bottom',
66
+ headerPaddingLeft: '--plasma-dropdown-header-padding-left',
67
+ headerMarginTop: '--plasma-dropdown-header-margin-top',
68
+ headerMarginRight: '--plasma-dropdown-header-margin-right',
69
+ headerMarginBottom: '--plasma-dropdown-header-margin-bottom',
70
+ headerMarginLeft: '--plasma-dropdown-header-margin-left',
71
+ headerFontFamily: '--plasma-dropdown-header-font-family',
72
+ headerFontSize: '--plasma-dropdown-header-font-size',
73
+ headerFontStyle: '--plasma-dropdown-header-font-style',
74
+ headerFontWeightBold: '--plasma-dropdown-header-letter-spacing',
75
+ headerFontLetterSpacing: '--plasma-dropdown-header-line-height',
76
+ headerFontLineHeight: '--plasma-dropdown-header-font-weight',
77
+ dividerColor: '--plasma-dropdown-divider-color',
78
+ dividerWidth: '--plasma-dropdown-divider-width',
79
+ dividerHeight: '--plasma-dropdown-divider-height',
80
+ dividerMarginTop: '--plasma-dropdown-divider-margin-top',
81
+ dividerMarginRight: '--plasma-dropdown-divider-margin-right',
82
+ dividerMarginBottom: '--plasma-dropdown-divider-margin-bottom',
83
+ dividerMarginLeft: '--plasma-dropdown-divider-margin-left',
84
+ groupBackground: '--plasma-dropdown-group-background',
85
+ groupWidth: '--plasma-dropdown-group-width',
86
+ groupHeight: '--plasma-dropdown-group-height',
87
+ groupPaddingTop: '--plasma-dropdown-group-padding-top',
88
+ groupPaddingRight: '--plasma-dropdown-group-padding-right',
89
+ groupPaddingBottom: '--plasma-dropdown-group-padding-bottom',
90
+ groupPaddingLeft: '--plasma-dropdown-group-padding-left',
91
+ groupMarginTop: '--plasma-dropdown-group-margin-top',
92
+ groupMarginRight: '--plasma-dropdown-group-margin-right',
93
+ groupMarginBottom: '--plasma-dropdown-group-margin-bottom',
94
+ groupMarginLeft: '--plasma-dropdown-group-margin-left',
95
+ groupLabelColor: '--plasma-dropdown-group-label-color',
96
+ groupLabelFontFamily: '--plasma-dropdown-group-label-font-family',
97
+ groupLabelFontSize: '--plasma-dropdown-group-label-font-size',
98
+ groupLabelFontStyle: '--plasma-dropdown-group-label-font-style',
99
+ groupLabelFontWeight: '--plasma-dropdown-group-label-font-weight',
100
+ groupLabelLetterSpacing: '--plasma-dropdown-group-label-letter-spacing',
101
+ groupLabelLineHeight: '--plasma-dropdown-group-label-line-height',
102
+ groupLabelPaddingTop: '--plasma-dropdown-group-label-padding-top',
103
+ groupLabelPaddingRight: '--plasma-dropdown-group-label-padding-right',
104
+ groupLabelPaddingBottom: '--plasma-dropdown-group-label-padding-bottom',
105
+ groupLabelPaddingLeft: '--plasma-dropdown-group-label-padding-left',
106
+ groupLabelMarginTop: '--plasma-dropdown-group-label-margin-top',
107
+ groupLabelMarginRight: '--plasma-dropdown-group-label-margin-right',
108
+ groupLabelMarginBottom: '--plasma-dropdown-group-label-margin-bottom',
109
+ groupLabelMarginLeft: '--plasma-dropdown-group-label-margin-left',
110
+ disabledOpacity: '--plasma-dropdown-disabled-opacity',
111
+ focusColor: '--plasma-dropdown-focus-color'
112
+ };
@@ -0,0 +1,15 @@
1
+ export var getPlacement = function getPlacement(placement) {
2
+ return "".concat(placement, "-start");
3
+ };
4
+ export var getPlacements = function getPlacements(placements) {
5
+ if (!placements) {
6
+ return;
7
+ }
8
+ var isArray = Array.isArray(placements);
9
+ if (!isArray) {
10
+ return getPlacement(placements);
11
+ }
12
+ return (placements || []).map(function (placement) {
13
+ return getPlacement(placement);
14
+ });
15
+ };
@@ -0,0 +1,2 @@
1
+ import { css } from 'styled-components';
2
+ export var base = /*#__PURE__*/css([""]);
@@ -0,0 +1,2 @@
1
+ import { css } from 'styled-components';
2
+ export var base = /*#__PURE__*/css([""]);
@@ -4,4 +4,6 @@ export { dropdownGroupRoot, dropdownGroupConfig } from './DropdownGroup/Dropdown
4
4
  export { dropdownHeaderRoot, dropdownHeaderConfig } from './DropdownHeader/DropdownHeader';
5
5
  export { DropdownItem } from './DropdownItem/DropdownItem';
6
6
  export { DropdownInner } from './DropdownInner/DropdownInner';
7
- export { dropdownItemOldRoot, dropdownItemOldConfig } from './DropdownItemOld/DropdownItemOld';
7
+ export { dropdownItemOldRoot, dropdownItemOldConfig } from './DropdownItemOld/DropdownItemOld';
8
+ export { dropdownOldRoot, dropdownOldConfig } from './DropdownOld/DropdownOld';
9
+ export { tokens as dropdownOldTokens } from './DropdownOld/DropdownOld.tokens';