UNPKG

@dnb/eufemia

Version:

DNB Eufemia Design System UI Library

122 lines (121 loc) 5.7 kB
"use strict"; "use client"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = DialogContent; var _react = require("react"); var _clsx = _interopRequireDefault(require("clsx")); var _componentHelper = require("../../shared/component-helper.js"); var _ScrollView = _interopRequireDefault(require("../../fragments/scroll-view/ScrollView.js")); var _DialogHeader = _interopRequireDefault(require("./parts/DialogHeader.js")); var _DialogNavigation = _interopRequireDefault(require("./parts/DialogNavigation.js")); var _DialogAction = _interopRequireDefault(require("./parts/DialogAction.js")); var _helpers = require("../modal/helpers.js"); var _ModalContext = _interopRequireDefault(require("../modal/ModalContext.js")); var _helpers2 = require("../drawer/helpers.js"); var _ModalHeaderBar = _interopRequireDefault(require("../modal/parts/ModalHeaderBar.js")); var _ModalHeader = _interopRequireDefault(require("../modal/parts/ModalHeader.js")); var _IconPrimary = _interopRequireDefault(require("../icon-primary/IconPrimary.js")); var _withComponentMarkers = _interopRequireDefault(require("../../shared/helpers/withComponentMarkers.js")); var _jsxRuntime = require("react/jsx-runtime"); function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } function DialogContent({ modalContent = null, navContent = null, headerContent = null, alignContent = null, className = null, preventCoreStyle = null, spacing = true, fullscreen, noAnimation = false, noAnimationOnMobile = false, minWidth: minWidthProp = null, maxWidth: maxWidthProp = null, variant = 'information', confirmType = 'information', icon = null, description, hideDecline, hideConfirm, onConfirm, onDecline, declineText, confirmText, scrollbarGutter, ...rest }) { const context = (0, _react.useContext)(_ModalContext.default); const { minWidth, maxWidth } = (0, _helpers2.checkMinMaxWidth)(minWidthProp, maxWidthProp); const content = modalContent || (0, _helpers.getContent)(typeof rest.children === 'function' ? Object.freeze({ ...rest, close: context === null || context === void 0 ? void 0 : context.close }) : rest); if (alignContent === null) { alignContent = variant === 'information' ? 'left' : 'centered'; } const contentParams = { className: (0, _clsx.default)('dnb-dialog', fullscreen === true ? `dnb-dialog--fullscreen` : fullscreen === 'auto' && `dnb-dialog--auto-fullscreen`, className, !preventCoreStyle && 'dnb-core-style', variant && `dnb-dialog--${variant}`, spacing && 'dnb-dialog--spacing', alignContent && `dnb-dialog__align--${alignContent}`, (context === null || context === void 0 ? void 0 : context.hide) && `dnb-dialog--hide`, noAnimation && `dnb-dialog--no-animation`, noAnimationOnMobile && `dnb-dialog--no-animation-on-mobile`), style: (minWidth || maxWidth) && { minWidth, maxWidth }, onClick: context === null || context === void 0 ? void 0 : context.preventClick, onTouchStart: context === null || context === void 0 ? void 0 : context.preventClick, onKeyDown: context === null || context === void 0 ? void 0 : context.onKeyDownHandler, ...rest }; const navExists = (0, _componentHelper.findElementInChildren)(content, cur => cur.type === _DialogNavigation.default || cur.type === _ModalHeaderBar.default); const headerExists = (0, _componentHelper.findElementInChildren)(content, cur => cur.type === _DialogHeader.default || cur.type === _ModalHeader.default); const actionExists = (0, _componentHelper.findElementInChildren)(content, cur => cur.type === _DialogAction.default); const dialogActionProps = { onConfirm, onDecline, declineText, confirmText, hideDecline, hideConfirm }; (0, _componentHelper.validateDOMAttributes)({}, contentParams); return (0, _jsxRuntime.jsx)("div", { ...contentParams, children: (0, _jsxRuntime.jsx)(_ScrollView.default, { ref: context === null || context === void 0 ? void 0 : context.scrollRef, scrollbarGutter: scrollbarGutter === false ? undefined : scrollbarGutter === 'stable' || variant === 'information' && spacing !== false ? 'stable' : undefined, children: (0, _jsxRuntime.jsxs)("div", { tabIndex: -1, className: "dnb-dialog__inner dnb-no-focus", ref: context === null || context === void 0 ? void 0 : context.contentRef, children: [!navExists && (0, _jsxRuntime.jsx)(_DialogNavigation.default, { children: navContent }), icon && (0, _jsxRuntime.jsx)("div", { className: "dnb-dialog__icon", children: (0, _jsxRuntime.jsx)(_IconPrimary.default, { border: true, icon: icon, "aria-hidden": true, className: (0, _clsx.default)('dnb-dialog__icon__primary', 'dnb-dialog__icon--' + confirmType) }, "dialog-icon") }), !headerExists && (0, _jsxRuntime.jsx)(_DialogHeader.default, { title: context === null || context === void 0 ? void 0 : context.title, size: variant === 'information' ? 'x-large' : 'large', children: headerContent }), (0, _jsxRuntime.jsxs)("div", { id: (context === null || context === void 0 ? void 0 : context.contentId) + '-content', className: "dnb-dialog__content", children: [description, content] }), variant === 'confirmation' && !actionExists && (0, _jsxRuntime.jsx)(_DialogAction.default, { ...dialogActionProps })] }) }) }); } (0, _withComponentMarkers.default)(DialogContent, { _supportsSpacingProps: true }); //# sourceMappingURL=DialogContent.js.map