UNPKG

@ozen-ui/kit

Version:

React component library

30 lines (29 loc) 2.68 kB
"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';