diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
index 21f5ec0..29c1698 100644
--- a/.pre-commit-config.yaml
+++ b/.pre-commit-config.yaml
@@ -1,14 +1,16 @@
 repos:
-  - repo: https://github.com/mercadolibre/fury_websec-git-hooks
-    rev: v1.0.5
+  - repo: https://github.com/melisource/fury_websec-git-hooks
+    rev: v2.0.0
     hooks:
       - id: pre_commit_hook
         stages: [commit]
       - id: post_commit_hook
         stages: [post-commit]
-  - repo: https://github.com/mercadolibre/fury_datasec-git-hooks
-    rev: 1.0.1
+  - repo: https://github.com/melisource/fury_datasec-git-hooks
+    rev: 1.2.0
     hooks:
       - id: pre_commit_hook
         stages: [commit]
         verbose: true
+      - id: post_commit_hook
+        stages: [post-commit]
diff --git a/README.md b/README.md
index 2308ffb..f46994e 100644
--- a/README.md
+++ b/README.md
@@ -329,21 +329,27 @@ const cardToken = await createCardToken({
 
 ## Run SDK project
 
-To use Mercado Pago React SDK, follow the steps:
+> Replace the `<YOUR_PUBLIC_KEY>` on `examples/contants` with your public key.
 
-Install project:
+To run Mercado Pago React SDK, follow the steps:
+
+Install project dependencies:
 
 ```
-npm i
+npm install
 ```
 
-Execute project build:
+Execute project build (_optional_):
 
 ```
-npm build
+npm run build
 ```
 
-Execute `npm run start` to initialize storybook.
+Execute storybook:
+
+```
+npm run start
+```
 
 <br/>
 
diff --git a/examples/bricks/BrandBrick/0-Simple.tsx b/examples/bricks/BrandBrick/0-Simple.tsx
index a199e31..1260576 100644
--- a/examples/bricks/BrandBrick/0-Simple.tsx
+++ b/examples/bricks/BrandBrick/0-Simple.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Brand from '../../../src/bricks/brand';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-bfe30303-c7de-4da3-b765-c4be61b4f88b', {
+initMercadoPago(PUBLIC_KEY, {
   locale: 'es-AR',
 });
 
diff --git a/examples/bricks/BrandBrick/1-Visual-Customization.tsx b/examples/bricks/BrandBrick/1-Visual-Customization.tsx
index fa77267..7f9ba59 100644
--- a/examples/bricks/BrandBrick/1-Visual-Customization.tsx
+++ b/examples/bricks/BrandBrick/1-Visual-Customization.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Brand from '../../../src/bricks/brand';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-bfe30303-c7de-4da3-b765-c4be61b4f88b', {
+initMercadoPago(PUBLIC_KEY, {
   locale: 'es-AR',
 });
 
diff --git a/examples/bricks/CardPayment/0-Simple.tsx b/examples/bricks/CardPayment/0-Simple.tsx
index 0373e14..83152c7 100644
--- a/examples/bricks/CardPayment/0-Simple.tsx
+++ b/examples/bricks/CardPayment/0-Simple.tsx
@@ -2,8 +2,9 @@ import React from 'react';
 import Card from '../../../src/bricks/cardPayment';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+import { PUBLIC_KEY } from '../../constants';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 const App = () => {
   return (
     <Card
diff --git a/examples/bricks/CardPayment/1-Customization.tsx b/examples/bricks/CardPayment/1-Customization.tsx
index d879257..d723806 100644
--- a/examples/bricks/CardPayment/1-Customization.tsx
+++ b/examples/bricks/CardPayment/1-Customization.tsx
@@ -2,8 +2,9 @@ import React from 'react';
 import Card from '../../../src/bricks/cardPayment';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+import { PUBLIC_KEY } from '../../constants';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const customization = {
@@ -25,7 +26,7 @@ const App = () => {
       .then((cardFormData) => {
         console.log('cardFormData received, creating payment...', cardFormData);
       })
-      .catch((error) => {});
+      .catch((error) => console.log(error));
   }
 
   return (
diff --git a/examples/bricks/CardPayment/2-UpdateAmount.tsx b/examples/bricks/CardPayment/2-UpdateAmount.tsx
index 0fe157c..bca1d99 100644
--- a/examples/bricks/CardPayment/2-UpdateAmount.tsx
+++ b/examples/bricks/CardPayment/2-UpdateAmount.tsx
@@ -2,8 +2,9 @@ import React from 'react';
 import Card, { useCardPaymentBrick } from '../../../src/bricks/cardPayment';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+import { PUBLIC_KEY } from '../../constants';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const { update } = useCardPaymentBrick();
diff --git a/examples/bricks/CardPayment/3-Custom-ContainerId.tsx b/examples/bricks/CardPayment/3-Custom-ContainerId.tsx
new file mode 100644
index 0000000..4b95abf
--- /dev/null
+++ b/examples/bricks/CardPayment/3-Custom-ContainerId.tsx
@@ -0,0 +1,21 @@
+import React from 'react';
+import Card from '../../../src/bricks/cardPayment';
+
+import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+import { PUBLIC_KEY } from '../../constants';
+
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
+
+const App = () => {
+  return (
+    <Card
+      initialization={{ amount: 100 }}
+      id="custom-container-id"
+      onSubmit={async (param) => {
+        console.log(param);
+      }}
+    />
+  );
+};
+
+export default App;
diff --git a/examples/bricks/Payment/0-Simple.tsx b/examples/bricks/Payment/0-Simple.tsx
index 9130255..56bcc82 100644
--- a/examples/bricks/Payment/0-Simple.tsx
+++ b/examples/bricks/Payment/0-Simple.tsx
@@ -2,8 +2,9 @@ import React from 'react';
 import Payment from '../../../src/bricks/payment';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+import { PUBLIC_KEY } from '../../constants';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const initialization = {
diff --git a/examples/bricks/Payment/1-Visual-Customization.tsx b/examples/bricks/Payment/1-Visual-Customization.tsx
index 887392a..4029077 100644
--- a/examples/bricks/Payment/1-Visual-Customization.tsx
+++ b/examples/bricks/Payment/1-Visual-Customization.tsx
@@ -2,8 +2,9 @@ import React from 'react';
 import Payment from '../../../src/bricks/payment';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+import { PUBLIC_KEY } from '../../constants';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const initialization = {
diff --git a/examples/bricks/Payment/2-UpdateAmount.tsx b/examples/bricks/Payment/2-UpdateAmount.tsx
index e20ef5d..0d615d2 100644
--- a/examples/bricks/Payment/2-UpdateAmount.tsx
+++ b/examples/bricks/Payment/2-UpdateAmount.tsx
@@ -2,8 +2,9 @@ import React from 'react';
 import Payment, { usePaymentBrick } from '../../../src/bricks/payment';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+import { PUBLIC_KEY } from '../../constants';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const { update } = usePaymentBrick();
diff --git a/examples/bricks/Payment/3-Review-Confirm-Simple.tsx b/examples/bricks/Payment/3-Review-Confirm-Simple.tsx
index 0f3787f..05586a8 100644
--- a/examples/bricks/Payment/3-Review-Confirm-Simple.tsx
+++ b/examples/bricks/Payment/3-Review-Confirm-Simple.tsx
@@ -2,8 +2,9 @@ import React from 'react';
 import Payment from '../../../src/bricks/payment';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+import { PUBLIC_KEY } from '../../constants';
 
-initMercadoPago('TEST-d198443d-7e9f-4e5f-a770-e5b23ae627cb', { locale: 'es-MX' });
+initMercadoPago(PUBLIC_KEY, { locale: 'es-MX' });
 
 // This feature is temporarily exclusive for MLM (México) 🇲🇽 and MLA (Argentina) 🇦🇷
 const App = () => {
diff --git a/examples/bricks/Payment/4-Review-Confirm-Full.tsx b/examples/bricks/Payment/4-Review-Confirm-Full.tsx
index a8f4d25..3c1e920 100644
--- a/examples/bricks/Payment/4-Review-Confirm-Full.tsx
+++ b/examples/bricks/Payment/4-Review-Confirm-Full.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Payment from '../../../src/bricks/payment';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-d198443d-7e9f-4e5f-a770-e5b23ae627cb', { locale: 'es-MX' });
+initMercadoPago(PUBLIC_KEY, { locale: 'es-MX' });
 
 // This feature is temporarily exclusive for MLM (México) 🇲🇽 and MLA (Argentina) 🇦🇷
 const App = () => {
diff --git a/examples/bricks/Payment/5-Marketplace.tsx b/examples/bricks/Payment/5-Marketplace.tsx
index ea47c6b..9fdd029 100644
--- a/examples/bricks/Payment/5-Marketplace.tsx
+++ b/examples/bricks/Payment/5-Marketplace.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Payment from '../../../src/bricks/payment';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const ExamplePaymentBrickMarketplace = () => {
   return (
diff --git a/examples/bricks/StatusScreen/0-Simple.tsx b/examples/bricks/StatusScreen/0-Simple.tsx
index f1a9bbe..49c32e7 100644
--- a/examples/bricks/StatusScreen/0-Simple.tsx
+++ b/examples/bricks/StatusScreen/0-Simple.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import StatusScreen from '../../../src/bricks/statusScreen';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const initialization = {
diff --git a/examples/bricks/StatusScreen/1-Visual-Customization.tsx b/examples/bricks/StatusScreen/1-Visual-Customization.tsx
index ab4c36a..03df835 100644
--- a/examples/bricks/StatusScreen/1-Visual-Customization.tsx
+++ b/examples/bricks/StatusScreen/1-Visual-Customization.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import StatusScreen from '../../../src/bricks/statusScreen';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const initialization = {
diff --git a/examples/bricks/StatusScreen/2-Error-Status.tsx b/examples/bricks/StatusScreen/2-Error-Status.tsx
index 86c6959..33949af 100644
--- a/examples/bricks/StatusScreen/2-Error-Status.tsx
+++ b/examples/bricks/StatusScreen/2-Error-Status.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import StatusScreen from '../../../src/bricks/statusScreen';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-2b00e5a0-b421-4588-b9cb-846a553d760e', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const initialization = {
diff --git a/examples/bricks/StatusScreen/3-3DS-Challenge.tsx b/examples/bricks/StatusScreen/3-3DS-Challenge.tsx
index b08ad8d..e883fdc 100644
--- a/examples/bricks/StatusScreen/3-3DS-Challenge.tsx
+++ b/examples/bricks/StatusScreen/3-3DS-Challenge.tsx
@@ -1,10 +1,11 @@
 import React from 'react';
 import StatusScreen from '../../../src/bricks/statusScreen';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 import { IStatusScreenBrickInitialization } from '../../../src/bricks/statusScreen/types';
 
-initMercadoPago('TEST-2b00e5a0-b421-4588-b9cb-846a553d760e', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   const initialization: IStatusScreenBrickInitialization = {
diff --git a/examples/bricks/WalletBrick/0-Simple.tsx b/examples/bricks/WalletBrick/0-Simple.tsx
index 4f4512e..7fd88a1 100644
--- a/examples/bricks/WalletBrick/0-Simple.tsx
+++ b/examples/bricks/WalletBrick/0-Simple.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Wallet from '../../../src/bricks/wallet';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83');
+initMercadoPago(PUBLIC_KEY);
 
 const ExampleSimpleWalletBrick = () => {
   return <Wallet initialization={{ preferenceId: 'YOUR_PREFERENCE_ID' }} />;
diff --git a/examples/bricks/WalletBrick/1-Visual-Customization.tsx b/examples/bricks/WalletBrick/1-Visual-Customization.tsx
index 86a9fef..cf3f7c3 100644
--- a/examples/bricks/WalletBrick/1-Visual-Customization.tsx
+++ b/examples/bricks/WalletBrick/1-Visual-Customization.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Wallet from '../../../src/bricks/wallet';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83');
+initMercadoPago(PUBLIC_KEY);
 
 const ExampleVisualCustomizationWalletBrick = () => {
   return (
diff --git a/examples/bricks/WalletBrick/2-Preference-onSubmit.tsx b/examples/bricks/WalletBrick/2-Preference-onSubmit.tsx
index 5eaf58c..b4f4690 100644
--- a/examples/bricks/WalletBrick/2-Preference-onSubmit.tsx
+++ b/examples/bricks/WalletBrick/2-Preference-onSubmit.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Wallet from '../../../src/bricks/wallet';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83');
+initMercadoPago(PUBLIC_KEY);
 
 const ExampleOnSubmitWalletBrick = () => {
   function onSubmit() {
diff --git a/examples/bricks/WalletBrick/3-Hide-Value-Prop.tsx b/examples/bricks/WalletBrick/3-Hide-Value-Prop.tsx
index 4f47488..4fe52be 100644
--- a/examples/bricks/WalletBrick/3-Hide-Value-Prop.tsx
+++ b/examples/bricks/WalletBrick/3-Hide-Value-Prop.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Wallet from '../../../src/bricks/wallet';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83');
+initMercadoPago(PUBLIC_KEY);
 
 const ExampleVisualCustomizationWalletBrick = () => {
   return (
diff --git a/examples/bricks/WalletBrick/4-ValueProp-Customization.tsx b/examples/bricks/WalletBrick/4-ValueProp-Customization.tsx
index 2d314d3..263c159 100644
--- a/examples/bricks/WalletBrick/4-ValueProp-Customization.tsx
+++ b/examples/bricks/WalletBrick/4-ValueProp-Customization.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import Wallet from '../../../src/bricks/wallet';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83');
+initMercadoPago(PUBLIC_KEY);
 
 const ExampleValuePropCustomizationWalletBrick = () => {
   return (
diff --git a/examples/bricks/WalletBrick/5-Marketplace.tsx b/examples/bricks/WalletBrick/5-Marketplace.tsx
index 94efd5a..d9ff6ed 100644
--- a/examples/bricks/WalletBrick/5-Marketplace.tsx
+++ b/examples/bricks/WalletBrick/5-Marketplace.tsx
@@ -1,12 +1,23 @@
 import React from 'react';
 import Wallet from '../../../src/bricks/wallet';
+import { PUBLIC_KEY } from '../../constants';
 
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83');
+initMercadoPago(PUBLIC_KEY);
+
+// Chech the API reference for more details about how to create the preferenceId
+// https://www.mercadopago.com.br/developers/en/reference/preferences/_checkout_preferences/post
 
 const ExampleWalletBrickMarketplace = () => {
-  return <Wallet initialization={{ preferenceId: '207446753-ea3adb2e-a4f2-41dd-a656-11cb01b8772c', marketplace: true }} />;
+  return (
+    <Wallet
+      initialization={{
+        preferenceId: '<PREFERENCE_ID>',
+        marketplace: true,
+      }}
+    />
+  );
 };
 
 export default ExampleWalletBrickMarketplace;
diff --git a/examples/bricks/WalletBrick/6-Custom-ContainerId.tsx b/examples/bricks/WalletBrick/6-Custom-ContainerId.tsx
new file mode 100644
index 0000000..e9319b7
--- /dev/null
+++ b/examples/bricks/WalletBrick/6-Custom-ContainerId.tsx
@@ -0,0 +1,15 @@
+import React from 'react';
+import Wallet from '../../../src/bricks/wallet';
+import { PUBLIC_KEY } from '../../constants';
+
+import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
+
+initMercadoPago(PUBLIC_KEY);
+
+const ExampleSimpleWalletBrick = () => {
+  return (
+    <Wallet initialization={{ preferenceId: 'YOUR_PREFERENCE_ID' }} id="custom-container-id" />
+  );
+};
+
+export default ExampleSimpleWalletBrick;
diff --git a/examples/constants.ts b/examples/constants.ts
new file mode 100644
index 0000000..95fc5ae
--- /dev/null
+++ b/examples/constants.ts
@@ -0,0 +1 @@
+export const PUBLIC_KEY = '<YOUR_PUBLIC_KEY>';
diff --git a/examples/secureFields/CardNumber/0-Simple.tsx b/examples/secureFields/CardNumber/0-Simple.tsx
index f59bdc7..34607b3 100644
--- a/examples/secureFields/CardNumber/0-Simple.tsx
+++ b/examples/secureFields/CardNumber/0-Simple.tsx
@@ -1,15 +1,16 @@
 import React from 'react';
 
+import { PUBLIC_KEY } from '../../constants';
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 import CardNumber from '../../../src/secureFields/cardNumber';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   return (
-    <CardNumber 
-      placeholder='Card Number'
-      style={{ fontFamily: "sans-serif" }}
+    <CardNumber
+      placeholder="Card Number"
+      style={{ fontFamily: 'sans-serif' }}
       onReady={(event) => console.log('Card number ready!!', event)}
       onError={(error) => console.log(error)}
     />
diff --git a/examples/secureFields/CardNumber/1-Update.tsx b/examples/secureFields/CardNumber/1-Update.tsx
index 7fa95da..c8c66c6 100644
--- a/examples/secureFields/CardNumber/1-Update.tsx
+++ b/examples/secureFields/CardNumber/1-Update.tsx
@@ -1,28 +1,29 @@
 import React, { useEffect, useState } from 'react';
 
+import { PUBLIC_KEY } from '../../constants';
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 import CardNumber from '../../../src/secureFields/cardNumber';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
-  const [text, setText] = useState('Card Number')
-  const [len, setLen] = useState(8)
+  const [text, setText] = useState('Card Number');
+  const [len, setLen] = useState(8);
 
-  useEffect(() => {   
+  useEffect(() => {
     setTimeout(() => {
-      console.log('Timeout 3000 - Placeholder and Length changed!')
-      setText('Placeholder')
-      setLen(10)
-    }, 3000)
-  }, [])
+      console.log('Timeout 3000 - Placeholder and Length changed!');
+      setText('Placeholder');
+      setLen(10);
+    }, 3000);
+  }, []);
 
   return (
     <CardNumber
       length={len}
       placeholder={text}
       style={{ fontFamily: 'Sigmar' }}
-      customFonts={[{src: 'https://fonts.googleapis.com/css2?family=Sigmar'}]}
+      customFonts={[{ src: 'https://fonts.googleapis.com/css2?family=Sigmar' }]}
       onReady={(event) => console.log('Card number ready!!', event)}
       onError={(error) => console.log(error)}
     />
diff --git a/examples/secureFields/ExpirationDate/0-Simple.tsx b/examples/secureFields/ExpirationDate/0-Simple.tsx
index 89192f7..bb87a5e 100644
--- a/examples/secureFields/ExpirationDate/0-Simple.tsx
+++ b/examples/secureFields/ExpirationDate/0-Simple.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
 
+import { PUBLIC_KEY } from '../../constants';
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 import ExpirationDate from '../../../src/secureFields/expirationDate';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 /**
  * IMPORTANT
@@ -13,11 +14,11 @@ initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' }
 const App = () => {
   return (
     <ExpirationDate
-      placeholder='Expiration Date'
-      style={{ fontFamily: "sans-serif" }}
+      placeholder="Expiration Date"
+      style={{ fontFamily: 'sans-serif' }}
       onReady={(event) => console.log('Expiration date ready!!', event)}
       onError={(error) => console.log(error)}
-      mode='full'
+      mode="full"
     />
   );
 };
diff --git a/examples/secureFields/ExpirationMonth/0-Simple.tsx b/examples/secureFields/ExpirationMonth/0-Simple.tsx
index 87f5c63..3195fe2 100644
--- a/examples/secureFields/ExpirationMonth/0-Simple.tsx
+++ b/examples/secureFields/ExpirationMonth/0-Simple.tsx
@@ -1,15 +1,16 @@
 import React from 'react';
 
+import { PUBLIC_KEY } from '../../constants';
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 import ExpirationMonth from '../../../src/secureFields/expirationMonth';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   return (
     <ExpirationMonth
-      placeholder='Expiration Month'
-      style={{ fontFamily: "sans-serif" }}
+      placeholder="Expiration Month"
+      style={{ fontFamily: 'sans-serif' }}
       onReady={(event) => console.log('Expiration month ready!!', event)}
       onError={(error) => console.log(error)}
     />
diff --git a/examples/secureFields/ExpirationYear/0-Simple.tsx b/examples/secureFields/ExpirationYear/0-Simple.tsx
index 532b23d..1a185b1 100644
--- a/examples/secureFields/ExpirationYear/0-Simple.tsx
+++ b/examples/secureFields/ExpirationYear/0-Simple.tsx
@@ -1,18 +1,19 @@
 import React from 'react';
 
+import { PUBLIC_KEY } from '../../constants';
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 import ExpirationYear from '../../../src/secureFields/expirationYear';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   return (
     <ExpirationYear
-      placeholder='Expiration Year'
-      style={{ fontFamily: "sans-serif" }}
+      placeholder="Expiration Year"
+      style={{ fontFamily: 'sans-serif' }}
       onReady={(event) => console.log('Expiration year ready!!', event)}
       onError={(error) => console.log(error)}
-      mode='short'
+      mode="short"
     />
   );
 };
diff --git a/examples/secureFields/GenerateCardToken/0-Simple.tsx b/examples/secureFields/GenerateCardToken/0-Simple.tsx
index fa59fe4..6f9786c 100644
--- a/examples/secureFields/GenerateCardToken/0-Simple.tsx
+++ b/examples/secureFields/GenerateCardToken/0-Simple.tsx
@@ -6,8 +6,9 @@ import {
   ExpirationDate,
   createCardToken,
 } from '../../../src';
+import { PUBLIC_KEY } from '../../constants';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83');
+initMercadoPago(PUBLIC_KEY);
 
 const App = () => {
   const cardToken = async () => {
diff --git a/examples/secureFields/SecurityCode/0-Simple.tsx b/examples/secureFields/SecurityCode/0-Simple.tsx
index 5f792e5..8036f4d 100644
--- a/examples/secureFields/SecurityCode/0-Simple.tsx
+++ b/examples/secureFields/SecurityCode/0-Simple.tsx
@@ -1,15 +1,16 @@
 import React from 'react';
 
+import { PUBLIC_KEY } from '../../constants';
 import initMercadoPago from '../../../src/mercadoPago/initMercadoPago';
 import SecurityCode from '../../../src/secureFields/securityCode';
 
-initMercadoPago('TEST-f4563544-ce69-40c3-b88e-6e7d1bd93a83', { locale: 'pt-BR' });
+initMercadoPago(PUBLIC_KEY, { locale: 'pt-BR' });
 
 const App = () => {
   return (
     <SecurityCode
-      placeholder='Security Code'
-      style={{ fontFamily: "sans-serif" }}
+      placeholder="Security Code"
+      style={{ fontFamily: 'sans-serif' }}
       onReady={(event) => console.log('Security code ready!!', event)}
       onError={(error) => console.log(error)}
     />
diff --git a/package-lock.json b/package-lock.json
index 62168ba..859c164 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@mercadopago/sdk-react",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@mercadopago/sdk-react",
-      "version": "0.0.19",
+      "version": "0.0.20",
       "license": "Apache-2.0",
       "dependencies": {
         "@mercadopago/sdk-js": "^0.0.3"
diff --git a/package.json b/package.json
index 9ab37f1..a55bb6b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mercadopago/sdk-react",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "description": "Mercado Pago SDK React",
   "main": "cjs/index.js",
   "module": "esm/index.js",
diff --git a/src/bricks/brand/index.tsx b/src/bricks/brand/index.tsx
index 08fef47..e6bc143 100644
--- a/src/bricks/brand/index.tsx
+++ b/src/bricks/brand/index.tsx
@@ -32,7 +32,6 @@ const Brand = ({
 }: TBrand) => {
   useEffect(() => {
     // Brand uses a debounce to prevent unnecessary reRenders.
-    let timer: ReturnType<typeof setTimeout>;
     const BrandBrickConfig = {
       settings: {
         customization,
@@ -42,11 +41,11 @@ const Brand = ({
         },
       },
       name: 'brand',
-      divId: id,
+      containerId: id,
       controller: 'brandBrickController',
     };
 
-    timer = setTimeout(() => {
+    const timer: ReturnType<typeof setTimeout> = setTimeout(() => {
       initBrick(BrandBrickConfig);
     }, DEBOUNCE_TIME_RENDER);
 
diff --git a/src/bricks/cardPayment/index.tsx b/src/bricks/cardPayment/index.tsx
index 92559b5..e8212bf 100644
--- a/src/bricks/cardPayment/index.tsx
+++ b/src/bricks/cardPayment/index.tsx
@@ -46,7 +46,6 @@ const CardPayment = ({
 }: TCardPayment) => {
   useEffect(() => {
     // CardPayment uses a debounce to prevent unnecessary reRenders.
-    let timer: ReturnType<typeof setTimeout>;
     const CardPaymentBrickConfig = {
       settings: {
         initialization,
@@ -60,10 +59,10 @@ const CardPayment = ({
         locale,
       },
       name: 'cardPayment',
-      divId: id,
+      containerId: id,
       controller: 'cardPaymentBrickController',
     };
-    timer = setTimeout(() => {
+    const timer: ReturnType<typeof setTimeout> = setTimeout(() => {
       initBrick(CardPaymentBrickConfig);
     }, DEBOUNCE_TIME_RENDER);
 
diff --git a/src/bricks/payment/index.tsx b/src/bricks/payment/index.tsx
index c91c107..a225f10 100644
--- a/src/bricks/payment/index.tsx
+++ b/src/bricks/payment/index.tsx
@@ -53,7 +53,6 @@ const Payment = ({
 }: TPaymentType) => {
   useEffect(() => {
     // Payment uses a debounce to prevent unnecessary reRenders.
-    let timer: ReturnType<typeof setTimeout>;
     const PaymentBrickController = {
       settings: {
         initialization,
@@ -71,10 +70,10 @@ const Payment = ({
         },
       },
       name: 'payment',
-      divId: id,
+      containerId: id,
       controller: 'paymentBrickController',
     };
-    timer = setTimeout(() => {
+    const timer: ReturnType<typeof setTimeout> = setTimeout(() => {
       initBrick(PaymentBrickController);
     }, DEBOUNCE_TIME_RENDER);
 
diff --git a/src/bricks/statusScreen/index.tsx b/src/bricks/statusScreen/index.tsx
index e6f341d..0314f7e 100644
--- a/src/bricks/statusScreen/index.tsx
+++ b/src/bricks/statusScreen/index.tsx
@@ -39,7 +39,6 @@ const StatusScreen = ({
 }: IStatusScreenBrickSettings) => {
   useEffect(() => {
     // Status Screen uses a debounce to prevent unnecessary reRenders.
-    let timer: ReturnType<typeof setTimeout>;
     const StatusScreenBrickConfig = {
       settings: {
         initialization,
@@ -51,10 +50,10 @@ const StatusScreen = ({
         },
       },
       name: 'statusScreen',
-      divId: id,
+      containerId: id,
       controller: 'statusScreenBrickController',
     };
-    timer = setTimeout(() => {
+    const timer: ReturnType<typeof setTimeout> = setTimeout(() => {
       initBrick(StatusScreenBrickConfig);
     }, DEBOUNCE_TIME_RENDER);
 
diff --git a/src/bricks/util/initial/index.ts b/src/bricks/util/initial/index.ts
index 535eb8a..bce4f95 100644
--- a/src/bricks/util/initial/index.ts
+++ b/src/bricks/util/initial/index.ts
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
 import { IBrickError } from '../types/common';
 
 const onSubmitDefault = async () => {};
diff --git a/src/bricks/util/initial/initial.test.ts b/src/bricks/util/initial/initial.test.ts
index 9690723..19131d8 100644
--- a/src/bricks/util/initial/initial.test.ts
+++ b/src/bricks/util/initial/initial.test.ts
@@ -3,7 +3,7 @@ import { onErrorDefault, onSubmitDefault, onReadyDefault } from './index';
 describe('Test default functions', () => {
   test('Console error should have been called when onErrorDefault is call', () => {
     // Mock the console.error to not generate a console.error when we run test.
-    const logSpy = jest.spyOn(global.console, 'error').mockImplementation(() => {});
+    const logSpy = jest.spyOn(global.console, 'error').mockImplementation(jest.fn());
     onErrorDefault({
       type: 'critical',
       cause: 'settings_empty',
@@ -15,10 +15,13 @@ describe('Test default functions', () => {
 
     logSpy.mockRestore();
   });
-  test('Should onSubmitDefault be called', () => {
-    expect(onSubmitDefault()).resolves.toBe({});
+
+  test('Should onSubmitDefault be called', async () => {
+    const response = await onSubmitDefault();
+    expect(response).toEqual(undefined);
   });
+
   test('Should onReadyDefault be called', () => {
-    expect(onReadyDefault()).toBe(undefined);
+    expect(onReadyDefault()).toEqual(undefined);
   });
 });
diff --git a/src/bricks/util/renderBrick/index.ts b/src/bricks/util/renderBrick/index.ts
index 133bfa9..1fe97ad 100644
--- a/src/bricks/util/renderBrick/index.ts
+++ b/src/bricks/util/renderBrick/index.ts
@@ -1,18 +1,23 @@
 import { MercadoPagoInstance } from '../../../mercadoPago/initMercadoPago';
 
 type TGenericRenderBrick = {
-  settings: any;
+  settings: Record<string, any>;
   name: string;
-  divId: string;
+  containerId: string;
   controller: string;
 };
-export const initBrick = async ({ settings, name, divId, controller }: TGenericRenderBrick) => {
+export const initBrick = async ({
+  settings,
+  name,
+  containerId,
+  controller,
+}: TGenericRenderBrick) => {
   const instanceMercadoPago = await MercadoPagoInstance.getInstance();
   const bricksBuilder = instanceMercadoPago?.bricks();
 
   (window as { [key: string]: any })[controller] = await bricksBuilder?.create(
     name,
-    divId,
+    containerId,
     settings,
   );
 };
diff --git a/src/bricks/util/renderBrick/renderBrick.test.ts b/src/bricks/util/renderBrick/renderBrick.test.ts
index c344fde..dd68fd0 100644
--- a/src/bricks/util/renderBrick/renderBrick.test.ts
+++ b/src/bricks/util/renderBrick/renderBrick.test.ts
@@ -1,6 +1,5 @@
-import { create } from 'domain';
 import { initBrick } from '.';
-import initMercadoPago, { MercadoPagoInstance } from '../../../mercadoPago/initMercadoPago';
+import { MercadoPagoInstance } from '../../../mercadoPago/initMercadoPago';
 
 declare global {
   interface Window {
@@ -10,24 +9,36 @@ declare global {
 
 describe('Test renderBrick', () => {
   test('should return a render Brick', async () => {
-    const mock = jest.fn();
+    const createMock = jest.fn();
     MercadoPagoInstance.publicKey = 'PUBLIC_KEY';
-    MercadoPagoInstance.instanceMercadoPago = {
+    MercadoPagoInstance.getInstance = jest.fn().mockResolvedValue({
       bricks: function () {
         return {
-          create: mock,
+          create: createMock,
         };
       },
-    };
+      getIdentificationTypes: jest.fn(),
+      getPaymentMethods: jest.fn(),
+      getIssuers: jest.fn(),
+      getInstallments: jest.fn(),
+      createCardToken: jest.fn(),
+      updateCardToken: jest.fn(),
+      fields: {
+        createCardToken: jest.fn(),
+        updateCardToken: jest.fn(),
+        create: jest.fn(),
+      },
+    });
 
     const WalletBrickConfig = {
       settings: {},
       name: 'brickTest',
-      divId: 'brickTest_container',
       controller: 'brickTestController',
+      containerId: 'brickTest_container',
     };
 
     await initBrick(WalletBrickConfig);
-    expect(mock).toBeCalledTimes(1);
+    expect(createMock).toHaveBeenCalledTimes(1);
+    expect(createMock).toHaveBeenCalledWith('brickTest', 'brickTest_container', {});
   });
 });
diff --git a/src/bricks/wallet/index.tsx b/src/bricks/wallet/index.tsx
index be600d0..d3a52a9 100644
--- a/src/bricks/wallet/index.tsx
+++ b/src/bricks/wallet/index.tsx
@@ -36,7 +36,7 @@ const Wallet = ({
 }: TWallet) => {
   useEffect(() => {
     // CardPayment uses a debounce to prevent unnecessary reRenders.
-    let timer: ReturnType<typeof setTimeout>;
+
     const WalletBrickConfig = {
       settings: {
         brand,
@@ -50,11 +50,11 @@ const Wallet = ({
         },
       },
       name: 'wallet',
-      divId: id,
+      containerId: id,
       controller: 'walletBrickController',
     };
 
-    timer = setTimeout(() => {
+    const timer: ReturnType<typeof setTimeout> = setTimeout(() => {
       initBrick(WalletBrickConfig);
     }, DEBOUNCE_TIME_RENDER);
 
diff --git a/src/bricks/wallet/walletBrick.test.tsx b/src/bricks/wallet/walletBrick.test.tsx
index 39e867b..dd7b2e2 100644
--- a/src/bricks/wallet/walletBrick.test.tsx
+++ b/src/bricks/wallet/walletBrick.test.tsx
@@ -12,6 +12,7 @@ describe('Test Wallet Brick Component', () => {
 
     expect(element.container.querySelector('#walletBrick_container')).toBeTruthy();
   });
+
   test('should found the id of Wallet Brick div if specified', async () => {
     MercadoPagoInstance.publicKey = 'PUBLIC_KEY';
     const element = await render(
diff --git a/src/mercadoPago/initMercadoPago/index.ts b/src/mercadoPago/initMercadoPago/index.ts
index d626a7d..1069642 100644
--- a/src/mercadoPago/initMercadoPago/index.ts
+++ b/src/mercadoPago/initMercadoPago/index.ts
@@ -5,7 +5,7 @@ export class MercadoPagoInstance {
   static publicKey: string | null = null;
   static options: TOptions = {};
   static instanceMercadoPago?: TInstanceMercadoPago = undefined;
-  static loadedInstanceMercadoPago: boolean = false;
+  static loadedInstanceMercadoPago = false;
 
   static async getInstance() {
     if (this.publicKey) {