react-native-a11y
Version:
Improvements of a11y for ReactNative, this library improve work with reader and keyboard focus and reader in general.
146 lines • 6.58 kB
JavaScript
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
/* eslint-disable complexity */
import * as React from "react";
import { useMemo, useState, useRef, useImperativeHandle } from "react";
// @ts-ignore: import from origin pressable
// eslint-disable-next-line import/no-unresolved
import { normalizeRect } from "react-native/Libraries/StyleSheet/Rect";
// @ts-ignore: import from origin pressable
// eslint-disable-next-line import/no-unresolved
import usePressability from "react-native/Libraries/Pressability/usePressability";
// @ts-ignore: import from origin pressable
// eslint-disable-next-line import/no-unresolved
import useAndroidRippleForView from "react-native/Libraries/Components/Pressable/useAndroidRippleForView";
import { KeyboardFocusView } from "../KeyboardFocusView";
const IOS_SPACE_KEY_CODE = 44;
export const Pressable = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
var _props$accessibilityV, _props$accessibilityV2, _props$accessibilityV3, _props$accessibilityV4;
const {
accessibilityState,
"aria-live": ariaLive,
android_disableSound,
android_ripple,
"aria-busy": ariaBusy,
"aria-checked": ariaChecked,
"aria-disabled": ariaDisabled,
"aria-expanded": ariaExpanded,
"aria-label": ariaLabel,
"aria-selected": ariaSelected,
cancelable,
children,
delayHoverIn,
delayHoverOut,
delayLongPress,
disabled,
focusable,
onHoverIn,
onHoverOut,
onLongPress,
onPress,
onPressIn,
onPressOut,
pressRetentionOffset,
style,
testOnly_pressed,
unstable_pressDelay,
canBeFocused,
onFocusChange,
...restProps
} = props;
const viewRef = useRef(null);
useImperativeHandle(forwardedRef, () => viewRef.current);
const hitSlop = normalizeRect(restProps === null || restProps === void 0 ? void 0 : restProps.hitSlop);
const android_rippleConfig = useAndroidRippleForView(android_ripple, viewRef);
const [pressed, setPressed] = usePressState(testOnly_pressed === true);
let _accessibilityState = {
busy: ariaBusy ?? (accessibilityState === null || accessibilityState === void 0 ? void 0 : accessibilityState.busy),
checked: ariaChecked ?? (accessibilityState === null || accessibilityState === void 0 ? void 0 : accessibilityState.checked),
disabled: ariaDisabled ?? (accessibilityState === null || accessibilityState === void 0 ? void 0 : accessibilityState.disabled),
expanded: ariaExpanded ?? (accessibilityState === null || accessibilityState === void 0 ? void 0 : accessibilityState.expanded),
selected: ariaSelected ?? (accessibilityState === null || accessibilityState === void 0 ? void 0 : accessibilityState.selected)
};
_accessibilityState = disabled != null ? {
..._accessibilityState,
disabled
} : _accessibilityState;
const accessibilityValue = {
max: props["aria-valuemax"] ?? ((_props$accessibilityV = props.accessibilityValue) === null || _props$accessibilityV === void 0 ? void 0 : _props$accessibilityV.max),
min: props["aria-valuemin"] ?? ((_props$accessibilityV2 = props.accessibilityValue) === null || _props$accessibilityV2 === void 0 ? void 0 : _props$accessibilityV2.min),
now: props["aria-valuenow"] ?? ((_props$accessibilityV3 = props.accessibilityValue) === null || _props$accessibilityV3 === void 0 ? void 0 : _props$accessibilityV3.now),
text: props["aria-valuetext"] ?? ((_props$accessibilityV4 = props.accessibilityValue) === null || _props$accessibilityV4 === void 0 ? void 0 : _props$accessibilityV4.text)
};
const accessibilityLiveRegion = ariaLive === "off" ? "none" : ariaLive ?? props.accessibilityLiveRegion;
const accessibilityLabel = ariaLabel ?? props.accessibilityLabel;
const restPropsWithDefaults = {
...restProps,
...(android_rippleConfig === null || android_rippleConfig === void 0 ? void 0 : android_rippleConfig.viewProps),
accessibilityState: _accessibilityState,
accessibilityValue,
accessibilityViewIsModal: restProps["aria-modal"] ?? restProps.accessibilityViewIsModal,
accessibilityLiveRegion,
accessibilityLabel,
focusable: focusable !== false,
hitSlop
};
const config = useMemo(() => ({
cancelable,
disabled,
hitSlop,
pressRectOffset: pressRetentionOffset,
android_disableSound,
delayHoverIn,
delayHoverOut,
delayLongPress,
delayPressIn: unstable_pressDelay,
onHoverIn,
onHoverOut,
onLongPress,
onPress,
onPressIn(event) {
if (android_rippleConfig != null) {
android_rippleConfig.onPressIn(event);
}
setPressed(true);
if (onPressIn != null) {
onPressIn(event);
}
},
onPressMove: android_rippleConfig === null || android_rippleConfig === void 0 ? void 0 : android_rippleConfig.onPressMove,
onPressOut(event) {
if (android_rippleConfig != null) {
android_rippleConfig.onPressOut(event);
}
setPressed(false);
if (onPressOut != null) {
onPressOut(event);
}
}
}), [android_disableSound, android_rippleConfig, cancelable, delayHoverIn, delayHoverOut, delayLongPress, disabled, hitSlop, onHoverIn, onHoverOut, onLongPress, onPress, onPressIn, onPressOut, pressRetentionOffset, setPressed, unstable_pressDelay]);
const eventHandlers = usePressability(config);
const onKeyUpPress = React.useCallback(e => {
if (e.nativeEvent.keyCode === IOS_SPACE_KEY_CODE) {
if (e.nativeEvent.isLongPress) {
onLongPress === null || onLongPress === void 0 ? void 0 : onLongPress(e);
} else {
onPress === null || onPress === void 0 ? void 0 : onPress(e);
}
}
}, [onLongPress, onPress]);
return /*#__PURE__*/React.createElement(KeyboardFocusView, _extends({}, restPropsWithDefaults, eventHandlers, {
canBeFocused: canBeFocused,
onFocusChange: onFocusChange,
onKeyUpPress: onKeyUpPress,
ref: viewRef,
style: typeof style === "function" ? style({
pressed
}) : style,
collapsable: false
}), typeof children === "function" ? children({
pressed
}) : children);
}));
function usePressState(forcePressed) {
const [pressed, setPressed] = useState(false);
return [pressed || forcePressed, setPressed];
}
//# sourceMappingURL=Pressable.ios.js.map