@granto-umbrella/umbrella-components 3.0.33 → 3.0.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@granto-umbrella/umbrella-components",
-  "version": "3.0.33",
+  "version": "3.0.34",
   "description": "Umbrella Components for React",
   "type": "module",
   "main": "src/index.js",

package/src/components/atoms/ErrorMessage/ErrorMessage.styles.tsx

@@ -1,10 +1,10 @@
-import styled, { css } from "styled-components";
+import styled, { css } from 'styled-components';
 import {
   semanticBorders,
   semanticColors,
   semanticSizes,
   typographyTokens,
-} from "@/styles/tokens";
+} from '../../../styles/tokens';
 
 const errorMessageVariants = {
   error: css`
@@ -15,7 +15,7 @@ const errorMessageVariants = {
   `,
 };
 
-export const ErrorMessage = styled.p<{ $type?: "error" | "success" }>`
+export const ErrorMessage = styled.p<{ $type?: 'error' | 'success' }>`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -23,6 +23,6 @@ export const ErrorMessage = styled.p<{ $type?: "error" | "success" }>`
   font-size: ${typographyTokens.fontSizes.labelS};
   margin-top: ${semanticSizes.global.spacings.sm};
   border-radius: ${semanticBorders.global.md};
-  
-  ${({ $type = "error" }) => errorMessageVariants[$type]}
-`;
+
+  ${({ $type = 'error' }) => errorMessageVariants[$type]}
+`;

package/src/components/atoms/Footer/Footer.styles.tsx

@@ -4,7 +4,7 @@ import {
   semanticColors,
   primitiveSizes,
   typographyTokens,
-} from "@/styles/tokens";
+} from '../../../styles/tokens';
 
 export const Container = styled.div`
   font-size: ${typographyTokens.fontSizes.bodyM};

package/src/components/atoms/GenericContainer/GenericContainer.styles.tsx

@@ -1,21 +1,21 @@
-import styled from "styled-components";
+import styled from 'styled-components';
 import {
   semanticColors,
   semanticSizes,
   typographyTokens,
-} from "@/styles/tokens";
+} from '../../../styles/tokens';
 
 export const Container = styled.div`
-  padding: ${semanticSizes.global.padding["2xl"]};
-  
+  padding: ${semanticSizes.global.padding['2xl']};
+
   h1 {
     font-size: ${typographyTokens.fontSizes.displayM};
     font-weight: ${typographyTokens.fontWeights.semibold};
     line-height: ${typographyTokens.lineHeights.displayM};
     margin-top: ${semanticSizes.global.padding.xl};
   }
-  
+
   .text {
     color: ${semanticColors.global.text.default.enabled};
   }
-`;
+`;

package/src/components/atoms/Loading/Loading.styles.tsx

@@ -1,10 +1,10 @@
-import styled, { keyframes } from "styled-components";
+import styled, { keyframes } from 'styled-components';
 import {
   semanticBorders,
   semanticColors,
   semanticRadius,
   semanticSizes,
-} from "@/styles/tokens";
+} from '../../../styles/tokens';
 
 const spin = keyframes`
   to { 
@@ -14,10 +14,12 @@ const spin = keyframes`
 
 export const StyledLoader = styled.div`
   margin: ${semanticSizes.global.spacings.lg} auto;
-  border: ${semanticBorders.global.lg} solid ${semanticColors.global.border.default};
-  border-top: ${semanticBorders.global.lg} solid ${semanticColors.info.border.feedback};
+  border: ${semanticBorders.global.lg} solid
+    ${semanticColors.global.border.default};
+  border-top: ${semanticBorders.global.lg} solid
+    ${semanticColors.info.border.feedback};
   border-radius: ${semanticRadius.global.radius.full};
   width: ${semanticSizes.global.spacings.md};
   height: ${semanticSizes.global.spacings.md};
   animation: ${spin} 1s linear infinite;
-`;
+`;

package/src/components/atoms/LogoContainer/LogoContainer.styles.tsx

@@ -1,11 +1,11 @@
-import styled from "styled-components";
-import { primitiveSizes } from "@/styles/tokens";
+import styled from 'styled-components';
+import { primitiveSizes } from '../../../styles/tokens';
 
 export const Logo = styled.img<{ marginBottom?: string }>`
   margin-bottom: ${(props) => props.marginBottom || primitiveSizes.size.x6};
   width: 112px;
-  
+
   @media (max-width: 768px) {
     width: 114.12px;
   }
-`;
+`;

package/src/components/atoms/ModalAviso/ModalAviso.styles.tsx

@@ -1,17 +1,17 @@
 // ModalAviso.styles.tsx
-import styled from "styled-components";
-import { 
+import styled from 'styled-components';
+import {
   primitiveColors,
   semanticSizes,
   semanticRadius,
-  typographyTokens, 
-  semanticBorders
-}  from "../../../styles/tokens";
-import { semanticColors } from "@/styles/tokens";
+  typographyTokens,
+  semanticBorders,
+} from '../../../styles/tokens';
+import { semanticColors } from '../../../styles/tokens';
 
 export const Wrapper = styled.div`
   position: fixed;
-  bottom: calc(${semanticSizes.global.spacings.lg} + 10px); 
+  bottom: calc(${semanticSizes.global.spacings.lg} + 10px);
   right: ${semanticSizes.global.padding.lg};
   z-index: 9999;
 `;
@@ -19,7 +19,8 @@ export const Wrapper = styled.div`
 export const Container = styled.div`
   background-color: ${semanticColors.info.surface.feedback};
   border-radius: ${semanticRadius.global.radius.md2};
-  border: ${semanticBorders.global.md} solid ${semanticColors.info.border.feedback};
+  border: ${semanticBorders.global.md} solid
+    ${semanticColors.info.border.feedback};
   padding: ${semanticSizes.global.padding.md} ${semanticSizes.global.padding.lg};
   display: flex;
   align-items: start;
@@ -52,4 +53,4 @@ export const CloseButton = styled.button`
   cursor: pointer;
   color: ${primitiveColors.gray[600]};
   line-height: 0;
-`;
+`;

package/src/components/molecules/InsuranceCard/InsuranceCard.styles.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react-refresh/only-export-components */
 import styled from 'styled-components';
-import { semanticColors } from "@/styles/tokens";
+import { semanticColors } from '../../../styles/tokens';
 import { StatusVariant } from './InsuranceCard.types';
 
 export const PageContainer = styled.div`

package/src/components/organisms/Navbar/Navbar.styles.tsx

@@ -5,7 +5,7 @@ import {
   semanticBorders,
   semanticColors,
   semanticShadows,
-} from "@/styles/tokens";
+} from '../../../styles/tokens';
 import styled from 'styled-components';
 import { Search } from 'lucide-react';
 //