@stokr/components-library 3.0.77 → 3.1.0-alpha.1

package/dist/components/MainMenu/MainMenu.styles.js

@@ -1,362 +0,0 @@
-import styled, { css } from "styled-components";
-import rwd from "../../styles/rwd.js";
-const StyledMainMenu = styled.div.withConfig({
-  shouldForwardProp: (props) => !["admin"].includes(props)
-})`
-  display: none;
-  z-index: 10;
-  background: white;
-
-  ${rwd.Medium`
-    display: block;
-    width: 100%;
-    position: absolute;
-    top: 100%;
-    left: 0;
-    overflow: hidden;
-    margin-top: -1px;
-    border-bottom: 1px solid #e1e1e1;
-    // box-shadow: inset 0 -1px 0 0 #e1e1e1;
-
-    ${(props) => props.admin && `
-      padding-left: 100px;
-    `}
-  `}
-
-  @media screen and (max-width: 991px) {
-    display: none;
-  }
-`;
-const MainMenuContainer = styled.div`
-  display: block;
-  background-color: ${(props) => props.theme.cWhite};
-  border-top: 1px solid #e1e1e1;
-  /* box-shadow: inset 0 -1px 0 0 #e1e1e1; */
-`;
-const MainMenuOptions = styled.div`
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-
-  ${rwd.Medium`
-    flex-direction: row;
-    height: 92px;
-  `}
-`;
-const MainMenuOption = styled.div.withConfig({
-  shouldForwardProp: (props) => !["isSettings", "isDashboard", "isOpened", "isVenture", "nameOption", "noBorder", "button", ""].includes(props)
-})`
-  background-color: white !important;
-  position: relative;
-  display: flex;
-  flex-basis: 33.3333%;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  padding: 4px 16px;
-  outline: none;
-
-  &:hover {
-    font-weight: bold;
-  }
-
-  ${({ isSettings }) => isSettings && css`
-      border-right: none !important;
-    `}
-
-  & {
-    border-top: 1px solid #e1e1e1;
-  }
-
-  ${rwd.Medium`
-    padding: 10px;
-    border-bottom: 1px solid #e1e1e1;
-    margin-bottom: -1px;
-    transition: border-bottom-color .2s;
-
-    & {
-      border-top: 0;
-      border-left: 1px solid #e1e1e1;
-
-       ${({ isDashboard }) => isDashboard && css`
-           border-right: 0;
-         `}
-    }
-
-    ${(props) => props.isOpened && `
-      border-bottom-color: transparent;
-    `};
-
-    ${({ isVenture }) => isVenture && css`
-        flex-basis: 66.6%;
-      `}
-
-      ${(props) => props.nameOption && `
-    display: flex;
-  `}
-
-  `}
-
-  ${(props) => props.nameOption && `
-    display: none;
-  `}
-
-  ${rwd.Large`
-
-     ${({ isVenture }) => isVenture && css`
-         flex-basis: 75.5%;
-       `}
-
-    ${(props) => props.nameOption && `
-      display: flex;
-    `};
-  `}
-
-     ${(props) => props.noBorder && `
-    border: none !important;
-  `}
-
-  ${(props) => props.button && `
-    cursor: pointer;
-    transition: color .2s;
-    outline: 0;
-    
-    & > span {
-      display: inline-block;
-      vertical-align: middle;
-      text-transform: uppercase;
-      font-size: 11px;
-      line-height: 20px;
-    }
-
-    &:hover {
-      color: ${props.theme.cPrimary};
-    }
-  `}
-
-  span {
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-  }
-
-  button {
-    color: #ee220d;
-    border-color: #ee220d;
-    background-color: white;
-
-    &:hover {
-      color: #be1b09;
-      border-color: #be1b09;
-    }
-  }
-`;
-styled.h3`
-  font-weight: 600;
-  font-size: 16px;
-  line-height: 24px;
-  text-transform: initial;
-  margin: 0;
-
-  &:hover {
-    color: initial;
-  }
-`;
-const ExpandArrow = styled.i.withConfig({
-  shouldForwardProp: (props) => !["isOpened"].includes(props)
-}).attrs({
-  className: "ion ion-ios-arrow-down"
-})`
-  position: absolute;
-  top: 50%;
-  right: 32px;
-  display: block;
-  margin-top: -8px;
-  transition: 0.3s transform;
-  transform: rotate(0);
-  text-align: center;
-  font-size: 16px;
-  line-height: 16px;
-  height: 16px;
-
-  ${(props) => props.isOpened && `
-    transform: rotate(180deg);
-  `}
-
-  ${rwd.Medium`
-    display: inline-block;
-    vertical-align: middle;
-    margin-left: 20px;
-    margin-top: 0;
-    position: relative;
-    top: 0;
-    right: auto;
-  `}
-`;
-const Settings = styled.div`
-  overflow: hidden;
-`;
-const SettingsOptions = styled.div`
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-
-  ${rwd.Medium`
-    flex-wrap: wrap;
-    padding: 27px 64px;
-    flex-direction: row;
-    height: auto;
-  `}
-
-  button {
-    border: none;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-    padding: 0;
-  }
-`;
-const SettingsOption = styled.button.withConfig({
-  shouldForwardProp: (props) => !["back", "isActive", "scrollDown"].includes(props)
-})`
-  position: relative;
-  flex-grow: 1;
-  cursor: pointer;
-  transition: font-weight 0.2s;
-  color: ${(props) => props.theme.cWhite};
-  background-color: ${(props) => props.theme.cWarning};
-  border-top: 1px solid ${(props) => props.theme.cWarningDark};
-  outline: 0;
-
-  ${(props) => props.back && `
-    color: ${props.theme.cBlack};
-    background-color: transparent;
-    border-top: 0;
-    
-    ${props.isActive && `
-      color: ${props.theme.cBlack};
-      background-color: transparent;
-    `}
-
-    ${rwd.Medium`
-      background-color: transparent;
-      
-      ${props.isActive && `
-        background-color: transparent;
-      `}
-    `}
-  `};
-
-  ${rwd.Medium`
-    flex-grow: 0;
-    text-align: left;
-    flex-basis: 33.3333%;
-    color: ${(props) => props.theme.cBlack};
-    background-color: transparent;
-    border-top: 0;
-  `}
-
-  ${rwd.Large`
-    flex-basis: 25%;
-
-    ${(props) => props.scrollDown && `
-      flex-basis: 20%;
-    `}
-  `}
-
-  & > span {
-    position: relative;
-    display: inline-block;
-    font-size: 11px;
-    line-height: 20px;
-    text-transform: uppercase;
-    transition: font-weight 0.2s;
-
-    ${rwd.Medium`
-      padding: 7px 0;
-      margin: 3px 0;
-    `}
-  }
-
-  ${(props) => props.isActive && `
-    background-color: ${props.theme.cPrimary};
-
-    & > span {
-      font-weight: bold;
-    }
-  `}
-
-  ${rwd.Medium`
-    ${(props) => props.isActive && `   
-      background-color: transparent;
-
-      & > span {
-        &:before {
-          content: '';
-          display: block;
-          height: 4px;
-          width: 100%;
-          position: absolute;
-          bottom: 0;
-          left: 0;
-          background-color: ${props.theme.cPrimary};
-        }
-      }
-    `}
-  `}
-
-  &:hover {
-    & > span {
-      font-weight: bold;
-    }
-  }
-`;
-styled.div.withConfig({
-  shouldForwardProp: (props) => !["isActive"].includes(props)
-})`
-  display: block;
-  visibility: hidden;
-  opacity: 0;
-  z-index: 5;
-  position: absolute;
-  top: 64px;
-  left: 0;
-  width: 100%;
-  height: calc(100% - 64px);
-  background-color: ${(props) => props.theme.cWhite};
-  border-top: 1px solid #e1e1e1;
-  transition:
-    opacity 0.2s,
-    visibility 0.2s;
-
-  ${(props) => props.isActive && `
-    visibility: visible;
-    opacity: 1;
-  `}
-`;
-styled.div`
-  position: relative;
-  top: -1px;
-  right: -5px;
-  width: 16px;
-  height: 16px;
-  color: #ffffff;
-  font-size: 11px;
-  font-weight: 700;
-  line-height: 16px;
-  text-align: center;
-  background-color: #ee220d;
-  border-radius: 50%;
-
-  @media screen and (max-width: 991px) {
-    display: none;
-  }
-`;
-export {
-  ExpandArrow,
-  MainMenuContainer,
-  MainMenuOption,
-  MainMenuOptions,
-  Settings,
-  SettingsOption,
-  SettingsOptions,
-  StyledMainMenu
-};

