@alfalab/core-components-select 17.11.0 → 17.12.1

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 (204) hide show
  1. package/components/arrow/Component.js +1 -1
  2. package/components/arrow/index.css +4 -4
  3. package/components/base-checkmark/Component.js +1 -1
  4. package/components/base-checkmark/index.css +7 -7
  5. package/components/base-option/Component.js +1 -1
  6. package/components/base-option/index.css +19 -18
  7. package/components/base-select/Component.js +2 -2
  8. package/components/base-select/components/list-desktop/list-popover-desktop.js +1 -1
  9. package/components/base-select/components/list-mobile/list-bottom-sheet-mobile.js +1 -1
  10. package/components/base-select/components/list-mobile/list-modal-mobile.js +1 -1
  11. package/components/base-select/index.css +25 -23
  12. package/components/base-select/mobile.css +17 -16
  13. package/components/checkmark/Component.js +1 -1
  14. package/components/checkmark/index.css +13 -12
  15. package/components/checkmark-mobile/Component.js +1 -1
  16. package/components/checkmark-mobile/index.css +7 -7
  17. package/components/clear-button/Component.js +1 -1
  18. package/components/clear-button/index.css +7 -7
  19. package/components/field/Component.js +1 -1
  20. package/components/field/index.css +13 -13
  21. package/components/footer/Component.js +1 -1
  22. package/components/footer/index.css +6 -6
  23. package/components/optgroup/Component.js +1 -1
  24. package/components/optgroup/index.css +7 -7
  25. package/components/option/Component.js +1 -1
  26. package/components/option/index.css +22 -22
  27. package/components/options-list/Component.js +3 -3
  28. package/components/options-list/index.css +15 -12
  29. package/components/search/Component.js +1 -1
  30. package/components/search/index.css +3 -3
  31. package/components/virtual-options-list/Component.js +1 -1
  32. package/components/virtual-options-list/index.css +21 -20
  33. package/cssm/components/arrow/index.module.css +1 -1
  34. package/cssm/components/base-checkmark/index.module.css +1 -1
  35. package/cssm/components/base-option/index.module.css +4 -3
  36. package/cssm/components/base-select/index.module.css +14 -12
  37. package/cssm/components/base-select/mobile.module.css +5 -4
  38. package/cssm/components/checkmark/index.module.css +3 -2
  39. package/cssm/components/checkmark-mobile/index.module.css +1 -1
  40. package/cssm/components/clear-button/index.module.css +1 -1
  41. package/cssm/components/field/index.module.css +1 -1
  42. package/cssm/components/footer/index.module.css +1 -1
  43. package/cssm/components/optgroup/index.module.css +1 -1
  44. package/cssm/components/option/index.module.css +3 -3
  45. package/cssm/components/options-list/Component.js +2 -2
  46. package/cssm/components/options-list/index.module.css +5 -2
  47. package/cssm/components/search/index.module.css +1 -1
  48. package/cssm/components/virtual-options-list/index.module.css +6 -5
  49. package/cssm/presets/useSelectWithApply/options-list-with-apply/footer/index.module.css +3 -1
  50. package/cssm/presets/useSelectWithApply/options-list-with-apply/footer/vars.css +0 -0
  51. package/cssm/presets/useSelectWithApply/options-list-with-apply/header/index.module.css +1 -1
  52. package/cssm/utils.d.ts +1 -1
  53. package/cssm/utils.js +11 -0
  54. package/esm/components/arrow/Component.js +1 -1
  55. package/esm/components/arrow/index.css +4 -4
  56. package/esm/components/base-checkmark/Component.js +1 -1
  57. package/esm/components/base-checkmark/index.css +7 -7
  58. package/esm/components/base-option/Component.js +1 -1
  59. package/esm/components/base-option/index.css +19 -18
  60. package/esm/components/base-select/Component.js +2 -2
  61. package/esm/components/base-select/components/list-desktop/list-popover-desktop.js +1 -1
  62. package/esm/components/base-select/components/list-mobile/list-bottom-sheet-mobile.js +1 -1
  63. package/esm/components/base-select/components/list-mobile/list-modal-mobile.js +1 -1
  64. package/esm/components/base-select/index.css +25 -23
  65. package/esm/components/base-select/mobile.css +17 -16
  66. package/esm/components/checkmark/Component.js +1 -1
  67. package/esm/components/checkmark/index.css +13 -12
  68. package/esm/components/checkmark-mobile/Component.js +1 -1
  69. package/esm/components/checkmark-mobile/index.css +7 -7
  70. package/esm/components/clear-button/Component.js +1 -1
  71. package/esm/components/clear-button/index.css +7 -7
  72. package/esm/components/field/Component.js +1 -1
  73. package/esm/components/field/index.css +13 -13
  74. package/esm/components/footer/Component.js +1 -1
  75. package/esm/components/footer/index.css +6 -6
  76. package/esm/components/optgroup/Component.js +1 -1
  77. package/esm/components/optgroup/index.css +7 -7
  78. package/esm/components/option/Component.js +1 -1
  79. package/esm/components/option/index.css +22 -22
  80. package/esm/components/options-list/Component.js +3 -3
  81. package/esm/components/options-list/index.css +15 -12
  82. package/esm/components/search/Component.js +1 -1
  83. package/esm/components/search/index.css +3 -3
  84. package/esm/components/virtual-options-list/Component.js +1 -1
  85. package/esm/components/virtual-options-list/index.css +21 -20
  86. package/esm/{list-popover-desktop-3b5200e4.js → list-popover-desktop-d8b3abfb.js} +1 -1
  87. package/esm/mobile/Component.mobile.js +1 -1
  88. package/esm/mobile.module-15868123.js +4 -0
  89. package/esm/presets/index.js +1 -1
  90. package/esm/presets/useSelectWithApply/hook.js +1 -1
  91. package/esm/presets/useSelectWithApply/options-list-with-apply/Component.js +1 -1
  92. package/esm/presets/useSelectWithApply/options-list-with-apply/footer/Component.js +1 -1
  93. package/esm/presets/useSelectWithApply/options-list-with-apply/footer/index.css +6 -4
  94. package/esm/presets/useSelectWithApply/options-list-with-apply/header/Component.js +1 -1
  95. package/esm/presets/useSelectWithApply/options-list-with-apply/header/index.css +3 -3
  96. package/esm/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
  97. package/esm/presets/useSelectWithApply/options-list-with-apply/index.js +1 -1
  98. package/esm/presets/useSelectWithLoading/hook.js +1 -1
  99. package/esm/presets/useSelectWithLoading/index.css +2 -2
  100. package/esm/shared/index.js +1 -1
  101. package/esm/utils.d.ts +1 -1
  102. package/esm/utils.js +13 -2
  103. package/{list-popover-desktop-3e8f155e.js → list-popover-desktop-4aec6d4b.js} +1 -1
  104. package/mobile/Component.mobile.js +1 -1
  105. package/mobile.module-54208123.js +6 -0
  106. package/modern/components/arrow/Component.js +1 -1
  107. package/modern/components/arrow/index.css +4 -4
  108. package/modern/components/base-checkmark/Component.js +1 -1
  109. package/modern/components/base-checkmark/index.css +7 -7
  110. package/modern/components/base-option/Component.js +1 -1
  111. package/modern/components/base-option/index.css +19 -18
  112. package/modern/components/base-select/Component.js +2 -2
  113. package/modern/components/base-select/components/list-desktop/list-popover-desktop.js +1 -1
  114. package/modern/components/base-select/components/list-mobile/list-bottom-sheet-mobile.js +1 -1
  115. package/modern/components/base-select/components/list-mobile/list-modal-mobile.js +1 -1
  116. package/modern/components/base-select/index.css +25 -23
  117. package/modern/components/base-select/mobile.css +17 -16
  118. package/modern/components/checkmark/Component.js +1 -1
  119. package/modern/components/checkmark/index.css +13 -12
  120. package/modern/components/checkmark-mobile/Component.js +1 -1
  121. package/modern/components/checkmark-mobile/index.css +7 -7
  122. package/modern/components/clear-button/Component.js +1 -1
  123. package/modern/components/clear-button/index.css +7 -7
  124. package/modern/components/field/Component.js +1 -1
  125. package/modern/components/field/index.css +13 -13
  126. package/modern/components/footer/Component.js +1 -1
  127. package/modern/components/footer/index.css +6 -6
  128. package/modern/components/optgroup/Component.js +1 -1
  129. package/modern/components/optgroup/index.css +7 -7
  130. package/modern/components/option/Component.js +1 -1
  131. package/modern/components/option/index.css +22 -22
  132. package/modern/components/options-list/Component.js +3 -3
  133. package/modern/components/options-list/index.css +15 -12
  134. package/modern/components/search/Component.js +1 -1
  135. package/modern/components/search/index.css +3 -3
  136. package/modern/components/virtual-options-list/Component.js +1 -1
  137. package/modern/components/virtual-options-list/index.css +21 -20
  138. package/modern/{list-popover-desktop-387dae64.js → list-popover-desktop-3bfc5ee1.js} +1 -1
  139. package/modern/mobile/Component.mobile.js +1 -1
  140. package/modern/mobile.module-3f4bbe1a.js +4 -0
  141. package/modern/presets/index.js +1 -1
  142. package/modern/presets/useSelectWithApply/hook.js +1 -1
  143. package/modern/presets/useSelectWithApply/options-list-with-apply/Component.js +1 -1
  144. package/modern/presets/useSelectWithApply/options-list-with-apply/footer/Component.js +1 -1
  145. package/modern/presets/useSelectWithApply/options-list-with-apply/footer/index.css +6 -4
  146. package/modern/presets/useSelectWithApply/options-list-with-apply/header/Component.js +1 -1
  147. package/modern/presets/useSelectWithApply/options-list-with-apply/header/index.css +3 -3
  148. package/modern/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
  149. package/modern/presets/useSelectWithApply/options-list-with-apply/index.js +1 -1
  150. package/modern/presets/useSelectWithLoading/hook.js +1 -1
  151. package/modern/presets/useSelectWithLoading/index.css +2 -2
  152. package/modern/shared/index.js +1 -1
  153. package/modern/utils.d.ts +1 -1
  154. package/modern/utils.js +13 -2
  155. package/moderncssm/components/base-option/index.module.css +2 -2
  156. package/moderncssm/components/base-select/index.module.css +11 -11
  157. package/moderncssm/components/base-select/mobile.module.css +3 -3
  158. package/moderncssm/components/checkmark/index.module.css +1 -1
  159. package/moderncssm/components/option/index.module.css +1 -2
  160. package/moderncssm/components/options-list/Component.js +2 -2
  161. package/moderncssm/components/options-list/index.module.css +4 -1
  162. package/moderncssm/components/virtual-options-list/index.module.css +4 -4
  163. package/moderncssm/presets/useSelectWithApply/options-list-with-apply/footer/index.module.css +4 -3
  164. package/moderncssm/presets/useSelectWithApply/options-list-with-apply/footer/vars.css +0 -0
  165. package/moderncssm/utils.d.ts +1 -1
  166. package/moderncssm/utils.js +13 -2
  167. package/package.json +15 -15
  168. package/presets/index.js +1 -1
  169. package/presets/useSelectWithApply/hook.js +1 -1
  170. package/presets/useSelectWithApply/options-list-with-apply/Component.js +1 -1
  171. package/presets/useSelectWithApply/options-list-with-apply/footer/Component.js +1 -1
  172. package/presets/useSelectWithApply/options-list-with-apply/footer/index.css +6 -4
  173. package/presets/useSelectWithApply/options-list-with-apply/header/Component.js +1 -1
  174. package/presets/useSelectWithApply/options-list-with-apply/header/index.css +3 -3
  175. package/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
  176. package/presets/useSelectWithApply/options-list-with-apply/index.js +1 -1
  177. package/presets/useSelectWithLoading/hook.js +1 -1
  178. package/presets/useSelectWithLoading/index.css +2 -2
  179. package/shared/index.js +1 -1
  180. package/src/components/base-option/index.module.css +2 -2
  181. package/src/components/base-select/index.module.css +8 -8
  182. package/src/components/base-select/mobile.module.css +3 -3
  183. package/src/components/option/index.module.css +1 -2
  184. package/src/components/options-list/Component.tsx +2 -1
  185. package/src/components/options-list/index.module.css +5 -1
  186. package/src/components/virtual-options-list/index.module.css +4 -4
  187. package/src/presets/useSelectWithApply/options-list-with-apply/footer/index.module.css +2 -1
  188. package/src/presets/useSelectWithApply/options-list-with-apply/footer/vars.css +3 -0
  189. package/src/utils.ts +28 -3
  190. package/src/vars.css +4 -4
  191. package/utils.d.ts +1 -1
  192. package/utils.js +11 -0
  193. package/esm/mobile.module-841dbab1.js +0 -4
  194. package/mobile.module-6a431abb.js +0 -6
  195. package/modern/mobile.module-5583797d.js +0 -4
  196. /package/esm/{hook-4a4a5429.d.ts → hook-9859170a.d.ts} +0 -0
  197. /package/esm/{hook-4a4a5429.js → hook-9859170a.js} +0 -0
  198. /package/esm/{list-popover-desktop-3b5200e4.d.ts → list-popover-desktop-d8b3abfb.d.ts} +0 -0
  199. /package/{hook-06aedfaf.d.ts → hook-9116639c.d.ts} +0 -0
  200. /package/{hook-06aedfaf.js → hook-9116639c.js} +0 -0
  201. /package/{list-popover-desktop-3e8f155e.d.ts → list-popover-desktop-4aec6d4b.d.ts} +0 -0
  202. /package/modern/{hook-07ac3ee1.d.ts → hook-8e453871.d.ts} +0 -0
  203. /package/modern/{hook-07ac3ee1.js → hook-8e453871.js} +0 -0
  204. /package/modern/{list-popover-desktop-387dae64.d.ts → list-popover-desktop-3bfc5ee1.d.ts} +0 -0
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { ButtonDesktop } from '@alfalab/core-components-button/modern/desktop';
3
3
  import { getDataTestId } from '@alfalab/core-components-shared/modern';
