fix: toggle title alignment

Author: Arthurk12

src/components/Toggle/component.tsx

@@ -38,7 +38,12 @@ function Toggle ({
   return (
     <Styled.ToggleWrapper textPosition={textPosition}>
       {(label || helperText) && (
-        <Styled.TextWrapper textPosition={textPosition} htmlFor={id} hasLabel={!!label}>
+        <Styled.TextWrapper
+          textPosition={textPosition}
+          htmlFor={id}
+          hasLabel={!!label}
+          hasHelperText={!!helperText}
+        >
           {label && <Styled.Title id={labelId}>{label}</Styled.Title>}
           {helperText && <Styled.HelperText id={helperTextId}>{helperText}</Styled.HelperText>}
         </Styled.TextWrapper>

src/components/Toggle/styles.ts

@@ -47,7 +47,7 @@ export const TextWrapper = styled.label<StyledTextWrapperProps>`
     return 1;
   }};
   cursor: pointer;
-  ${({hasLabel}) => !hasLabel && `justify-content: center;`}
+  ${({hasLabel, hasHelperText}) => (!hasLabel || !hasHelperText) && `justify-content: center;`}
   ${({ textPosition }) => {
     if (textPosition === TEXT_POSITIONS.TOP || textPosition === TEXT_POSITIONS.BOTTOM) {
       return css`

src/components/Toggle/types.ts

@@ -10,6 +10,7 @@ export interface StyledToggleWrapperProps {
 
 export interface StyledTextWrapperProps extends StyledToggleWrapperProps{
   hasLabel: boolean;
+  hasHelperText: boolean;
 }
 
 export interface ToggleProps {