@alfalab/core-components-select 10.6.4 → 10.6.7

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.
Files changed (242) hide show
  1. package/CHANGELOG.md +130 -130
  2. package/dist/Component-a1a4a76b.d.ts +5 -0
  3. package/dist/Component-a1a4a76b.js +247 -0
  4. package/dist/Component-d0f16ea7.d.ts +33 -0
  5. package/dist/Component-d0f16ea7.js +359 -0
  6. package/dist/Component.d.ts +1 -1
  7. package/dist/Component.js +2 -2
  8. package/dist/components/arrow/Component.js +1 -1
  9. package/dist/components/arrow/index.css +3 -3
  10. package/dist/components/base-select/Component.d.ts +0 -5
  11. package/dist/components/base-select/Component.js +11 -241
  12. package/dist/components/base-select/index.css +7 -7
  13. package/dist/components/base-select/index.d.ts +1 -1
  14. package/dist/components/base-select/index.js +2 -2
  15. package/dist/components/checkmark/Component.js +1 -1
  16. package/dist/components/checkmark/index.css +7 -7
  17. package/dist/components/field/Component.js +2 -2
  18. package/dist/components/field/index.css +9 -9
  19. package/dist/components/field/index.js +1 -1
  20. package/dist/components/index.d.ts +1 -0
  21. package/dist/components/index.js +12 -2
  22. package/dist/components/native-select/Component.js +1 -1
  23. package/dist/components/native-select/index.js +1 -1
  24. package/dist/components/optgroup/Component.d.ts +1 -1
  25. package/dist/components/optgroup/Component.js +3 -3
  26. package/dist/components/optgroup/index.css +6 -6
  27. package/dist/components/option/Component.js +2 -2
  28. package/dist/components/option/index.css +20 -20
  29. package/dist/components/option/index.js +1 -1
  30. package/dist/components/options-list/Component.js +4 -4
  31. package/dist/components/options-list/index.css +6 -6
  32. package/dist/components/options-list/index.js +1 -1
  33. package/dist/components/select-mobile/Component.d.ts +0 -0
  34. package/dist/components/select-mobile/Component.js +38 -0
  35. package/dist/components/select-mobile/checkmark/Component.d.ts +4 -0
  36. package/dist/components/select-mobile/checkmark/Component.js +24 -0
  37. package/dist/components/select-mobile/checkmark/index.css +37 -0
  38. package/dist/components/select-mobile/checkmark/index.d.ts +1 -0
  39. package/dist/components/select-mobile/checkmark/index.js +11 -0
  40. package/dist/components/select-mobile/index.css +68 -0
  41. package/dist/components/select-mobile/index.d.ts +1 -0
  42. package/dist/components/select-mobile/index.js +38 -0
  43. package/dist/components/select-mobile/options-list/Component.d.ts +4 -0
  44. package/dist/components/select-mobile/options-list/Component.js +51 -0
  45. package/dist/components/select-mobile/options-list/index.css +65 -0
  46. package/dist/components/select-mobile/options-list/index.d.ts +1 -0
  47. package/dist/components/select-mobile/options-list/index.js +16 -0
  48. package/dist/components/virtual-options-list/Component.js +2 -2
  49. package/dist/components/virtual-options-list/index.css +12 -12
  50. package/dist/components/virtual-options-list/index.js +1 -1
  51. package/dist/cssm/Component-9bc41b6c.d.ts +5 -0
  52. package/dist/cssm/Component-9bc41b6c.js +246 -0
  53. package/dist/cssm/Component-d45c0e41.d.ts +33 -0
  54. package/dist/cssm/Component-d45c0e41.js +365 -0
  55. package/dist/cssm/Component.d.ts +1 -1
  56. package/dist/cssm/Component.js +1 -1
  57. package/dist/cssm/components/base-select/Component.d.ts +0 -5
  58. package/dist/cssm/components/base-select/Component.js +12 -240
  59. package/dist/cssm/components/base-select/index.d.ts +1 -1
  60. package/dist/cssm/components/base-select/index.js +1 -1
  61. package/dist/cssm/components/index.d.ts +1 -0
  62. package/dist/cssm/components/index.js +17 -1
  63. package/dist/cssm/components/optgroup/Component.d.ts +1 -1
  64. package/dist/cssm/components/optgroup/Component.js +2 -2
  65. package/dist/cssm/components/options-list/Component.js +2 -2
  66. package/dist/cssm/components/select-mobile/Component.d.ts +0 -0
  67. package/dist/cssm/components/select-mobile/Component.js +52 -0
  68. package/dist/cssm/components/select-mobile/checkmark/Component.d.ts +4 -0
  69. package/dist/cssm/components/select-mobile/checkmark/Component.js +23 -0
  70. package/dist/cssm/components/select-mobile/checkmark/index.d.ts +1 -0
  71. package/dist/cssm/components/select-mobile/checkmark/index.js +12 -0
  72. package/dist/cssm/components/select-mobile/checkmark/index.module.css +36 -0
  73. package/dist/cssm/components/select-mobile/index.d.ts +1 -0
  74. package/dist/cssm/components/select-mobile/index.js +52 -0
  75. package/dist/cssm/components/select-mobile/index.module.css +67 -0
  76. package/dist/cssm/components/select-mobile/options-list/Component.d.ts +4 -0
  77. package/dist/cssm/components/select-mobile/options-list/Component.js +51 -0
  78. package/dist/cssm/components/select-mobile/options-list/index.d.ts +1 -0
  79. package/dist/cssm/components/select-mobile/options-list/index.js +18 -0
  80. package/dist/cssm/components/select-mobile/options-list/index.module.css +64 -0
  81. package/dist/cssm/getDataTestId-3fe0d3e6.d.ts +2 -0
  82. package/dist/cssm/hook-f5b8fe4f.d.ts +3 -3
  83. package/dist/cssm/index.js +14 -6
  84. package/dist/cssm/presets/index.js +13 -6
  85. package/dist/cssm/presets/useSelectWithApply/hook.js +13 -6
  86. package/dist/cssm/presets/useSelectWithApply/options-list-with-apply/Component.js +12 -5
  87. package/dist/cssm/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
  88. package/dist/cssm/presets/useSelectWithApply/options-list-with-apply/index.js +12 -5
  89. package/dist/cssm/typings.d.ts +29 -0
  90. package/dist/esm/Component-18e6b97f.d.ts +5 -0
  91. package/dist/esm/Component-18e6b97f.js +238 -0
  92. package/dist/esm/Component-516f02d9.d.ts +33 -0
  93. package/dist/esm/Component-516f02d9.js +348 -0
  94. package/dist/esm/Component.d.ts +1 -1
  95. package/dist/esm/Component.js +2 -2
  96. package/dist/esm/components/arrow/Component.js +1 -1
  97. package/dist/esm/components/arrow/index.css +3 -3
  98. package/dist/esm/components/base-select/Component.d.ts +0 -5
  99. package/dist/esm/components/base-select/Component.js +10 -238
  100. package/dist/esm/components/base-select/index.css +7 -7
  101. package/dist/esm/components/base-select/index.d.ts +1 -1
  102. package/dist/esm/components/base-select/index.js +2 -2
  103. package/dist/esm/components/checkmark/Component.js +1 -1
  104. package/dist/esm/components/checkmark/index.css +7 -7
  105. package/dist/esm/components/field/Component.js +2 -2
  106. package/dist/esm/components/field/index.css +9 -9
  107. package/dist/esm/components/field/index.js +1 -1
  108. package/dist/esm/components/index.d.ts +1 -0
  109. package/dist/esm/components/index.js +11 -2
  110. package/dist/esm/components/native-select/Component.js +1 -1
  111. package/dist/esm/components/native-select/index.js +1 -1
  112. package/dist/esm/components/optgroup/Component.d.ts +1 -1
  113. package/dist/esm/components/optgroup/Component.js +3 -3
  114. package/dist/esm/components/optgroup/index.css +6 -6
  115. package/dist/esm/components/option/Component.js +2 -2
  116. package/dist/esm/components/option/index.css +20 -20
  117. package/dist/esm/components/option/index.js +1 -1
  118. package/dist/esm/components/options-list/Component.js +4 -4
  119. package/dist/esm/components/options-list/index.css +6 -6
  120. package/dist/esm/components/options-list/index.js +1 -1
  121. package/dist/esm/components/select-mobile/Component.d.ts +0 -0
  122. package/dist/esm/components/select-mobile/Component.js +30 -0
  123. package/dist/esm/components/select-mobile/checkmark/Component.d.ts +4 -0
  124. package/dist/esm/components/select-mobile/checkmark/Component.js +15 -0
  125. package/dist/esm/components/select-mobile/checkmark/index.css +37 -0
  126. package/dist/esm/components/select-mobile/checkmark/index.d.ts +1 -0
  127. package/dist/esm/components/select-mobile/checkmark/index.js +3 -0
  128. package/dist/esm/components/select-mobile/index.css +68 -0
  129. package/dist/esm/components/select-mobile/index.d.ts +1 -0
  130. package/dist/esm/components/select-mobile/index.js +30 -0
  131. package/dist/esm/components/select-mobile/options-list/Component.d.ts +4 -0
  132. package/dist/esm/components/select-mobile/options-list/Component.js +42 -0
  133. package/dist/esm/components/select-mobile/options-list/index.css +65 -0
  134. package/dist/esm/components/select-mobile/options-list/index.d.ts +1 -0
  135. package/dist/esm/components/select-mobile/options-list/index.js +8 -0
  136. package/dist/esm/components/virtual-options-list/Component.js +2 -2
  137. package/dist/esm/components/virtual-options-list/index.css +12 -12
  138. package/dist/esm/components/virtual-options-list/index.js +1 -1
  139. package/dist/esm/getDataTestId-3fe0d3e6.d.ts +2 -0
  140. package/dist/esm/hook-f5b8fe4f.d.ts +3 -3
  141. package/dist/esm/index.js +9 -5
  142. package/dist/esm/{intersection-observer-812c9e4f.d.ts → intersection-observer-ade41fff.d.ts} +0 -0
  143. package/dist/esm/{intersection-observer-812c9e4f.js → intersection-observer-ade41fff.js} +0 -0
  144. package/dist/esm/presets/index.js +9 -5
  145. package/dist/esm/presets/useLazyLoading/hook.js +3 -3
  146. package/dist/esm/presets/useLazyLoading/index.css +2 -2
  147. package/dist/esm/presets/useSelectWithApply/hook.js +9 -5
  148. package/dist/esm/presets/useSelectWithApply/options-list-with-apply/Component.js +9 -5
  149. package/dist/esm/presets/useSelectWithApply/options-list-with-apply/index.css +4 -4
  150. package/dist/esm/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
  151. package/dist/esm/presets/useSelectWithApply/options-list-with-apply/index.js +9 -5
  152. package/dist/esm/presets/useSelectWithLoading/hook.js +2 -2
  153. package/dist/esm/presets/useSelectWithLoading/index.css +2 -2
  154. package/dist/esm/{tslib.es6-de132685.d.ts → tslib.es6-a11a4f58.d.ts} +0 -0
  155. package/dist/esm/{tslib.es6-de132685.js → tslib.es6-a11a4f58.js} +0 -0
  156. package/dist/esm/typings.d.ts +29 -0
  157. package/dist/getDataTestId-3fe0d3e6.d.ts +2 -0
  158. package/dist/hook-f5b8fe4f.d.ts +3 -3
  159. package/dist/index.js +12 -7
  160. package/dist/{intersection-observer-25b5554f.d.ts → intersection-observer-f6329639.d.ts} +0 -0
  161. package/dist/{intersection-observer-25b5554f.js → intersection-observer-f6329639.js} +0 -0
  162. package/dist/modern/Component-6db2b45d.d.ts +33 -0
  163. package/dist/modern/Component-6db2b45d.js +363 -0
  164. package/dist/modern/Component-9c4c2de2.d.ts +5 -0
  165. package/dist/modern/Component-9c4c2de2.js +247 -0
  166. package/dist/modern/Component.d.ts +1 -1
  167. package/dist/modern/Component.js +1 -1
  168. package/dist/modern/components/arrow/Component.js +1 -1
  169. package/dist/modern/components/arrow/index.css +3 -3
  170. package/dist/modern/components/base-select/Component.d.ts +0 -5
  171. package/dist/modern/components/base-select/Component.js +9 -247
  172. package/dist/modern/components/base-select/index.css +7 -7
  173. package/dist/modern/components/base-select/index.d.ts +1 -1
  174. package/dist/modern/components/base-select/index.js +1 -1
  175. package/dist/modern/components/checkmark/Component.js +1 -1
  176. package/dist/modern/components/checkmark/index.css +7 -7
  177. package/dist/modern/components/field/Component.js +1 -1
  178. package/dist/modern/components/field/index.css +9 -9
  179. package/dist/modern/components/index.d.ts +1 -0
  180. package/dist/modern/components/index.js +10 -1
  181. package/dist/modern/components/optgroup/Component.d.ts +1 -1
  182. package/dist/modern/components/optgroup/Component.js +3 -3
  183. package/dist/modern/components/optgroup/index.css +6 -6
  184. package/dist/modern/components/option/Component.js +1 -1
  185. package/dist/modern/components/option/index.css +20 -20
  186. package/dist/modern/components/options-list/Component.js +3 -3
  187. package/dist/modern/components/options-list/index.css +6 -6
  188. package/dist/modern/components/select-mobile/Component.d.ts +0 -0
  189. package/dist/modern/components/select-mobile/Component.js +29 -0
  190. package/dist/modern/components/select-mobile/checkmark/Component.d.ts +4 -0
  191. package/dist/modern/components/select-mobile/checkmark/Component.js +11 -0
  192. package/dist/modern/components/select-mobile/checkmark/index.css +37 -0
  193. package/dist/modern/components/select-mobile/checkmark/index.d.ts +1 -0
  194. package/dist/modern/components/select-mobile/checkmark/index.js +3 -0
  195. package/dist/modern/components/select-mobile/index.css +68 -0
  196. package/dist/modern/components/select-mobile/index.d.ts +1 -0
  197. package/dist/modern/components/select-mobile/index.js +29 -0
  198. package/dist/modern/components/select-mobile/options-list/Component.d.ts +4 -0
  199. package/dist/modern/components/select-mobile/options-list/Component.js +37 -0
  200. package/dist/modern/components/select-mobile/options-list/index.css +65 -0
  201. package/dist/modern/components/select-mobile/options-list/index.d.ts +1 -0
  202. package/dist/modern/components/select-mobile/options-list/index.js +7 -0
  203. package/dist/modern/components/virtual-options-list/Component.js +1 -1
  204. package/dist/modern/components/virtual-options-list/index.css +12 -12
  205. package/dist/modern/getDataTestId-3fe0d3e6.d.ts +2 -0
  206. package/dist/modern/hook-f5b8fe4f.d.ts +3 -3
  207. package/dist/modern/index.js +8 -4
  208. package/dist/modern/{intersection-observer-812c9e4f.d.ts → intersection-observer-ade41fff.d.ts} +0 -0
  209. package/dist/modern/{intersection-observer-812c9e4f.js → intersection-observer-ade41fff.js} +0 -0
  210. package/dist/modern/presets/index.js +8 -4
  211. package/dist/modern/presets/useLazyLoading/hook.js +2 -2
  212. package/dist/modern/presets/useLazyLoading/index.css +2 -2
  213. package/dist/modern/presets/useSelectWithApply/hook.js +8 -4
  214. package/dist/modern/presets/useSelectWithApply/options-list-with-apply/Component.js +8 -4
  215. package/dist/modern/presets/useSelectWithApply/options-list-with-apply/index.css +4 -4
  216. package/dist/modern/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
  217. package/dist/modern/presets/useSelectWithApply/options-list-with-apply/index.js +8 -4
  218. package/dist/modern/presets/useSelectWithLoading/hook.js +1 -1
  219. package/dist/modern/presets/useSelectWithLoading/index.css +2 -2
  220. package/dist/modern/typings.d.ts +29 -0
  221. package/dist/presets/index.js +11 -7
  222. package/dist/presets/useLazyLoading/hook.js +3 -3
  223. package/dist/presets/useLazyLoading/index.css +2 -2
  224. package/dist/presets/useSelectWithApply/hook.js +11 -7
  225. package/dist/presets/useSelectWithApply/options-list-with-apply/Component.js +10 -6
  226. package/dist/presets/useSelectWithApply/options-list-with-apply/index.css +4 -4
  227. package/dist/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
  228. package/dist/presets/useSelectWithApply/options-list-with-apply/index.js +10 -6
  229. package/dist/presets/useSelectWithLoading/hook.js +2 -2
  230. package/dist/presets/useSelectWithLoading/index.css +2 -2
  231. package/dist/{tslib.es6-2027080d.d.ts → tslib.es6-1a72f42c.d.ts} +0 -0
  232. package/dist/{tslib.es6-2027080d.js → tslib.es6-1a72f42c.js} +0 -0
  233. package/dist/typings.d.ts +29 -0
  234. package/package.json +14 -12
  235. package/dist/cssm/hook-3b9bd559.d.ts +0 -12
  236. package/dist/cssm/hook-3b9bd559.js +0 -147
  237. package/dist/esm/hook-73d6fe0f.d.ts +0 -12
  238. package/dist/esm/hook-73d6fe0f.js +0 -131
  239. package/dist/hook-81a989b0.d.ts +0 -12
  240. package/dist/hook-81a989b0.js +0 -140
  241. package/dist/modern/hook-42b89ed1.d.ts +0 -12
  242. package/dist/modern/hook-42b89ed1.js +0 -132
