@bigbinary/neeto-molecules 1.1.10 → 1.1.12

package/dist/EmailForm/EmailPreview.js

@@ -0,0 +1,129 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React from "react";
+import classnames from "classnames";
+import { isNotEmpty, isPresent } from "@bigbinary/neeto-commons-frontend/pure";
+import { withT } from "@bigbinary/neeto-commons-frontend/react-utils";
+import { EditorContent } from "@bigbinary/neeto-editor";
+import { Typography, Button } from "@bigbinary/neetoui";
+import PropTypes from "prop-types";
+var MemoizedEditorContent = /*#__PURE__*/React.memo(EditorContent);
+var EmailPreview = withT(function (_ref) {
+  var t = _ref.t,
+    _ref$to = _ref.to,
+    to = _ref$to === void 0 ? [] : _ref$to,
+    from = _ref.from,
+    subject = _ref.subject,
+    body = _ref.body,
+    productName = _ref.productName,
+    actionButtonText = _ref.actionButtonText,
+    logo = _ref.logo,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-cy": "email-preview-card",
+    "data-testid": "email-preview",
+    className: classnames("neeto-ui-border-gray-300 neeto-ui-shadow-m neeto-ui-bg-white flex flex-1 flex-col border", _defineProperty({}, className, className))
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-border-gray-300 space-y-3 divide-y divide-gray-200 border-b p-6"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "flex gap-2",
+    "data-cy": "email-send-to-preview",
+    "data-testid": "email-to-block"
+  }, /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-500",
+    lineHeight: "normal",
+    style: "body2"
+  }, t("neetoMolecules.emailPreview.to"), ":"), isPresent(to) && isNotEmpty(to) ? /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-800 min-w-0 flex-grow break-words",
+    lineHeight: "normal",
+    style: "body2"
+  }, to.join(", ")) : /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-bg-gray-300 neeto-ui-rounded-full mt-2 h-2 w-40"
+  })), from && /*#__PURE__*/React.createElement("div", {
+    className: "flex items-center gap-2 pt-3"
+  }, /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-500",
+    lineHeight: "normal",
+    style: "body2"
+  }, t("neetoMolecules.emailPreview.from"), ":"), /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-800 min-w-0 flex-grow break-words",
+    "data-cy": "email-send-from-preview",
+    lineHeight: "normal",
+    style: "body2"
+  }, from)), /*#__PURE__*/React.createElement("div", {
+    className: "flex items-center gap-2 pt-3"
+  }, /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-500",
+    lineHeight: "normal",
+    style: "body2"
+  }, t("neetoMolecules.emailPreview.subject"), ":"), /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-800 min-w-0 flex-grow break-words",
+    "data-cy": "email-subject-preview",
+    lineHeight: "normal",
+    style: "body2"
+  }, subject || /*#__PURE__*/React.createElement("span", {
+    className: "neeto-ui-bg-gray-300 neeto-ui-rounded-full h-2 w-40"
+  })))), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-text-gray-800 flex flex-1 flex-col justify-between space-y-6 p-6 pr-10 text-base leading-relaxed",
+    "data-cy": "email-body-preview-container"
+  }, body ? /*#__PURE__*/React.createElement(MemoizedEditorContent, {
+    content: body
+  }) : /*#__PURE__*/React.createElement("div", {
+    className: "space-y-4"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-bg-gray-300 neeto-ui-rounded-full h-2 w-80"
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-bg-gray-300 neeto-ui-rounded-full h-2 w-72"
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-bg-gray-300 neeto-ui-rounded-full h-2 w-80"
+  })), actionButtonText && /*#__PURE__*/React.createElement("div", {
+    className: "mt-6 flex w-full items-center justify-center"
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: "pointer-events-none",
+    label: actionButtonText
+  })), logo && /*#__PURE__*/React.createElement("img", {
+    alt: t("neetoMolecules.emailPreview.logoAltText"),
+    className: "h-20 w-36 object-cover",
+    "data-cy": "company-logo-preview",
+    src: logo
+  })), productName && /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-bg-gray-100 mt-auto p-2",
+    "data-testid": "product-name-block"
+  }, /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-600 text-center leading-6",
+    style: "body3"
+  }, t("neetoMolecules.emailPreview.poweredBy"), /*#__PURE__*/React.createElement("span", {
+    className: "neeto-ui-text-gray-800 font-medium"
+  }, productName))));
+});
+EmailPreview.propTypes = {
+  /**
+   * The value of the send-to field.
+   */
+  to: PropTypes.arrayOf(PropTypes.string),
+  /**
+   * The value of the send-from field.
+   */
+  from: PropTypes.string,
+  /**
+   * The subject of the email.
+   */
+  subject: PropTypes.string,
+  /**
+   * The body of the email.
+   */
+  body: PropTypes.string,
+  /**
+   * The name of the neeto product to be previewed.
+   */
+  productName: PropTypes.string,
+  /**
+   * The text to be shown in the action button.
+   */
+  actionButtonText: PropTypes.string,
+  /**
+   * Source link for the company logo.
+   */
+  logo: PropTypes.string
+};
+export default EmailPreview;