4
4
 
5
- const styles = {"footer":"select__footer_xl99m","button":"select__button_xl99m"};
5
+ const styles = {"footer":"select__footer_yg98u","button":"select__button_yg98u"};
6
6
  require('./index.css')
7
7
 
8
8
  const Footer = ({ handleApply, handleClear, showClear, selectedDraft = [], dataTestId, }) => (React.createElement("div", {
@@ -1,4 +1,4 @@
1
- /* hash: f1i06 */
1
+ /* hash: y80va */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-base-bg-primary: #fff; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -23,10 +23,12 @@
23
23
  --gap-12: var(--gap-s);
24
24
  } :root {
25
25
  } :root {
26
- } .select__footer_xl99m {
26
+ } /* сбрасывает синюю подсветку при нажатии */ :root {
27
+ --select-option-list-footer-button-gap: var(--gap-8);
28
+ } .select__footer_yg98u {
27
29
  background-color: var(--color-light-base-bg-primary);
28
30
  padding: var(--gap-12);
29
31
  outline: none
30
- } .select__footer_xl99m > .select__button_xl99m + .select__button_xl99m {
31
- margin-left: var(--gap-8);
32
+ } .select__footer_yg98u > .select__button_yg98u + .select__button_yg98u {
33
+ margin-left: var(--select-option-list-footer-button-gap);
32
34
  }
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import cn from 'classnames';
3
3
  import { Checkbox } from '@alfalab/core-components-checkbox/modern';
4
4
 
5
- const styles = {"desktop":"select__desktop_rc4tb","mobile":"select__mobile_rc4tb"};
5
+ const styles = {"desktop":"select__desktop_qh4u3","mobile":"select__mobile_qh4u3"};
6
6
  require('./index.css')
7
7
 
8
8
  const Header = ({ onChange, checked, indeterminate, mobile }) => (React.createElement("div", { className: cn({ [styles.desktop]: !mobile, [styles.mobile]: mobile }) },
@@ -1,4 +1,4 @@
1
- /* hash: 8sdjv */
1
+ /* hash: q8wgk */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -22,8 +22,8 @@
22
22
  --gap-12: var(--gap-s);
23
23
  } :root {
24
24
  } :root {
25
- } .select__desktop_rc4tb {
25
+ } /* сбрасывает синюю подсветку при нажатии */ .select__desktop_qh4u3 {
26
26
  padding: var(--gap-12);
27
- } .select__mobile_rc4tb {
27
+ } .select__mobile_qh4u3 {
28
28
  padding: var(--gap-12) var(--gap-8);
29
29
  }
@@ -1 +1 @@
1
- export * from "../../../hook-07ac3ee1";
1
+ export * from "../../../hook-8e453871";
@@ -1 +1 @@
1
- export { O as OptionsListWithApply } from '../../../hook-07ac3ee1.js';
1
+ export { O as OptionsListWithApply } from '../../../hook-8e453871.js';
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { Skeleton } from '@alfalab/core-components-skeleton/modern';
3
3
  import { Option } from '../../components/option/Component.js';
4
4
 
5
- const styles = {"skeleton":"select__skeleton_1tkpm"};
5
+ const styles = {"skeleton":"select__skeleton_ckvwc"};
6
6
  require('./index.css')
7
7
 
8
8
  function useSelectWithLoading({ loading = false, visibleOptions = 6, Option: Option$1 = Option, }) {
@@ -1,5 +1,5 @@
1
- /* hash: pke3d */
2
- .select__skeleton_1tkpm {
1
+ /* hash: 19h9k */
2
+ .select__skeleton_ckvwc {
3
3
  position: absolute;
4
4
  top: 50%;
5
5
  transform: translateY(-50%);
@@ -1,6 +1,6 @@
1
1
  export { useSelectWithLoading } from '../presets/useSelectWithLoading/hook.js';
2
2
  export { useLazyLoading } from '../presets/useLazyLoading/hook.js';
3
- export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../hook-07ac3ee1.js';
3
+ export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../hook-8e453871.js';
4
4
  export { defaultAccessor, defaultFilterFn, defaultGroupAccessor, getSelectTestIds, isGroup, isOptionShape, joinOptions, lastIndexOf, processOptions, usePrevious, useVisibleOptions } from '../utils.js';
5
5
  export { Option } from '../components/option/Component.js';
6
6
  export { BaseOption } from '../components/base-option/Component.js';
package/modern/utils.d.ts CHANGED
@@ -45,7 +45,7 @@ type useVisibleOptionsArgs = {
45
45
  */
46
46
  actualOptionsCount?: boolean;
47
47
  };
48
- declare function useVisibleOptions({ visibleOptions, listRef, styleTargetRef, open, invalidate, options, size, actualOptionsCount, }: useVisibleOptionsArgs): void;
48
+ declare function useVisibleOptions({ visibleOptions, listRef, styleTargetRef, open, invalidate, options, size, actualOptionsCount, }: useVisibleOptionsArgs): boolean;
49
49
  declare function defaultFilterFn(optionText: string, search: string): boolean;
50
50
  declare function defaultGroupAccessor(option: GroupShape): string | undefined;
51
51
  declare function defaultAccessor(option: OptionShape): string;
package/modern/utils.js CHANGED
@@ -1,5 +1,5 @@
1
- import { isValidElement, cloneElement, useEffect, useRef } from 'react';
2
- import { getDataTestId } from '@alfalab/core-components-shared/modern';
1
+ import { isValidElement, cloneElement, useState, useEffect, useRef } from 'react';
2
+ import { useIsMounted, fnUtils, getDataTestId } from '@alfalab/core-components-shared/modern';
3
3
 
4
4
  const isGroup = (item) => Object.prototype.hasOwnProperty.call(item, 'options');
5
5
  const isOptionShape = (item) => !!item && Object.prototype.hasOwnProperty.call(item, 'key');
@@ -69,6 +69,8 @@ function processOptions(options, selected = [], filterFn = () => true, filterGro
69
69
  return { filteredOptions, flatOptions, selectedOptions };
70
70
  }
71
71
  function useVisibleOptions({ visibleOptions, listRef, styleTargetRef = listRef, open, invalidate, options, size, actualOptionsCount, }) {
72
+ const [, runIfMounted] = useIsMounted();
73
+ const [measured, setMeasured] = useState(false);
72
74
  useEffect(() => {
73
75
  const measureOptionHeight = (element) => typeof size === 'number' ? Math.min(element.clientHeight, size) : element.clientHeight;
74
76
  const list = listRef.current;
@@ -96,8 +98,15 @@ function useVisibleOptions({ visibleOptions, listRef, styleTargetRef = listRef,
96
98
  height += size / 2;
97
99
  }
98
100
  }
101
+ const prevHeight = styleTarget.style.height;
99
102
  styleTarget.style.height = `${height}px`;
103
+ setMeasured(true);
104
+ return () => {
105
+ styleTarget.style.height = prevHeight;
106
+ runIfMounted(() => setMeasured(false));
107
+ };
100
108
  }
109
+ return fnUtils.noop;
101
110
  }, [
102
111
  actualOptionsCount,
103
112
  listRef,
@@ -107,7 +116,9 @@ function useVisibleOptions({ visibleOptions, listRef, styleTargetRef = listRef,
107
116
  styleTargetRef,
108
117
  visibleOptions,
109
118
  invalidate,
119
+ runIfMounted,
110
120
  ]);
121
+ return measured;
111
122
  }
112
123
  function defaultFilterFn(optionText, search) {
113
124
  if (!search)
@@ -39,13 +39,13 @@
39
39
  color: var(--select-option-active-color);
40
40
  }
41
41
  .option.checkmarkBefore {
42
- padding: 0 0 0 var(--gap-12)
42
+ padding: var(--gap-0) var(--gap-0) var(--gap-0) var(--gap-12)
43
43
  }
44
44
  .option.checkmarkBefore.mobile {
45
45
  padding-left: var(--gap-16);
46
46
  }
47
47
  .option.checkmarkAfter.checkmarkAfter {
48
- padding: 0 var(--gap-12) 0 0
48
+ padding: var(--gap-0) var(--gap-12) var(--gap-0) var(--gap-0)
49
49
  }
50
50
  .option.checkmarkAfter.checkmarkAfter.mobile {
51
51
  padding-right: var(--gap-20);
@@ -3,11 +3,11 @@
3
3
 
4
4
  /* options list */
5
5
 
6
- --select-options-list-border-radius: var(--border-radius-m);
6
+ --select-options-list-border-radius: var(--border-radius-8);
7
7
  --select-options-list-box-shadow: var(--shadow-m);
8
8
  --select-options-list-offset: var(--gap-4);
9
- --select-options-list-top-padding: 0;
10
- --select-options-list-bottom-padding: 0;
9
+ --select-options-list-top-padding: var(--gap-0);
10
+ --select-options-list-bottom-padding: var(--gap-0);
11
11
 
12
12
  /* option */
13
13
  --select-option-background: var(--color-light-modal-bg-primary);
@@ -45,10 +45,10 @@
45
45
  }
46
46
  .optionsListBorder {
47
47
  position: absolute;
48
- top: 0;
49
- right: 0;
50
- bottom: 0;
51
- left: 0;
48
+ top: var(--gap-0);
49
+ right: var(--gap-0);
50
+ bottom: var(--gap-0);
51
+ left: var(--gap-0);
52
52
  box-shadow: inset 0 0 0 1px var(--color-light-neutral-300);
53
53
  border-radius: inherit;
54
54
  pointer-events: none;
@@ -57,9 +57,9 @@
57
57
  opacity: 0;
58
58
  overflow: hidden;
59
59
  position: absolute;
60
- top: 0;
61
- bottom: 0;
62
- left: 0;
60
+ top: var(--gap-0);
61
+ bottom: var(--gap-0);
62
+ left: var(--gap-0);
63
63
  width: 100%;
64
64
  max-width: 100%;
65
65
  min-width: 0;
@@ -74,7 +74,7 @@
74
74
  text-align: center;
75
75
  }
76
76
  .search {
77
- margin: var(--gap-12) var(--gap-12) 0
77
+ margin: var(--gap-12) var(--gap-12) var(--gap-0)
78
78
  }
79
79
  .search:last-child {
80
80
  margin-bottom: var(--gap-12);
@@ -13,15 +13,15 @@
13
13
  overflow: hidden;
14
14
  }
15
15
  .sheetContent.sheetContent {
16
- padding: 0
16
+ padding: var(--gap-0)
17
17
  }
18
18
  .sheetContent.sheetContent .modalContent {
19
- padding: 0;
19
+ padding: var(--gap-0);
20
20
  display: flex;
21
21
  flex-direction: column;
22
22
  }
23
23
  .sheetContainer {
24
- padding: 0;
24
+ padding: var(--gap-0);
25
25
  }
26
26
  .optionsListWrapper {
27
27
  flex: 1;
@@ -7,7 +7,7 @@
7
7
 
8
8
  /* checkmark */
9
9
 
10
- --select-checkmark-margin: 0 var(--gap-8) 0 0;
10
+ --select-checkmark-margin: var(--gap-0) var(--gap-8) var(--gap-0) var(--gap-0);
11
11
  --select-checkmark-margin-after: var(--select-checkmark-margin);
12
12
  --select-checkmark-size: 4px;
13
13
  --select-checkmark-before-display: 'flex';
@@ -51,7 +51,7 @@
51
51
  position: absolute;
52
52
  left: var(--select-option-left-padding);
53
53
  right: var(--select-option-right-padding);
54
- top: 0;
54
+ top: var(--gap-0);
55
55
  height: 1px;
56
56
  background: var(--select-option-divider-background);
57
57
  display: var(--select-option-divider-display);
@@ -103,7 +103,6 @@
103
103
  overflow: hidden;
104
104
  flex: 1;
105
105
  text-overflow: ellipsis;
106
- white-space: nowrap;
107
106
  }
108
107
  .textContent {
109
108
  padding-top: var(--gap-12);
@@ -39,7 +39,7 @@ const OptionsList = forwardRef(({ size = 48, className, optionGroupClassName, sc
39
39
  };
40
40
  return (React.createElement(Optgroup$1, { className: optionGroupClassName, label: group.label, key: group.label, size: size, options: group.options, selectedItems: groupSelectedItems, setSelectedItems: handleSelectedItems, search: search, multiple: multiple, ...groupOptionProps }, group.options.map((option) => renderOption(option, counter()))));
41
41
  };
42
- useVisibleOptions({
42
+ const measured = useVisibleOptions({
43
43
  ...(!nativeScrollbar && { styleTargetRef: scrollbarRef }),
44
44
  visibleOptions,
45
45
  listRef,
@@ -69,7 +69,7 @@ const OptionsList = forwardRef(({ size = 48, className, optionGroupClassName, sc
69
69
  'data-test-id': dataTestId,
70
70
  ref: ref,
71
71
  };
72
- return (React.createElement(Scrollbar, { className: cn(styles.scrollable, scrollbarClassName), ref: scrollbarRef, horizontalAutoStretch: optionsListWidth === 'content', scrollableNodeProps: scrollableNodeProps, contentNodeProps: { ref: listRef } }, renderListItems()));
72
+ return (React.createElement(Scrollbar, { className: cn(styles.scrollable, scrollbarClassName), ref: scrollbarRef, horizontalAutoStretch: optionsListWidth === 'content', scrollableNodeProps: scrollableNodeProps, contentNodeProps: { ref: listRef }, maskProps: { className: measured ? undefined : styles.mask } }, renderListItems()));
73
73
  };
74
74
  const renderWithNativeScrollbar = () => (React.createElement("div", { className: cn(styles.scrollable, scrollbarClassName), ref: mergeRefs([listRef, ref]), onScroll: handleScroll }, renderListItems()));
75
75
  const resetHighlightedIndex = () => setHighlightedIndex?.(-1);
@@ -26,7 +26,7 @@
26
26
  }
27
27
  .optionsListFooter {
28
28
  position: sticky;
29
- bottom: 0;
29
+ bottom: var(--gap-0);
30
30
  box-sizing: border-box;
31
31
  border-top: 1px solid transparent;
32
32
  transition: border-color 0.2s ease
@@ -38,6 +38,9 @@
38
38
  overflow: auto;
39
39
  width: 100%;
40
40
  }
41
+ .mask {
42
+ min-width: 4000px;
43
+ }
41
44
  .emptyPlaceholder {
42
45
  padding: var(--gap-16) var(--gap-12);
43
46
  color: var(--select-options-list-empty-placeholder-color);
@@ -28,7 +28,7 @@
28
28
  }
29
29
  .virtualOptionsListFooter {
30
30
  position: sticky;
31
- bottom: 0;
31
+ bottom: var(--gap-0);
32
32
  box-sizing: border-box;
33
33
  border-top: 1px solid transparent
34
34
  }
@@ -46,8 +46,8 @@
46
46
  }
47
47
  .virtualRow {
48
48
  position: absolute;
49
- top: 0;
50
- left: 0;
49
+ top: var(--gap-0);
50
+ left: var(--gap-0);
51
51
  width: 100%
52
52
  }
53
53
  .virtualRow:before {
@@ -56,7 +56,7 @@
56
56
  z-index: 1;
57
57
  left: var(--select-option-left-padding);
58
58
  right: var(--select-option-right-padding);
59
- top: 0;
59
+ top: var(--gap-0);
60
60
  height: 1px;
61
61
  background: var(--select-option-divider-background);
62
62
  display: var(--select-option-divider-display);
@@ -1,11 +1,12 @@
1
1
  /* */
2
-
2
+ :root {
3
+ --select-option-list-footer-button-gap: var(--gap-8);
4
+ }
3
5
  .footer {
4
6
  background-color: var(--color-light-base-bg-primary);
5
7
  padding: var(--gap-12);
6
8
  outline: none
7
9
  }
8
-
9
10
  .footer > .button + .button {
10
- margin-left: var(--gap-8);
11
+ margin-left: var(--select-option-list-footer-button-gap);
11
12
  }
@@ -45,7 +45,7 @@ type useVisibleOptionsArgs = {
45
45
  */
46
46
  actualOptionsCount?: boolean;
47
47
  };
48
- declare function useVisibleOptions({ visibleOptions, listRef, styleTargetRef, open, invalidate, options, size, actualOptionsCount, }: useVisibleOptionsArgs): void;
48
+ declare function useVisibleOptions({ visibleOptions, listRef, styleTargetRef, open, invalidate, options, size, actualOptionsCount, }: useVisibleOptionsArgs): boolean;
49
49
  declare function defaultFilterFn(optionText: string, search: string): boolean;
50
50
  declare function defaultGroupAccessor(option: GroupShape): string | undefined;
51
51
  declare function defaultAccessor(option: OptionShape): string;
@@ -1,5 +1,5 @@
1
- import { isValidElement, cloneElement, useEffect, useRef } from 'react';
2
- import { getDataTestId } from '@alfalab/core-components-shared/moderncssm';
1
+ import { isValidElement, cloneElement, useState, useEffect, useRef } from 'react';
2
+ import { useIsMounted, fnUtils, getDataTestId } from '@alfalab/core-components-shared/moderncssm';
3
3
 
4
4
  const isGroup = (item) => Object.prototype.hasOwnProperty.call(item, 'options');
5
5
  const isOptionShape = (item) => !!item && Object.prototype.hasOwnProperty.call(item, 'key');
@@ -69,6 +69,8 @@ function processOptions(options, selected = [], filterFn = () => true, filterGro
69
69
  return { filteredOptions, flatOptions, selectedOptions };
70
70
  }
71
71
  function useVisibleOptions({ visibleOptions, listRef, styleTargetRef = listRef, open, invalidate, options, size, actualOptionsCount, }) {
72
+ const [, runIfMounted] = useIsMounted();
73
+ const [measured, setMeasured] = useState(false);
72
74
  useEffect(() => {
73
75
  const measureOptionHeight = (element) => typeof size === 'number' ? Math.min(element.clientHeight, size) : element.clientHeight;
74
76
  const list = listRef.current;
@@ -96,8 +98,15 @@ function useVisibleOptions({ visibleOptions, listRef, styleTargetRef = listRef,
96
98
  height += size / 2;
97
99
  }
98
100
  }
101
+ const prevHeight = styleTarget.style.height;
99
102
  styleTarget.style.height = `${height}px`;
103
+ setMeasured(true);
104
+ return () => {
105
+ styleTarget.style.height = prevHeight;
106
+ runIfMounted(() => setMeasured(false));
107
+ };
100
108
  }
109
+ return fnUtils.noop;
101
110
  }, [
102
111
  actualOptionsCount,
103
112
  listRef,
@@ -107,7 +116,9 @@ function useVisibleOptions({ visibleOptions, listRef, styleTargetRef = listRef,
107
116
  styleTargetRef,
108
117
  visibleOptions,
109
118
  invalidate,
119
+ runIfMounted,
110
120
  ]);
121
+ return measured;
111
122
  }
112
123
  function defaultFilterFn(optionText, search) {
113
124
  if (!search)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-select",
3
- "version": "17.11.0",
3
+ "version": "17.12.1",
4
4
  "description": "Select component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -15,19 +15,19 @@
15
15
  "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
16
16
  },
17
17
  "dependencies": {
18
- "@alfalab/core-components-badge": "^5.6.0",
19
- "@alfalab/core-components-base-modal": "^5.8.0",
20
- "@alfalab/core-components-bottom-sheet": "^6.17.0",
21
- "@alfalab/core-components-button": "^11.6.0",
22
- "@alfalab/core-components-checkbox": "^4.6.0",
23
- "@alfalab/core-components-form-control": "^12.3.0",
24
- "@alfalab/core-components-input": "^15.1.0",
25
- "@alfalab/core-components-modal": "^9.4.0",
18
+ "@alfalab/core-components-badge": "^5.6.1",
19
+ "@alfalab/core-components-base-modal": "^5.8.1",
20
+ "@alfalab/core-components-bottom-sheet": "^6.17.2",
21
+ "@alfalab/core-components-button": "^11.7.1",
22
+ "@alfalab/core-components-checkbox": "^4.6.1",
23
+ "@alfalab/core-components-form-control": "^12.4.0",
24
+ "@alfalab/core-components-input": "^15.1.2",
25
+ "@alfalab/core-components-modal": "^9.5.1",
26
26
  "@alfalab/core-components-mq": "^4.3.0",
27
- "@alfalab/core-components-popover": "^6.3.0",
28
- "@alfalab/core-components-scrollbar": "^3.1.0",
29
- "@alfalab/core-components-skeleton": "^5.1.0",
30
- "@alfalab/core-components-shared": "^0.12.0",
27
+ "@alfalab/core-components-popover": "^6.3.1",
28
+ "@alfalab/core-components-scrollbar": "^3.1.1",
29
+ "@alfalab/core-components-skeleton": "^5.2.0",
30
+ "@alfalab/core-components-shared": "^0.12.1",
31
31
  "@alfalab/hooks": "^1.13.0",
32
32
  "@alfalab/icons-glyph": "^2.139.0",
33
33
  "@juggle/resize-observer": "^3.3.1",
@@ -39,6 +39,6 @@
39
39
  "react-virtual": "^2.3.2",
40
40
  "tslib": "^2.4.0"
41
41
  },
42
- "themesVersion": "13.1.0",
43
- "varsVersion": "9.12.0"
42
+ "themesVersion": "13.2.0",
43
+ "varsVersion": "9.13.1"
44
44
  }
package/presets/index.js CHANGED
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var presets_useSelectWithLoading_hook = require('./useSelectWithLoading/hook.js');
6
6
  var presets_useLazyLoading_hook = require('./useLazyLoading/hook.js');
7
- var presets_useSelectWithApply_optionsListWithApply_Component = require('../hook-06aedfaf.js');
7
+ var presets_useSelectWithApply_optionsListWithApply_Component = require('../hook-9116639c.js');
8
8
 
9
9
 
10
10
 
@@ -6,7 +6,7 @@ require('tslib');
6
6
  require('react');
7
7
  require('deep-equal');
8
8
  require('../../utils.js');
9
- var presets_useSelectWithApply_optionsListWithApply_Component = require('../../hook-06aedfaf.js');
9
+ var presets_useSelectWithApply_optionsListWithApply_Component = require('../../hook-9116639c.js');
10
10
 
11
11
 
12
12
 
@@ -6,7 +6,7 @@ require('tslib');
6
6
  require('react');
7
7
  require('../../../components/options-list/Component.js');
8
8
  require('../../../consts.js');
9
- var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../hook-06aedfaf.js');
9
+ var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../hook-9116639c.js');
10
10
  require('./footer/Component.js');
11
11
  require('./header/Component.js');
12
12
 
@@ -10,7 +10,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
10
10
 
11
11
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
12
12
 
13
- var styles = {"footer":"select__footer_xl99m","button":"select__button_xl99m"};
13
+ var styles = {"footer":"select__footer_yg98u","button":"select__button_yg98u"};
14
14
  require('./index.css')
15
15
 
16
16
  var Footer = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: f1i06 */
1
+ /* hash: y80va */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-base-bg-primary: #fff; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -23,10 +23,12 @@
23
23
  --gap-12: var(--gap-s);
24
24
  } :root {
25
25
  } :root {
26
- } .select__footer_xl99m {
26
+ } /* сбрасывает синюю подсветку при нажатии */ :root {
27
+ --select-option-list-footer-button-gap: var(--gap-8);
28
+ } .select__footer_yg98u {
27
29
  background-color: var(--color-light-base-bg-primary);
28
30
  padding: var(--gap-12);
29
31
  outline: none
30
- } .select__footer_xl99m > .select__button_xl99m + .select__button_xl99m {
31
- margin-left: var(--gap-8);
32
+ } .select__footer_yg98u > .select__button_yg98u + .select__button_yg98u {
33
+ margin-left: var(--select-option-list-footer-button-gap);
32
34
  }