text: import * as React from 'react';
  import PropTypes from 'prop-types';
  import { useTheme, styled, useThemeProps as useThemProps } from '@mui/material/styles';
  import { unstable_composeClasses as composeClasses } from '@mui/material';
  import clsx from 'clsx';
  import { PickersYear } from './PickersYear';
  import { useUtils, useNow } from '../internals/hooks/useUtils';
  import { findClosestEnabledDate } from '../internals/utils/date-utils';
  import { WrapperVariantContext } from '../internals/components/wrappers/WrapperVariantContext';
  import { getYearPickerUtilityClass } from './yearPickerClasses';
  import { jsx as _jsx } from "react/jsx-runtime";
  
  const useUtilityClasses = ownerState => {
    const {
      classes
    } = ownerState;
    const slots = {
      root: ['root']
    };
    return composeClasses(slots, getYearPickerUtilityClass, classes);
  };
  
  const YearPickerRoot = styled('div', {
    name: 'MuiYearPicker',
    slot: 'Root',
    overridesResolver: (props, styles) => styles.root
  })({
    display: 'flex',
    flexDirection: 'row',
    flexWrap: 'wrap',
    overflowY: 'auto',
    height: '100%',
    margin: '0 4px'
  });
  export const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProps, ref) {
    const props = useThemProps({
      props: inProps,
      name: 'MuiYearPicker'
    });
    const {
      autoFocus,
      className,
      date,
      disabled,
      disableFuture,
      disablePast,
      isDateDisabled,
      maxDate,
      minDate,
      onChange,
      onFocusedDayChange,
      onYearChange,
      readOnly,
      shouldDisableYear
    } = props;
    const ownerState = props;
    const classes = useUtilityClasses(ownerState);
    const now = useNow();
    const theme = useTheme();
    const utils = useUtils();
    const selectedDate = date || now;
    const currentYear = utils.getYear(selectedDate);
    const wrapperVariant = React.useContext(WrapperVariantContext);
    const selectedYearRef = React.useRef(null);
    const [focusedYear, setFocusedYear] = React.useState(currentYear);
  
    const handleYearSelection = (event, year, isFinish = 'finish') => {
      if (readOnly) {
        return;
      }
  
      const submitDate = newDate => {
        onChange(newDate, isFinish);
  
        if (onFocusedDayChange) {
          onFocusedDayChange(newDate || now);
        }
  
        if (onYearChange) {
          onYearChange(newDate);
        }
      };
  
      const newDate = utils.setYear(selectedDate, year);
  
      if (isDateDisabled(newDate)) {
        const closestEnabledDate = findClosestEnabledDate({
          utils,
          date: newDate,
          minDate,
          maxDate,
          disablePast: Boolean(disablePast),
          disableFuture: Boolean(disableFuture),
          shouldDisableDate: isDateDisabled
        });
        submitDate(closestEnabledDate || now);
      } else {
        submitDate(newDate);
      }
    };
  
    const focusYear = React.useCallback(year => {
      if (!isDateDisabled(utils.setYear(selectedDate, year))) {
        setFocusedYear(year);
      }
    }, [selectedDate, isDateDisabled, utils]);
    const yearsInRow = wrapperVariant === 'desktop' ? 4 : 3;
  
    const handleKeyDown = (event, year) => {
      switch (event.key) {
        case 'ArrowUp':
          focusYear(year - yearsInRow);
          event.preventDefault();
          break;
  
        case 'ArrowDown':
          focusYear(year + yearsInRow);
          event.preventDefault();
          break;
  
        case 'ArrowLeft':
          focusYear(year + (theme.direction === 'ltr' ? -1 : 1));
          event.preventDefault();
          break;
  
        case 'ArrowRight':
          focusYear(year + (theme.direction === 'ltr' ? 1 : -1));
          event.preventDefault();
          break;
  
        default:
          break;
      }
    };
  
    return /*#__PURE__*/_jsx(YearPickerRoot, {
      ref: ref,
      className: clsx(classes.root, className),
      ownerState: ownerState,
      children: utils.getYearRange(minDate, maxDate).map(year => {
        const yearNumber = utils.getYear(year);
        const selected = yearNumber === currentYear;
        return /*#__PURE__*/_jsx(PickersYear, {
          selected: selected,
          value: yearNumber,
          onClick: handleYearSelection,
          onKeyDown: handleKeyDown,
          autoFocus: autoFocus && yearNumber === focusedYear,
          ref: selected ? selectedYearRef : undefined,
          disabled: disabled || disablePast && utils.isBeforeYear(year, now) || disableFuture && utils.isAfterYear(year, now) || shouldDisableYear && shouldDisableYear(year),
          children: utils.format(year, 'year')
        }, utils.format(year, 'year'));
      })
    });
  });
  process.env.NODE_ENV !== "production" ? YearPicker.propTypes = {
    // ----------------------------- Warning --------------------------------
    // | These PropTypes are generated from the TypeScript type definitions |
    // | To update them edit the TypeScript types and run "yarn proptypes"  |
    // ----------------------------------------------------------------------
    autoFocus: PropTypes.bool,
    classes: PropTypes.object,
    className: PropTypes.string,
    date: PropTypes.any,
    disabled: PropTypes.bool,
    disableFuture: PropTypes.bool,
    disablePast: PropTypes.bool,
    isDateDisabled: PropTypes.func.isRequired,
    maxDate: PropTypes.any.isRequired,
    minDate: PropTypes.any.isRequired,
    onChange: PropTypes.func.isRequired,
    onFocusedDayChange: PropTypes.func,
  
    /**
     * Callback firing on year change @DateIOType.
     * @template TDate
     * @param {TDate} year The new year.
     */
    onYearChange: PropTypes.func,
    readOnly: PropTypes.bool,
  
    /**
     * Disable specific years dynamically.
     * Works like `shouldDisableDate` but for year selection view @DateIOType.
     * @template TDate
     * @param {TDate} year The year to test.
     * @returns {boolean} Return `true` if the year should be disabled.
     */
    shouldDisableYear: PropTypes.func
  } : void 0;