package/dist/components/Modal/NewVentureModal/NewVentureModal.js

@@ -1,273 +0,0 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { useContext } from "react";
-import { useNavigate } from "react-router-dom";
-import PropTypes from "prop-types";
-import { Formik } from "formik";
-import * as Yup from "yup";
-import { AuthContext } from "../../../context/AuthContext.js";
-import { emailRegex, ProjectTypes } from "../../../constants/globalVariables.js";
-import { Modal } from "../Modal.js";
-import { Row, Column } from "../../Grid/Grid.styles.js";
-import { Text } from "../../Text/Text.styles.js";
-import stdin_default$1 from "../../Form/Form.js";
-import { ComponentWrapper } from "../../ComponentWrapper/ComponentWrapper.styles.js";
-import { Input } from "../../Input/Input.js";
-import stdin_default$2 from "../../Checkbox/Checkbox.js";
-import stdin_default from "../../Button/Button.styles.js";
-import { useNewVentureForm } from "../../../hooks/useNewVentureForm.js";
-import { getConfig } from "../../../runtime-config.js";
-import { ModalInner } from "../Modal.styles.js";
-import { navigateToHref } from "../../../routing/navigate-app.js";
-import { FormField, FormError } from "../../Form/Form.styles.js";
-const defaultProject = {
-  _id: "",
-  name: "",
-  type: "fund",
-  title: "",
-  description: ""
-};
-const NewVentureModal = (props) => {
-  const navigate = useNavigate();
-  const { user } = useContext(AuthContext);
-  const isLoggedIn = !!user?._id;
-  const {
-    title = "Register Your Interest",
-    description = "Register your interest and learn more about this investment opportunity.",
-    isModalOpen,
-    onModalClose,
-    onFormSend,
-    popupError = null,
-    project = defaultProject,
-    salesChannel = "investor",
-    modalBotContent,
-    onSuccessMessageBtnClick,
-    customSuccessMessage
-  } = props;
-  const {
-    email,
-    name,
-    mailingList,
-    privateInvestorList,
-    mailingListText,
-    privateInvestorListText,
-    mailingListDisabled,
-    privateInvestorListDisabled,
-    optionalCheckBox,
-    optionalCheckBoxText,
-    optionalCheckBoxChecked,
-    checkedCheckboxes,
-    isSubmitting,
-    successMessage,
-    errorMessage,
-    handleSubmit,
-    updateCheckedCheckboxes
-  } = useNewVentureForm({
-    project: props.project,
-    user,
-    salesChannel,
-    customSuccessMessage
-  });
-  const validationSchema = isLoggedIn ? Yup.object().shape({
-    email: Yup.string().nullable(),
-    name: Yup.string().nullable()
-  }) : Yup.object().shape({
-    email: Yup.string().matches(emailRegex, "Oops, that's not a valid address").required("Oops, this can't be blank"),
-    name: Yup.string().required("Oops, this can't be blank")
-  });
-  return /* @__PURE__ */ jsx(
-    Modal,
-    {
-      isOpen: isModalOpen,
-      onClose: (e) => {
-        onModalClose(e);
-      },
-      children: /* @__PURE__ */ jsxs(Row, { children: [
-        /* @__PURE__ */ jsxs(Column, { part: 8, children: [
-          /* @__PURE__ */ jsx(ModalInner, { modalTop: true, children: /* @__PURE__ */ jsxs(Text, { children: [
-            /* @__PURE__ */ jsx("h3", { children: errorMessage ? "OOPS.." : successMessage ? "AWESOME!" : title }),
-            !(successMessage || errorMessage) && /* @__PURE__ */ jsx("p", { children: description })
-          ] }) }),
-          /* @__PURE__ */ jsx(ModalInner, { modalBot: true, children: modalBotContent })
-        ] }),
-        /* @__PURE__ */ jsx(Column, { part: 8, children: /* @__PURE__ */ jsx(ModalInner, { children: successMessage || errorMessage ? /* @__PURE__ */ jsxs(Text, { children: [
-          /* @__PURE__ */ jsx("br", {}),
-          /* @__PURE__ */ jsx("br", {}),
-          /* @__PURE__ */ jsx("p", { children: errorMessage ? errorMessage : successMessage }),
-          successMessage && /* @__PURE__ */ jsx(ComponentWrapper, { noPaddingHorizontal: true, children: /* @__PURE__ */ jsx(
-            stdin_default,
-            {
-              fluid: true,
-              id: "private-investor-success-button",
-              "data-cy": "new-venture-modal-success-continue",
-              onClick: () => {
-                if (onSuccessMessageBtnClick) {
-                  onSuccessMessageBtnClick();
-                } else {
-                  if (user?._id) {
-                    navigateToHref(navigate, `${getConfig("dashboardUrl")}/checklist`);
-                  } else {
-                    navigate(`/signup?email=${encodeURIComponent(email)}`);
-                  }
-                }
-              },
-              children: "Continue"
-            }
-          ) })
-        ] }) : /* @__PURE__ */ jsx(
-          Formik,
-          {
-            enableReinitialize: true,
-            initialValues: {
-              email: email || "",
-              name: name || "",
-              mailingList: mailingList || false,
-              privateInvestorList: privateInvestorList || false,
-              optionalCheckBoxChecked: optionalCheckBoxChecked || false
-            },
-            validationSchema,
-            onSubmit: (values) => {
-              onFormSend(values);
-              handleSubmit(values);
-            },
-            id: "register-interest-form",
-            children: ({ values, errors, touched, handleBlur, handleChange, setFieldValue, setFieldTouched }) => {
-              const onChangeWithTouch = async (e) => {
-                const field = e.target;
-                await setFieldValue(field.name, field.value, false);
-                await setFieldTouched(field.name);
-              };
-              const oneOfCheckbox = values.mailingList && !mailingListDisabled || values.privateInvestorList && !privateInvestorListDisabled;
-              const optionalCheckBoxForm = optionalCheckBox ? values.optionalCheckBoxChecked : true;
-              const handleCheckboxChange = (e) => {
-                handleChange(e);
-                if (e.target.checked) {
-                  updateCheckedCheckboxes([...checkedCheckboxes, e.target.id]);
-                } else {
-                  updateCheckedCheckboxes(checkedCheckboxes.filter((item) => item !== e.target.id));
-                }
-              };
-              const requiresIdentityFields = !isLoggedIn;
-              const submitDisabled = requiresIdentityFields && (!values.email || !!errors.email || !values.name || !!errors.name) || isSubmitting || !oneOfCheckbox || !optionalCheckBoxForm;
-              return /* @__PURE__ */ jsxs(stdin_default$1, { children: [
-                /* @__PURE__ */ jsx(ComponentWrapper, { noPadding: true, children: /* @__PURE__ */ jsxs(FormField, { children: [
-                  !isLoggedIn && /* @__PURE__ */ jsxs(Fragment, { children: [
-                    /* @__PURE__ */ jsx(
-                      Input,
-                      {
-                        id: "new-venture-email",
-                        name: "email",
-                        type: "email",
-                        label: "Your email",
-                        value: values.email,
-                        onChange: onChangeWithTouch,
-                        onBlur: handleBlur,
-                        error: !!errors.email,
-                        touched: !!touched.email,
-                        "data-cy": "new-venture-modal-email-input"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(FormError, { show: touched.email && errors.email, children: errors.email }),
-                    /* @__PURE__ */ jsxs(ComponentWrapper, { noPaddingHorizontal: true, paddingVeticalHalf: true, noPaddingBottom: true, children: [
-                      /* @__PURE__ */ jsx(
-                        Input,
-                        {
-                          id: "new-venture-name",
-                          name: "name",
-                          type: "text",
-                          label: "Your name",
-                          value: values.name,
-                          onChange: onChangeWithTouch,
-                          onBlur: handleBlur,
-                          error: !!errors.name,
-                          touched: !!touched.name,
-                          "data-cy": "new-venture-modal-name-input"
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(FormError, { show: touched.name && errors.name, children: errors.name })
-                    ] })
-                  ] }),
-                  /* @__PURE__ */ jsx(FormField, { style: { marginTop: "1rem", marginBottom: -5 }, children: /* @__PURE__ */ jsx(
-                    stdin_default$2,
-                    {
-                      id: "createPrivateInvestor",
-                      name: "privateInvestorList",
-                      text: privateInvestorListText,
-                      checked: values.privateInvestorList,
-                      disabled: privateInvestorListDisabled,
-                      onChange: handleCheckboxChange,
-                      onBlur: handleBlur,
-                      "data-cy": "new-venture-modal-private-investor-checkbox"
-                    }
-                  ) }),
-                  /* @__PURE__ */ jsx(FormField, { style: { marginTop: "2rem", marginBottom: -5 }, children: /* @__PURE__ */ jsx(
-                    stdin_default$2,
-                    {
-                      id: "subscribeToProject",
-                      name: "mailingList",
-                      text: mailingListText,
-                      checked: values.mailingList,
-                      disabled: mailingListDisabled,
-                      onChange: handleCheckboxChange,
-                      onBlur: handleBlur,
-                      "data-cy": "new-venture-modal-mailing-list-checkbox"
-                    }
-                  ) }),
-                  optionalCheckBox && /* @__PURE__ */ jsx(FormField, { style: { marginTop: "2rem", marginBottom: -5 }, children: /* @__PURE__ */ jsx(
-                    stdin_default$2,
-                    {
-                      id: "optionalCheckBox",
-                      name: "optionalCheckBoxChecked",
-                      text: optionalCheckBoxText,
-                      value: values.optionalCheckBoxChecked,
-                      checked: values.optionalCheckBoxChecked,
-                      onChange: handleChange,
-                      onBlur: handleBlur,
-                      "data-cy": "new-venture-modal-optional-checkbox"
-                    }
-                  ) }),
-                  project.type === ProjectTypes.FUND && /* @__PURE__ */ jsx(FormField, { style: { marginTop: "2rem", marginBottom: -5 }, children: /* @__PURE__ */ jsx(
-                    "p",
-                    {
-                      style: {
-                        margin: 0,
-                        fontSize: 12
-                      },
-                      children: /* @__PURE__ */ jsx("strong", { children: "The fund, as well as its fund manager(s) and affiliates, may not be subject to any registration or other local marketing or private placement laws in your jurisdiction." })
-                    }
-                  ) })
-                ] }) }),
-                /* @__PURE__ */ jsx(ComponentWrapper, { noPaddingBottom: true, noPaddingHorizontal: true, center: true, children: /* @__PURE__ */ jsx(
-                  stdin_default,
-                  {
-                    type: "submit",
-                    id: "private-investor-subscribe-button",
-                    "data-cy": "new-venture-modal-register-submit",
-                    disabled: submitDisabled,
-                    children: "register"
-                  }
-                ) }),
-                /* @__PURE__ */ jsx(ComponentWrapper, { paddingVeticalHalf: true, noPaddingHorizontal: true, children: /* @__PURE__ */ jsx(FormError, { show: popupError, children: popupError }) })
-              ] });
-            }
-          }
-        ) }) })
-      ] })
-    }
-  );
-};
-NewVentureModal.propTypes = {
-  isModalOpen: PropTypes.bool.isRequired,
-  onModalClose: PropTypes.func.isRequired,
-  onFormSend: PropTypes.func.isRequired,
-  onModalSwitch: PropTypes.func,
-  title: PropTypes.string,
-  description: PropTypes.string,
-  popupError: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-  project: PropTypes.object,
-  successMsg: PropTypes.node,
-  errorMsg: PropTypes.node,
-  modalBotContent: PropTypes.node
-};
-export {
-  NewVentureModal
-};

package/dist/components/RegisterConfirmModal/RegisterConfirmModal.js

@@ -1,74 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import "react";
-import PropTypes from "prop-types";
-import styled from "styled-components";
-import { RED_BASE_HEX } from "../../constants/style.js";
-import { Modal } from "../Modal/Modal.js";
-import { Text } from "../Text/Text.styles.js";
-import { TextLink } from "../TextLink/TextLink.styles.js";
-import { Row, Column } from "../Grid/Grid.styles.js";
-import { ContainerWithLine } from "./RegisterConfirmModal.styles.js";
-import { ComponentWrapper } from "../ComponentWrapper/ComponentWrapper.styles.js";
-import { FormError } from "../Form/Form.styles.js";
-import { ModalInner } from "../Modal/Modal.styles.js";
-const RedBar = styled.div`
-  background: ${RED_BASE_HEX};
-  bottom: 0;
-  height: 30%;
-  position: absolute;
-  right: 0;
-  width: 50%;
-`;
-const RegisterConfirmModal = ({
-  id,
-  userInfo,
-  isModalOpen,
-  onModalClose,
-  onResend,
-  popupError,
-  popupSuccess,
-  isActionLoading,
-  cooldown
-}) => {
-  const userEmail = userInfo && userInfo.email;
-  return /* @__PURE__ */ jsxs(Modal, { isOpen: isModalOpen, onClose: onModalClose, closeIsFullHeight: true, id, children: [
-    /* @__PURE__ */ jsx(Row, { isConfirmModal: true, children: /* @__PURE__ */ jsx(Column, { part: 10, isConfirmModal: true, children: /* @__PURE__ */ jsx(ModalInner, { children: /* @__PURE__ */ jsxs(ContainerWithLine, { children: [
-      /* @__PURE__ */ jsxs(Text, { children: [
-        /* @__PURE__ */ jsx("h3", { children: "VERIFY YOUR EMAIL ADDRESS" }),
-        /* @__PURE__ */ jsxs("p", { children: [
-          "A verification link has been sent to ",
-          userEmail,
-          ". Please follow the link in the email to confirm your email address and activate your account."
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs(Text.Caption, { children: [
-        "Email not received?",
-        /* @__PURE__ */ jsx("br", {})
-      ] }),
-      /* @__PURE__ */ jsx(
-        TextLink,
-        {
-          to: "",
-          "data-cy": "register-confirm-modal-resend-email",
-          onClick: onResend,
-          disabled: cooldown?.isDisabled,
-          children: isActionLoading === "resend" ? "Resending email" : "Resend verification email"
-        }
-      ),
-      /* @__PURE__ */ jsx(ComponentWrapper, { noPaddingVertical: true, noPaddingHorizontal: true, children: /* @__PURE__ */ jsx(FormError, { show: popupError.popup === "resend", children: popupError.message }) }),
-      /* @__PURE__ */ jsx(ComponentWrapper, { noPaddingVertical: true, noPaddingHorizontal: true, children: /* @__PURE__ */ jsx(FormError, { show: popupSuccess.popup === "resend", children: popupSuccess.message }) }),
-      /* @__PURE__ */ jsx(ComponentWrapper, { noPaddingBottom: true, noPaddingHorizontal: true, children: cooldown?.isDisabled && /* @__PURE__ */ jsx(FormError, { show: cooldown?.isDisabled, children: `You can resend email in ${cooldown?.secondsRemaining} seconds` }) })
-    ] }) }) }) }),
-    /* @__PURE__ */ jsx(RedBar, {})
-  ] });
-};
-RegisterConfirmModal.propTypes = {
-  isModalOpen: PropTypes.bool.isRequired,
-  onModalClose: PropTypes.func.isRequired
-};
-var stdin_default = RegisterConfirmModal;
-export {
-  ContainerWithLine,
-  RegisterConfirmModal,
-  stdin_default as default
-};