@dnb/eufemia/cjs/components/dialog/parts/DialogAction.js

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _clsx = require("clsx");
var _Button = _interopRequireDefault(require("../../button/Button.js"));
var _FormStatus = _interopRequireDefault(require("../../FormStatus.js"));
var _Space = _interopRequireDefault(require("../../space/Space.js"));
var _ModalContext = _interopRequireDefault(require("../../modal/ModalContext.js"));
var _componentHelper = require("../../../shared/component-helper.js");
var _index = require("../../../shared/index.js");
var _useId = _interopRequireDefault(require("../../../shared/helpers/useId.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 }; }
const fallbackCloseAction = ({
  close
}) => close();
const DialogAction = ({
  declineText = null,
  confirmText = null,
  hideDecline = false,
  hideConfirm = false,
  status,
  onConfirm = fallbackCloseAction,
  onDecline = fallbackCloseAction,
  className,
  children,
  ...props
}) => {
  const {
    translation,
    Button: ButtonContext
  } = (0, _react.useContext)(_index.Context);
  const {
    close
  } = (0, _react.useContext)(_ModalContext.default);
  let childrenWithCloseFunc;
  const statusId = (0, _useId.default)();
  const statusDescribedBy = status ? statusId + '-status' : undefined;
  const onConfirmHandler = (0, _react.useCallback)(event => {
    (0, _componentHelper.dispatchCustomElementEvent)({
      onConfirm
    }, 'onConfirm', {
      event,
      close
    });
  }, [close, onConfirm]);
  const onDeclineHandler = (0, _react.useCallback)(event => {
    (0, _componentHelper.dispatchCustomElementEvent)({
      onDecline
    }, 'onDecline', {
      event,
      close
    });
  }, [close, onDecline]);
  if (children) {
    childrenWithCloseFunc = _react.Children.map(children, child => {
      if ((0, _react.isValidElement)(child) && child.type === _Button.default) {
        const childElement = child;
        return (0, _react.createElement)(childElement.type, {
          ...(childElement.props || {}),
          onClick: event => {
            (0, _componentHelper.dispatchCustomElementEvent)(childElement.props, 'onClick', {
              event,
              close
            });
          },
          ...(statusDescribedBy && {
            'aria-describedby': (0, _componentHelper.combineDescribedBy)(childElement.props, statusDescribedBy)
          })
        }, childElement.props.children);
      } else {
        return child;
      }
    });
  }
  return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [(0, _jsxRuntime.jsxs)(_Space.default, {
      element: "section",
      className: (0, _clsx.clsx)('dnb-dialog__actions', className),
      ...props,
      children: [childrenWithCloseFunc, !children && !hideDecline && (0, _jsxRuntime.jsx)(_Button.default, {
        text: declineText || translation?.Dialog?.declineText,
        variant: "secondary",
        onClick: onDeclineHandler,
        size: ButtonContext?.size || 'large',
        "aria-describedby": hideConfirm ? statusDescribedBy : undefined
      }), !children && !hideConfirm && (0, _jsxRuntime.jsx)(_Button.default, {
        text: confirmText || translation?.Dialog?.confirmText,
        variant: "primary",
        onClick: onConfirmHandler,
        size: ButtonContext?.size || 'large',
        status: status ? 'error' : undefined,
        "aria-describedby": statusDescribedBy
      })]
    }), (0, _jsxRuntime.jsx)(_FormStatus.default, {
      show: !!status,
      id: statusId + '-form-status',
      textId: statusId + '-status',
      noAnimation: false,
      shellSpace: {
        top: 'small'
      },
      children: status
    })]
  });
};
(0, _withComponentMarkers.default)(DialogAction, {
  _supportsSpacingProps: true
});
var _default = exports.default = DialogAction;
//# sourceMappingURL=DialogAction.js.map