@react-aria/focus 3.19.0 → 3.20.0

package/dist/useFocusable.mjs

@@ -1,65 +0,0 @@
-import {focusSafely as $6a99195332edec8b$export$80f3e147d781571c} from "./focusSafely.mjs";
-import {useSyncRef as $h8xso$useSyncRef, useObjectRef as $h8xso$useObjectRef, mergeProps as $h8xso$mergeProps} from "@react-aria/utils";
-import $h8xso$react, {useContext as $h8xso$useContext, useRef as $h8xso$useRef, useEffect as $h8xso$useEffect} from "react";
-import {useFocus as $h8xso$useFocus, useKeyboard as $h8xso$useKeyboard} from "@react-aria/interactions";
-
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */ 
-
-
-
-let $e6afbd83fe6ebbd2$var$FocusableContext = /*#__PURE__*/ (0, $h8xso$react).createContext(null);
-function $e6afbd83fe6ebbd2$var$useFocusableContext(ref) {
-    let context = (0, $h8xso$useContext)($e6afbd83fe6ebbd2$var$FocusableContext) || {};
-    (0, $h8xso$useSyncRef)(context, ref);
-    // eslint-disable-next-line
-    let { ref: _, ...otherProps } = context;
-    return otherProps;
-}
-/**
- * Provides DOM props to the nearest focusable child.
- */ function $e6afbd83fe6ebbd2$var$FocusableProvider(props, ref) {
-    let { children: children, ...otherProps } = props;
-    let objRef = (0, $h8xso$useObjectRef)(ref);
-    let context = {
-        ...otherProps,
-        ref: objRef
-    };
-    return /*#__PURE__*/ (0, $h8xso$react).createElement($e6afbd83fe6ebbd2$var$FocusableContext.Provider, {
-        value: context
-    }, children);
-}
-let $e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 = /*#__PURE__*/ (0, $h8xso$react).forwardRef($e6afbd83fe6ebbd2$var$FocusableProvider);
-function $e6afbd83fe6ebbd2$export$4c014de7c8940b4c(props, domRef) {
-    let { focusProps: focusProps } = (0, $h8xso$useFocus)(props);
-    let { keyboardProps: keyboardProps } = (0, $h8xso$useKeyboard)(props);
-    let interactions = (0, $h8xso$mergeProps)(focusProps, keyboardProps);
-    let domProps = $e6afbd83fe6ebbd2$var$useFocusableContext(domRef);
-    let interactionProps = props.isDisabled ? {} : domProps;
-    let autoFocusRef = (0, $h8xso$useRef)(props.autoFocus);
-    (0, $h8xso$useEffect)(()=>{
-        if (autoFocusRef.current && domRef.current) (0, $6a99195332edec8b$export$80f3e147d781571c)(domRef.current);
-        autoFocusRef.current = false;
-    }, [
-        domRef
-    ]);
-    return {
-        focusableProps: (0, $h8xso$mergeProps)({
-            ...interactions,
-            tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
-        }, interactionProps)
-    };
-}
-
-
-export {$e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 as FocusableProvider, $e6afbd83fe6ebbd2$export$4c014de7c8940b4c as useFocusable};
-//# sourceMappingURL=useFocusable.module.js.map

package/dist/useFocusable.module.js

@@ -1,65 +0,0 @@
-import {focusSafely as $6a99195332edec8b$export$80f3e147d781571c} from "./focusSafely.module.js";
-import {useSyncRef as $h8xso$useSyncRef, useObjectRef as $h8xso$useObjectRef, mergeProps as $h8xso$mergeProps} from "@react-aria/utils";
-import $h8xso$react, {useContext as $h8xso$useContext, useRef as $h8xso$useRef, useEffect as $h8xso$useEffect} from "react";
-import {useFocus as $h8xso$useFocus, useKeyboard as $h8xso$useKeyboard} from "@react-aria/interactions";
-
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */ 
-
-
-
-let $e6afbd83fe6ebbd2$var$FocusableContext = /*#__PURE__*/ (0, $h8xso$react).createContext(null);
-function $e6afbd83fe6ebbd2$var$useFocusableContext(ref) {
-    let context = (0, $h8xso$useContext)($e6afbd83fe6ebbd2$var$FocusableContext) || {};
-    (0, $h8xso$useSyncRef)(context, ref);
-    // eslint-disable-next-line
-    let { ref: _, ...otherProps } = context;
-    return otherProps;
-}
-/**
- * Provides DOM props to the nearest focusable child.
- */ function $e6afbd83fe6ebbd2$var$FocusableProvider(props, ref) {
-    let { children: children, ...otherProps } = props;
-    let objRef = (0, $h8xso$useObjectRef)(ref);
-    let context = {
-        ...otherProps,
-        ref: objRef
-    };
-    return /*#__PURE__*/ (0, $h8xso$react).createElement($e6afbd83fe6ebbd2$var$FocusableContext.Provider, {
-        value: context
-    }, children);
-}
-let $e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 = /*#__PURE__*/ (0, $h8xso$react).forwardRef($e6afbd83fe6ebbd2$var$FocusableProvider);
-function $e6afbd83fe6ebbd2$export$4c014de7c8940b4c(props, domRef) {
-    let { focusProps: focusProps } = (0, $h8xso$useFocus)(props);
-    let { keyboardProps: keyboardProps } = (0, $h8xso$useKeyboard)(props);
-    let interactions = (0, $h8xso$mergeProps)(focusProps, keyboardProps);
-    let domProps = $e6afbd83fe6ebbd2$var$useFocusableContext(domRef);
-    let interactionProps = props.isDisabled ? {} : domProps;
-    let autoFocusRef = (0, $h8xso$useRef)(props.autoFocus);
-    (0, $h8xso$useEffect)(()=>{
-        if (autoFocusRef.current && domRef.current) (0, $6a99195332edec8b$export$80f3e147d781571c)(domRef.current);
-        autoFocusRef.current = false;
-    }, [
-        domRef
-    ]);
-    return {
-        focusableProps: (0, $h8xso$mergeProps)({
-            ...interactions,
-            tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
-        }, interactionProps)
-    };
-}
-
-
-export {$e6afbd83fe6ebbd2$export$13f3202a3e5ddd5 as FocusableProvider, $e6afbd83fe6ebbd2$export$4c014de7c8940b4c as useFocusable};
-//# sourceMappingURL=useFocusable.module.js.map

