Enhance Calendar Accessibility and Usability

This commit focuses on improving the accessibility and usability of the calendar component within our application. Key accessibility enhancements include the addition of `ariaDisabled` and `ariaLabel` attributes to the `MonthSelector` and `YearSelector` components, significantly improving screen reader support. These attributes provide users with disabilities a more intuitive and navigable experience. On the usability front, the `inputDate` component has been updated to offer a more flexible date range selection. This was achieved by adjusting the `maxDate` and `minDate` properties within `inputDate.stories.tsx`, allowing users to select dates that better suit their needs. Together, these changes aim to create a more inclusive and user-friendly calendar component.

Author: Kubit

src/components/calendar/selector/monthSelector/monthSelector.tsx

@@ -68,6 +68,8 @@ export const MonthSelector = (props: IMonthSelector): JSX.Element => {
             styles={props.styles}
           >
             <ItemRove
+              ariaDisabled={setDisabledMonths(index)}
+              ariaLabel={month.charAt(0).toUpperCase() + month.slice(1)}
               asElement={MonthElementStyled}
               focus={focus === index}
               index={index}

src/components/calendar/selector/yearSelector/yearSelector.tsx

@@ -59,6 +59,7 @@ export const YearSelector = (props: IYearSelector): JSX.Element => {
         return (
           <YearListStyled key={index} state={state} styles={props.styles}>
             <ItemRove
+              ariaLabel={String(year)}
               asElement={YearElementStyled}
               focus={focus === index}
               index={index}