@@ -1,4 +1,4 @@
1
- /* hash: qm1bt */
1
+ /* hash: v1uad */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  --color-light-bg-secondary: #f3f4f5;
@@ -53,7 +53,7 @@
53
53
 
54
54
  /* optgroup */
55
55
  }
56
- .select__option_v3drd {
56
+ .select__option_yry7g {
57
57
  font-size: 16px;
58
58
  line-height: 20px;
59
59
  font-weight: 400;
@@ -69,11 +69,11 @@
69
69
  position: relative;
70
70
  cursor: pointer
71
71
  }
72
- .select__option_v3drd:not(.select__disabled_v3drd):active {
72
+ .select__option_yry7g:not(.select__disabled_yry7g):active {
73
73
  background: var(--select-option-active-background);
74
74
  color: var(--select-option-active-color);
75
75
  }
76
- .select__option_v3drd:before {
76
+ .select__option_yry7g:before {
77
77
  content: '';
78
78
  position: absolute;
79
79
  left: var(--select-option-left-padding);
@@ -84,60 +84,60 @@
84
84
  display: var(--select-option-divider-display);
85
85
  transition: opacity 0.2s ease;
86
86
  }
87
- .select__option_v3drd:first-child:before {
87
+ .select__option_yry7g:first-child:before {
88
88
  display: none;
89
89
  }
90
- .select__s_v3drd {
90
+ .select__s_yry7g {
91
91
  min-height: var(--size-s-height);
92
92
  }
93
- .select__m_v3drd {
93
+ .select__m_yry7g {
94
94
  min-height: var(--size-m-height);
95
95
  }
96
- .select__l_v3drd {
96
+ .select__l_yry7g {
97
97
  min-height: var(--size-l-height);
98
98
  }
99
- .select__xl_v3drd {
99
+ .select__xl_yry7g {
100
100
  min-height: var(--size-xl-height);
101
101
  }
102
- .select__l_v3drd,
103
- .select__xl_v3drd {
102
+ .select__l_yry7g,
103
+ .select__xl_yry7g {
104
104
  padding-left: var(--select-option-l-left-padding);
105
105
  padding-right: var(--select-option-l-right-padding)
106
106
  }
107
- .select__l_v3drd:before, .select__xl_v3drd:before {
107
+ .select__l_yry7g:before, .select__xl_yry7g:before {
108
108
  left: var(--select-option-l-left-padding);
109
109
  right: var(--select-option-l-right-padding);
110
110
  }
111
- .select__selected_v3drd {
111
+ .select__selected_yry7g {
112
112
  background: var(--select-option-selected-background);
113
113
  color: var(--select-option-selected-color);
114
114
  cursor: default;
115
115
  }
116
- .select__highlighted_v3drd {
116
+ .select__highlighted_yry7g {
117
117
  background: var(--select-option-hover-background);
118
118
  color: var(--select-option-hover-color)
119
119
  }
120
- .select__highlighted_v3drd:before,
121
- .select__highlighted_v3drd + .select__option_v3drd:before {
120
+ .select__highlighted_yry7g:before,
121
+ .select__highlighted_yry7g + .select__option_yry7g:before {
122
122
  opacity: 0;
123
123
  }
124
- .select__disabled_v3drd {
124
+ .select__disabled_yry7g {
125
125
  cursor: var(--disabled-cursor);
126
126
  background: var(--select-option-disabled-background);
127
127
  color: var(--select-option-disabled-color);
128
128
  }
129
- .select__content_v3drd {
129
+ .select__content_yry7g {
130
130
  overflow: hidden;
131
131
  flex: 1;
132
132
  text-overflow: ellipsis;
133
133
  }
134
- .select__textContent_v3drd {
134
+ .select__textContent_yry7g {
135
135
  padding-top: var(--gap-s);
136
136
  padding-bottom: var(--gap-s);
137
137
  }
138
138
  /* IE min-height fix */
139
139
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
140
- .select__option_v3drd:after {
140
+ .select__option_yry7g:after {
141
141
  min-height: inherit;
142
142
  font-size: 0;
143
143
  content: '';
@@ -4,7 +4,7 @@ import { useVisibleOptions, isGroup } from '../../utils.js';
4
4
  import mergeRefs from 'react-merge-refs';
5
5
  import { Optgroup } from '../optgroup/Component.js';
6
6
 
7
- var styles = {"optionsList":"select__optionsList_yc9pn","scrollable":"select__scrollable_yc9pn","emptyPlaceholder":"select__emptyPlaceholder_yc9pn","l":"select__l_yc9pn","xl":"select__xl_yc9pn"};
7
+ var styles = {"optionsList":"select__optionsList_1ogwx","scrollable":"select__scrollable_1ogwx","emptyPlaceholder":"select__emptyPlaceholder_1ogwx","l":"select__l_1ogwx","xl":"select__xl_1ogwx"};
8
8
  require('./index.css')
9
9
 
10
10
  const createCounter = () => {
@@ -12,11 +12,11 @@ const createCounter = () => {
12
12
  // eslint-disable-next-line no-plusplus
13
13
  return () => count++;
14
14
  };
15
- const OptionsList = forwardRef(({ size = 's', className, Option, getOptionProps, options = [], Optgroup: Optgroup$1 = Optgroup, dataTestId, emptyPlaceholder, visibleOptions = 5, onScroll, open, header, footer, }, ref) => {
15
+ const OptionsList = forwardRef(({ size = 's', className, optionGroupClassName, Option, getOptionProps, options = [], Optgroup: Optgroup$1 = Optgroup, dataTestId, emptyPlaceholder, visibleOptions = 5, onScroll, open, header, footer, }, ref) => {
16
16
  const renderOption = useCallback((option, index) => (React.createElement(Option, Object.assign({ key: option.key }, getOptionProps(option, index)))), [getOptionProps]);
17
17
  const listRef = useRef(null);
18
18
  const counter = createCounter();
19
- const renderGroup = useCallback((group) => (React.createElement(Optgroup$1, { label: group.label, key: group.label, size: size }, group.options.map(option => renderOption(option, counter())))), [counter, renderOption, size]);
19
+ const renderGroup = useCallback((group) => (React.createElement(Optgroup$1, { className: optionGroupClassName, label: group.label, key: group.label, size: size }, group.options.map(option => renderOption(option, counter())))), [optionGroupClassName, counter, renderOption, size]);
20
20
  useVisibleOptions({
21
21
  visibleOptions,
22
22
  listRef,
@@ -1,4 +1,4 @@
1
- /* hash: 196yb */
1
+ /* hash: r06fu */
2
2
  :root {
3
3
  --color-light-text-secondary: #546272;
4
4
  }
@@ -26,21 +26,21 @@
26
26
 
27
27
  /* optgroup */
28
28
  }
29
- .select__optionsList_yc9pn {
29
+ .select__optionsList_1ogwx {
30
30
  overflow: auto;
31
31
  width: 100%;
32
32
  outline: none;
33
33
  box-sizing: border-box;
34
34
  }
35
- .select__scrollable_yc9pn {
35
+ .select__scrollable_1ogwx {
36
36
  overflow: auto;
37
37
  width: 100%;
38
38
  }
39
- .select__emptyPlaceholder_yc9pn {
39
+ .select__emptyPlaceholder_1ogwx {
40
40
  padding: var(--gap-m) var(--gap-s);
41
41
  color: var(--select-options-list-empty-placeholder-color);
42
42
  }
43
- .select__l_yc9pn .select__emptyPlaceholder_yc9pn,
44
- .select__xl_yc9pn .select__emptyPlaceholder_yc9pn {
43
+ .select__l_1ogwx .select__emptyPlaceholder_1ogwx,
44
+ .select__xl_1ogwx .select__emptyPlaceholder_1ogwx {
45
45
  padding: var(--gap-xl) var(--gap-m);
46
46
  }
@@ -0,0 +1,29 @@
1
+ import 'react';
2
+ import 'classnames';
3
+ import '@alfalab/hooks';
4
+ import '@alfalab/core-components-form-control/dist/modern';
5
+ import '../../utils.js';
6
+ import '../field/Component.js';
7
+ import '@alfalab/icons-glyph/ChevronDownMIcon';
8
+ import '../arrow/Component.js';
9
+ import 'react-merge-refs';
10
+ import '../optgroup/Component.js';
11
+ import '../options-list/Component.js';
12
+ import '@alfalab/core-components-checkbox/dist/modern';
13
+ import '../checkmark/Component.js';
14
+ import '../option/Component.js';
15
+ import 'resize-observer';
16
+ import '@alfalab/core-components-popover/dist/modern';
17
+ import 'downshift';
18
+ import '../native-select/Component.js';
19
+ import '../../Component-9c4c2de2.js';
20
+ import '../../Component.js';
21
+ import '@alfalab/core-components-bottom-sheet/dist/modern';
22
+ import '@alfalab/core-components-button/dist/modern';
23
+ import '@alfalab/core-components-base-modal/dist/modern';
24
+ import './options-list/Component.js';
25
+ import './checkmark/Component.js';
26
+ export { S as SelectMobile } from '../../Component-6db2b45d.js';
27
+ import 'react-virtual';
28
+ import '@alfalab/core-components-skeleton/dist/modern';
29
+ import '../../intersection-observer-ade41fff.js';
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { CheckmarkProps } from "../../../typings";
3
+ declare const Checkmark: ({ selected, className }: CheckmarkProps) => JSX.Element;
4
+ export { Checkmark };
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import cn from 'classnames';
3
+
4
+ var styles = {"checkmark":"select__checkmark_1y77a","selected":"select__selected_1y77a"};
5
+ require('./index.css')
6
+
7
+ const Checkmark = ({ selected, className }) => (React.createElement("span", { className: cn(styles.checkmark, className, {
8
+ [styles.selected]: selected,
9
+ }) }));
10
+
11
+ export { Checkmark };
@@ -0,0 +1,37 @@
1
+ /* hash: 1l3wl */
2
+ :root {
3
+
4
+ /* Hard */
5
+
6
+ /* Up */
7
+
8
+ /* Hard up */
9
+ }
10
+ :root {
11
+
12
+ /* options list */
13
+
14
+ /* option */
15
+
16
+ /* checkmark */
17
+ --select-mobile-checkmark-background: url('https://alfabank.gcdn.co/icons/glyph_checkmark_m.svg');
18
+
19
+ /* optgroup */
20
+ }
21
+ .select__checkmark_1y77a {
22
+ flex-shrink: 0;
23
+ display: flex;
24
+ align-items: center;
25
+ justify-content: center;
26
+ background: var(--select-mobile-checkmark-background);
27
+ background-size: cover;
28
+ width: 24px;
29
+ height: 24px;
30
+ opacity: 0
31
+ }
32
+ .select__checkmark_1y77a:first-child {
33
+ display: none;
34
+ }
35
+ .select__checkmark_1y77a.select__selected_1y77a {
36
+ opacity: 1;
37
+ }
@@ -0,0 +1 @@
1
+ export * from "./Component";
@@ -0,0 +1,3 @@
1
+ import 'react';
2
+ import 'classnames';
3
+ export { Checkmark } from './Component.js';
@@ -0,0 +1,68 @@
1
+ /* hash: bmtr9 */
2
+ :root {
3
+
4
+ /* Hard */
5
+
6
+ /* Up */
7
+
8
+ /* Hard up */
9
+ }
10
+ :root {
11
+ --gap-2xs: 4px;
12
+ --gap-xs: 8px;
13
+ --gap-m: 16px;
14
+ --gap-l: 20px;
15
+ }
16
+ :root {
17
+
18
+ /* options list */
19
+ --select-options-list-offset: 0;
20
+
21
+ /* option */
22
+
23
+ /* checkmark */
24
+
25
+ /* optgroup */
26
+ }
27
+ .select__component_nryms {
28
+ width: max-content;
29
+ position: relative;
30
+ outline: 0;
31
+ }
32
+ .select__popoverInner_nryms {
33
+ padding-top: var(--select-options-list-offset);
34
+ padding-bottom: var(--select-options-list-offset);
35
+ box-shadow: none;
36
+ border: none;
37
+ background: transparent;
38
+ border-radius: 0;
39
+ position: relative;
40
+ }
41
+ .select__sheet_nryms {
42
+ overflow: hidden;
43
+ }
44
+ .select__sheetContent_nryms {
45
+ padding: 0;
46
+ }
47
+ .select__sheetContainer_nryms {
48
+ padding: 0;
49
+ }
50
+ .select__block_nryms {
51
+ width: 100%;
52
+ }
53
+ /* width: max-content; fix for IE */
54
+ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
55
+ .select__component_nryms {
56
+ float: left;
57
+ clear: left;
58
+ }
59
+ }
60
+ .select__option_nryms {
61
+ padding: var(--gap-2xs) var(--gap-l) var(--gap-2xs) var(--gap-m)
62
+ }
63
+ .select__option_nryms:before {
64
+ display: none;
65
+ }
66
+ .select__optionGroup_nryms {
67
+ padding: var(--gap-m) var(--gap-m) var(--gap-xs);
68
+ }
@@ -0,0 +1 @@
1
+ export * from "../../Component-6db2b45d";
@@ -0,0 +1,29 @@
1
+ import 'react';
2
+ import 'classnames';
3
+ import '@alfalab/hooks';
4
+ import '@alfalab/core-components-form-control/dist/modern';
5
+ import '../../utils.js';
6
+ import '../field/Component.js';
7
+ import '@alfalab/icons-glyph/ChevronDownMIcon';
8
+ import '../arrow/Component.js';
9
+ import 'react-merge-refs';
10
+ import '../optgroup/Component.js';
11
+ import '../options-list/Component.js';
12
+ import '@alfalab/core-components-checkbox/dist/modern';
13
+ import '../checkmark/Component.js';
14
+ import '../option/Component.js';
15
+ import 'resize-observer';
16
+ import '@alfalab/core-components-popover/dist/modern';
17
+ import 'downshift';
18
+ import '../native-select/Component.js';
19
+ import '../../Component-9c4c2de2.js';
20
+ import '../../Component.js';
21
+ import '@alfalab/core-components-bottom-sheet/dist/modern';
22
+ import '@alfalab/core-components-button/dist/modern';
23
+ import '@alfalab/core-components-base-modal/dist/modern';
24
+ import './options-list/Component.js';
25
+ import './checkmark/Component.js';
26
+ export { S as SelectMobile } from '../../Component-6db2b45d.js';
27
+ import 'react-virtual';
28
+ import '@alfalab/core-components-skeleton/dist/modern';
29
+ import '../../intersection-observer-ade41fff.js';
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { OptionsListProps } from "../../../typings";
3
+ declare const OptionsList: ({ size, className, optionGroupClassName, Option, getOptionProps, options, Optgroup, dataTestId, emptyPlaceholder, showFooter, onApply, onClear, }: OptionsListProps) => JSX.Element | null;
4
+ export { OptionsList };
@@ -0,0 +1,37 @@
1
+ import React, { useContext, useEffect, useCallback } from 'react';
2
+ import cn from 'classnames';
3
+ import { isGroup } from '../../../utils.js';
4
+ import { Optgroup } from '../../optgroup/Component.js';
5
+ import { Button } from '@alfalab/core-components-button/dist/modern';
6
+ import { BaseModalContext } from '@alfalab/core-components-base-modal/dist/modern';
7
+
8
+ var styles = {"optionsList":"select__optionsList_1uyqp","emptyPlaceholder":"select__emptyPlaceholder_1uyqp","l":"select__l_1uyqp","xl":"select__xl_1uyqp","footer":"select__footer_1uyqp","footerButton":"select__footerButton_1uyqp","highlighted":"select__highlighted_1uyqp"};
9
+ require('./index.css')
10
+
11
+ const createCounter = () => {
12
+ let count = 0;
13
+ // eslint-disable-next-line no-plusplus
14
+ return () => count++;
15
+ };
16
+ const OptionsList = ({ size = 's', className, optionGroupClassName, Option, getOptionProps, options = [], Optgroup: Optgroup$1 = Optgroup, dataTestId, emptyPlaceholder, showFooter, onApply = () => null, onClear = () => null, }) => {
17
+ const { footerHighlighted, setHasFooter } = useContext(BaseModalContext);
18
+ useEffect(() => {
19
+ setHasFooter(true);
20
+ }, [setHasFooter]);
21
+ const renderOption = useCallback((option, index) => (React.createElement(Option, Object.assign({ key: option.key }, getOptionProps(option, index)))), [getOptionProps]);
22
+ const counter = createCounter();
23
+ const renderGroup = useCallback((group) => (React.createElement(Optgroup$1, { className: optionGroupClassName, label: group.label, key: group.label, size: size }, group.options.map(option => renderOption(option, counter())))), [optionGroupClassName, counter, renderOption, size]);
24
+ if (options.length === 0 && !emptyPlaceholder) {
25
+ return null;
26
+ }
27
+ return (React.createElement("div", { className: cn(styles.optionsList, styles[size], className), "data-test-id": dataTestId },
28
+ options.map(option => isGroup(option) ? renderGroup(option) : renderOption(option, counter())),
29
+ emptyPlaceholder && options.length === 0 && (React.createElement("div", { className: styles.emptyPlaceholder }, emptyPlaceholder)),
30
+ showFooter && (React.createElement("div", { className: cn(styles.footer, className, {
31
+ [styles.highlighted]: footerHighlighted,
32
+ }) },
33
+ React.createElement(Button, { size: 's', view: 'primary', onClick: onApply, className: styles.footerButton }, "\u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C"),
34
+ React.createElement(Button, { size: 's', view: 'secondary', onClick: onClear, className: styles.footerButton }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C")))));
35
+ };
36
+
37
+ export { OptionsList };
@@ -0,0 +1,65 @@
1
+ /* hash: 2o0po */
2
+ :root {
3
+ --color-light-bg-primary: #fff;
4
+ --color-light-border-primary: #dbdee1;
5
+ --color-light-text-secondary: #546272;
6
+ }
7
+ :root {
8
+
9
+ /* Hard */
10
+
11
+ /* Up */
12
+
13
+ /* Hard up */
14
+ }
15
+ :root {
16
+ --gap-s: 12px;
17
+ --gap-m: 16px;
18
+ --gap-xl: 24px;
19
+ }
20
+ :root {
21
+
22
+ /* options list */
23
+ --select-options-list-empty-placeholder-color: var(--color-light-text-secondary);
24
+
25
+ /* option */
26
+
27
+ /* checkmark */
28
+
29
+ /* optgroup */
30
+ }
31
+ :root {
32
+ --select-mobile-footer-border-top: 1px solid var(--color-light-border-primary);
33
+ --select-mobile-footer-background-color: var(--color-light-bg-primary);
34
+ }
35
+ .select__optionsList_1uyqp {
36
+ width: 100%;
37
+ outline: none;
38
+ box-sizing: border-box;
39
+ }
40
+ .select__emptyPlaceholder_1uyqp {
41
+ padding: var(--gap-m) var(--gap-s);
42
+ color: var(--select-options-list-empty-placeholder-color);
43
+ }
44
+ .select__l_1uyqp .select__emptyPlaceholder_1uyqp,
45
+ .select__xl_1uyqp .select__emptyPlaceholder_1uyqp {
46
+ padding: var(--gap-xl) var(--gap-m);
47
+ }
48
+ .select__footer_1uyqp {
49
+ display: flex;
50
+ justify-content: space-between;
51
+ position: sticky;
52
+ padding: var(--gap-m) var(--gap-m);
53
+ background-color: var(--color-light-bg-primary);
54
+ bottom: 0
55
+ }
56
+ .select__footer_1uyqp .select__footerButton_1uyqp:first-of-type {
57
+ margin-right: var(--gap-m);
58
+ }
59
+ .select__footerButton_1uyqp {
60
+ width: 50%;
61
+ }
62
+ .select__highlighted_1uyqp {
63
+ border-top: var(--select-mobile-footer-border-top);
64
+ background-color: var(--select-mobile-footer-background-color);
65
+ }
@@ -0,0 +1 @@
1
+ export * from "./Component";
@@ -0,0 +1,7 @@
1
+ import 'react';
2
+ import 'classnames';
3
+ import '../../../utils.js';
4
+ import '../../optgroup/Component.js';
5
+ import '@alfalab/core-components-button/dist/modern';
6
+ import '@alfalab/core-components-base-modal/dist/modern';
7
+ export { OptionsList } from './Component.js';
@@ -4,7 +4,7 @@ import { usePrevious, lastIndexOf, useVisibleOptions, isGroup } from '../../util
4
4
  import { Optgroup } from '../optgroup/Component.js';
5
5
  import { useVirtual } from 'react-virtual';
6
6
 
7
- var styles = {"virtualOptionsList":"select__virtualOptionsList_12i5x","scrollable":"select__scrollable_12i5x","inner":"select__inner_12i5x","virtualRow":"select__virtualRow_12i5x","highlighted":"select__highlighted_12i5x","emptyPlaceholder":"select__emptyPlaceholder_12i5x","l":"select__l_12i5x","xl":"select__xl_12i5x"};
7
+ var styles = {"virtualOptionsList":"select__virtualOptionsList_s71ed","scrollable":"select__scrollable_s71ed","inner":"select__inner_s71ed","virtualRow":"select__virtualRow_s71ed","highlighted":"select__highlighted_s71ed","emptyPlaceholder":"select__emptyPlaceholder_s71ed","l":"select__l_s71ed","xl":"select__xl_s71ed"};
8
8
  require('./index.css')
9
9
 
10
10
  /* eslint-disable react-hooks/exhaustive-deps */
@@ -1,4 +1,4 @@
1
- /* hash: 14p5n */
1
+ /* hash: ey66a */
2
2
  :root {
3
3
  --color-light-border-primary: #dbdee1;
4
4
  --color-light-text-secondary: #546272;
@@ -32,27 +32,27 @@
32
32
 
33
33
  /* optgroup */
34
34
  }
35
- .select__virtualOptionsList_12i5x {
35
+ .select__virtualOptionsList_s71ed {
36
36
  width: 100%;
37
37
  outline: none;
38
38
  box-sizing: border-box;
39
39
  position: relative;
40
40
  }
41
- .select__scrollable_12i5x {
41
+ .select__scrollable_s71ed {
42
42
  overflow: auto;
43
43
  width: 100%;
44
44
  }
45
- .select__inner_12i5x {
45
+ .select__inner_s71ed {
46
46
  position: relative;
47
47
  width: 100%;
48
48
  }
49
- .select__virtualRow_12i5x {
49
+ .select__virtualRow_s71ed {
50
50
  position: absolute;
51
51
  top: 0;
52
52
  left: 0;
53
53
  width: 100%
54
54
  }
55
- .select__virtualRow_12i5x:before {
55
+ .select__virtualRow_s71ed:before {
56
56
  content: '';
57
57
  position: absolute;
58
58
  z-index: 1;
@@ -63,18 +63,18 @@
63
63
  background: var(--select-option-divider-background);
64
64
  display: var(--select-option-divider-display);
65
65
  }
66
- .select__virtualRow_12i5x:first-child:before {
66
+ .select__virtualRow_s71ed:first-child:before {
67
67
  display: none;
68
68
  }
69
- .select__highlighted_12i5x:before,
70
- .select__highlighted_12i5x + .select__virtualRow_12i5x:before {
69
+ .select__highlighted_s71ed:before,
70
+ .select__highlighted_s71ed + .select__virtualRow_s71ed:before {
71
71
  display: none;
72
72
  }
73
- .select__emptyPlaceholder_12i5x {
73
+ .select__emptyPlaceholder_s71ed {
74
74
  padding: var(--gap-m) var(--gap-s);
75
75
  color: var(--select-options-list-empty-placeholder-color);
76
76
  }
77
- .select__l_12i5x .select__emptyPlaceholder_12i5x,
78
- .select__xl_12i5x .select__emptyPlaceholder_12i5x {
77
+ .select__l_s71ed .select__emptyPlaceholder_s71ed,
78
+ .select__xl_s71ed .select__emptyPlaceholder_s71ed {
79
79
  padding: var(--gap-xl) var(--gap-m);
80
80
  }
@@ -0,0 +1,2 @@
1
+ declare const getDataTestId: (dataTestId?: string | undefined, element?: string | undefined) => string | undefined;
2
+ export { getDataTestId };
@@ -30,11 +30,11 @@ declare const SELECT_ALL_KEY = "select_all";
30
30
  declare function useSelectWithApply({ options, selected, onChange, OptionsList, showClear, showSelectAll, }: useSelectWithApplyProps): {
31
31
  OptionsList: import("react").ForwardRefExoticComponent<import("./index").OptionsListProps & {
32
32
  showClear?: boolean | undefined;
33
- onApply?: (() => void) | undefined;
34
- onClear?: (() => void) | undefined;
35
33
  onClose?: (() => void) | undefined;
36
34
  selectedDraft?: OptionShape[] | undefined;
37
- OptionsList?: import("react").FC<import("./index").OptionsListProps & import("react").RefAttributes<unknown>> | undefined;
35
+ OptionsList?: import("react").FC<import("./index").OptionsListProps & import("react").RefAttributes<unknown>> | undefined; /**
36
+ * Показывать кнопку очистки
37
+ */
38
38
  } & import("react").RefAttributes<unknown>>;
39
39
  optionsListProps: {
40
40
  OptionsList: import("react").FC<import("./index").OptionsListProps> | undefined;
@@ -16,13 +16,17 @@ import 'resize-observer';
16
16
  import '@alfalab/core-components-popover/dist/modern';
17
17
  import 'downshift';
18
18
  import './components/native-select/Component.js';
19
- export { BaseSelect } from './components/base-select/Component.js';
19
+ export { B as BaseSelect } from './Component-9c4c2de2.js';
20
20
  export { Select } from './Component.js';
21
+ import '@alfalab/core-components-bottom-sheet/dist/modern';
22
+ import '@alfalab/core-components-button/dist/modern';
23
+ import '@alfalab/core-components-base-modal/dist/modern';
24
+ import './components/select-mobile/options-list/Component.js';
25
+ import './components/select-mobile/checkmark/Component.js';
26
+ export { a as SELECT_ALL_KEY, S as SelectMobile, u as useSelectWithApply } from './Component-6db2b45d.js';
21
27
  import 'react-virtual';
22
28
  export { VirtualOptionsList } from './components/virtual-options-list/Component.js';
23
29
  import '@alfalab/core-components-skeleton/dist/modern';
24
30
  export { useSelectWithLoading } from './presets/useSelectWithLoading/hook.js';
25
- import './intersection-observer-812c9e4f.js';
31
+ import './intersection-observer-ade41fff.js';
26
32
  export { useLazyLoading } from './presets/useLazyLoading/hook.js';
27
- import '@alfalab/core-components-button/dist/modern';
28
- export { S as SELECT_ALL_KEY, u as useSelectWithApply } from './hook-42b89ed1.js';
@@ -16,12 +16,16 @@ import 'resize-observer';
16
16
  import '@alfalab/core-components-popover/dist/modern';
17
17
  import 'downshift';
18
18
  import '../components/native-select/Component.js';
19
- import '../components/base-select/Component.js';
19
+ import '../Component-9c4c2de2.js';
20
20
  import '../Component.js';
21
+ import '@alfalab/core-components-bottom-sheet/dist/modern';
22
+ import '@alfalab/core-components-button/dist/modern';
23
+ import '@alfalab/core-components-base-modal/dist/modern';
24
+ import '../components/select-mobile/options-list/Component.js';
25
+ import '../components/select-mobile/checkmark/Component.js';
26
+ export { a as SELECT_ALL_KEY, u as useSelectWithApply } from '../Component-6db2b45d.js';
21
27
  import 'react-virtual';
22
28
  import '@alfalab/core-components-skeleton/dist/modern';
23
29
  export { useSelectWithLoading } from './useSelectWithLoading/hook.js';
24
- import '../intersection-observer-812c9e4f.js';
30
+ import '../intersection-observer-ade41fff.js';
25
31
  export { useLazyLoading } from './useLazyLoading/hook.js';
26
- import '@alfalab/core-components-button/dist/modern';
27
- export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../hook-42b89ed1.js';
@@ -4,9 +4,9 @@ import '@alfalab/core-components-checkbox/dist/modern';
4
4
  import '../../components/checkmark/Component.js';
5
5
  import { Option } from '../../components/option/Component.js';
6
6
  import { Skeleton } from '@alfalab/core-components-skeleton/dist/modern';
7
- import '../../intersection-observer-812c9e4f.js';
7
+ import '../../intersection-observer-ade41fff.js';
8
8
 
9
- var styles = {"skeleton":"select__skeleton_1cpda"};
9
+ var styles = {"skeleton":"select__skeleton_gdnja"};
10
10
  require('./index.css')
11
11
 
12
12
  const DEBOUNCE_TIMEOUT = 300;
@@ -1,5 +1,5 @@
1
- /* hash: 1cgdy */
2
- .select__skeleton_1cpda {
1
+ /* hash: mpehg */
2
+ .select__skeleton_gdnja {
3
3
  position: absolute;
4
4
  top: 50%;
5
5
  transform: translateY(-50%);