package/dist/EmailForm/ReplyToField.js

@@ -0,0 +1,55 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React from "react";
+import { useFormikContext } from "formik";
+import { isNotEmpty } from "@bigbinary/neeto-commons-frontend/pure";
+import { Info } from "@bigbinary/neeto-icons";
+import { Select, Input } from "@bigbinary/neetoui/formik";
+import { useTranslation } from "react-i18next";
+var ReplyToField = function ReplyToField(_ref) {
+  var _helpIconProps2;
+  var replyToOptions = _ref.replyToOptions;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var isDropdownField = isNotEmpty(replyToOptions);
+  var _useFormikContext = useFormikContext(),
+    setFieldValue = _useFormikContext.setFieldValue;
+  if (isDropdownField) {
+    var _helpIconProps;
+    return /*#__PURE__*/React.createElement(Select, {
+      className: "w-full",
+      "data-testid": "replyToOptions",
+      label: t("neetoMolecules.emailForm.labels.replyTo"),
+      name: "replyTo",
+      options: replyToOptions,
+      labelProps: {
+        helpIconProps: (_helpIconProps = {
+          icon: Info
+        }, _defineProperty(_helpIconProps, "data-testid", "reply-to-tooltip"), _defineProperty(_helpIconProps, "tooltipProps", {
+          content: t("neetoMolecules.emailForm.tooltips.replyTo")
+        }), _helpIconProps)
+      },
+      onChange: function onChange(_ref2) {
+        var value = _ref2.value;
+        return setFieldValue("replyTo", value);
+      }
+    });
+  }
+  return /*#__PURE__*/React.createElement(Input, {
+    autoFocus: true,
+    required: true,
+    className: "w-full",
+    "data-testid": "replyToInput",
+    label: t("neetoMolecules.emailForm.labels.replyTo"),
+    name: "replyTo",
+    placeholder: t("neetoMolecules.emailForm.placeholders.emailPlaceholder"),
+    size: "large",
+    labelProps: {
+      helpIconProps: (_helpIconProps2 = {
+        icon: Info
+      }, _defineProperty(_helpIconProps2, "data-testid", "reply-to-tooltip"), _defineProperty(_helpIconProps2, "tooltipProps", {
+        content: t("neetoMolecules.emailForm.tooltips.replyTo")
+      }), _helpIconProps2)
+    }
+  });
+};
+export default ReplyToField;

package/dist/EmailForm/SendToField.js

@@ -0,0 +1,27 @@
+import React from "react";
+import { withT } from "@bigbinary/neeto-commons-frontend/react-utils";
+import SendToFields from "../SendToFields";
+var SendToField = withT(function (_ref) {
+  var t = _ref.t;
+  return /*#__PURE__*/React.createElement(SendToFields, {
+    showCcBccButton: true,
+    showUploadCsvButton: true,
+    bccInputProps: {
+      label: t("neetoMolecules.emailForm.labels.bCc"),
+      name: "sendToBcc",
+      placeholder: t("neetoMolecules.emailForm.placeholders.commaSeparatedEmails")
+    },
+    ccInputProps: {
+      label: t("neetoMolecules.emailForm.labels.cc"),
+      name: "sendToCc",
+      placeholder: t("neetoMolecules.emailForm.placeholders.commaSeparatedEmails")
+    },
+    emailInputProps: {
+      id: "sendTo",
+      name: "sendTo",
+      label: t("neetoMolecules.emailForm.labels.sendTo"),
+      placeholder: t("neetoMolecules.emailForm.placeholders.commaSeparatedEmails")
+    }
+  });
+});
+export default SendToField;

