Focus url bar

[Fusseldieb]

Hi, firstly, thanks for this nice package, it works great.

But now to my question: Is there any option to make the focus-lock leave the DOM and jump to the URL bar and then back, like the default browser behaviour?

I was thinking something like: <FocusLock :allowEscapeToURLBar="true">

Currently it does:

• First DOM element > ... > Last DOM element > First DOM element > ...

But the default browser (Chrome) behaviour is:

• Upper left site certificate > URL bar > First DOM element > ...

It would be nice to have something like this to set.

[theKashey]

It's a long story, and some people thinks this behaviour is right(you, bootstap), while some are not(modal specs). The big brother - react-focus-lock, has this feature, and it's easy to implement the same behaviour here - additional value for noFocusGuard - true, false, tail. As far as I can see - right now guardsEnabled is not used anywhere, so this option just don't work.

<div>
        <div :tabIndex="disabled ? -1 : 0" :style="hidden"></div>
        <div :tabIndex="disabled ? -1 : 1" :style="hidden"></div>

        <div @focusout="onBlur" data-lock>
            <slot></slot>
        </div>

        <div :tabIndex="disabled ? -1 : 0" :style="hidden"></div> 
        //  ^^^ conditionally remove the last guard.
    </div>

That would allow moving focus to the browser navigation if your modal is the last element on the page. That's the requirement, or it would move to the next focusable element.

Plus add one more condition to activateTrap - focusWasOutsideWindow (as seen here). Without it after tabbing back to window you will focus body, and would have to tab again to focus the Lock.

I am not quite sure I would be apply to create a PR soon, and would be very thankful you will try to implement these two changes.