@react-aria/focus 3.19.1 → 3.20.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,62 +0,0 @@
1
- import {focusSafely as $6a99195332edec8b$export$80f3e147d781571c} from "./focusSafely.mjs";
2
- import {useSyncRef as $h8xso$useSyncRef, useObjectRef as $h8xso$useObjectRef, mergeProps as $h8xso$mergeProps} from "@react-aria/utils";
3
- import $h8xso$react, {useContext as $h8xso$useContext, useRef as $h8xso$useRef, useEffect as $h8xso$useEffect} from "react";
4
- import {useFocus as $h8xso$useFocus, useKeyboard as $h8xso$useKeyboard} from "@react-aria/interactions";
5
-
6
- /*
7
- * Copyright 2020 Adobe. All rights reserved.
8
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
9
- * you may not use this file except in compliance with the License. You may obtain a copy
10
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
11
- *
12
- * Unless required by applicable law or agreed to in writing, software distributed under
13
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
14
- * OF ANY KIND, either express or implied. See the License for the specific language
15
- * governing permissions and limitations under the License.
16
- */
17
-
18
-
19
-
20
- let $e6afbd83fe6ebbd2$var$FocusableContext = /*#__PURE__*/ (0, $h8xso$react).createContext(null);
21
- function $e6afbd83fe6ebbd2$var$useFocusableContext(ref) {
22
- let context = (0, $h8xso$useContext)($e6afbd83fe6ebbd2$var$FocusableContext) || {};
23
- (0, $h8xso$useSyncRef)(context, ref);
24
- // eslint-disable-next-line
25
- let { ref: _, ...otherProps } = context;
26
- return otherProps;
27
- }
28
- const $e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 = /*#__PURE__*/ (0, $h8xso$react).forwardRef(function FocusableProvider(props, ref) {
29
- let { children: children, ...otherProps } = props;
30
- let objRef = (0, $h8xso$useObjectRef)(ref);
31
- let context = {
32
- ...otherProps,
33
- ref: objRef
34
- };
35
- return /*#__PURE__*/ (0, $h8xso$react).createElement($e6afbd83fe6ebbd2$var$FocusableContext.Provider, {
36
- value: context
37
- }, children);
38
- });
39
- function $e6afbd83fe6ebbd2$export$4c014de7c8940b4c(props, domRef) {
40
- let { focusProps: focusProps } = (0, $h8xso$useFocus)(props);
41
- let { keyboardProps: keyboardProps } = (0, $h8xso$useKeyboard)(props);
42
- let interactions = (0, $h8xso$mergeProps)(focusProps, keyboardProps);
43
- let domProps = $e6afbd83fe6ebbd2$var$useFocusableContext(domRef);
44
- let interactionProps = props.isDisabled ? {} : domProps;
45
- let autoFocusRef = (0, $h8xso$useRef)(props.autoFocus);
46
- (0, $h8xso$useEffect)(()=>{
47
- if (autoFocusRef.current && domRef.current) (0, $6a99195332edec8b$export$80f3e147d781571c)(domRef.current);
48
- autoFocusRef.current = false;
49
- }, [
50
- domRef
51
- ]);
52
- return {
53
- focusableProps: (0, $h8xso$mergeProps)({
54
- ...interactions,
55
- tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
56
- }, interactionProps)
57
- };
58
- }
59
-
60
-
61
- export {$e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 as FocusableProvider, $e6afbd83fe6ebbd2$export$4c014de7c8940b4c as useFocusable};
62
- //# sourceMappingURL=useFocusable.module.js.map
@@ -1,62 +0,0 @@
1
- import {focusSafely as $6a99195332edec8b$export$80f3e147d781571c} from "./focusSafely.module.js";
2
- import {useSyncRef as $h8xso$useSyncRef, useObjectRef as $h8xso$useObjectRef, mergeProps as $h8xso$mergeProps} from "@react-aria/utils";
3
- import $h8xso$react, {useContext as $h8xso$useContext, useRef as $h8xso$useRef, useEffect as $h8xso$useEffect} from "react";
4
- import {useFocus as $h8xso$useFocus, useKeyboard as $h8xso$useKeyboard} from "@react-aria/interactions";
5
-
6
- /*
7
- * Copyright 2020 Adobe. All rights reserved.
8
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
9
- * you may not use this file except in compliance with the License. You may obtain a copy
10
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
11
- *
12
- * Unless required by applicable law or agreed to in writing, software distributed under
13
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
14
- * OF ANY KIND, either express or implied. See the License for the specific language
15
- * governing permissions and limitations under the License.
16
- */
17
-
18
-
19
-
20
- let $e6afbd83fe6ebbd2$var$FocusableContext = /*#__PURE__*/ (0, $h8xso$react).createContext(null);
21
- function $e6afbd83fe6ebbd2$var$useFocusableContext(ref) {
22
- let context = (0, $h8xso$useContext)($e6afbd83fe6ebbd2$var$FocusableContext) || {};
23
- (0, $h8xso$useSyncRef)(context, ref);
24
- // eslint-disable-next-line
25
- let { ref: _, ...otherProps } = context;
26
- return otherProps;
27
- }
28
- const $e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 = /*#__PURE__*/ (0, $h8xso$react).forwardRef(function FocusableProvider(props, ref) {
29
- let { children: children, ...otherProps } = props;
30
- let objRef = (0, $h8xso$useObjectRef)(ref);
31
- let context = {
32
- ...otherProps,
33
- ref: objRef
34
- };
35
- return /*#__PURE__*/ (0, $h8xso$react).createElement($e6afbd83fe6ebbd2$var$FocusableContext.Provider, {
36
- value: context
37
- }, children);
38
- });
39
- function $e6afbd83fe6ebbd2$export$4c014de7c8940b4c(props, domRef) {
40
- let { focusProps: focusProps } = (0, $h8xso$useFocus)(props);
41
- let { keyboardProps: keyboardProps } = (0, $h8xso$useKeyboard)(props);
42
- let interactions = (0, $h8xso$mergeProps)(focusProps, keyboardProps);
43
- let domProps = $e6afbd83fe6ebbd2$var$useFocusableContext(domRef);
44
- let interactionProps = props.isDisabled ? {} : domProps;
45
- let autoFocusRef = (0, $h8xso$useRef)(props.autoFocus);
46
- (0, $h8xso$useEffect)(()=>{
47
- if (autoFocusRef.current && domRef.current) (0, $6a99195332edec8b$export$80f3e147d781571c)(domRef.current);
48
- autoFocusRef.current = false;
49
- }, [
50
- domRef
51
- ]);
52
- return {
53
- focusableProps: (0, $h8xso$mergeProps)({
54
- ...interactions,
55
- tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
56
- }, interactionProps)
57
- };
58
- }
59
-
60
-
61
- export {$e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 as FocusableProvider, $e6afbd83fe6ebbd2$export$4c014de7c8940b4c as useFocusable};
62
- //# sourceMappingURL=useFocusable.module.js.map
@@ -1 +0,0 @@
1
- {"mappings":";;;;;AAAA;;;;;;;;;;CAUC;;;;AAsBD,IAAI,uDAAmB,CAAA,GAAA,YAAI,EAAE,aAAa,CAA+B;AAEzE,SAAS,0CAAoB,GAAuC;IAClE,IAAI,UAAU,CAAA,GAAA,iBAAS,EAAE,2CAAqB,CAAC;IAC/C,CAAA,GAAA,iBAAS,EAAE,SAAS;IAEpB,2BAA2B;IAC3B,IAAI,EAAC,KAAK,CAAC,EAAE,GAAG,YAAW,GAAG;IAC9B,OAAO;AACT;AAKO,MAAM,yDAAoB,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,kBAAkB,KAA6B,EAAE,GAAmC;IAC7I,IAAI,YAAC,QAAQ,EAAE,GAAG,YAAW,GAAG;IAChC,IAAI,SAAS,CAAA,GAAA,mBAAW,EAAE;IAC1B,IAAI,UAAU;QACZ,GAAG,UAAU;QACb,KAAK;IACP;IAEA,qBACE,gCAAC,uCAAiB,QAAQ;QAAC,OAAO;OAC/B;AAGP;AAUO,SAAS,0CAA4D,KAA0B,EAAE,MAA0C;IAChJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;IAC5B,IAAI,iBAAC,aAAa,EAAC,GAAG,CAAA,GAAA,kBAAU,EAAE;IAClC,IAAI,eAAe,CAAA,GAAA,iBAAS,EAAE,YAAY;IAC1C,IAAI,WAAW,0CAAoB;IACnC,IAAI,mBAAmB,MAAM,UAAU,GAAG,CAAC,IAAI;IAC/C,IAAI,eAAe,CAAA,GAAA,aAAK,EAAE,MAAM,SAAS;IAEzC,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,aAAa,OAAO,IAAI,OAAO,OAAO,EACxC,CAAA,GAAA,yCAAU,EAAE,OAAO,OAAO;QAE5B,aAAa,OAAO,GAAG;IACzB,GAAG;QAAC;KAAO;IAEX,OAAO;QACL,gBAAgB,CAAA,GAAA,iBAAS,EACvB;YACE,GAAG,YAAY;YACf,UAAU,MAAM,mBAAmB,IAAI,CAAC,MAAM,UAAU,GAAG,KAAK;QAClE,GACA;IAEJ;AACF","sources":["packages/@react-aria/focus/src/useFocusable.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {DOMAttributes, FocusableDOMProps, FocusableElement, FocusableProps, RefObject} from '@react-types/shared';\nimport {focusSafely} from './';\nimport {mergeProps, useObjectRef, useSyncRef} from '@react-aria/utils';\nimport React, {ForwardedRef, MutableRefObject, ReactNode, useContext, useEffect, useRef} from 'react';\nimport {useFocus, useKeyboard} from '@react-aria/interactions';\n\nexport interface FocusableOptions<T = FocusableElement> extends FocusableProps<T>, FocusableDOMProps {\n /** Whether focus should be disabled. */\n isDisabled?: boolean\n}\n\nexport interface FocusableProviderProps extends DOMAttributes {\n /** The child element to provide DOM props to. */\n children?: ReactNode\n}\n\ninterface FocusableContextValue extends FocusableProviderProps {\n ref?: MutableRefObject<FocusableElement | null>\n}\n\nlet FocusableContext = React.createContext<FocusableContextValue | null>(null);\n\nfunction useFocusableContext(ref: RefObject<FocusableElement | null>): FocusableContextValue {\n let context = useContext(FocusableContext) || {};\n useSyncRef(context, ref);\n\n // eslint-disable-next-line\n let {ref: _, ...otherProps} = context;\n return otherProps;\n}\n\n/**\n * Provides DOM props to the nearest focusable child.\n */\nexport const FocusableProvider = React.forwardRef(function FocusableProvider(props: FocusableProviderProps, ref: ForwardedRef<FocusableElement>) {\n let {children, ...otherProps} = props;\n let objRef = useObjectRef(ref);\n let context = {\n ...otherProps,\n ref: objRef\n };\n\n return (\n <FocusableContext.Provider value={context}>\n {children}\n </FocusableContext.Provider>\n );\n});\n\nexport interface FocusableAria {\n /** Props for the focusable element. */\n focusableProps: DOMAttributes\n}\n\n/**\n * Used to make an element focusable and capable of auto focus.\n */\nexport function useFocusable<T extends FocusableElement = FocusableElement>(props: FocusableOptions<T>, domRef: RefObject<FocusableElement | null>): FocusableAria {\n let {focusProps} = useFocus(props);\n let {keyboardProps} = useKeyboard(props);\n let interactions = mergeProps(focusProps, keyboardProps);\n let domProps = useFocusableContext(domRef);\n let interactionProps = props.isDisabled ? {} : domProps;\n let autoFocusRef = useRef(props.autoFocus);\n\n useEffect(() => {\n if (autoFocusRef.current && domRef.current) {\n focusSafely(domRef.current);\n }\n autoFocusRef.current = false;\n }, [domRef]);\n\n return {\n focusableProps: mergeProps(\n {\n ...interactions,\n tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined\n },\n interactionProps\n )\n };\n}\n"],"names":[],"version":3,"file":"useFocusable.module.js.map"}
@@ -1,39 +0,0 @@
1
- /*
2
- * Copyright 2020 Adobe. All rights reserved.
3
- * This file is licensed to you under the Apache License, Version 2.0 (the 'License');
4
- * you may not use this file except in compliance with the License. You may obtain a copy
5
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
6
- *
7
- * Unless required by applicable law or agreed to in writing, software distributed under
8
- * the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
- * OF ANY KIND, either express or implied. See the License for the specific language
10
- * governing permissions and limitations under the License.
11
- */
12
-
13
- import {FocusableElement} from '@react-types/shared';
14
- import {focusWithoutScrolling, getOwnerDocument, runAfterTransition} from '@react-aria/utils';
15
- import {getInteractionModality} from '@react-aria/interactions';
16
-
17
- /**
18
- * A utility function that focuses an element while avoiding undesired side effects such
19
- * as page scrolling and screen reader issues with CSS transitions.
20
- */
21
- export function focusSafely(element: FocusableElement) {
22
- // If the user is interacting with a virtual cursor, e.g. screen reader, then
23
- // wait until after any animated transitions that are currently occurring on
24
- // the page before shifting focus. This avoids issues with VoiceOver on iOS
25
- // causing the page to scroll when moving focus if the element is transitioning
26
- // from off the screen.
27
- const ownerDocument = getOwnerDocument(element);
28
- if (getInteractionModality() === 'virtual') {
29
- let lastFocusedElement = ownerDocument.activeElement;
30
- runAfterTransition(() => {
31
- // If focus did not move and the element is still in the document, focus it.
32
- if (ownerDocument.activeElement === lastFocusedElement && element.isConnected) {
33
- focusWithoutScrolling(element);
34
- }
35
- });
36
- } else {
37
- focusWithoutScrolling(element);
38
- }
39
- }
@@ -1,94 +0,0 @@
1
- /*
2
- * Copyright 2020 Adobe. All rights reserved.
3
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
- * you may not use this file except in compliance with the License. You may obtain a copy
5
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
6
- *
7
- * Unless required by applicable law or agreed to in writing, software distributed under
8
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
- * OF ANY KIND, either express or implied. See the License for the specific language
10
- * governing permissions and limitations under the License.
11
- */
12
-
13
- import {DOMAttributes, FocusableDOMProps, FocusableElement, FocusableProps, RefObject} from '@react-types/shared';
14
- import {focusSafely} from './';
15
- import {mergeProps, useObjectRef, useSyncRef} from '@react-aria/utils';
16
- import React, {ForwardedRef, MutableRefObject, ReactNode, useContext, useEffect, useRef} from 'react';
17
- import {useFocus, useKeyboard} from '@react-aria/interactions';
18
-
19
- export interface FocusableOptions<T = FocusableElement> extends FocusableProps<T>, FocusableDOMProps {
20
- /** Whether focus should be disabled. */
21
- isDisabled?: boolean
22
- }
23
-
24
- export interface FocusableProviderProps extends DOMAttributes {
25
- /** The child element to provide DOM props to. */
26
- children?: ReactNode
27
- }
28
-
29
- interface FocusableContextValue extends FocusableProviderProps {
30
- ref?: MutableRefObject<FocusableElement | null>
31
- }
32
-
33
- let FocusableContext = React.createContext<FocusableContextValue | null>(null);
34
-
35
- function useFocusableContext(ref: RefObject<FocusableElement | null>): FocusableContextValue {
36
- let context = useContext(FocusableContext) || {};
37
- useSyncRef(context, ref);
38
-
39
- // eslint-disable-next-line
40
- let {ref: _, ...otherProps} = context;
41
- return otherProps;
42
- }
43
-
44
- /**
45
- * Provides DOM props to the nearest focusable child.
46
- */
47
- export const FocusableProvider = React.forwardRef(function FocusableProvider(props: FocusableProviderProps, ref: ForwardedRef<FocusableElement>) {
48
- let {children, ...otherProps} = props;
49
- let objRef = useObjectRef(ref);
50
- let context = {
51
- ...otherProps,
52
- ref: objRef
53
- };
54
-
55
- return (
56
- <FocusableContext.Provider value={context}>
57
- {children}
58
- </FocusableContext.Provider>
59
- );
60
- });
61
-
62
- export interface FocusableAria {
63
- /** Props for the focusable element. */
64
- focusableProps: DOMAttributes
65
- }
66
-
67
- /**
68
- * Used to make an element focusable and capable of auto focus.
69
- */
70
- export function useFocusable<T extends FocusableElement = FocusableElement>(props: FocusableOptions<T>, domRef: RefObject<FocusableElement | null>): FocusableAria {
71
- let {focusProps} = useFocus(props);
72
- let {keyboardProps} = useKeyboard(props);
73
- let interactions = mergeProps(focusProps, keyboardProps);
74
- let domProps = useFocusableContext(domRef);
75
- let interactionProps = props.isDisabled ? {} : domProps;
76
- let autoFocusRef = useRef(props.autoFocus);
77
-
78
- useEffect(() => {
79
- if (autoFocusRef.current && domRef.current) {
80
- focusSafely(domRef.current);
81
- }
82
- autoFocusRef.current = false;
83
- }, [domRef]);
84
-
85
- return {
86
- focusableProps: mergeProps(
87
- {
88
- ...interactions,
89
- tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
90
- },
91
- interactionProps
92
- )
93
- };
94
- }