package/dist/EmailForm/SubjectField.js

@@ -0,0 +1,64 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useState } from "react";
+import { withEventTargetValue } from "@bigbinary/neeto-commons-frontend/utils";
+import { Input, Typography } from "@bigbinary/neetoui";
+import { Trans, useTranslation } from "react-i18next";
+import DynamicVariables from "../DynamicVariables";
+var SubjectField = function SubjectField(_ref) {
+  var name = _ref.name,
+    text = _ref.text,
+    updateText = _ref.updateText,
+    _ref$subjectVariables = _ref.subjectVariables,
+    subjectVariables = _ref$subjectVariables === void 0 ? [] : _ref$subjectVariables,
+    error = _ref.error,
+    _ref$required = _ref.required,
+    required = _ref$required === void 0 ? false : _ref$required;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isFieldFocusedOnce = _useState2[0],
+    setIsFieldFocusedOnce = _useState2[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var tagClickHandler = function tagClickHandler(_ref2) {
+    var slug = _ref2.key;
+    var textAreaElement = document.querySelector("textarea[name=".concat(name, "]"));
+    var splitIndex = isFieldFocusedOnce && textAreaElement ? textAreaElement.selectionEnd : text.length;
+    var updatedSubject = [text.slice(0, splitIndex), " {{".concat(slug, "}}"), text.slice(splitIndex)].join("");
+    updateText(updatedSubject);
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Input, {
+    error: error,
+    name: name,
+    required: required,
+    label: t("neetoMolecules.emailForm.labels.subject"),
+    size: "large",
+    value: text,
+    suffix: /*#__PURE__*/React.createElement(DynamicVariables, {
+      variables: subjectVariables,
+      dropdownProps: {
+        className: "neeto-ui-dropdown__popup overflow-y-auto",
+        buttonSize: "small"
+      },
+      onVariableClick: tagClickHandler
+    }),
+    onChange: withEventTargetValue(updateText),
+    onFocus: function onFocus() {
+      return setIsFieldFocusedOnce(true);
+    }
+  }), /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-600 mt-2",
+    "data-cy": "subject-input-variable-label",
+    style: "body3"
+  }, /*#__PURE__*/React.createElement(Trans, {
+    components: {
+      span: /*#__PURE__*/React.createElement("span", {
+        className: "font-semibold"
+      })
+    },
+    i18nKey: "neetoMolecules.emailForm.helpText",
+    values: {
+      type: "subject"
+    }
+  })));
+};
+export default SubjectField;

package/dist/EmailForm/constants.js

@@ -0,0 +1,33 @@
+import { t } from "i18next";
+import { isEditorEmpty } from "@bigbinary/neeto-editor";
+import { prop } from "ramda";
+import * as yup from "yup";
+export var INITIAL_FORM_VALUES = {
+  sendTo: [],
+  sendToCc: [],
+  sendToBcc: [],
+  replyTo: "",
+  showCopyEmails: false,
+  subject: "",
+  message: ""
+};
+export var EMAIL_FORM_VALIDATION_SCHEMA = yup.object({
+  subject: yup.string().required(t("neetoMolecules.emailForm.errors.subjectRequired")),
+  message: yup.string().test("message", t("neetoMolecules.emailForm.errors.messageRequired"), function (value) {
+    return !isEditorEmpty(value);
+  })
+});
+export var SEND_TO_FIELD_VALIDATION = yup.object({
+  sendTo: yup.array().min(1, t("neetoMolecules.emailForm.errors.required", {
+    entity: t("neetoMolecules.emailForm.fields.sendToEmailAddress")
+  })).test("all-emails-valid", t("neetoMolecules.emailForm.errors.invalidEmailAddress"), function (emails) {
+    return emails === null || emails === void 0 ? void 0 : emails.every(prop("valid"));
+  }).nullable()
+});
+export var REPLY_TO_FIELD_VALIDATION = yup.object({
+  replyTo: yup.string().nullable().email(t("neetoMolecules.emailForm.errors.invalidEmailAddress")).required(t("neetoMolecules.emailForm.errors.required", {
+    entity: t("neetoMolecules.emailForm.fields.replyToEmailAddress")
+  }))
+});
+export var EDITOR_ADDONS = ["highlight", "emoji", "code-block", "block-quote", "image-upload", "divider", "video-embed"];
+export var ALLOWED_FILE_PICKER_TYPES = [".csv"];

