@stokr/components-library 3.0.55 → 3.0.56

package/dist/components/BackButton/BackButton.js

@@ -25,12 +25,10 @@ BackButton.propTypes = {
   to: PropTypes.string,
   href: PropTypes.string
 };
-var stdin_default = BackButton;
 export {
   BackButton,
   BackButtonIcon,
   StyledBackButton,
   StyledBackButtonExternal,
-  StyledWindowBackButton,
-  stdin_default as default
+  StyledWindowBackButton
 };

package/dist/components/ComponentScroll/ComponentScroll.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { useRef, useEffect } from "react";
 import PropTypes from "prop-types";
-import { Scrollbars } from "react-custom-scrollbars-2";
+import { Scrollbars } from "react-custom-scrollbars-4";
 import { Container, Outer, Inner, ThumbV, TrackV, ThumbH, TrackH } from "./ComponentScroll.styles.js";
 const ComponentScroll = (props) => {
   const {

package/dist/components/FAQ/FAQ.js

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import PropTypes from "prop-types";
 import { Text } from "../Text/Text.styles.js";
 import { useState } from "react";
-import scrollToElement from "scroll-to-element";
+import { scrollToElement } from "../../utils/scrollUtils.js";
 import { FaqItems, FaqItem, FaqTitle, FaqDropdownIcon, FaqContent, FaqText } from "./FAQ.styles.js";
 function slugFromTitle(title) {
   if (title == null) return "";
@@ -22,10 +22,7 @@ const FAQ = (props) => {
           scrollRef?.current.scrollToBottom();
         }, 0);
       } else {
-        scrollToElement?.(e.target.parentElement, {
-          duration: 300,
-          offset: 20
-        });
+        scrollToElement(e.target.parentElement, { offset: 20 });
       }
     }
   };

package/dist/components/MultiProgressBar/MultiProgressBar.js

@@ -22,9 +22,7 @@ const MultiProgressBarPropTypes = {
   fill: PropTypes.number.isRequired
 };
 MultiProgressBar.propTypes = MultiProgressBarPropTypes;
-var stdin_default = MultiProgressBar;
 export {
   MultiProgressBar,
-  MultiProgressBarPropTypes,
-  stdin_default as default
+  MultiProgressBarPropTypes
 };

package/dist/components/Tabs/Tabs.js

@@ -46,9 +46,7 @@ Tabs.propTypes = {
   children: PropTypes.node.isRequired,
   activeTab: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
 };
-var stdin_default = Tabs;
 export {
   Tab,
-  Tabs,
-  stdin_default as default
+  Tabs
 };

package/dist/components/TabsNav/TabsNav.js

@@ -16,13 +16,11 @@ TabsNav.propTypes = {
   noBorderBottom: PropTypes.bool,
   noWrapperPadding: PropTypes.bool
 };
-var stdin_default = TabsNav;
 export {
   LinkText,
   Scroll,
   StyledTab,
   StyledTabs,
   TabsNav,
-  TabsWrapper,
-  stdin_default as default
+  TabsWrapper
 };

package/dist/index.js

@@ -9,7 +9,6 @@ import { HeroVideoBlock } from "./components/HeroBlock/HeroVideoBlock.js";
 import { BasicTable } from "./components/BasicTable/BasicTable.js";
 import { Button } from "./components/Button/Button.styles.js";
 import { ButtonContainer, ButtonGridContainer } from "./components/ButtonContainer/ButtonContainer.styles.js";
-import { CaptialRaisedSummary } from "./components/CapitalRaisedSummary/CaptialRaisedSummary.js";
 import { ChartLegend } from "./components/ChartLegend/ChartLegend.js";
 import { CheckBoxCaption, Checkbox } from "./components/Checkbox/Checkbox.js";
 import { ComponentScroll } from "./components/ComponentScroll/ComponentScroll.js";
@@ -45,12 +44,6 @@ import { TableFilterDropdown } from "./components/Input/TableFilterDropdown.js";
 import { InvestmentStat } from "./components/InvestmentStat/InvestmentStat.js";
 import { SpanButton } from "./components/SpanButton/SpanButton.styles.js";
 import { LatestUpdate } from "./components/LatestUpdate/LatestUpdate.js";
