@kiwicom/orbit-components
Version:
Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.
68 lines (67 loc) • 2.68 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
exports.__esModule = true;
exports.default = void 0;
var React = _interopRequireWildcard(require("react"));
var _useRandomId = _interopRequireDefault(require("../../hooks/useRandomId"));
var _useStateWithTimeout = _interopRequireDefault(require("../../hooks/useStateWithTimeout"));
var _Portal = _interopRequireDefault(require("../../Portal"));
var _TooltipPrimitive = require("../TooltipPrimitive");
var _DialogContent = _interopRequireDefault(require("./components/DialogContent"));
const MobileDialog = ({
children,
labelClose = "Close",
enabled = true,
onShow,
renderInPortal = true,
tabIndex = 0,
dataTest,
content,
stopPropagation = false,
removeUnderlinedText,
block = false,
lockScrolling
}) => {
const [render, setRender, setRenderWithTimeout, clearRenderTimeout] = (0, _useStateWithTimeout.default)(false, 200);
const [shown, setShown, setShownWithTimeout] = (0, _useStateWithTimeout.default)(false, 200);
const mobileDialogID = (0, _useRandomId.default)();
const handleInMobile = React.useCallback(ev => {
ev.preventDefault();
if (stopPropagation) {
ev.stopPropagation();
}
setRender(true);
if (onShow) onShow();
setShownWithTimeout(true);
clearRenderTimeout();
}, [clearRenderTimeout, setRender, setShownWithTimeout, stopPropagation]);
const handleOutMobile = React.useCallback(ev => {
if (stopPropagation) {
ev.stopPropagation();
}
setShown(false);
setRenderWithTimeout(false);
}, [setRenderWithTimeout, setShown, stopPropagation]);
if (!enabled && children) return /*#__PURE__*/React.createElement(React.Fragment, null, children);
const dialog = /*#__PURE__*/React.createElement(_DialogContent.default, {
dataTest: dataTest,
shown: shown,
labelClose: labelClose,
lockScrolling: lockScrolling,
dialogId: mobileDialogID,
onClose: handleOutMobile
}, content);
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_TooltipPrimitive.TooltipWrapper, {
onClick: handleInMobile,
"aria-describedby": enabled ? mobileDialogID : undefined,
tabIndex: enabled ? Number(tabIndex) : undefined,
enabled: enabled,
removeUnderlinedText: removeUnderlinedText,
block: block
}, children), enabled && render && (renderInPortal ? /*#__PURE__*/React.createElement(_Portal.default, {
renderInto: "dialogs"
}, dialog) : dialog));
};
var _default = MobileDialog;
exports.default = _default;