package/dist/EmailForm/contexts/EmailForm.js

@@ -0,0 +1,7 @@
+/* eslint-disable @bigbinary/neeto/use-zustand-for-global-state-management */
+import React from "react";
+var EmailFormContext = /*#__PURE__*/React.createContext({
+  showSendToField: false,
+  showReplyToField: false
+});
+export { EmailFormContext };

package/dist/EmailForm/index.js

@@ -0,0 +1,4 @@
+import EmailForm from "./EmailForm";
+import EmailFormProvider from "./EmailFormProvider";
+import EmailPreview from "./EmailPreview";
+export { EmailFormProvider, EmailForm, EmailPreview };

package/dist/EmailForm/utils.js

@@ -0,0 +1,10 @@
+import { EMAIL_FORM_VALIDATION_SCHEMA, REPLY_TO_FIELD_VALIDATION, SEND_TO_FIELD_VALIDATION } from "./constants";
+export var getValidationSchema = function getValidationSchema(_ref) {
+  var showSendToField = _ref.showSendToField,
+    showReplyToField = _ref.showReplyToField,
+    customValidations = _ref.customValidations;
+  var schema = EMAIL_FORM_VALIDATION_SCHEMA.clone();
+  if (showSendToField) schema = schema.concat(SEND_TO_FIELD_VALIDATION);
+  if (showReplyToField) schema = schema.concat(REPLY_TO_FIELD_VALIDATION);
+  return schema.shape(customValidations);
+};

package/dist/EmailPreview/index.js

@@ -0,0 +1,2 @@
+import EmailPreview from "../EmailForm/EmailPreview";
+export default EmailPreview;

package/dist/{ErrorPage.js → ErrorPage/constants.js}

