@trap_stevo/legendarybuilderproreact-ui/dist/HUDComponents/HUDConfirmationModal.js

The legendary UI & utility API that makes your application a legendary application. ~ Created by Steven Compton

import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import * as React from "react";
import { useState } from "react";
import { motion } from "framer-motion";
import HUDLoading from "./HUDLoading.js";
import HUDModal from "./HUDModal.js";
import HUDTyper from "./HUDTyper.js";
import HUDIcon from "./HUDIcon.js";
function HUDConfirmationModal(_ref) {
  var _ref$confirmationModa = _ref.confirmationModalConfirmationMessageAnimationTransitionConfigurationSettings,
    confirmationModalConfirmationMessageAnimationTransitionConfigurationSettings = _ref$confirmationModa === void 0 ? {} : _ref$confirmationModa,
    _ref$confirmationModa2 = _ref.confirmationModalActionsContainerAnimationTransitionConfigurationSettings,
    confirmationModalActionsContainerAnimationTransitionConfigurationSettings = _ref$confirmationModa2 === void 0 ? {} : _ref$confirmationModa2,
    _ref$confirmationModa3 = _ref.confirmationModalConfirmationMessageAnimationStylesConfigurationSettings,
    confirmationModalConfirmationMessageAnimationStylesConfigurationSettings = _ref$confirmationModa3 === void 0 ? {} : _ref$confirmationModa3,
    _ref$confirmModalConf = _ref.confirmModalConfirmButtonMessageAnimationTransitionConfigurationSettings,
    confirmModalConfirmButtonMessageAnimationTransitionConfigurationSettings = _ref$confirmModalConf === void 0 ? {} : _ref$confirmModalConf,
    _ref$confirmationModa4 = _ref.confirmationModalActionsContainerInitialAnimationConfigurationSettings,
    confirmationModalActionsContainerInitialAnimationConfigurationSettings = _ref$confirmationModa4 === void 0 ? {} : _ref$confirmationModa4,
    _ref$confirmModalConf2 = _ref.confirmModalConfirmButtonMessageAnimationStylesConfigurationSettings,
    confirmModalConfirmButtonMessageAnimationStylesConfigurationSettings = _ref$confirmModalConf2 === void 0 ? {} : _ref$confirmModalConf2,
    _ref$confirmModalCanc = _ref.confirmModalCancelButtonMessageAnimationStylesConfigurationSettings,
    confirmModalCancelButtonMessageAnimationStylesConfigurationSettings = _ref$confirmModalCanc === void 0 ? {} : _ref$confirmModalCanc,
    _ref$confirmationModa5 = _ref.confirmationModalConfirmationMessageContainerConfigurationSettings,
    confirmationModalConfirmationMessageContainerConfigurationSettings = _ref$confirmationModa5 === void 0 ? {} : _ref$confirmationModa5,
    _ref$confirmationModa6 = _ref.confirmationModalActionsContainerAnimationConfigurationSettings,
    confirmationModalActionsContainerAnimationConfigurationSettings = _ref$confirmationModa6 === void 0 ? {} : _ref$confirmationModa6,
    _ref$confirmModalConf3 = _ref.confirmModalConfirmButtonMessageContainerConfigurationSettings,
    confirmModalConfirmButtonMessageContainerConfigurationSettings = _ref$confirmModalConf3 === void 0 ? {} : _ref$confirmModalConf3,
    _ref$confirmModalCanc2 = _ref.confirmModalCancelButtonMessageContainerConfigurationSettings,
    confirmModalCancelButtonMessageContainerConfigurationSettings = _ref$confirmModalCanc2 === void 0 ? {} : _ref$confirmModalCanc2,
    _ref$confirmationModa7 = _ref.confirmationModalConfirmationMessageConfigurationSettings,
    confirmationModalConfirmationMessageConfigurationSettings = _ref$confirmationModa7 === void 0 ? {} : _ref$confirmationModa7,
    _ref$confirmationModa8 = _ref.confirmationModalHeaderContentTitleConfigurationSettings,
    confirmationModalHeaderContentTitleConfigurationSettings = _ref$confirmationModa8 === void 0 ? {} : _ref$confirmationModa8,
    _ref$confirmationModa9 = _ref.confirmationModalFooterContentTitleConfigurationSettings,
    confirmationModalFooterContentTitleConfigurationSettings = _ref$confirmationModa9 === void 0 ? {} : _ref$confirmationModa9,
    _ref$confirmationModa10 = _ref.confirmationModalActionsContainerConfigurationSettings,
    confirmationModalActionsContainerConfigurationSettings = _ref$confirmationModa10 === void 0 ? {} : _ref$confirmationModa10,
    _ref$confirmModalConf4 = _ref.confirmModalConfirmButtonMessageConfigurationSettings,
    confirmModalConfirmButtonMessageConfigurationSettings = _ref$confirmModalConf4 === void 0 ? {} : _ref$confirmModalConf4,
    _ref$confirmModalCanc3 = _ref.confirmModalCancelButtonMessageConfigurationSettings,
    confirmModalCancelButtonMessageConfigurationSettings = _ref$confirmModalCanc3 === void 0 ? {} : _ref$confirmModalCanc3,
    _ref$confirmationModa11 = _ref.confirmationModalHeaderContentConfigurationSettings,
    confirmationModalHeaderContentConfigurationSettings = _ref$confirmationModa11 === void 0 ? {} : _ref$confirmationModa11,
    _ref$confirmationModa12 = _ref.confirmationModalFooterContentConfigurationSettings,
    confirmationModalFooterContentConfigurationSettings = _ref$confirmationModa12 === void 0 ? {} : _ref$confirmationModa12,
    _ref$confirmModalConf5 = _ref.confirmModalConfirmButtonHoverConfigurationSettings,
    confirmModalConfirmButtonHoverConfigurationSettings = _ref$confirmModalConf5 === void 0 ? {} : _ref$confirmModalConf5,
    _ref$confirmModalCanc4 = _ref.confirmModalCancelButtonHoverConfigurationSettings,
    confirmModalCancelButtonHoverConfigurationSettings = _ref$confirmModalCanc4 === void 0 ? {} : _ref$confirmModalCanc4,
    _ref$confirmModalConf6 = _ref.confirmModalConfirmButtonTapConfigurationSettings,
    confirmModalConfirmButtonTapConfigurationSettings = _ref$confirmModalConf6 === void 0 ? {} : _ref$confirmModalConf6,
    _ref$confirmModalCanc5 = _ref.confirmModalCancelButtonTapConfigurationSettings,
    confirmModalCancelButtonTapConfigurationSettings = _ref$confirmModalCanc5 === void 0 ? {} : _ref$confirmModalCanc5,
    _ref$confirmationModa13 = _ref.confirmationModalBackDropConfigurationSettings,
    confirmationModalBackDropConfigurationSettings = _ref$confirmationModa13 === void 0 ? {} : _ref$confirmationModa13,
    _ref$confirmModalConf7 = _ref.confirmModalConfirmButtonConfigurationSettings,
    confirmModalConfirmButtonConfigurationSettings = _ref$confirmModalConf7 === void 0 ? {} : _ref$confirmModalConf7,
    _ref$confirmationModa14 = _ref.confirmationModalContentConfigurationSettings,
    confirmationModalContentConfigurationSettings = _ref$confirmationModa14 === void 0 ? {} : _ref$confirmationModa14,
    _ref$confirmModalCanc6 = _ref.confirmModalCancelButtonConfigurationSettings,
    confirmModalCancelButtonConfigurationSettings = _ref$confirmModalCanc6 === void 0 ? {} : _ref$confirmModalCanc6,
    _ref$confirmationModa15 = _ref.confirmationModalHeaderConfigurationSettings,
    confirmationModalHeaderConfigurationSettings = _ref$confirmationModa15 === void 0 ? {} : _ref$confirmationModa15,
    _ref$confirmationModa16 = _ref.confirmationModalConfigurationSettings,
    confirmationModalConfigurationSettings = _ref$confirmationModa16 === void 0 ? {} : _ref$confirmationModa16,
    _ref$confirmationModa17 = _ref.confirmationModalConfirmationMessageConfigurations,
    confirmationModalConfirmationMessageConfigurations = _ref$confirmationModa17 === void 0 ? {} : _ref$confirmationModa17,
    _ref$confirmationModa18 = _ref.confirmationModalHeaderContentTitleConfigurations,
    confirmationModalHeaderContentTitleConfigurations = _ref$confirmationModa18 === void 0 ? {} : _ref$confirmationModa18,
    _ref$confirmationModa19 = _ref.confirmationModalFooterContentTitleConfigurations,
    confirmationModalFooterContentTitleConfigurations = _ref$confirmationModa19 === void 0 ? {} : _ref$confirmationModa19,
    _ref$confirmationModa20 = _ref.confirmationModalHeaderContentIconConfigurations,
    confirmationModalHeaderContentIconConfigurations = _ref$confirmationModa20 === void 0 ? {} : _ref$confirmationModa20,
    _ref$confirmationModa21 = _ref.confirmationModalFooterContentIconConfigurations,
    confirmationModalFooterContentIconConfigurations = _ref$confirmationModa21 === void 0 ? {} : _ref$confirmationModa21,
    _ref$confirmationModa22 = _ref.confirmationModalActionsContainerConfigurations,
    confirmationModalActionsContainerConfigurations = _ref$confirmationModa22 === void 0 ? {} : _ref$confirmationModa22,
    _ref$confirmModalConf8 = _ref.confirmModalConfirmButtonMessageConfigurations,
    confirmModalConfirmButtonMessageConfigurations = _ref$confirmModalConf8 === void 0 ? {} : _ref$confirmModalConf8,
    _ref$confirmModalCanc7 = _ref.confirmModalCancelButtonMessageConfigurations,
    confirmModalCancelButtonMessageConfigurations = _ref$confirmModalCanc7 === void 0 ? {} : _ref$confirmModalCanc7,
    _ref$confirmationModa23 = _ref.confirmationModalHeaderContentConfigurations,
    confirmationModalHeaderContentConfigurations = _ref$confirmationModa23 === void 0 ? {} : _ref$confirmationModa23,
    _ref$confirmationModa24 = _ref.confirmationModalFooterContentConfigurations,
    confirmationModalFooterContentConfigurations = _ref$confirmationModa24 === void 0 ? {} : _ref$confirmationModa24,
    _ref$confirmModalConf9 = _ref.confirmModalConfirmButtonIconConfigurations,
    confirmModalConfirmButtonIconConfigurations = _ref$confirmModalConf9 === void 0 ? {} : _ref$confirmModalConf9,
    _ref$confirmModalCanc8 = _ref.confirmModalCancelButtonIconConfigurations,
    confirmModalCancelButtonIconConfigurations = _ref$confirmModalCanc8 === void 0 ? {} : _ref$confirmModalCanc8,
    _ref$confirmModalConf10 = _ref.confirmModalConfirmButtonConfigurations,
    confirmModalConfirmButtonConfigurations = _ref$confirmModalConf10 === void 0 ? {} : _ref$confirmModalConf10,
    _ref$confirmModalCanc9 = _ref.confirmModalCancelButtonConfigurations,
    confirmModalCancelButtonConfigurations = _ref$confirmModalCanc9 === void 0 ? {} : _ref$confirmModalCanc9,
    _ref$confirmationModa25 = _ref.confirmationModalConfigurations,
    confirmationModalConfigurations = _ref$confirmationModa25 === void 0 ? {} : _ref$confirmationModa25,
    _ref$confirmationModa26 = _ref.confirmationModalHeaderContent,
    confirmationModalHeaderContent = _ref$confirmationModa26 === void 0 ? null : _ref$confirmationModa26,
    _ref$confirmationModa27 = _ref.confirmationModalFooterContent,
    confirmationModalFooterContent = _ref$confirmationModa27 === void 0 ? null : _ref$confirmationModa27,
    _ref$onConfirm = _ref.onConfirm,
    onConfirm = _ref$onConfirm === void 0 ? null : _ref$onConfirm,
    _ref$onCancel = _ref.onCancel,
    onCancel = _ref$onCancel === void 0 ? null : _ref$onCancel,
    setConfirmationModalVisible = _ref.setConfirmationModalVisible,
    confirmationModalVisible = _ref.confirmationModalVisible,
    _ref$confirmationFoot = _ref.confirmationFootnote,
    confirmationFootnote = _ref$confirmationFoot === void 0 ? "This action removes data permanently." : _ref$confirmationFoot,
    _ref$confirmationMess = _ref.confirmationMessage,
    confirmationMessage = _ref$confirmationMess === void 0 ? "Remove selected content permanently?" : _ref$confirmationMess,
    _ref$confirmationTitl = _ref.confirmationTitle,
    confirmationTitle = _ref$confirmationTitl === void 0 ? "Confirm Deletion" : _ref$confirmationTitl,
    _ref$confirmationData = _ref.confirmationData,
    confirmationData = _ref$confirmationData === void 0 ? null : _ref$confirmationData,
    children = _ref.children;
  return /*#__PURE__*/React.createElement(HUDModal, _extends({
    backdropConfigurationSettings: _objectSpread({
      background: "transparent"
    }, confirmationModalBackDropConfigurationSettings),
    headerConfigurationSettings: _objectSpread({
      flexDirection: "row-reverse",
      justifyContent: "space-between"
    }, confirmationModalHeaderConfigurationSettings),
    contentConfigurationSettings: _objectSpread({
      alignItems: "center"
    }, confirmationModalContentConfigurationSettings),
    modalConfigurationSettings: _objectSpread({
      border: "1px solid rgba(227, 227, 227, 1)",
      height: "auto"
    }, confirmationModalConfigurationSettings),
    headerContent: /*#__PURE__*/React.createElement("div", _extends({
      style: _objectSpread({
        display: "flex",
        flexDirection: "row",
        alignItems: "center",
        gap: "5.69px"
      }, confirmationModalHeaderContentConfigurationSettings)
    }, confirmationModalHeaderContentConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
      color: "orange",
      name: "trash-alt"
    }, confirmationModalHeaderContentIconConfigurations)), /*#__PURE__*/React.createElement("label", _extends({
      style: _objectSpread({
        display: "flex",
        flexDirection: "row",
        fontFamily: "HUD Subtitle",
        fontWeight: "769",
        color: "orange"
      }, confirmationModalHeaderContentTitleConfigurationSettings)
    }, confirmationModalHeaderContentTitleConfigurations), /*#__PURE__*/React.createElement(HUDTyper, {
      speed: 5.69
    }, confirmationTitle))),
    footerContent: /*#__PURE__*/React.createElement("div", _extends({
      style: _objectSpread({
        display: "flex",
        flexDirection: "row",
        alignItems: "center",
        fontSize: "0.869rem",
        gap: "5.69px"
      }, confirmationModalFooterContentConfigurationSettings)
    }, confirmationModalFooterContentConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
      color: "orange",
      name: "warning"
    }, confirmationModalFooterContentIconConfigurations)), /*#__PURE__*/React.createElement("label", _extends({
      style: _objectSpread({
        display: "flex",
        flexDirection: "row",
        fontFamily: "HUD Subtitle",
        color: "orange"
      }, confirmationModalFooterContentTitleConfigurationSettings)
    }, confirmationModalFooterContentTitleConfigurations), /*#__PURE__*/React.createElement(HUDTyper, {
      speed: 5.69
    }, confirmationFootnote))),
    onClose: function onClose() {
      setConfirmationModalVisible(false);
      if (onCancel) {
        onCancel(null, false, null);
      }
    },
    open: confirmationModalVisible
  }, confirmationModalConfigurations), /*#__PURE__*/React.createElement(HUDLoading, _extends({
    wordAnimationTransitionConfigurationSettings: _objectSpread({
      repeat: 0
    }, confirmationModalConfirmationMessageAnimationTransitionConfigurationSettings),
    wordContainerConfigurationSettings: _objectSpread({
      marginTop: "1.69rem"
    }, confirmationModalConfirmationMessageContainerConfigurationSettings),
    wordConfigurationSettings: _objectSpread({
      fontFamily: "HUD Subtitle"
    }, confirmationModalConfirmationMessageConfigurationSettings),
    wordStyles: _objectSpread({
      opacity: 1,
      scale: [0, 1, 1]
    }, confirmationModalConfirmationMessageAnimationStylesConfigurationSettings),
    word: confirmationMessage,
    wordColor: "rgba(27, 27, 27, 1)",
    speed: 0.69,
    type: "word"
  }, confirmationModalConfirmationMessageConfigurations)), /*#__PURE__*/React.createElement(motion.div, _extends({
    initial: _objectSpread({
      scale: 0.269,
      y: -200
    }, confirmationModalActionsContainerInitialAnimationConfigurationSettings),
    animate: _objectSpread({
      scale: 1,
      y: 0
    }, confirmationModalActionsContainerAnimationConfigurationSettings),
    transition: _objectSpread({
      duration: 0.469,
      delay: 0.869,
      animate: "easeOut"
    }, confirmationModalActionsContainerAnimationTransitionConfigurationSettings),
    style: _objectSpread({
      display: "flex",
      flexDirection: "row",
      alignItems: "center",
      width: "auto",
      gap: "12.69px",
      padding: "0.69rem",
      marginTop: "1.69rem"
    }, confirmationModalActionsContainerConfigurationSettings)
  }, confirmationModalActionsContainerConfigurations), /*#__PURE__*/React.createElement(motion.div, _extends({
    whileHover: _objectSpread({
      background: "rgba(215.69, 215.69, 215.69, 1)",
      scale: 1.1069
    }, confirmModalCancelButtonHoverConfigurationSettings),
    whileTap: _objectSpread({
      opacity: 0.869,
      scale: 0.869
    }, confirmModalCancelButtonTapConfigurationSettings),
    style: _objectSpread({
      display: "flex",
      alignItems: "center",
      userSelect: "none",
      cursor: "pointer",
      border: "1px solid rgba(227.69, 227.69, 227.69, 1)",
      borderRadius: "0.369rem",
      background: "rgba(187.69, 187.69, 187.69, 0.869)",
      gap: "5.69px",
      paddingBottom: "0.369rem",
      paddingTop: "0.369rem",
      padding: "0.269rem"
    }, confirmModalCancelButtonConfigurationSettings),
    onClick: function onClick() {
      if (onCancel) {
        onCancel(null, false, function () {
          return setConfirmationModalVisible(false);
        });
      }
    }
  }, confirmModalCancelButtonConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
    color: "rgba(255, 255, 255, 1)",
    name: "times"
  }, confirmModalCancelButtonIconConfigurations)), /*#__PURE__*/React.createElement(HUDLoading, _extends({
    wordContainerConfigurationSettings: _objectSpread({
      userSelect: "none"
    }, confirmModalCancelButtonMessageContainerConfigurationSettings),
    wordConfigurationSettings: _objectSpread({
      fontFamily: "HUD Subtitle",
      fontSize: "1rem"
    }, confirmModalCancelButtonMessageConfigurationSettings),
    wordStyles: _objectSpread({
      opacity: 1
    }, confirmModalCancelButtonMessageAnimationStylesConfigurationSettings),
    word: "Cancel",
    wordColor: "rgba(255, 255, 255, 1)",
    speed: 2.69,
    type: "word"
  }, confirmModalCancelButtonMessageConfigurations))), /*#__PURE__*/React.createElement(motion.div, _extends({
    whileHover: _objectSpread({
      background: "rgba(247.69, 57.69, 0, 0.969)",
      scale: 1.1069
    }, confirmModalConfirmButtonHoverConfigurationSettings),
    whileTap: _objectSpread({
      opacity: 0.869,
      scale: 0.869
    }, confirmModalConfirmButtonTapConfigurationSettings),
    style: _objectSpread({
      display: "flex",
      alignItems: "center",
      userSelect: "none",
      cursor: "pointer",
      border: "1px solid rgba(255, 37, 0, 1)",
      borderRadius: "0.369rem",
      background: "rgba(227.69, 57, 0, 0.869)",
      gap: "5.69px",
      paddingBottom: "0.369rem",
      paddingTop: "0.369rem",
      padding: "0.269rem"
    }, confirmModalConfirmButtonConfigurationSettings),
    onClick: function onClick() {
      if (onConfirm) {
        onConfirm(confirmationData, true, function () {
          return setConfirmationModalVisible(false);
        });
      }
    }
  }, confirmModalConfirmButtonConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
    color: "rgba(255, 255, 255, 1)",
    name: "trash"
  }, confirmModalConfirmButtonIconConfigurations)), /*#__PURE__*/React.createElement(HUDLoading, _extends({
    wordAnimationTransitionConfigurationSettings: _objectSpread({
      repeat: 0
    }, confirmModalConfirmButtonMessageAnimationTransitionConfigurationSettings),
    wordContainerConfigurationSettings: _objectSpread({
      userSelect: "none"
    }, confirmModalConfirmButtonMessageContainerConfigurationSettings),
    wordConfigurationSettings: _objectSpread({
      fontFamily: "HUD Subtitle",
      fontSize: "1rem"
    }, confirmModalConfirmButtonMessageConfigurationSettings),
    wordStyles: _objectSpread({
      opacity: 1,
      transform: ["rotate(0deg)", "rotate(0deg)", "rotate(47deg)", "rotate(270deg)", "rotate(0deg)", "rotate(0deg)", "rotate(0deg)", "rotate(0deg)"]
    }, confirmModalConfirmButtonMessageAnimationStylesConfigurationSettings),
    word: "Confirm",
    wordColor: "rgba(255, 255, 255, 1)",
    speed: 2.69,
    type: "word"
  }, confirmModalConfirmButtonMessageConfigurations)))), children);
}
;
export default HUDConfirmationModal;