fix: add i18n props and delete onFocus

Author: zamkovskaya

src/components/RelativeRangeDatePicker/__stories__/RelativeRangeDatePiker.stories.tsx

@@ -132,7 +132,7 @@ export const CustomControl: StoryObj<RelativeRangeDatePickerProps> = {
                 {...props}
                 renderControl={({title, triggerProps, ref}) => {
                     return (
-                        <Button ref={ref} {...triggerProps}>
+                        <Button ref={ref} {...triggerProps} extraProps={triggerProps}>
                             {title || 'Not selected'}
                         </Button>
                     );

src/components/RelativeRangeDatePicker/components/Control/Control.tsx

@@ -11,6 +11,8 @@ import {getDefaultTitle} from '../../utils';
 
 import {i18n} from './i18n';
 
+import './Control.scss';
+
 export type ControlProps = {
     props: RelativeRangeDatePickerProps;
     state: RelativeRangeDatePickerState;
@@ -51,13 +53,17 @@ export const Control = React.forwardRef<HTMLInputElement, ControlProps>(
         const errorMessage = props.errorMessage ?? state.errors.join('\n');
 
         const triggerProps: RelativeRangeDatePickerTriggerProps = {
+            id: props.id,
             role: 'combobox',
             'aria-expanded': open,
+            'aria-label': props['aria-label'],
+            'aria-labelledby': props['aria-labelledby'],
+            'aria-describedby': props['aria-describedby'],
+            'aria-details': props['aria-details'],
             disabled: props.disabled,
             readOnly: props.readOnly,
-            onClick,
+            onClick: onClickCalendar,
             onKeyDown,
-            onFocus,
         };
 
         return props.renderControl ? (
@@ -68,7 +74,6 @@ export const Control = React.forwardRef<HTMLInputElement, ControlProps>(
                 validationState,
                 errorMessage,
                 open,
-                isMobile,
                 triggerProps,
             })
         ) : (
@@ -84,6 +89,7 @@ export const Control = React.forwardRef<HTMLInputElement, ControlProps>(
                         className: b('input', {mobile: isMobile}),
                         ...triggerProps,
                         disabled: isMobile,
+                        onClick,
                     }}
                     onKeyDown={onKeyDown}
                     onFocus={onFocus}

src/components/RelativeRangeDatePicker/types.ts

@@ -2,6 +2,7 @@ import type {DateTime} from '@gravity-ui/date-utils';
 
 import type {Value} from '../RelativeDatePicker';
 import type {
+    AccessibilityProps,
     DomProps,
     FocusableProps,
     InputBase,
@@ -32,7 +33,6 @@ export type RelativeRangeDatePickerTriggerProps = Pick<
     | 'aria-details'
     | 'onClick'
     | 'onKeyDown'
-    | 'onFocus'
     | 'disabled'
     | 'readOnly'
 >;
@@ -44,13 +44,13 @@ export interface RelativeRangeDatePickerRenderControlProps {
     errorMessage?: React.ReactNode;
     validationState?: 'invalid';
     open: boolean;
-    isMobile?: boolean;
     triggerProps: RelativeRangeDatePickerTriggerProps;
 }
 
 export interface RelativeRangeDatePickerProps
     extends RelativeRangeDatePickerStateOptions,
         DomProps,
+        AccessibilityProps,
         InputBase,
         InputDOMProps,
         TextInputProps,