@@ -1,202 +1,63 @@
-import * as React from 'react';
-import React__default, { useEffect } from 'react';
-import { useErrorDisplayStore } from '@bigbinary/neeto-commons-frontend/react-utils';
-import { Typography, Button } from '@bigbinary/neetoui';
-import { pick } from 'ramda';
-import { Helmet } from 'react-helmet';
-import { useTranslation, Trans } from 'react-i18next';
-
-function _extends$3() {
-  _extends$3 = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends$3.apply(this, arguments);
-}
-
-function shallow(objA, objB) {
-  if (Object.is(objA, objB)) {
-    return true;
-  }
-  if (typeof objA !== "object" || objA === null || typeof objB !== "object" || objB === null) {
-    return false;
-  }
-  if (objA instanceof Map && objB instanceof Map) {
-    if (objA.size !== objB.size)
-      return false;
-    for (const [key, value] of objA) {
-      if (!Object.is(value, objB.get(key))) {
-        return false;
-      }
-    }
-    return true;
-  }
-  if (objA instanceof Set && objB instanceof Set) {
-    if (objA.size !== objB.size)
-      return false;
-    for (const value of objA) {
-      if (!objB.has(value)) {
-        return false;
-      }
-    }
-    return true;
-  }
-  const keysA = Object.keys(objA);
-  if (keysA.length !== Object.keys(objB).length) {
-    return false;
-  }
-  for (let i = 0; i < keysA.length; i++) {
-    if (!Object.prototype.hasOwnProperty.call(objB, keysA[i]) || !Object.is(objA[keysA[i]], objB[keysA[i]])) {
-      return false;
-    }
-  }
-  return true;
-}
-
-var _path$2, _path2$2;
-function _extends$2() { _extends$2 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
-var SvgInternalServerError = function SvgInternalServerError(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$2({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 120,
-    height: 120,
-    fill: "none"
-  }, props), _path$2 || (_path$2 = /*#__PURE__*/React.createElement("path", {
+import React from "react";
+var InternalServerErrorImage = function InternalServerErrorImage(props) {
+  return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
     fill: "#1D1D1F",
     d: "M120 60c0-33.137-26.863-60-60-60H0v120h120V60Z"
-  })), _path2$2 || (_path2$2 = /*#__PURE__*/React.createElement("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fill: "#fff",
     d: "M30.602 107.562c2.343 0 4.421-.484 6.234-1.453 1.812-.984 3.234-2.343 4.266-4.078 1.03-1.734 1.546-3.726 1.546-5.976v-.047c0-2.172-.484-4.094-1.453-5.766a10.432 10.432 0 0 0-3.96-3.984c-1.672-.969-3.594-1.453-5.766-1.453-1.094 0-2.125.132-3.094.398a9.096 9.096 0 0 0-2.625 1.172 7.204 7.204 0 0 0-1.969 1.922h-.093l1.148-11.367h15.89v-3.75H21.368l-1.734 19.289h3.726c.22-.39.461-.75.727-1.078.281-.329.57-.633.867-.914a7.185 7.185 0 0 1 2.578-1.524c.985-.344 2.047-.516 3.188-.516 1.5 0 2.828.329 3.984.985a7.101 7.101 0 0 1 2.719 2.719c.672 1.14 1.008 2.453 1.008 3.937v.047c0 1.516-.328 2.86-.985 4.031a7.056 7.056 0 0 1-2.742 2.719c-1.172.656-2.523.984-4.055.984-1.343 0-2.554-.257-3.632-.773-1.078-.516-1.953-1.219-2.625-2.109a6.34 6.34 0 0 1-1.22-3.024l-.023-.187H19l.023.257c.172 1.829.766 3.461 1.782 4.899 1.015 1.437 2.36 2.57 4.03 3.398 1.688.828 3.61 1.242 5.767 1.242ZM58.844 107.562c2.593 0 4.82-.71 6.68-2.132 1.859-1.422 3.28-3.438 4.265-6.047 1-2.61 1.5-5.703 1.5-9.281v-.047c0-3.578-.5-6.672-1.5-9.282-.984-2.609-2.406-4.617-4.266-6.023-1.859-1.422-4.085-2.133-6.68-2.133-2.593 0-4.82.711-6.679 2.133-1.844 1.406-3.258 3.414-4.242 6.023-.984 2.61-1.477 5.704-1.477 9.282v.047c0 3.578.492 6.671 1.477 9.28.984 2.61 2.398 4.626 4.242 6.048 1.86 1.422 4.086 2.132 6.68 2.132Zm0-3.679c-1.719 0-3.188-.555-4.407-1.664-1.218-1.125-2.148-2.719-2.789-4.781-.64-2.063-.96-4.508-.96-7.336v-.047c0-2.828.32-5.266.96-7.313.641-2.062 1.57-3.648 2.79-4.758 1.218-1.109 2.687-1.664 4.406-1.664 1.718 0 3.187.555 4.406 1.664 1.234 1.11 2.172 2.696 2.813 4.758.656 2.047.984 4.485.984 7.313v.047c0 2.828-.328 5.273-.984 7.335-.641 2.063-1.579 3.657-2.813 4.782-1.219 1.109-2.688 1.664-4.406 1.664ZM87.953 107.562c2.594 0 4.82-.71 6.68-2.132 1.86-1.422 3.281-3.438 4.265-6.047 1-2.61 1.5-5.703 1.5-9.281v-.047c0-3.578-.5-6.672-1.5-9.282-.984-2.609-2.406-4.617-4.265-6.023-1.86-1.422-4.086-2.133-6.68-2.133-2.594 0-4.82.711-6.68 2.133-1.843 1.406-3.257 3.414-4.242 6.023-.984 2.61-1.476 5.704-1.476 9.282v.047c0 3.578.492 6.671 1.476 9.28.985 2.61 2.399 4.626 4.242 6.048 1.86 1.422 4.086 2.132 6.68 2.132Zm0-3.679c-1.719 0-3.187-.555-4.406-1.664-1.219-1.125-2.149-2.719-2.79-4.781-.64-2.063-.96-4.508-.96-7.336v-.047c0-2.828.32-5.266.96-7.313.641-2.062 1.571-3.648 2.79-4.758 1.219-1.109 2.687-1.664 4.406-1.664 1.719 0 3.188.555 4.406 1.664 1.235 1.11 2.172 2.696 2.813 4.758.656 2.047.984 4.485.984 7.313v.047c0 2.828-.328 5.273-.984 7.335-.64 2.063-1.578 3.657-2.813 4.782-1.218 1.109-2.687 1.664-4.406 1.664Z"
-  })));
+  }));
 };
