@oxyhq/services
Version:
180 lines (173 loc) • 6.25 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _zustand = require("zustand");
var _routes = require("../navigation/routes.js");
var _useColorScheme = require("../hooks/useColorScheme.js");
var _theme = require("../constants/theme.js");
var _BottomSheet = _interopRequireDefault(require("./BottomSheet.js"));
var _bottomSheetManager = require("../navigation/bottomSheetManager.js");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
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); }
/**
* BottomSheetRouter - Navigation container for bottom sheet screens
*/
const BottomSheetRouter = ({
onScreenChange,
onDismiss
}) => {
const sheetRef = (0, _react.useRef)(null);
const colorScheme = (0, _useColorScheme.useColorScheme)();
const colors = _theme.Colors[colorScheme ?? 'light'];
const prevScreenRef = (0, _react.useRef)(null);
const {
currentScreen,
screenProps,
currentStep,
isOpen
} = (0, _zustand.useStore)(_bottomSheetManager.bottomSheetStore);
const ScreenComponent = (0, _react.useMemo)(() => currentScreen ? (0, _routes.getScreenComponent)(currentScreen) : null, [currentScreen]);
// Notify screen changes
(0, _react.useEffect)(() => {
if (prevScreenRef.current !== currentScreen) {
onScreenChange?.(currentScreen);
prevScreenRef.current = currentScreen;
}
}, [currentScreen, onScreenChange]);
// Control visibility
(0, _react.useEffect)(() => {
if (!sheetRef.current) return;
if (isOpen) {
sheetRef.current.present();
} else {
sheetRef.current.dismiss();
}
}, [isOpen]);
// Android back button
(0, _react.useEffect)(() => {
if (!isOpen) return;
const handler = _reactNative.BackHandler.addEventListener('hardwareBackPress', () => {
handleGoBack();
return true;
});
return () => handler.remove();
}, [isOpen]);
const navigate = (0, _react.useCallback)((screen, props) => {
if (!(0, _routes.isValidRoute)(screen)) {
if (__DEV__) console.warn(`[BottomSheetRouter] Invalid route: ${screen}`);
return;
}
(0, _bottomSheetManager.showBottomSheet)({
screen,
props
});
}, []);
const handleGoBack = (0, _react.useCallback)(() => {
const state = (0, _bottomSheetManager.getState)();
// Try history first
if (state.history.length > 0) {
(0, _bottomSheetManager.goBack)();
return true;
}
// Try step back
const step = state.currentStep ?? 0;
if (step > 0) {
(0, _bottomSheetManager.updateState)({
currentStep: step - 1,
screenProps: {
...state.screenProps,
initialStep: step - 1
}
});
return true;
}
// Close
(0, _bottomSheetManager.closeBottomSheet)();
return true;
}, []);
const canDismiss = (0, _react.useCallback)(() => {
const state = (0, _bottomSheetManager.getState)();
if (state.history.length > 0) return false;
const step = state.currentStep ?? 0;
return step <= 0;
}, []);
const handleDismissAttempt = (0, _react.useCallback)(() => {
if (!canDismiss()) {
handleGoBack();
return false;
}
return true;
}, [canDismiss, handleGoBack]);
const handleDismiss = (0, _react.useCallback)(() => {
(0, _bottomSheetManager.closeBottomSheet)();
onDismiss?.();
}, [onDismiss]);
const handleStepChange = (0, _react.useCallback)(step => {
const state = (0, _bottomSheetManager.getState)();
(0, _bottomSheetManager.updateState)({
currentStep: step,
screenProps: {
...state.screenProps,
initialStep: step
}
});
}, []);
const scrollTo = (0, _react.useCallback)((y, animated) => {
sheetRef.current?.scrollTo(y, animated);
}, []);
const renderBackground = (0, _react.useCallback)(props => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: [styles.background, {
backgroundColor: colors.background
}, props.style]
}), [colors.background]);
const screenPropsValue = (0, _react.useMemo)(() => {
const {
initialStep: _,
...rest
} = screenProps;
return {
navigate,
goBack: handleGoBack,
onClose: _bottomSheetManager.closeBottomSheet,
onAuthenticated: _bottomSheetManager.closeBottomSheet,
theme: colorScheme ?? 'light',
currentScreen: currentScreen ?? undefined,
initialStep: currentStep ?? screenProps?.initialStep,
onStepChange: handleStepChange,
scrollTo,
...rest
};
}, [navigate, handleGoBack, colorScheme, currentScreen, currentStep, screenProps, handleStepChange, scrollTo]);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_BottomSheet.default, {
ref: sheetRef,
enablePanDownToClose: true,
enableHandlePanningGesture: true,
backgroundComponent: renderBackground,
style: styles.container,
onDismiss: handleDismiss,
onDismissAttempt: handleDismissAttempt,
children: ScreenComponent && currentScreen && /*#__PURE__*/(0, _jsxRuntime.jsx)(ScreenComponent, {
...screenPropsValue
})
});
};
const styles = _reactNative.StyleSheet.create({
container: {
maxWidth: 800,
width: '100%',
alignSelf: 'center',
marginHorizontal: 'auto'
},
background: {
borderTopLeftRadius: 20,
borderTopRightRadius: 20,
overflow: 'hidden'
}
});
var _default = exports.default = /*#__PURE__*/_react.default.memo(BottomSheetRouter);
//# sourceMappingURL=BottomSheetRouter.js.map