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

package/dist/components/Input/InputPassword.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import PropTypes from "prop-types";
-import stdin_default$1 from "../SvgIcons/CapsLockSvg.js";
+import stdin_default from "../SvgIcons/CapsLockSvg.js";
 import { InfoIcon } from "../InfoIcon/InfoIcon.js";
 import { Wrapper, Label, InputWrap } from "./Input.styles.js";
 import { getPasswordEntropy, ENTROPY_WEAK, ENTROPY_MEDIUM } from "../../utils/password-validation.js";
@@ -105,7 +105,7 @@ const InputPassword = (props) => {
         // )
         /* @__PURE__ */ jsx(Fragment, {})
       ),
-      /* @__PURE__ */ jsx(CapslockIndicator, { children: isCapslockOn && /* @__PURE__ */ jsx(stdin_default$1, {}) })
+      /* @__PURE__ */ jsx(CapslockIndicator, { children: isCapslockOn && /* @__PURE__ */ jsx(stdin_default, {}) })
     ] })
   ] });
 };
@@ -124,9 +124,7 @@ InputPassword.propTypes = {
   autoComplete: PropTypes.string,
   toggleDataCy: PropTypes.string
 };
-var stdin_default = InputPassword;
 export {
   InputPassword,
-  PasswordStrength,
-  stdin_default as default
+  PasswordStrength
 };

package/dist/components/Input/OtpInput.js

@@ -77,8 +77,6 @@ const OtpInput = (props) => {
     ) })
   ] });
 };
-var stdin_default = OtpInput;
 export {
-  OtpInput,
-  stdin_default as default
+  OtpInput
 };

package/dist/components/MenuNav/MenuNav.styles.js

@@ -61,6 +61,5 @@ const MenuNav = styled.nav.withConfig({
   `}
 `;
 export {
-  MenuNav,
-  MenuNav as default
+  MenuNav
 };

package/dist/components/Modal/Modal.styles.js

@@ -393,7 +393,7 @@ const ModalLink = styled(Link)`
     }
   }
 `;
-const ModalWrapper = styled.div`
+styled.div`
   display: flex;
   flex-direction: column;
   height: 100%;
@@ -453,6 +453,5 @@ export {
   ModalLink,
   ModalLinkWrap,
   ModalRoot,
-  ModalScroll,
-  ModalWrapper
+  ModalScroll
 };

package/dist/components/Newsletter/Newsletter.js

@@ -115,8 +115,6 @@ ${e}`);
     ] })
   ] }) }) }) });
 };
-var stdin_default = Newsletter;
 export {
-  Newsletter,
-  stdin_default as default
+  Newsletter
 };

package/dist/components/NotificationCounter/NotificationCounter.styles.js

@@ -33,6 +33,5 @@ const NotificationCounter = styled.span.withConfig({
   `}
 `;
 export {
-  NotificationCounter,
-  NotificationCounter as default
+  NotificationCounter
 };

package/dist/components/SmartLink/SmartLink.js

@@ -16,9 +16,7 @@ SmartLink.propTypes = {
   to: PropTypes.string,
   children: PropTypes.node
 };
-var stdin_default = SmartLink;
 export {
   SmartLink,
-  stdin_default as default,
   isExternalUrl
 };

package/dist/components/StepController/StepController.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import PropTypes from "prop-types";
 import { Transition } from "../../utils/transition.js";
 import React__default, { PureComponent, Fragment } from "react";
-import stdin_default$1 from "./StepControllerProgress.js";
+import stdin_default from "./StepControllerProgress.js";
 import { StepsProgressContainer, StepContainer } from "./StepController.styles.js";
 const timeout = 300;
 const getTransitionStyles = {
@@ -30,7 +30,7 @@ class StepController extends PureComponent {
     const { children, stepsProgressList, currentStep, activeStepIndex, doneStepsIndexes, touchedStepsIndexes } = this.props;
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(StepsProgressContainer, { children: /* @__PURE__ */ jsx(
-        stdin_default$1,
+        stdin_default,
         {
           activeStepIndex,
           doneStepsIndexes,
@@ -77,8 +77,6 @@ StepController.propTypes = {
   doneStepsIndexes: PropTypes.arrayOf(PropTypes.number).isRequired,
   changeStep: PropTypes.func.isRequired
 };
-var stdin_default = StepController;
 export {
-  StepController,
-  stdin_default as default
+  StepController
 };

package/dist/components/StepController/StepController.styles.js

@@ -1,6 +1,103 @@
 import styled from "styled-components";
 import rwd from "../../styles/rwd.js";
 import theme from "../../styles/theme.js";
+import { colors } from "../../styles/colors.js";
+const Container = styled.div`
+  display: block;
+  width: 100%;
+  height: 100%;
+`;
+const Wrap = styled.div`
+  display: block;
+  margin: 0 auto;
+`;
+const Items = styled.div`
+  display: flex;
+  height: 100%;
+  font-size: 0;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: center;
+  margin: 0 -6px;
+  text-align: center;
+
+  ${rwd.Medium`
+    display: block;
+  `}
+`;
+const Item = styled.div.withConfig({
+  shouldForwardProp: (props) => !["isDone", "isActive"].includes(props)
+})`
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+  padding: 0;
+  flex: 1;
+  margin: 0 4px;
+  height: 32px;
+  max-width: 32px;
+  cursor: pointer;
+
+  &:before {
+    z-index: 0;
+    content: '';
+    display: block;
+    width: 100%;
+    height: 4px;
+    position: absolute;
+    top: 14px;
+    left: 0;
+    border-radius: 3px;
+    box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.05);
+    background-color: ${colors.lightGrey};
+  }
+
+  &:after {
+    z-index: 1;
+    content: '';
+    display: block;
+    width: 100%;
+    height: 4px;
+    position: absolute;
+    top: 14px;
+    left: 0;
+    border-radius: 3px;
+    background-color: transparent;
+    transition: background-color 0.2s;
+  }
+
+  &:focus {
+    outline: none;
+  }
+
+  &:hover:after {
+    background-color: ${colors.black};
+  }
+
+  ${(props) => props.isDone && `
+    &:after {
+      background-color: ${colors.progressGreen};
+    }
+
+    &:hover:after {
+      background-color: ${colors.black};
+    }
+  `}
+
+  ${(props) => props.isActive && `
+    &:after {
+      background-color: ${colors.grey2};
+    }
+
+    &:hover:after {
+      background-color: ${colors.black};
+    }
+  `}
+
+  ${rwd.Medium`
+    width: 32px;
+  `}
+`;
 const StepsProgressContainer = styled.div`
   position: relative;
   width: 100%;
