UNPKG

@attio/react-native-bottom-sheet-toolbox

Version:
110 lines (107 loc) 5.55 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.KeyboardProvider = KeyboardProvider; exports.useKeyboardHeightSharedValue = useKeyboardHeightSharedValue; exports.useKeyboardProgressSharedValue = useKeyboardProgressSharedValue; var React = _interopRequireWildcard(require("react")); var _reactNative = require("react-native"); var _reactNativeReanimated = require("react-native-reanimated"); var _internalKeyboardContext = require("./internal-keyboard-context"); var _jsxRuntime = require("react/jsx-runtime"); function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); } const KeyboardContext = /*#__PURE__*/React.createContext(null); const FALLBACK_KEYBOARD_HEIGHT = _reactNative.Platform.select({ ios: 346, android: 330, default: 346 }); function useDeriveKeyboardProgressSharedValue(keyboardHeightSharedValue) { // Keyboard metrics are not available on web, so we use a fallback. const defaultKeyboardHeight = _reactNative.Keyboard.metrics?.()?.height || FALLBACK_KEYBOARD_HEIGHT; const keyboardEndHeightSharedValue = (0, _reactNativeReanimated.useSharedValue)(defaultKeyboardHeight); React.useEffect(() => { const sub = _reactNative.Keyboard.addListener("keyboardWillChangeFrame", evt => { keyboardEndHeightSharedValue.set(evt.endCoordinates.height); }); return () => { sub.remove(); }; }, []); return (0, _reactNativeReanimated.useDerivedValue)(() => { const keyboardEndHeight = keyboardEndHeightSharedValue.get(); if (keyboardEndHeight === 0) return 0; return (0, _reactNativeReanimated.interpolate)(keyboardHeightSharedValue.get(), [0, keyboardEndHeight], [0, 1], _reactNativeReanimated.Extrapolation.CLAMP); }, [keyboardHeightSharedValue]); } function useDeriveKeyboardHeightSharedValue(keyboardHeightSharedValue, keyboardProgressSharedValue) { const additionalKeyboardHeightTotalSharedValue = (0, _internalKeyboardContext.useAdditionalKeyboardHeightTotal)(); return (0, _reactNativeReanimated.useDerivedValue)(() => { const offset = additionalKeyboardHeightTotalSharedValue.get() * keyboardProgressSharedValue.get(); return keyboardHeightSharedValue.get() + offset; }, [keyboardHeightSharedValue, keyboardProgressSharedValue, additionalKeyboardHeightTotalSharedValue.get]); } function WithInternalKeyboardProvider({ children, keyboardHeightSharedValue: outerKeyboardHeightSharedValue, keyboardProgressSharedValue: outerKeyboardProgressSharedValue }) { const keyboardProgressSharedValue = useDeriveKeyboardProgressSharedValue(outerKeyboardHeightSharedValue); const keyboardHeightSharedValue = useDeriveKeyboardHeightSharedValue(outerKeyboardHeightSharedValue, outerKeyboardProgressSharedValue); const value = React.useMemo(() => ({ keyboardHeightSharedValue, keyboardProgressSharedValue }), [keyboardHeightSharedValue, keyboardProgressSharedValue]); return /*#__PURE__*/(0, _jsxRuntime.jsx)(KeyboardContext.Provider, { value: value, children: children }); } /** * Provides shared values representing the keyboard height and progress that * various bottom sheet behaviors can hook into. * * This also support additional keyboard height, which is useful when implementing * features such as keyboard toolbars. */ function KeyboardProvider({ children, ...rest }) { const animatedKeyboard = (0, _reactNativeReanimated.useAnimatedKeyboard)("animatedKeyboardOptions" in rest ? rest.animatedKeyboardOptions : undefined); const innerKeyboardHeightSharedValue = animatedKeyboard.height; const innerKeyboardProgressSharedValue = useDeriveKeyboardProgressSharedValue(innerKeyboardHeightSharedValue); const hasKeyboardOverride = "keyboardHeightSharedValue" in rest && "keyboardProgressSharedValue" in rest; const keyboardHeightSharedValue = hasKeyboardOverride ? rest.keyboardHeightSharedValue : innerKeyboardHeightSharedValue; const keyboardProgressSharedValue = hasKeyboardOverride ? rest.keyboardProgressSharedValue : innerKeyboardProgressSharedValue; return /*#__PURE__*/(0, _jsxRuntime.jsx)(_internalKeyboardContext.InternalKeyboardProvider, { children: /*#__PURE__*/(0, _jsxRuntime.jsx)(WithInternalKeyboardProvider, { keyboardHeightSharedValue: keyboardHeightSharedValue, keyboardProgressSharedValue: keyboardProgressSharedValue, children: children }) }); } function useKeyboardContext() { const context = React.useContext(KeyboardContext); if (!context) { throw new Error("KeyboardProvider not found."); } return context; } /** * Returns a shared value representing the keyboard height plus any additional * keyboard height. */ function useKeyboardHeightSharedValue() { return useKeyboardContext().keyboardHeightSharedValue; } /** * Returns a shared value, from 0 to 1, representing the keyboard's opening * progress. */ function useKeyboardProgressSharedValue() { return useKeyboardContext().keyboardProgressSharedValue; } //# sourceMappingURL=keyboard-context.js.map