-
-var _path$1, _path2$1;
-function _extends$1() { _extends$1 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
-var SvgPageNotFound = function SvgPageNotFound(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$1({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 121,
-    height: 120,
-    fill: "none"
-  }, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
+InternalServerErrorImage.defaultProps = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "120",
+  height: "120",
+  fill: "none"
+};
+var PageNotFoundImage = function PageNotFoundImage(props) {
+  return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
     fill: "#1D1D1F",
     d: "M120.5 60c0-33.137-26.863-60-60-60H.5v120h120V60Z"
-  })), _path2$1 || (_path2$1 = /*#__PURE__*/React.createElement("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fill: "#fff",
     d: "M35.501 106.909h3.164v-7.838h5.154v-2.876h-5.154V72.32h-4.77a2440.935 2440.935 0 0 1-3.188 4.77 823.85 823.85 0 0 0-3.188 4.746 2487.114 2487.114 0 0 1-3.188 4.77l-3.212 4.747c-1.055 1.582-2.11 3.172-3.164 4.77v2.948h17.546v7.838ZM21.24 96.195v-.072a945.042 945.042 0 0 1 2.828-4.195l2.829-4.17 2.828-4.172c.943-1.39 1.886-2.772 2.829-4.147.943-1.39 1.886-2.788 2.828-4.194h.12v20.95H21.24ZM59.879 107.461c2.605 0 4.842-.719 6.712-2.158 1.87-1.454 3.3-3.507 4.29-6.16 1.007-2.669 1.51-5.833 1.51-9.492v-.072c0-3.644-.503-6.8-1.51-9.468-.99-2.669-2.42-4.723-4.29-6.16-1.87-1.455-4.107-2.182-6.712-2.182-2.605 0-4.842.727-6.712 2.181-1.853 1.438-3.284 3.492-4.29 6.16-.991 2.653-1.487 5.81-1.487 9.469v.072c0 3.643.496 6.8 1.487 9.468 1.006 2.653 2.437 4.706 4.29 6.16 1.87 1.455 4.107 2.182 6.712 2.182Zm0-2.877c-1.934 0-3.588-.607-4.962-1.822-1.374-1.214-2.429-2.94-3.164-5.177-.72-2.237-1.079-4.882-1.079-7.934v-.072c0-3.052.36-5.697 1.079-7.934.735-2.237 1.79-3.963 3.164-5.178 1.374-1.214 3.028-1.822 4.962-1.822 1.934 0 3.587.608 4.962 1.822 1.39 1.215 2.453 2.94 3.188 5.178.735 2.221 1.102 4.866 1.102 7.934v.072c0 3.052-.367 5.697-1.102 7.934-.735 2.237-1.798 3.963-3.188 5.177-1.375 1.215-3.028 1.822-4.962 1.822ZM93.893 106.909h3.164v-7.838h5.153v-2.876h-5.153V72.32h-4.77a2487.163 2487.163 0 0 1-3.189 4.77 829.054 829.054 0 0 0-3.188 4.746 2534.647 2534.647 0 0 1-3.188 4.77c-1.07 1.583-2.14 3.165-3.212 4.747-1.054 1.582-2.109 3.172-3.164 4.77v2.948h17.547v7.838ZM79.63 96.195v-.072a953.801 953.801 0 0 1 2.829-4.195l2.828-4.17 2.829-4.172c.943-1.39 1.885-2.772 2.828-4.147.943-1.39 1.886-2.788 2.829-4.194h.12v20.95H79.63Z"
-  })));
+  }));
+};
+PageNotFoundImage.defaultProps = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "121",
+  height: "120",
+  fill: "none"
 };