@@ -29,6 +126,10 @@ const StepContainer = styled.div.withConfig({
   `}
 `;
 export {
+  Container,
+  Item,
+  Items,
   StepContainer,
-  StepsProgressContainer
+  StepsProgressContainer,
+  Wrap
 };

package/dist/components/StepController/StepControllerProgress.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
 import PropTypes from "prop-types";
-import { Container, Wrap, Items, Item } from "../StepsProgress/StepsProgress.styles.js";
+import { Container, Wrap, Items, Item } from "./StepController.styles.js";
 const StepControllerProgress = ({
   touchedStepsIndexes,
   doneStepsIndexes,

package/dist/components/Switch/Switch.js

@@ -58,8 +58,6 @@ Switch.propTypes = {
   indicatorStyle: PropTypes.object,
   dataCy: PropTypes.string
 };
-var stdin_default = Switch;
 export {
-  Switch,
-  stdin_default as default
+  Switch
 };

package/dist/components/ToDoList/ToDoListTask.js

@@ -5,7 +5,6 @@ import { Tooltip } from "../Tooltip/Tooltip.js";
 import { Container, IconContainer, Icon, Content, TitleContainer, Title, State } from "./ToDoListTask.styles.js";
 import { TooltipIcon } from "../Icon/Icon.style.js";
 import setRedirectCookie from "../../utils/set-redirect-cookie.js";
-import { AuthProvider } from "../../context/AuthContext.js";
 import { ToDoModal } from "./ToDoList.js";
 import stdin_default$1 from "../taxId/flow.js";
 const ToDoTask = ({
@@ -19,7 +18,11 @@ const ToDoTask = ({
   disabled,
   openModal,
   redirectCookie = false,
-  onTaxIdComplete
+  onTaxIdComplete,
+  /** @deprecated Passed through to RegisterTaxIdFlow's tax-id form when openModal is TAX_ID. */
+  user,
+  /** @deprecated Passed through to RegisterTaxIdFlow's tax-id form when openModal is TAX_ID. */
+  updateUser
 }) => {
   const [modalOpen, setmodalOpen] = React__default.useState(false);
   const handleOpenModal = () => {
@@ -58,7 +61,16 @@ const ToDoTask = ({
         message ? /* @__PURE__ */ jsx(State, { children: message }) : ""
       ] })
     ] }),
-    modalOpen && /* @__PURE__ */ jsx(AuthProvider, { children: openModal === ToDoModal.TAX_ID && /* @__PURE__ */ jsx(stdin_default$1, { showFlow: modalOpen, setShowFlow: setmodalOpen, onComplete: onTaxIdComplete }) })
+    modalOpen && openModal === ToDoModal.TAX_ID && /* @__PURE__ */ jsx(
+      stdin_default$1,
+      {
+        showFlow: modalOpen,
+        setShowFlow: setmodalOpen,
+        onComplete: onTaxIdComplete,
+        user,
+        updateUser
+      }
+    )
   ] });
 };
 ToDoTask.propTypes = {

package/dist/components/taxId/register-taxid.js

@@ -1,7 +1,6 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { useContext, useState } from "react";
+import { useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { AuthContext } from "../../context/AuthContext.js";
 import { track } from "../../analytics/index.js";
 import { Text } from "../Text/Text.styles.js";
 import * as Yup from "yup";
@@ -53,10 +52,13 @@ const RegisterTaxId = ({
   backButtonText = "Back to verify identity",
   textHeader = defaultTextHeader,
   textFieldLabel = "enter your tax id",
-  faqItems = defaultFaqItems
+  faqItems = defaultFaqItems,
+  /** @deprecated Consumer no longer provides a local AuthContext — pass the authenticated user object explicitly. */
+  user = {},
+  /** @deprecated Consumer no longer provides a local AuthContext — pass the update-user function explicitly. */
+  updateUser
 }) => {
   let navigate = useNavigate();
-  const { user = {}, updateUser } = useContext(AuthContext);
   const { taxId } = user;
   const [isUpdatingUser, setIsUpdatingUser] = useState(false);
   const [error, setError] = useState("");
@@ -69,7 +71,7 @@ const RegisterTaxId = ({
   const handleOnSubmit = async (e) => {
     setIsUpdatingUser(true);
     try {
-      await updateUser({
+      await updateUser?.({
         taxId: e.taxId
       });
       track("tax_id_form_submitted_success");