UNPKG

brandeur-primitives

Version:

Primitive components for brandeur

59 lines 2.38 kB
var _excluded = ["children", "visible", "zIndex", "inset", "top", "left", "bottom", "right", "style"]; function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; } function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; } import React, { forwardRef } from 'react'; var containerStyle = function containerStyle(_ref) { var zIndex = _ref.zIndex, overflow = _ref.overflow, inset = _ref.inset, top = _ref.top, left = _ref.left, bottom = _ref.bottom, right = _ref.right; return { position: 'fixed', maxHeight: '100%', zIndex: zIndex, inset: inset, top: top, left: left, bottom: bottom, right: right, paddingRight: 'env(safe-area-inset-right)', paddingLeft: 'env(safe-area-inset-left)', paddingTop: 'env(safe-area-inset-top)', paddingBottom: 'env(safe-area-inset-bottom)' }; }; export default function createOverlay(_ref2) { var El = _ref2.El; return /*#__PURE__*/forwardRef(function Overlay(_ref3, ref) { var children = _ref3.children, _ref3$visible = _ref3.visible, visible = _ref3$visible === void 0 ? false : _ref3$visible, zIndex = _ref3.zIndex, inset = _ref3.inset, top = _ref3.top, left = _ref3.left, bottom = _ref3.bottom, right = _ref3.right, style = _ref3.style, props = _objectWithoutProperties(_ref3, _excluded); if (!visible) { return null; } return /*#__PURE__*/React.createElement(El, _extends({ ref: ref }, props, { style: [style, containerStyle({ zIndex: zIndex, top: top, left: left, bottom: bottom, right: right, inset: inset })] }), children); }); }