-
-var _path, _path2;
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-var SvgUnauthorized = function SvgUnauthorized(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 120,
-    height: 120,
-    fill: "none"
-  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+var UnauthorizedImage = function UnauthorizedImage(props) {
+  return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
     fill: "#1D1D1F",
     d: "M120 60c0-33.137-26.863-60-60-60H0v120h120V60Z"
-  })), _path2 || (_path2 = /*#__PURE__*/React.createElement("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fill: "#fff",
     d: "M32.913 105.236h4.205v-7.143h4.873v-3.846h-4.873V70.764h-6.283a569.118 569.118 0 0 0-2.962 4.515 396.499 396.499 0 0 0-3.01 4.659 611.785 611.785 0 0 0-3.01 4.73l-2.963 4.777a3496.03 3496.03 0 0 1-2.89 4.73v3.918h16.913v7.143ZM20.348 94.271v-.24c.78-1.29 1.576-2.587 2.389-3.893l2.484-3.966a843.046 843.046 0 0 1 2.532-3.941l2.485-3.846c.828-1.274 1.64-2.508 2.436-3.703h.263v19.589h-12.59ZM59.716 106c2.58 0 4.786-.733 6.617-2.198 1.832-1.465 3.241-3.543 4.228-6.235.988-2.691 1.481-5.876 1.481-9.555v-.048c0-3.679-.493-6.856-1.48-9.531-.988-2.692-2.397-4.77-4.229-6.235C64.502 70.733 62.296 70 59.716 70c-2.564 0-4.762.733-6.593 2.198-1.816 1.465-3.217 3.543-4.205 6.235-.971 2.675-1.457 5.852-1.457 9.531v.048c0 3.679.486 6.864 1.457 9.555.988 2.692 2.39 4.77 4.205 6.235 1.831 1.465 4.029 2.198 6.593 2.198Zm0-3.75c-1.656 0-3.082-.582-4.276-1.744-1.179-1.163-2.086-2.803-2.723-4.921-.621-2.134-.932-4.659-.932-7.573v-.048c0-2.914.31-5.43.932-7.549.637-2.118 1.544-3.75 2.723-4.897 1.194-1.162 2.62-1.744 4.276-1.744 1.688 0 3.121.582 4.3 1.744 1.194 1.147 2.11 2.78 2.747 4.897.637 2.118.956 4.635.956 7.55v.047c0 2.914-.319 5.439-.956 7.573-.637 2.118-1.553 3.758-2.747 4.921-1.179 1.162-2.612 1.744-4.3 1.744ZM90.341 105.809c2.31 0 4.364-.43 6.163-1.29 1.8-.876 3.217-2.07 4.252-3.583 1.036-1.513 1.553-3.225 1.553-5.136v-.048c0-2.453-.78-4.42-2.34-5.9-1.546-1.498-3.576-2.35-6.092-2.557V87.2c1.433-.303 2.699-.82 3.798-1.553 1.099-.733 1.959-1.648 2.58-2.747.621-1.1.931-2.357.931-3.775v-.047c0-1.752-.453-3.289-1.361-4.61-.892-1.339-2.158-2.382-3.799-3.13-1.624-.765-3.535-1.147-5.733-1.147-2.15 0-4.053.39-5.71 1.17-1.64.781-2.961 1.872-3.965 3.273-.987 1.402-1.576 3.042-1.767 4.921l-.024.24h4.133l.023-.24c.128-1.162.51-2.166 1.147-3.01.637-.844 1.481-1.489 2.532-1.934 1.067-.462 2.278-.693 3.631-.693 1.402 0 2.588.223 3.56.669.987.445 1.736 1.09 2.245 1.935.51.844.765 1.87.765 3.081v.048c0 1.147-.295 2.174-.884 3.082-.59.891-1.41 1.6-2.46 2.126-1.052.51-2.262.764-3.632.764h-4.133v3.631h4.324c2.421 0 4.332.573 5.734 1.72 1.417 1.13 2.126 2.755 2.126 4.873v.048c0 1.21-.319 2.285-.956 3.225-.637.924-1.529 1.648-2.675 2.174-1.131.526-2.453.788-3.966.788-1.529 0-2.874-.239-4.037-.716-1.163-.494-2.094-1.171-2.795-2.03a5.723 5.723 0 0 1-1.218-2.987l-.024-.239h-4.133l.024.287c.16 1.815.748 3.432 1.768 4.849 1.035 1.418 2.436 2.532 4.204 3.345 1.768.812 3.838 1.218 6.211 1.218Z"
-  })));
+  }));
+};
+UnauthorizedImage.defaultProps = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "120",
+  height: "120",
+  fill: "none"
 };