package/dist/useFocusable.module.js.map

@@ -1 +0,0 @@
-{"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;AAEA;;CAEC,GACD,SAAS,wCAAkB,KAA6B,EAAE,GAAmC;IAC3F,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;AAEA,IAAI,yDAAqB,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC;AAWnC,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 */\nfunction 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\nlet _FocusableProvider = React.forwardRef(FocusableProvider);\nexport {_FocusableProvider as FocusableProvider};\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"}

package/src/focusSafely.ts

@@ -1,39 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the 'License');
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {FocusableElement} from '@react-types/shared';
-import {focusWithoutScrolling, getOwnerDocument, runAfterTransition} from '@react-aria/utils';
-import {getInteractionModality} from '@react-aria/interactions';
-
-/**
- * A utility function that focuses an element while avoiding undesired side effects such
- * as page scrolling and screen reader issues with CSS transitions.
- */
-export function focusSafely(element: FocusableElement) {
-  // If the user is interacting with a virtual cursor, e.g. screen reader, then
-  // wait until after any animated transitions that are currently occurring on
-  // the page before shifting focus. This avoids issues with VoiceOver on iOS
-  // causing the page to scroll when moving focus if the element is transitioning
-  // from off the screen.
-  const ownerDocument = getOwnerDocument(element);
-  if (getInteractionModality() === 'virtual') {
-    let lastFocusedElement = ownerDocument.activeElement;
-    runAfterTransition(() => {
-      // If focus did not move and the element is still in the document, focus it.
-      if (ownerDocument.activeElement === lastFocusedElement && element.isConnected) {
-        focusWithoutScrolling(element);
-      }
-    });
-  } else {
-    focusWithoutScrolling(element);
-  }
-}

package/src/useFocusable.tsx

@@ -1,97 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {DOMAttributes, FocusableDOMProps, FocusableElement, FocusableProps, RefObject} from '@react-types/shared';
-import {focusSafely} from './';
-import {mergeProps, useObjectRef, useSyncRef} from '@react-aria/utils';
-import React, {ForwardedRef, MutableRefObject, ReactNode, useContext, useEffect, useRef} from 'react';
-import {useFocus, useKeyboard} from '@react-aria/interactions';
-
-export interface FocusableOptions<T = FocusableElement> extends FocusableProps<T>, FocusableDOMProps {
-  /** Whether focus should be disabled. */
-  isDisabled?: boolean
-}
-
-export interface FocusableProviderProps extends DOMAttributes {
-  /** The child element to provide DOM props to. */
-  children?: ReactNode
-}
-
-interface FocusableContextValue extends FocusableProviderProps {
-  ref?: MutableRefObject<FocusableElement | null>
-}
-
-let FocusableContext = React.createContext<FocusableContextValue | null>(null);
-
-function useFocusableContext(ref: RefObject<FocusableElement | null>): FocusableContextValue {
-  let context = useContext(FocusableContext) || {};
-  useSyncRef(context, ref);
-
-  // eslint-disable-next-line
-  let {ref: _, ...otherProps} = context;
-  return otherProps;
-}
-
-/**
- * Provides DOM props to the nearest focusable child.
- */
-function FocusableProvider(props: FocusableProviderProps, ref: ForwardedRef<FocusableElement>) {
-  let {children, ...otherProps} = props;
-  let objRef = useObjectRef(ref);
-  let context = {
-    ...otherProps,
-    ref: objRef
-  };
-
-  return (
-    <FocusableContext.Provider value={context}>
-      {children}
-    </FocusableContext.Provider>
-  );
-}
-
-let _FocusableProvider = React.forwardRef(FocusableProvider);
-export {_FocusableProvider as FocusableProvider};
-
-export interface FocusableAria {
-  /** Props for the focusable element. */
-  focusableProps: DOMAttributes
-}
-
-/**
- * Used to make an element focusable and capable of auto focus.
- */
-export function useFocusable<T extends FocusableElement = FocusableElement>(props: FocusableOptions<T>, domRef: RefObject<FocusableElement | null>): FocusableAria {
-  let {focusProps} = useFocus(props);
-  let {keyboardProps} = useKeyboard(props);
-  let interactions = mergeProps(focusProps, keyboardProps);
-  let domProps = useFocusableContext(domRef);
-  let interactionProps = props.isDisabled ? {} : domProps;
-  let autoFocusRef = useRef(props.autoFocus);
-
-  useEffect(() => {
-    if (autoFocusRef.current && domRef.current) {
-      focusSafely(domRef.current);
-    }
-    autoFocusRef.current = false;
-  }, [domRef]);
-
-  return {
-    focusableProps: mergeProps(
-      {
-        ...interactions,
-        tabIndex: props.excludeFromTabOrder && !props.isDisabled ? -1 : undefined
-      },
-      interactionProps
-    )
-  };
-}