[material-ui][FocusTrap] getTabbable function has a return type of string[] instead of HTMLElement[]

[KalmarLorand]

Steps to reproduce

Link to live example: (required)

Steps:

1. Create a Focustrap component
2. Pass in the getTabbable function that returns an array of nodes Returns an array of ordered tabbable nodes
3. Notice the Typescript Linting error.

Current behavior

Based on the description of the getTabbable prop of the FocusTrap component: Returns an array of ordered tabbable nodes (i.e. in tab order) within the root. For instance, you can provide the "tabbable" npm dependency. However, the type definition of this function expects it to return a ReadonlyArray<string>. When returning a HTML Element array, it throws:

Type '(root: HTMLElement) => HTMLAnchorElement[]' is not assignable to type '(root: HTMLElement) => readonly string[]'.
  Type 'HTMLAnchorElement[]' is not assignable to type 'readonly string[]'.
    Type 'HTMLAnchorElement' is not assignable to type 'string'.typescript(2322)
FocusTrap.types.d.ts(12, 5): The expected type comes from property 'getTabbable' which is declared here on type 'IntrinsicAttributes & Pick<FocusTrapProps, keyof FocusTrapProps> & Pick<InferProps<any>, string | number | symbol> & Pick<...>'

Expected behavior

The getTabbable prop should accept a function returning an array of HTMLElements.

Search keywords: getTabbable, FocusTrap

[mnajdova]

Nice catch, would you like to introduce a PR with the change?

[KalmarLorand]

Nice catch, would you like to introduce a PR with the change?

Sure thing. I'll open a PR today. thanks

[KalmarLorand]

Nice catch, would you like to introduce a PR with the change?

I just created the PR: 42237

[PRANJALI-SANKPAL]

Is this issue resolved? If not I want to work on it

[kmr-ankitt]

Is this issue solved? I want to give it a try

[rkumar261]

Is this issue already resolved? If not, I'm interested in working on it.