@ozen-ui/kit
Version:
React component library
30 lines (29 loc) • 2.68 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.BottomSheetBase = void 0;
var tslib_1 = require("tslib");
require("./BottomSheetBase.css");
var react_1 = tslib_1.__importStar(require("react"));
var useLockBodyScroll_1 = require("../../hooks/useLockBodyScroll");
var usePortalContainer_1 = require("../../hooks/usePortalContainer");
var components_1 = require("./components");
var constants_1 = require("./constants");
var BottomSheetBaseContextProvider_1 = require("./context/BottomSheetBaseContextProvider");
var hooks_1 = require("./hooks");
var modules_1 = require("./modules");
exports.BottomSheetBase = (0, react_1.forwardRef)(function (_a, ref) {
var children = _a.children, snaps = _a.snaps, open = _a.open, maxHeight = _a.maxHeight, defaultSnap = _a.defaultSnap, _b = _a.onClose, onClose = _b === void 0 ? function () { } : _b, _c = _a.closable, closable = _c === void 0 ? constants_1.BOTTOM_SHEET_BASE_CLOSABLE : _c, _d = _a.backdrop, backdrop = _d === void 0 ? react_1.default.createElement(modules_1.BottomSheetBaseBackdrop, null) : _d, _e = _a.hideBackdrop, hideBackdrop = _e === void 0 ? constants_1.BOTTOM_SHEET_BASE_HIDE_BACKDROP : _e, _f = _a.disableScrollLock, disableScrollLock = _f === void 0 ? constants_1.BOTTOM_SHEET_BASE_DISABLE_SCROLL_LOCK : _f, bottomSheetClassName = _a.bottomSheetClassName, _g = _a.container, containerProp = _g === void 0 ? constants_1.BOTTOM_SHEET_BASE_PORTAL_CONTAINER : _g, other = tslib_1.__rest(_a, ["children", "snaps", "open", "maxHeight", "defaultSnap", "onClose", "closable", "backdrop", "hideBackdrop", "disableScrollLock", "bottomSheetClassName", "container"]);
var _h = tslib_1.__read((0, react_1.useState)(false), 2), isAnimating = _h[0], setIsAnimating = _h[1];
var isVisible = (0, hooks_1.useBottomSheetBaseVisibility)({
isAnimating: isAnimating,
isOpen: open,
});
(0, useLockBodyScroll_1.useLockBodyScroll)(open && !disableScrollLock);
var container = (0, usePortalContainer_1.usePortalContainer)(containerProp);
if (!isVisible || !container) {
return null;
}
return (react_1.default.createElement(BottomSheetBaseContextProvider_1.BottomSheetBaseContextProvider, { snaps: snaps, onClose: onClose, defaultSnap: defaultSnap, maxHeight: maxHeight, isClosable: closable, isOpen: open, setIsAnimating: setIsAnimating },
react_1.default.createElement(components_1.BottomSheetBaseLayout, tslib_1.__assign({}, other, { ref: ref, backdrop: backdrop, container: container, hideBackdrop: hideBackdrop, bottomSheetClassName: bottomSheetClassName }), children)));
});
exports.BottomSheetBase.displayName = 'BottomSheetBase';