-
-var ERRORS = {
+export var ERRORS = {
   404: {
-    Image: SvgPageNotFound,
+    Image: PageNotFoundImage,
     errorKey: "neetoMolecules.errorPage.cantBeFound",
     titleKey: "neetoMolecules.errorPage.title.cantBeFound"
   },
   403: {
-    Image: SvgUnauthorized,
+    Image: UnauthorizedImage,
     errorKey: "neetoMolecules.errorPage.unauthorized",
     titleKey: "neetoMolecules.errorPage.title.unauthorized"
   },
   500: {
-    Image: SvgInternalServerError,
+    Image: InternalServerErrorImage,
     errorKey: "neetoMolecules.errorPage.internalServerError",
     titleKey: "neetoMolecules.errorPage.title.internalServerError"
   }
-};
-
-var ErrorPage = function ErrorPage(_ref) {
-  var _ref$homeUrl = _ref.homeUrl,
-    homeUrl = _ref$homeUrl === void 0 ? "/" : _ref$homeUrl,
-    status = _ref.status,
-    backToHomeButtonProps = _ref.backToHomeButtonProps,
-    children = _ref.children;
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var _useErrorDisplayStore = useErrorDisplayStore(pick(["statusCode", "showErrorPage"]), shallow),
-    storeStatusCode = _useErrorDisplayStore.statusCode,
-    showErrorPage = _useErrorDisplayStore.showErrorPage;
-  status = status || storeStatusCode;
-  var _ref2 = ERRORS[status] || ERRORS[404],
-    Image = _ref2.Image,
-    errorKey = _ref2.errorKey,
-    titleKey = _ref2.titleKey;
-  useEffect(function () {
-    var onBackButtonPress = function onBackButtonPress() {
-      if (showErrorPage) {
-        useErrorDisplayStore.setState({
-          showErrorPage: false
-        });
-      }
-    };
-    window.addEventListener("popstate", onBackButtonPress);
-    return function () {
-      window.removeEventListener("popstate", onBackButtonPress);
-    };
-  }, []);
-  var openChatWidget = function openChatWidget() {
-    var _window$NeetoChat, _window$NeetoChat$con, _window$NeetoChat2, _window$NeetoChat2$co;
-    (_window$NeetoChat = window.NeetoChat) === null || _window$NeetoChat === void 0 ? void 0 : (_window$NeetoChat$con = _window$NeetoChat.contextualHelp) === null || _window$NeetoChat$con === void 0 ? void 0 : _window$NeetoChat$con.maximizeWidget();
-    (_window$NeetoChat2 = window.NeetoChat) === null || _window$NeetoChat2 === void 0 ? void 0 : (_window$NeetoChat2$co = _window$NeetoChat2.contextualHelp) === null || _window$NeetoChat2$co === void 0 ? void 0 : _window$NeetoChat2$co.openWidget();
-  };
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: "flex min-h-screen w-full flex-col items-center justify-center",
-    "data-cy": "error-page-container"
-  }, /*#__PURE__*/React__default.createElement(Helmet, null, /*#__PURE__*/React__default.createElement("title", null, t(titleKey))), /*#__PURE__*/React__default.createElement(Image, {
-    className: "mb-8",
-    "data-cy": "error-image"
-  }), /*#__PURE__*/React__default.createElement(Typography, {
-    className: "mb-6 text-center",
-    "data-cy": "title",
-    style: "h2",
-    weight: "semibold"
-  }, /*#__PURE__*/React__default.createElement(Trans, {
-    i18nKey: errorKey
-  })), /*#__PURE__*/React__default.createElement("div", {
-    className: "mb-5 flex flex-col items-center space-y-3"
-  }, /*#__PURE__*/React__default.createElement(Button, _extends$3({
-    href: homeUrl,
-    label: t("neetoMolecules.errorPage.backToHome"),
-    size: "large",
-    style: "primary"
-  }, backToHomeButtonProps)), children), /*#__PURE__*/React__default.createElement(Typography, {
-    className: "text-center",
-    "data-cy": "title",
-    style: "body2"
-  }, /*#__PURE__*/React__default.createElement(Trans, {
-    i18nKey: "neetoMolecules.errorPage.contactUs",
-    components: {
-      button: /*#__PURE__*/React__default.createElement(Button, {
-        style: "link",
-        onClick: openChatWidget
-      })
-    }
-  })));
-};
-
-export { ErrorPage as default };
-//# sourceMappingURL=ErrorPage.js.map
+};