fix(Calendar): nowrap for select

SevereCloud · SevereCloud · commit 08bfcaa88f6b · 2026-02-13T13:09:43.000+03:00
diff --git a/packages/vkui/src/components/CalendarTime/CalendarTimePicker.tsx b/packages/vkui/src/components/CalendarTime/CalendarTimePicker.tsx
@@ -4,6 +4,7 @@ import { type ChangeEvent, useState } from 'react';
 import * as React from 'react';
 import { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';
 import { CustomSelect, type SelectProps } from '../CustomSelect/CustomSelect';
+import { CustomSelectOption } from '../CustomSelectOption/CustomSelectOption';
 import styles from './CalendarTime.module.css';
 
 const selectFilterFn = () => true;
@@ -78,6 +79,11 @@ export const CalendarTimePicker = ({
           filterFn={selectFilterFn}
           onInputChange={onPickerValueChange}
           onInputKeyDown={onInputKeyDown}
+          renderOption={({ children: optionChildren, ...optionProps }) => (
+            <CustomSelectOption {...optionProps} textNoWrap>
+              {optionChildren}
+            </CustomSelectOption>
+          )}
           slotProps={{
             input: {
               'aria-label': inputLabel,
diff --git a/packages/vkui/src/components/CustomSelectOption/CustomSelectOption.module.css b/packages/vkui/src/components/CustomSelectOption/CustomSelectOption.module.css
@@ -55,6 +55,10 @@
   word-break: break-word;
 }
 
+.textNoWrap {
+  white-space: nowrap;
+}
+
 .after {
   display: flex;
   flex-shrink: 0;
diff --git a/packages/vkui/src/components/CustomSelectOption/CustomSelectOption.tsx b/packages/vkui/src/components/CustomSelectOption/CustomSelectOption.tsx
@@ -55,6 +55,10 @@ export interface CustomSelectOptionProps extends HTMLAttributesWithRootRef<HTMLD
    * опции.
    */
   disabled?: boolean;
+  /**
+   * Предотвращает перенос текста внутри опции.
+   */
+  textNoWrap?: boolean;
 }
 
 /**
@@ -69,6 +73,7 @@ export const CustomSelectOption = ({
   after,
   description,
   disabled,
+  textNoWrap,
   style: styleProp,
   className,
   onClick,
@@ -107,7 +112,9 @@ export const CustomSelectOption = ({
     >
       {hasReactNode(before) && <div className={styles.before}>{before}</div>}
       <div className={styles.main}>
-        <div className={styles.children}>{children}</div>
+        <div className={classNames(styles.children, textNoWrap && styles.textNoWrap)}>
+          {children}
+        </div>
         {hasReactNode(description) && (
           <Footnote className={styles.description}>
             <VisuallyHidden>&nbsp;</VisuallyHidden>