-import { LearnMoreCarousel } from "./components/LearnMoreCarousel/LearnMoreCarousel.js";
-import { LearnMore } from "./components/LearnMorePage/LearnMore.js";
-import { LearnMoreExampleObject } from "./components/LearnMorePage/LearnMoreExampleObject.js";
-import { LearnMoreItem } from "./components/LearnMorePage/LearnMoreItem.js";
-import { LearnMoreSection } from "./components/LearnMoreSection/LearnMore.js";
-import { LearnMoreItemSection } from "./components/LearnMoreSection/LearnMoreItem.js";
 import { MainMenu } from "./components/MainMenu/MainMenu.js";
 import { MenuNav } from "./components/MenuNav/MenuNav.styles.js";
 import { GlareButton } from "./components/Button/GlareButton.js";
@@ -244,7 +237,6 @@ import { Youtube } from "./components/icons/Youtube.js";
 import { format } from "date-fns";
 import { getAnalyticsIngestUrl, getBackofficeAppUrl } from "./utils/app-urls-analytics-backoffice.js";
 import { getConfig, resetRuntimeConfig } from "./runtime-config.js";
-import { learnMoreCategoryPropTypes, learnMorePostPropTypes } from "./components/LearnMorePage/LearnMore.propTypes.js";
 import { useSnackbar } from "./components/Snackbar/useSnackbar.js";
 export {
   AccountBalance,
@@ -280,7 +272,6 @@ export {
   CURRENCY_CONFIG,
   default10 as CameraSvg,
   default11 as CapsLockSvg,
-  CaptialRaisedSummary,
   Card,
   CardHeader,
   CardHeaderRegular,
@@ -405,12 +396,6 @@ export {
   LatestUpdate,
   LatestUpdateWrapper,
   Layout,
-  LearnMore,
-  LearnMoreCarousel,
-  LearnMoreExampleObject,
-  LearnMoreItem,
-  LearnMoreItemSection,
-  LearnMoreSection,
   LinkIcon,
   LinkText,
   LinkedIn,
@@ -641,8 +626,6 @@ export {
   isPasswordValid,
   isUSInvestor,
   km_ify,
-  learnMoreCategoryPropTypes,
-  learnMorePostPropTypes,
   loaderGif,
   momentUtils,
   navigateToHref,

package/dist/utils/scrollUtils.js

@@ -1,22 +1,22 @@
 import { useEffect, useCallback } from "react";
 import { useLocation } from "react-router-dom";
-const scrollToElement = (elementRef, options = {}) => {
-  const { behavior = "smooth", block = "start", delay = 0 } = options;
+const scrollToElement = (elementOrRef, options = {}) => {
+  const { behavior = "smooth", block = "start", delay = 0, offset = 0 } = options;
   const performScroll = () => {
-    if (!elementRef?.current) return;
+    const element = elementOrRef?.current ?? elementOrRef;
+    if (!element) return;
     const isAppleDevice = /iPad|iPhone|iPod/.test(navigator.userAgent) || navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1;
     requestAnimationFrame(() => {
-      if (isAppleDevice) {
-        const rect = elementRef.current.getBoundingClientRect();
-        const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
-        const targetY = rect.top + scrollTop;
+      const rect = element.getBoundingClientRect();
+      const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+      const targetY = rect.top + scrollTop - offset;
+      if (isAppleDevice || offset !== 0) {
         window.scrollTo({
           top: targetY,
           behavior: behavior === "smooth" ? "auto" : behavior
-          // Use 'auto' for Apple devices
         });
       } else {
-        elementRef.current.scrollIntoView({
+        element.scrollIntoView({
           behavior,
           block
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stokr/components-library",
-  "version": "3.0.55",
+  "version": "3.0.56",
   "description": "STOKR - Components Library",
   "author": "Bilal Hodzic <bilal@stokr.io>",
   "license": "MIT",
@@ -54,32 +54,25 @@
     "serve": "npx http-server ./storybook-static -p 9009"
   },
   "dependencies": {
-    "@lottiefiles/dotlottie-react": "^0.17.13",
-    "ajv": "^8.18.0",
+    "@lottiefiles/dotlottie-react": "^0.19.4",
     "axios": "^1.13.5",
-    "bignumber.js": "^9.1.1",
     "country-flag-icons": "^1.6.17",
     "date-fns": "^4.1.0",
     "date-fns-tz": "^3.2.0",
     "dompurify": "^3.2.4",
     "firebase": "^12.4.0",
     "formik": "^2.2.9",
-    "formik-persist": "^1.1.0",
     "html-react-parser": "^5.0.6",
     "js-cookie": "^3.0.5",
     "mixpanel-browser": "^2.74.0",
-    "mobile-detect": "^1.4.5",
     "moment": "^2.30.1",
     "moment-timezone": "^0.6.0",
     "prop-types": "^15.8.1",
     "qrcode.react": "^4.2.0",
     "react-collapse": "^5.1.1",
     "react-copy-to-clipboard": "^5.1.0",
-    "react-countup": "^6.4.1",
-    "react-custom-scrollbars-2": "^4.5.0",
+    "react-custom-scrollbars-4": "^4.5.1",
     "react-day-picker": "^9.11.1",
-    "react-device-detect": "^2.2.3",
-    "react-ga4": "^2.1.0",
     "react-helmet": "^6.1.0",
     "react-intersection-observer": "^10.0.2",
     "react-otp-input": "^3.1.0",
@@ -89,15 +82,13 @@
     "react-slick": "^0.31.0",
     "react-table": "^7.8.0",
     "react-tippy": "^1.4.0",
-    "scroll-to-element": "^2.0.3",
-    "semantic-ui-react": "^2.1.4",
     "slick-carousel": "^1.8.1",
     "yup": "^1.0.0"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0",
-    "react-router-dom": "^6.0.0",
+    "react-router-dom": "^6.0.0 || ^7.0.0",
     "styled-components": "^6.0.0"
   },
   "devDependencies": {

package/dist/components/CapitalRaisedSummary/CaptialRaisedSummary.js

@@ -1,18 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import "react";
-import CountUp from "react-countup";
-import PropTypes from "prop-types";
-import stdin_default, { MultiProgressBarPropTypes } from "../MultiProgressBar/MultiProgressBar.js";
-import { Wrapper, Title, Amount } from "./CaptialRaisedSummary.styles.js";
-const CaptialRaisedSummary = ({ capital, multiProgressBar }) => /* @__PURE__ */ jsxs(Wrapper, { children: [
-  /* @__PURE__ */ jsx(Title, { children: "CAPITAL RAISED" }),
-  /* @__PURE__ */ jsx(Amount, { children: /* @__PURE__ */ jsx(CountUp, { end: capital, prefix: "€ ", duration: 0.01, separator: "," }) }),
-  /* @__PURE__ */ jsx(stdin_default, { ...multiProgressBar })
-] });
-CaptialRaisedSummary.propTypes = {
-  capital: PropTypes.number.isRequired,
-  multiProgressBar: PropTypes.shape(MultiProgressBarPropTypes).isRequired
-};
-export {
-  CaptialRaisedSummary
-};

package/dist/components/CapitalRaisedSummary/CaptialRaisedSummary.styles.js

@@ -1,41 +0,0 @@
-import styled from "styled-components";
-import { ComponentWrapper } from "../ComponentWrapper/ComponentWrapper.styles.js";
-import rwd from "../../styles/rwd.js";
-import theme from "../../styles/theme.js";
-const Wrapper = styled(ComponentWrapper)`
-  background: ${() => theme.cPrimary};
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  height: 100%;
-  margin-top: -1px;
-`;
-const Title = styled.div`
-  font-size: 11px;
-  line-height: 20px;
-  letter-spacing: 2px;
-  margin-bottom: 14px;
-  color: ${() => theme.cWhite};
-`;
-const Amount = styled.div`
-  font-size: 34px;
-  line-height: 40px;
-  font-weight: 300;
-  margin-bottom: 20px;
-  letter-spacing: 2px;
-  color: ${() => theme.cWhite};
-  white-space: nowrap;
-
-  ${rwd.Medium`
-    font-size: 28px;
-  `}
-
-  ${rwd.Large`
-    font-size: 34px;
-  `}
-`;
-export {
-  Amount,
-  Title,
-  Wrapper
-};

package/dist/components/LearnMoreCarousel/LearnMoreCarousel.js

@@ -1,32 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import "react";
-import PropTypes from "prop-types";
-import Slick from "react-slick";
-import "slick-carousel/slick/slick.css";
-import "slick-carousel/slick/slick-theme.css";
-import { Container, Offset, Wrapper } from "./LearnMoreCarousel.styles.js";
-const LearnMoreCarousel = ({ children, autoplay = 0, dots = false, arrows = false, isMobile = false }) => {
-  const settings = {
-    dots,
-    arrows,
-    infinite: false,
-    speed: 600,
-    autoplay: !!autoplay,
-    autoplaySpeed: autoplay,
-    slidesToShow: isMobile ? 1 : 2,
-    slidesToScroll: isMobile ? 1 : 1
-  };
-  return /* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsx(Offset, { children: /* @__PURE__ */ jsx(Wrapper, { children: /* @__PURE__ */ jsx(Slick, { ...settings, children }) }) }) });
-};
-LearnMoreCarousel.propTypes = {
-  children: PropTypes.node.isRequired,
-  autoplay: PropTypes.number,
-  dots: PropTypes.bool,
-  arrows: PropTypes.bool,
-  isMobile: PropTypes.bool
-};
-var stdin_default = LearnMoreCarousel;
-export {
-  LearnMoreCarousel,
-  stdin_default as default
-};

package/dist/components/LearnMoreCarousel/LearnMoreCarousel.styles.js

@@ -1,208 +0,0 @@
-import styled from "styled-components";
-import rwd from "../../styles/rwd.js";
-import theme from "../../styles/theme.js";
-const Container = styled.div`
-  overflow: hidden;
-`;
-const Offset = styled.div`
-  position: relative;
-  padding-top: 28px;
-  padding-bottom: 76px;
-  margin-right: 0;
-
-  ${rwd.Medium`
-    padding-top: 32px;
-    padding-bottom: 72px;
-    margin-right: 64px;
-  `}
-
-  ${rwd.Large`
-    padding-top: 64px;
-    padding-bottom: 88px;
-    margin-right: 128px;
-  `}
-`;
-const Wrapper = styled.div`
-  margin-right: 0;
-
-  ${rwd.Medium`
-    margin-right: -100%;
-  `}
-
-  .slick-list {
-    z-index: 0;
-  }
-
-  .slick-arrow {
-    z-index: 1;
-    width: 32px;
-    height: 48px;
-    background-color: ${() => theme.cWarning};
-    transition: background-color 0.2s;
-
-    ${rwd.Large`
-      width: 64px;
-    `}
-
-    &.slick-prev ,
-    &.slick-next {
-      top: 100%;
-      right: 50%;
-      margin-top: 40px;
-      transform: none;
-
-      ${rwd.Medium`
-        margin-top: 24px;
-      `}
-
-      ${rwd.Large`
-        margin-top: 40px;
-      `}
-
-      &:before {
-        font-family: 'Ionicons';
-        speak: none;
-        font-style: normal;
-        font-weight: normal;
-        font-variant: normal;
-        text-transform: none;
-        text-rendering: auto;
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-        font-size: 20px;
-        line-height: 24px;
-        text-align: center;
-        opacity: 1;
-        color: ${() => theme.cWhite};
-      }
-
-      &:focus,
-      &:hover {
-        background-color: ${() => theme.cWarningDark};
-      }
-    }
-
-    &.slick-prev {
-      left: auto;
-      margin-right: -32px;
-
-      ${rwd.Large`
-        margin-right: -64px;
-      `}
-
-      &:before {
-        content: '\f3cf';
-      }
-    }
-
-    &.slick-next {
-      border-left: 1px solid ${() => theme.cWarningDark};
-      margin-right: -64px;
-
-      ${rwd.Large`
-        margin-right: -128px;
-      `}
-
-      &:before {
-        content: '\f3d1';
-      }
-    }
-  }
-
-  .slick-dots {
-    z-index: 1;
-    height: auto;
-    top: 100%;
-    margin-left: 8px;
-    text-align: center;
-    width: 100%;
-    margin-top: 28px;
-
-    ${rwd.Medium`
-      margin-top: 36px;
-      width: 50%;
-      padding-right: 32px;
-      text-align: right;
-      `}
-
-    ${rwd.Large`
-      margin-top: 52px;
-      padding-right: 36px;
-    `}
-
-    li {
-      display: inline-block;
-      width: 24px;
-      height: 24px;
-      margin: 0;
-
-      button {
-        display: block;
-        padding: 8px;
-        width: 24px;
-        height: 24px;
-
-        &:before {
-          position: relative;
-          content: '';
-          display: block;
-          width: 8px;
-          height: 8px;
-          border-radius: 4px;
-          background-color: #eee;
-          opacity: 1;
-          transition: background-color 0.2s;
-        }
-
-        &:hover {
-          &:before {
-            background-color: #0050ca;
-          }
-        }
-      }
-
-      &.slick-active {
-        button {
-          &:before {
-            background-color: #ee220d;
-          }
-        }
-      }
-    }
-  }
-
-  .slick-track {
-    display: flex;
-    align-items: stretch;
-  }
-
-  .slick-slide {
-    height: auto;
-
-    & > div {
-      height: 100%;
-    }
-  }
-`;
-const LearnMoreSlide = styled.div`
-  outline: 0;
-  height: 100%;
-  padding-left: 32px;
-  padding-right: 32px;
-
-  ${rwd.Medium`
-    padding-left: 32px;
-    padding-right: 0;
-  `}
-
-  ${rwd.Large`
-    padding-left: 64px;
-    padding-right: 0;
-  `}
-`;
-export {
-  Container,
-  LearnMoreSlide,
-  Offset,
-  Wrapper
-};