[Chip] Add skipFocusWhenDisabled prop to not allow focussing deletable chip if disabled

packages/mui-material/src/Chip/Chip.d.ts

@@ -76,6 +76,10 @@ export interface ChipTypeMap<P = {}, D extends React.ElementType = 'div'> {
      * The system prop that allows defining system overrides as well as additional CSS styles.
      */
     sx?: SxProps<Theme>;
+    /**
+     *  tab order of an element
+     */
+    tabIndex?: number;
     /**
      * The variant to use.
      * @default 'filled'

packages/mui-material/src/Chip/Chip.js

@@ -346,6 +346,7 @@ const Chip = React.forwardRef(function Chip(inProps, ref) {
     onKeyUp,
     size = 'medium',
     variant = 'filled',
+    tabIndex,
     ...other
   } = props;
 
@@ -460,6 +461,7 @@ const Chip = React.forwardRef(function Chip(inProps, ref) {
       onKeyDown={handleKeyDown}
       onKeyUp={handleKeyUp}
       ref={handleRef}
+      tabIndex={disabled ? tabIndex ?? -1 : tabIndex}
       ownerState={ownerState}
       {...moreProps}
       {...other}
@@ -569,6 +571,10 @@ Chip.propTypes /* remove-proptypes */ = {
     PropTypes.func,
     PropTypes.object,
   ]),
+  /**
+   * tab order of an element
+   */
+  tabIndex: PropTypes.number,
   /**
    * The variant to use.
    * @default 'filled'

packages/mui-material/src/Chip/Chip.test.js

@@ -174,6 +174,18 @@ describe('<Chip />', () => {
       expect(chip).to.have.class(classes.filledPrimary);
     });
 
+    it('should not be focused when chip is disabled', () => {
+      const { getByTestId } = render(<Chip label="My Chip" disabled data-testid="chip" />);
+
+      const chip = getByTestId('chip');
+
+      fireEvent.keyDown(document.body, { key: 'Tab' });
+
+      expect(chip).to.have.class(classes.root);
+      expect(chip).to.have.property('tabIndex', -1);
+      expect(chip).not.to.have.class(classes.focusVisible);
+    });
+
     it('should render with the root and filled clickable secondary class', () => {
       const { getByRole } = render(
         <Chip color="secondary" label="My Chip" onClick={() => {}} variant="filled" />,