From d04299276c26ea6d547db91c73574494bcdbc48d Mon Sep 17 00:00:00 2001
From: juninhokaponne <juninhokaponnemg@hotmail.com>
Date: Tue, 9 Apr 2024 10:00:30 -0300
Subject: [PATCH] TEC-4290: Create the label component and style

---
 .../PaymentMethods/PaymentMethodsLabel/index.tsx | 16 ++++++++++++++++
 .../PaymentMethods/PaymentMethodsLabel/style.tsx | 14 ++++++++++++++
 2 files changed, 30 insertions(+)

diff --git a/src/components/PaymentMethods/PaymentMethodsLabel/index.tsx b/src/components/PaymentMethods/PaymentMethodsLabel/index.tsx
index e69de29..eb91714 100644
--- a/src/components/PaymentMethods/PaymentMethodsLabel/index.tsx
+++ b/src/components/PaymentMethods/PaymentMethodsLabel/index.tsx
@@ -0,0 +1,16 @@
+import { PaymentMethodsContainerStyled } from './style'
+import { PaymentMethodsContainerProps } from '../PaymentMethodsContainer/type'
+
+const PaymentMethodsLabel = ({
+  children,
+  icon,
+}: PaymentMethodsContainerProps) => {
+  return (
+    <PaymentMethodsContainerStyled>
+      {icon && icon}
+      {children}
+    </PaymentMethodsContainerStyled>
+  )
+}
+
+export { PaymentMethodsLabel }
diff --git a/src/components/PaymentMethods/PaymentMethodsLabel/style.tsx b/src/components/PaymentMethods/PaymentMethodsLabel/style.tsx
index e69de29..5d19141 100644
--- a/src/components/PaymentMethods/PaymentMethodsLabel/style.tsx
+++ b/src/components/PaymentMethods/PaymentMethodsLabel/style.tsx
@@ -0,0 +1,14 @@
+import styled from 'styled-components'
+import { Colors } from '../../../tokens'
+
+const PaymentMethodsContainerStyled = styled.label`
+  color: ${Colors.light.neutral.neutral500};
+  font-size: 1rem;
+
+  display: flex;
+  gap: 0.5rem;
+  align-items: center;
+  cursor: pointer;
+`
+
+export { PaymentMethodsContainerStyled }