@react-aria/utils
- Version 3.25.2
- Published
- 567 kB
- 5 dependencies
- Apache-2.0 license
Install
npm i @react-aria/utils
yarn add @react-aria/utils
pnpm add @react-aria/utils
Overview
Spectrum UI components in React
Index
Variables
Functions
- chain()
- filterDOMProps()
- focusWithoutScrolling()
- getOffset()
- getOwnerDocument()
- getOwnerWindow()
- getScrollParent()
- getScrollParents()
- isScrollable()
- isVirtualClick()
- isVirtualPointerEvent()
- mergeIds()
- mergeProps()
- mergeRefs()
- runAfterTransition()
- scrollIntoView()
- scrollIntoViewport()
- useDeepMemo()
- useDescription()
- useDrag1D()
- useEffectEvent()
- useEvent()
- useFormReset()
- useGlobalListeners()
- useId()
- useLabels()
- useLoadMore()
- useObjectRef()
- useResizeObserver()
- useSlotId()
- useSyncRef()
- useUpdateEffect()
- useValueEffect()
- useViewportSize()
Variables
variable isAndroid
const isAndroid: () => boolean;
variable isAppleDevice
const isAppleDevice: () => boolean;
variable isChrome
const isChrome: () => boolean;
variable isFirefox
const isFirefox: () => boolean;
variable isIOS
const isIOS: () => boolean;
variable isIPad
const isIPad: () => boolean;
variable isIPhone
const isIPhone: () => boolean;
variable isMac
const isMac: () => boolean;
variable isWebKit
const isWebKit: () => boolean;
variable useLayoutEffect
const useLayoutEffect: any;
Functions
function chain
chain: (...callbacks: any[]) => (...args: any[]) => void;
Calls all functions in the order they were chained with the same arguments.
function filterDOMProps
filterDOMProps: ( props: DOMProps & AriaLabelingProps & LinkDOMProps, opts?: Options) => DOMProps & AriaLabelingProps;
Filters out all props that aren't valid DOM props or defined via override prop obj.
Parameter props
The component props to be filtered.
Parameter opts
Props to override.
function focusWithoutScrolling
focusWithoutScrolling: (element: FocusableElement) => void;
function getOffset
getOffset: (element: any, reverse: any, orientation?: string) => any;
function getOwnerDocument
getOwnerDocument: (el: Element | null | undefined) => Document;
function getOwnerWindow
getOwnerWindow: ( el: (Window & typeof global) | Element | null | undefined) => Window & typeof global;
function getScrollParent
getScrollParent: (node: Element, checkForOverflow?: boolean) => Element;
function getScrollParents
getScrollParents: (node: Element, checkForOverflow?: boolean) => Element[];
function isScrollable
isScrollable: (node: Element, checkForOverflow?: boolean) => boolean;
function isVirtualClick
isVirtualClick: (event: MouseEvent | PointerEvent) => boolean;
function isVirtualPointerEvent
isVirtualPointerEvent: (event: PointerEvent) => boolean;
function mergeIds
mergeIds: (idA: string, idB: string) => string;
Merges two ids. Different ids will trigger a side-effect and re-render components hooked up with
useId
.
function mergeProps
mergeProps: <T extends Props[]>( ...args: T) => UnionToIntersection<TupleTypes<T>>;
Merges multiple props objects together. Event handlers are chained, classNames are combined, and ids are deduplicated - different ids will trigger a side-effect and re-render components hooked up with
useId
. For all other props, the last prop object overrides all previous ones.Parameter args
Multiple sets of props to merge together.
function mergeRefs
mergeRefs: <T>( ...refs: Array<ForwardedRef<T> | MutableRefObject<T> | null | undefined>) => ForwardedRef<T>;
Merges multiple refs into one. Works with either callback or object refs.
function runAfterTransition
runAfterTransition: (fn: () => void) => void;
function scrollIntoView
scrollIntoView: (scrollView: HTMLElement, element: HTMLElement) => void;
Scrolls
scrollView
so thatelement
is visible. Similar toelement.scrollIntoView({block: 'nearest'})
(not supported in Edge), but doesn't affect parents abovescrollView
.
function scrollIntoViewport
scrollIntoViewport: ( targetElement: Element, opts?: ScrollIntoViewportOpts) => void;
Scrolls the
targetElement
so it is visible in the viewport. Accepts an optionalopts.containingElement
that will be centered in the viewport prior to scrolling the targetElement into view. If scrolling is prevented on the body (e.g. targetElement is in a popover), this will only scroll the scroll parents of the targetElement up to but not including the body itself.
function useDeepMemo
useDeepMemo: <T>(value: T, isEqual: (a: T, b: T) => boolean) => T;
function useDescription
useDescription: (description?: string) => AriaLabelingProps;
function useDrag1D
useDrag1D: (props: UseDrag1DProps) => HTMLAttributes<HTMLElement>;
function useEffectEvent
useEffectEvent: <T extends Function>(fn?: T) => T;
function useEvent
useEvent: <K extends keyof GlobalEventHandlersEventMap>( ref: RefObject<EventTarget>, event: K | (string & {}), handler?: (this: Document, ev: GlobalEventHandlersEventMap[K]) => any, options?: boolean | AddEventListenerOptions) => void;
function useFormReset
useFormReset: <T>( ref: RefObject<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>, initialValue: T, onReset: (value: T) => void) => void;
function useGlobalListeners
useGlobalListeners: () => GlobalListeners;
function useId
useId: (defaultId?: string) => string;
If a default is not provided, generate an id.
Parameter defaultId
Default component id.
function useLabels
useLabels: ( props: DOMProps & AriaLabelingProps, defaultLabel?: string) => DOMProps & AriaLabelingProps;
Merges aria-label and aria-labelledby into aria-labelledby when both exist.
Parameter props
Aria label props.
Parameter defaultLabel
Default value for aria-label when not present.
function useLoadMore
useLoadMore: (props: LoadMoreProps, ref: RefObject<HTMLElement>) => void;
function useObjectRef
useObjectRef: <T>(forwardedRef?: any) => MutableRefObject<T>;
Offers an object ref for a given callback ref or an object ref. Especially helfpul when passing forwarded refs (created using
React.forwardRef
) to React Aria hooks.Parameter forwardedRef
The original ref intended to be used.
Returns
An object ref that updates the given ref.
See Also
https://reactjs.org/docs/forwarding-refs.html
function useResizeObserver
useResizeObserver: <T extends Element>( options: useResizeObserverOptionsType<T>) => void;
function useSlotId
useSlotId: (depArray?: ReadonlyArray<any>) => string;
Used to generate an id, and after render, check if that id is rendered so we know if we can use it in places such as labelledby.
Parameter depArray
When to recalculate if the id is in the DOM.
function useSyncRef
useSyncRef: <T>(context?: ContextValue<T> | null, ref?: RefObject<T>) => void;
function useUpdateEffect
useUpdateEffect: (effect: EffectCallback, dependencies: any[]) => void;
function useValueEffect
useValueEffect: <S>( defaultValue: S | (() => S)) => [S, Dispatch<SetValueAction<S>>];
function useViewportSize
useViewportSize: () => ViewportSize;
Package Files (32)
- src/chain.ts
- src/domHelpers.ts
- src/filterDOMProps.ts
- src/focusWithoutScrolling.ts
- src/getOffset.ts
- src/getScrollParent.ts
- src/getScrollParents.ts
- src/index.ts
- src/isScrollable.ts
- src/isVirtualEvent.ts
- src/mergeProps.ts
- src/mergeRefs.ts
- src/platform.ts
- src/runAfterTransition.ts
- src/scrollIntoView.ts
- src/useDeepMemo.ts
- src/useDescription.ts
- src/useDrag1D.ts
- src/useEffectEvent.ts
- src/useEvent.ts
- src/useFormReset.ts
- src/useGlobalListeners.ts
- src/useId.ts
- src/useLabels.ts
- src/useLayoutEffect.ts
- src/useLoadMore.ts
- src/useObjectRef.ts
- src/useResizeObserver.ts
- src/useSyncRef.ts
- src/useUpdateEffect.ts
- src/useValueEffect.ts
- src/useViewportSize.ts
Dependencies (5)
Dev Dependencies (0)
No dev dependencies.
Peer Dependencies (1)
Badge
To add a badge like this oneto your package's README, use the codes available below.
You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@react-aria/utils
.
- Markdown[![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@react-aria/utils)
- HTML<a href="https://www.jsdocs.io/package/@react-aria/utils"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>
- Updated .
Package analyzed in 3054 ms. - Missing or incorrect documentation? Open an issue for this package.