@attio/react-native-bottom-sheet-toolbox-text-input
Version:
69 lines (68 loc) • 3.41 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.OverlayTextInput = OverlayTextInput;
var React = _interopRequireWildcard(require("react"));
var _reactMergeRefs = require("react-merge-refs");
var _reactNative = require("react-native");
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
var _reactNativeBottomSheetToolbox = require("@attio/react-native-bottom-sheet-toolbox");
var _useMinOverlayHeightSharedValue = require("./use-min-overlay-height-shared-value");
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 AnimatedTextInput = _reactNativeReanimated.default.createAnimatedComponent(_reactNative.TextInput);
function OverlayTextInput({
bottomInsetSharedValue,
topInsetSharedValue,
minTextInputHeightSharedValue,
textInputStyle,
autoFocus = false,
multiline = false,
ref,
value,
...textInputProps
}) {
const textInputRef = React.useRef(null);
const onContentSizeChange = (0, _useMinOverlayHeightSharedValue.useMinOverlayHeightSharedValue)({
minTextInputHeightSharedValue,
topInsetSharedValue,
bottomInsetSharedValue,
textInputStyle,
fallbackLines: multiline ? 3 : 1
});
const {
currentPositionSharedValue
} = (0, _reactNativeBottomSheetToolbox.useBottomSheetToolboxInternalContext)();
const keyboardHeightSharedValue = (0, _reactNativeBottomSheetToolbox.useKeyboardHeightSharedValue)();
const overlayTextInputHeightSharedValue = (0, _reactNativeReanimated.useDerivedValue)(() => {
const topInset = topInsetSharedValue.get();
const minTextInputHeight = minTextInputHeightSharedValue.get();
if (topInset === null || minTextInputHeight === null) {
return null;
}
const unclampedHeight = currentPositionSharedValue.get() - keyboardHeightSharedValue.get() - topInset - bottomInsetSharedValue.get();
const height = Math.max(minTextInputHeight, unclampedHeight);
return height;
}, [bottomInsetSharedValue, currentPositionSharedValue, keyboardHeightSharedValue, minTextInputHeightSharedValue, topInsetSharedValue]);
const style = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
const height = overlayTextInputHeightSharedValue.get();
const bottomInset = bottomInsetSharedValue.get();
return {
height: height,
marginBottom: bottomInset
};
}, [bottomInsetSharedValue]);
const mergedRef = (0, _reactMergeRefs.useMergeRefs)([ref, textInputRef]);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(AnimatedTextInput, {
ref: mergedRef,
...textInputProps,
value: value,
multiline: multiline,
onContentSizeChange: onContentSizeChange,
textAlignVertical: "top",
autoFocus: autoFocus,
style: [style, textInputStyle]
});
}
//# sourceMappingURL=overlay-text-input.js.map