From f8db5526047559095c0bfb77f0ea86a894f5719a Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Thu, 22 Feb 2024 11:59:50 -0300
Subject: [PATCH 01/10] style(carousel): change button color

---
 packages/core/src/components/carousel/carousel.scss | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/core/src/components/carousel/carousel.scss b/packages/core/src/components/carousel/carousel.scss
index 855dbb7cf..ac00aa54b 100644
--- a/packages/core/src/components/carousel/carousel.scss
+++ b/packages/core/src/components/carousel/carousel.scss
@@ -7,7 +7,7 @@
   border: 1px solid transparent;
   border-radius: var(--border-radius-full);
   box-shadow: var(--elevation-3);
-  color: var(--color-brand-secondary-dark-1);
+  color: var(--color-brand-secondary-regular);
   height: var(--spacing-medium);
   padding: var(--spacing-small);
   transition:
@@ -18,7 +18,7 @@
   will-change: border, box-shadow;
 
   &:hover {
-    border-color: var(--color-brand-secondary-dark-1);
+    border-color: var(--color-brand-secondary-regular);
   }
 }
 
@@ -64,4 +64,4 @@
   height: var(--spacing-giant);
   object-fit: contain;
   width: var(--spacing-giant);
-}
\ No newline at end of file
+}

From cc42bd33bb653caad9fb6695c3b3aa90dea09f7c Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Thu, 22 Feb 2024 12:00:36 -0300
Subject: [PATCH 02/10] style: centralize when item is smaller

---
 .../carousel/carousel-item/carousel-item.scss |  4 ++
 .../carousel/carousel-item/carousel-item.tsx  |  1 +
 .../stories/carousel.core.stories.tsx         | 40 +++++++++++++------
 .../src/components/carousel/stories/style.css |  9 +++++
 4 files changed, 41 insertions(+), 13 deletions(-)
 create mode 100644 packages/core/src/components/carousel/carousel-item/carousel-item.scss

diff --git a/packages/core/src/components/carousel/carousel-item/carousel-item.scss b/packages/core/src/components/carousel/carousel-item/carousel-item.scss
new file mode 100644
index 000000000..6d38761f6
--- /dev/null
+++ b/packages/core/src/components/carousel/carousel-item/carousel-item.scss
@@ -0,0 +1,4 @@
+.atom-carousel-item {
+  display: flex;
+  justify-content: center;
+}
diff --git a/packages/core/src/components/carousel/carousel-item/carousel-item.tsx b/packages/core/src/components/carousel/carousel-item/carousel-item.tsx
index 5f02df4d9..9f85fc647 100644
--- a/packages/core/src/components/carousel/carousel-item/carousel-item.tsx
+++ b/packages/core/src/components/carousel/carousel-item/carousel-item.tsx
@@ -1,6 +1,7 @@
 import { Component, Element, Host, h } from '@stencil/core'
 @Component({
   tag: 'atom-carousel-item',
+  styleUrl: 'carousel-item.scss',
   shadow: false,
 })
 export class AtomCarouselItem {
diff --git a/packages/core/src/components/carousel/stories/carousel.core.stories.tsx b/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
index 6362ec959..da0242547 100644
--- a/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
+++ b/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
@@ -41,19 +41,19 @@ const createComponent = (args, itemClass: string) => {
   ${args.loop !== undefined ? `loop="${args.loop}"` : ''}
   ${args.autoplay !== undefined ? `autoplay="${args.autoplay}"` : ''}
   ${args.speed !== undefined ? `speed="${args.speed}"` : ''} >
-    <atom-carousel-item ><div class="${itemClass}">Slide 1</div></atom-carousel-item>
-      <atom-carousel-item><div class="${itemClass}">Slide 2</div></atom-carousel-item>
-      <atom-carousel-item><div class="${itemClass}">Slide 3</div></atom-carousel-item>
-      <atom-carousel-item><div class="${itemClass}">Slide 4</div></atom-carousel-item>
-      <atom-carousel-item><div class="${itemClass}">Slide 5</div></atom-carousel-item>
-      <atom-carousel-item><div class="${itemClass}">Slide 6</div></atom-carousel-item>
-      <atom-carousel-item><div class="${itemClass}">Slide 7</div></atom-carousel-item>
-      <atom-carousel-item><div class="${itemClass}">Slide 8</div></atom-carousel-item>
-      <atom-carousel-item lazy="true">
-        <div class="${itemClass}">Slide 9
-          <img loading="lazy" width="100px" src="https://user-images.githubusercontent.com/3603793/257943112-fb180815-7bd7-45f7-ad14-bd1677079931.png"/>
-        </div>
-      </atom-carousel-item>
+    <atom-carousel-item><div class="${itemClass}">Slide 1</div></atom-carousel-item>
+    <atom-carousel-item><div class="${itemClass}">Slide 2</div></atom-carousel-item>
+    <atom-carousel-item><div class="${itemClass}">Slide 3</div></atom-carousel-item>
+    <atom-carousel-item><div class="${itemClass}">Slide 4</div></atom-carousel-item>
+    <atom-carousel-item><div class="${itemClass}">Slide 5</div></atom-carousel-item>
+    <atom-carousel-item><div class="${itemClass}">Slide 6</div></atom-carousel-item>
+    <atom-carousel-item><div class="${itemClass}">Slide 7</div></atom-carousel-item>
+    <atom-carousel-item><div class="${itemClass}">Slide 8</div></atom-carousel-item>
+    <atom-carousel-item lazy="true">
+      <div class="${itemClass}">Slide 9
+        <img loading="lazy" width="100px" src="https://user-images.githubusercontent.com/3603793/257943112-fb180815-7bd7-45f7-ad14-bd1677079931.png"/>
+      </div>
+    </atom-carousel-item>
   </atom-carousel>
   <script>
   const  atomCarousel${carouselStoryId} = document.querySelector('atom-carousel#carousel-${carouselStoryId}');
@@ -115,3 +115,17 @@ export const PaginationType: StoryObj = {
       'item-pag-type'
     ),
 }
+
+export const CenterItemContent: StoryObj = {
+  render: () =>
+    createComponent(
+      {
+        pagination: true,
+        slidesPerView: 1,
+        spaceBetween: 40,
+        paginationClickable: true,
+      },
+      'item-smaller'
+    ),
+}
+
diff --git a/packages/core/src/components/carousel/stories/style.css b/packages/core/src/components/carousel/stories/style.css
index c1388a84d..4ca3dfe5b 100644
--- a/packages/core/src/components/carousel/stories/style.css
+++ b/packages/core/src/components/carousel/stories/style.css
@@ -24,3 +24,12 @@
   justify-content: center;
   width: 100% !important;
 }
+
+.item-smaller {
+  align-items: center;
+  background: coral;
+  display: flex;
+  height: 400px;
+  justify-content: center;
+  width: 250px;
+}

From 5190ef79de65b01d11a4208636a59dad115195bf Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Thu, 22 Feb 2024 12:01:18 -0300
Subject: [PATCH 03/10] chore: update version

---
 package-lock.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index b24336df8..f0d869f0a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -31885,7 +31885,7 @@
     },
     "packages/core": {
       "name": "@juntossomosmais/atomium",
-      "version": "1.11.0"
+      "version": "1.12.1"
     },
     "packages/icons": {
       "name": "@juntossomosmais/atomium-icons"

From 538f9753d69d0f04839ace922cedfbd68bf4d6f7 Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Thu, 22 Feb 2024 15:30:44 -0300
Subject: [PATCH 04/10] style: start all sccs files with utils

---
 packages/core/src/components/badge/badge.scss                   | 2 ++
 packages/core/src/components/button/button.scss                 | 2 ++
 .../src/components/carousel/carousel-item/carousel-item.scss    | 2 ++
 packages/core/src/components/carousel/carousel.scss             | 1 +
 packages/core/src/components/chip/chip.scss                     | 2 ++
 packages/core/src/components/grid/grid.scss                     | 2 ++
 packages/core/src/components/input/input.scss                   | 2 ++
 packages/core/src/components/select/select.scss                 | 2 ++
 packages/core/src/components/tag/tag.scss                       | 2 ++
 packages/core/src/components/textarea/textarea.scss             | 2 ++
 10 files changed, 19 insertions(+)

diff --git a/packages/core/src/components/badge/badge.scss b/packages/core/src/components/badge/badge.scss
index 04cc1ad4d..62e7bc18c 100644
--- a/packages/core/src/components/badge/badge.scss
+++ b/packages/core/src/components/badge/badge.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 :host {
   line-height: 0;
 }
diff --git a/packages/core/src/components/button/button.scss b/packages/core/src/components/button/button.scss
index 9ec4f62a4..1c506d18a 100644
--- a/packages/core/src/components/button/button.scss
+++ b/packages/core/src/components/button/button.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 :host {
   display: inline-block;
 }
diff --git a/packages/core/src/components/carousel/carousel-item/carousel-item.scss b/packages/core/src/components/carousel/carousel-item/carousel-item.scss
index 6d38761f6..52392ceda 100644
--- a/packages/core/src/components/carousel/carousel-item/carousel-item.scss
+++ b/packages/core/src/components/carousel/carousel-item/carousel-item.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 .atom-carousel-item {
   display: flex;
   justify-content: center;
diff --git a/packages/core/src/components/carousel/carousel.scss b/packages/core/src/components/carousel/carousel.scss
index ac00aa54b..1e76c887e 100644
--- a/packages/core/src/components/carousel/carousel.scss
+++ b/packages/core/src/components/carousel/carousel.scss
@@ -1,3 +1,4 @@
+@import '~@atomium/scss-utils/index';
 @import '~swiper/swiper-bundle.css';
 @import '~swiper/swiper.css';
 
diff --git a/packages/core/src/components/chip/chip.scss b/packages/core/src/components/chip/chip.scss
index d685429c0..ac47b0e69 100644
--- a/packages/core/src/components/chip/chip.scss
+++ b/packages/core/src/components/chip/chip.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 :host {
   --icon-size: var(--spacing-base);
   display: inline-flex;
diff --git a/packages/core/src/components/grid/grid.scss b/packages/core/src/components/grid/grid.scss
index be071d8a5..bad6a47b9 100644
--- a/packages/core/src/components/grid/grid.scss
+++ b/packages/core/src/components/grid/grid.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 .atom-grid {
   display: flex;
   flex-wrap: wrap;
diff --git a/packages/core/src/components/input/input.scss b/packages/core/src/components/input/input.scss
index 702bf64e4..2ee1add1a 100644
--- a/packages/core/src/components/input/input.scss
+++ b/packages/core/src/components/input/input.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 :host {
   --atom-icon-color: var(--color-neutral-regular);
   --atom-icon-grid: var(--spacing-xxxxlarge);
diff --git a/packages/core/src/components/select/select.scss b/packages/core/src/components/select/select.scss
index 79b2bc8c1..961cd0bf5 100644
--- a/packages/core/src/components/select/select.scss
+++ b/packages/core/src/components/select/select.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 :host {
   --atom-icon-color: var(--color-neutral-regular);
   --atom-icon-grid: var(--spacing-xxxxlarge);
diff --git a/packages/core/src/components/tag/tag.scss b/packages/core/src/components/tag/tag.scss
index fec0c110c..dd30396d2 100644
--- a/packages/core/src/components/tag/tag.scss
+++ b/packages/core/src/components/tag/tag.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 :host {
   --icon-size: var(--spacing-small);
   --atom-tag-height: 10px;
diff --git a/packages/core/src/components/textarea/textarea.scss b/packages/core/src/components/textarea/textarea.scss
index cdbd8728f..8044f3e53 100644
--- a/packages/core/src/components/textarea/textarea.scss
+++ b/packages/core/src/components/textarea/textarea.scss
@@ -1,3 +1,5 @@
+@import '~@atomium/scss-utils/index';
+
 :host {
   --atom-icon-color: var(--color-neutral-regular);
   --atom-icon-grid: var(--spacing-xxxxlarge);

From aba8dcbc57ad014e830c482318c49e8b005d6d3d Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Thu, 22 Feb 2024 16:55:38 -0300
Subject: [PATCH 05/10] feat: update puppeter

---
 package-lock.json | 363 ++++++++++++++++++++++++++++++++--------------
 package.json      |   2 +-
 2 files changed, 253 insertions(+), 112 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f0d869f0a..c63b23d62 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -68,7 +68,7 @@
         "postcss-scss": "^4.0.6",
         "prettier": "3.0.0",
         "prop-types": "^15.8.1",
-        "puppeteer": "^21.5.2",
+        "puppeteer": "^22.2.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "rollup": "^3.26.3",
@@ -5384,15 +5384,17 @@
       }
     },
     "node_modules/@puppeteer/browsers": {
-      "version": "1.8.0",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-2.1.0.tgz",
+      "integrity": "sha512-xloWvocjvryHdUjDam/ZuGMh7zn4Sn3ZAaV4Ah2e2EwEt90N3XphZlSsU3n0VDc1F7kggCjMuH0UuxfPQ5mD9w==",
       "dev": true,
-      "license": "Apache-2.0",
       "dependencies": {
         "debug": "4.3.4",
         "extract-zip": "2.0.1",
         "progress": "2.0.3",
-        "proxy-agent": "6.3.1",
-        "tar-fs": "3.0.4",
+        "proxy-agent": "6.4.0",
+        "semver": "7.6.0",
+        "tar-fs": "3.0.5",
         "unbzip2-stream": "1.4.3",
         "yargs": "17.7.2"
       },
@@ -5400,9 +5402,42 @@
         "browsers": "lib/cjs/main-cli.js"
       },
       "engines": {
-        "node": ">=16.3.0"
+        "node": ">=18"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dev": true,
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
       }
     },
+    "node_modules/@puppeteer/browsers/node_modules/semver": {
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "dev": true,
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true
+    },
     "node_modules/@radix-ui/number": {
       "version": "1.0.1",
       "dev": true,
@@ -9837,8 +9872,9 @@
     },
     "node_modules/@tootallnate/quickjs-emscripten": {
       "version": "0.23.0",
-      "dev": true,
-      "license": "MIT"
+      "resolved": "https://registry.npmjs.org/@tootallnate/quickjs-emscripten/-/quickjs-emscripten-0.23.0.tgz",
+      "integrity": "sha512-C5Mc6rdnsaJDjO3UpGW/CQTHtCKaYlScZTly4JIu97Jxo/odCiH0ITnDXSJPTOrEKk/ycSZ0AOgTmkDtkOsvIA==",
+      "dev": true
     },
     "node_modules/@trysound/sax": {
       "version": "0.2.0",
@@ -10263,8 +10299,9 @@
     },
     "node_modules/@types/yauzl": {
       "version": "2.10.3",
+      "resolved": "https://registry.npmjs.org/@types/yauzl/-/yauzl-2.10.3.tgz",
+      "integrity": "sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q==",
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "dependencies": {
         "@types/node": "*"
@@ -11610,9 +11647,10 @@
       }
     },
     "node_modules/b4a": {
-      "version": "1.6.4",
-      "dev": true,
-      "license": "ISC"
+      "version": "1.6.6",
+      "resolved": "https://registry.npmjs.org/b4a/-/b4a-1.6.6.tgz",
+      "integrity": "sha512-5Tk1HLk6b6ctmjIkAcU/Ujv/1WqiDl0F0JdRCR80VsOcUlHcu7pWeWRlOqQLHfDEsVx9YH/aif5AG4ehoCtTmg==",
+      "dev": true
     },
     "node_modules/babel-core": {
       "version": "7.0.0-bridge.0",
@@ -12034,6 +12072,43 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/bare-events": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.2.0.tgz",
+      "integrity": "sha512-Yyyqff4PIFfSuthCZqLlPISTWHmnQxoPuAvkmgzsJEmG3CesdIv6Xweayl0JkCZJSB2yYIdJyEz97tpxNhgjbg==",
+      "dev": true,
+      "optional": true
+    },
+    "node_modules/bare-fs": {
+      "version": "2.1.5",
+      "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-2.1.5.tgz",
+      "integrity": "sha512-5t0nlecX+N2uJqdxe9d18A98cp2u9BETelbjKpiVgQqzzmVNFYWEAjQHqS+2Khgto1vcwhik9cXucaj5ve2WWA==",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "bare-events": "^2.0.0",
+        "bare-os": "^2.0.0",
+        "bare-path": "^2.0.0",
+        "streamx": "^2.13.0"
+      }
+    },
+    "node_modules/bare-os": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-2.2.0.tgz",
+      "integrity": "sha512-hD0rOPfYWOMpVirTACt4/nK8mC55La12K5fY1ij8HAdfQakD62M+H4o4tpfKzVGLgRDTuk3vjA4GqGXXCeFbag==",
+      "dev": true,
+      "optional": true
+    },
+    "node_modules/bare-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/bare-path/-/bare-path-2.1.0.tgz",
+      "integrity": "sha512-DIIg7ts8bdRKwJRJrUMy/PICEaQZaPGZ26lsSx9MJSwIhSrcdHn7/C8W+XmnG/rKi6BaRcz+JO00CjZteybDtw==",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "bare-os": "^2.1.0"
+      }
+    },
     "node_modules/base": {
       "version": "0.11.2",
       "dev": true,
@@ -12082,9 +12157,10 @@
       "license": "MIT"
     },
     "node_modules/basic-ftp": {
-      "version": "5.0.3",
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/basic-ftp/-/basic-ftp-5.0.4.tgz",
+      "integrity": "sha512-8PzkB0arJFV4jJWSGOYR+OEic6aeKMu/osRhBULN6RY0ykby6LKhbmuQ5ublvaas5BOwboah5D87nrHyuh8PPA==",
       "dev": true,
-      "license": "MIT",
       "engines": {
         "node": ">=10.0.0"
       }
@@ -12618,12 +12694,13 @@
       }
     },
     "node_modules/chromium-bidi": {
-      "version": "0.4.33",
+      "version": "0.5.9",
+      "resolved": "https://registry.npmjs.org/chromium-bidi/-/chromium-bidi-0.5.9.tgz",
+      "integrity": "sha512-wOTX3m2zuHX0zRX4h7Ol1DAGz0cqHzo2IrAPvOqBxdd4ZR32vxg4FKNjmBihi1oP9b1QGSBBG5VNUUXUCsxDfg==",
       "dev": true,
-      "license": "Apache-2.0",
       "dependencies": {
         "mitt": "3.0.1",
-        "urlpattern-polyfill": "9.0.0"
+        "urlpattern-polyfill": "10.0.0"
       },
       "peerDependencies": {
         "devtools-protocol": "*"
@@ -14107,8 +14184,9 @@
     },
     "node_modules/cross-fetch": {
       "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-4.0.0.tgz",
+      "integrity": "sha512-e4a5N8lVvuLgAWgnCrLr2PP0YyDOTHa9H/Rj54dirp61qXnNq46m82bRhNqIA5VccJtWBvPTFRV3TtvHUKPB1g==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "node-fetch": "^2.6.12"
       }
@@ -14406,9 +14484,10 @@
       }
     },
     "node_modules/data-uri-to-buffer": {
-      "version": "6.0.1",
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-6.0.2.tgz",
+      "integrity": "sha512-7hvf7/GW8e86rW0ptuwS3OcBGDjIi6SZva7hCyWC0yYry2cOPmLIjXAUHI6DK2HsnwJd9ifmt57i8eV2n4YNpw==",
       "dev": true,
-      "license": "MIT",
       "engines": {
         "node": ">= 14"
       }
@@ -14602,8 +14681,9 @@
     },
     "node_modules/degenerator": {
       "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/degenerator/-/degenerator-5.0.1.tgz",
+      "integrity": "sha512-TllpMR/t0M5sqCXfj85i4XaAzxmS5tVA16dqvdkMwGmzI+dXLXnw3J+3Vdv7VKw+ThlTMboK6i9rnZ6Nntj5CQ==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "ast-types": "^0.13.4",
         "escodegen": "^2.1.0",
@@ -14615,8 +14695,9 @@
     },
     "node_modules/degenerator/node_modules/ast-types": {
       "version": "0.13.4",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.13.4.tgz",
+      "integrity": "sha512-x1FCFnFifvYDDzTaLII71vG5uvDwgtmDTEVWAxrgeiR8VjMONcCXJx7E+USjDtHlwFmt9MysbqgF9b9Vjr6w+w==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "tslib": "^2.0.1"
       },
@@ -14729,9 +14810,10 @@
       }
     },
     "node_modules/devtools-protocol": {
-      "version": "0.0.1203626",
-      "dev": true,
-      "license": "BSD-3-Clause"
+      "version": "0.0.1249869",
+      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1249869.tgz",
+      "integrity": "sha512-Ctp4hInA0BEavlUoRy9mhGq0i+JSo/AwVyX2EFgZmV1kYB+Zq+EMBAn52QWu6FbRr10hRb6pBl420upbp4++vg==",
+      "dev": true
     },
     "node_modules/diff": {
       "version": "5.1.0",
@@ -16185,8 +16267,9 @@
     },
     "node_modules/extract-zip": {
       "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-2.0.1.tgz",
+      "integrity": "sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==",
       "dev": true,
-      "license": "BSD-2-Clause",
       "dependencies": {
         "debug": "^4.1.1",
         "get-stream": "^5.1.0",
@@ -16204,8 +16287,9 @@
     },
     "node_modules/extract-zip/node_modules/get-stream": {
       "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz",
+      "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "pump": "^3.0.0"
       },
@@ -16223,8 +16307,9 @@
     },
     "node_modules/fast-fifo": {
       "version": "1.3.2",
-      "dev": true,
-      "license": "MIT"
+      "resolved": "https://registry.npmjs.org/fast-fifo/-/fast-fifo-1.3.2.tgz",
+      "integrity": "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==",
+      "dev": true
     },
     "node_modules/fast-glob": {
       "version": "3.2.7",
@@ -17057,46 +17142,32 @@
       }
     },
     "node_modules/get-uri": {
-      "version": "6.0.2",
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/get-uri/-/get-uri-6.0.3.tgz",
+      "integrity": "sha512-BzUrJBS9EcUb4cFol8r4W3v1cPsSyajLSthNkz5BxbpDcHN5tIrM10E2eNvfnvBn3DaT3DUgx0OpsBKkaOpanw==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "basic-ftp": "^5.0.2",
-        "data-uri-to-buffer": "^6.0.0",
+        "data-uri-to-buffer": "^6.0.2",
         "debug": "^4.3.4",
-        "fs-extra": "^8.1.0"
+        "fs-extra": "^11.2.0"
       },
       "engines": {
         "node": ">= 14"
       }
     },
     "node_modules/get-uri/node_modules/fs-extra": {
-      "version": "8.1.0",
+      "version": "11.2.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz",
+      "integrity": "sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "graceful-fs": "^4.2.0",
-        "jsonfile": "^4.0.0",
-        "universalify": "^0.1.0"
+        "jsonfile": "^6.0.1",
+        "universalify": "^2.0.0"
       },
       "engines": {
-        "node": ">=6 <7 || >=8"
-      }
-    },
-    "node_modules/get-uri/node_modules/jsonfile": {
-      "version": "4.0.0",
-      "dev": true,
-      "license": "MIT",
-      "optionalDependencies": {
-        "graceful-fs": "^4.1.6"
-      }
-    },
-    "node_modules/get-uri/node_modules/universalify": {
-      "version": "0.1.2",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 4.0.0"
+        "node": ">=14.14"
       }
     },
     "node_modules/get-value": {
@@ -18119,11 +18190,6 @@
         "@stencil/core": "^4.0.3"
       }
     },
-    "node_modules/ip": {
-      "version": "1.1.8",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/ipaddr.js": {
       "version": "1.9.1",
       "dev": true,
@@ -24458,8 +24524,9 @@
     },
     "node_modules/mitt": {
       "version": "3.0.1",
-      "dev": true,
-      "license": "MIT"
+      "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
+      "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==",
+      "dev": true
     },
     "node_modules/mixin-deep": {
       "version": "1.3.2",
@@ -24565,8 +24632,9 @@
     },
     "node_modules/netmask": {
       "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/netmask/-/netmask-2.0.2.tgz",
+      "integrity": "sha512-dBpDMdxv9Irdq66304OLfEmQ9tbNRFnFTuZiLo+bD+r332bBmMJ8GBLXklIXXgxd3+v9+KUnZaUR5PJMa75Gsg==",
       "dev": true,
-      "license": "MIT",
       "engines": {
         "node": ">= 0.4.0"
       }
@@ -25799,8 +25867,9 @@
     },
     "node_modules/pac-proxy-agent": {
       "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/pac-proxy-agent/-/pac-proxy-agent-7.0.1.tgz",
+      "integrity": "sha512-ASV8yU4LLKBAjqIPMbrgtaKIvxQri/yh2OpI+S6hVa9JRkUI3Y3NPFbfngDtY7oFtSMD3w31Xns89mDa3Feo5A==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "@tootallnate/quickjs-emscripten": "^0.23.0",
         "agent-base": "^7.0.2",
@@ -25817,8 +25886,9 @@
     },
     "node_modules/pac-proxy-agent/node_modules/agent-base": {
       "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
+      "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "debug": "^4.3.4"
       },
@@ -25827,9 +25897,10 @@
       }
     },
     "node_modules/pac-proxy-agent/node_modules/http-proxy-agent": {
-      "version": "7.0.0",
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
+      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "agent-base": "^7.1.0",
         "debug": "^4.3.4"
@@ -25839,9 +25910,10 @@
       }
     },
     "node_modules/pac-proxy-agent/node_modules/https-proxy-agent": {
-      "version": "7.0.2",
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.4.tgz",
+      "integrity": "sha512-wlwpilI7YdjSkWaQ/7omYBMTliDcmCN8OLihO6I9B86g06lMyAoqgoDpV0XqoaPOKj+0DIdAvnsWfyAAhmimcg==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "agent-base": "^7.0.2",
         "debug": "4"
@@ -25852,8 +25924,9 @@
     },
     "node_modules/pac-proxy-agent/node_modules/socks-proxy-agent": {
       "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/socks-proxy-agent/-/socks-proxy-agent-8.0.2.tgz",
+      "integrity": "sha512-8zuqoLv1aP/66PHF5TqwJ7Czm3Yv32urJQHrVyhD7mmA6d61Zv8cIXQYPTWwmg6qlupnPvs/QKDmfa4P/qct2g==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "agent-base": "^7.0.2",
         "debug": "^4.3.4",
@@ -25864,12 +25937,12 @@
       }
     },
     "node_modules/pac-resolver": {
-      "version": "7.0.0",
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/pac-resolver/-/pac-resolver-7.0.1.tgz",
+      "integrity": "sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "degenerator": "^5.0.0",
-        "ip": "^1.1.8",
         "netmask": "^2.0.2"
       },
       "engines": {
@@ -26876,14 +26949,15 @@
       }
     },
     "node_modules/proxy-agent": {
-      "version": "6.3.1",
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/proxy-agent/-/proxy-agent-6.4.0.tgz",
+      "integrity": "sha512-u0piLU+nCOHMgGjRbimiXmA9kM/L9EHh3zL81xCdp7m+Y2pHIsnmbdDoEDoAz5geaonNR6q6+yOPQs6n4T6sBQ==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "agent-base": "^7.0.2",
         "debug": "^4.3.4",
-        "http-proxy-agent": "^7.0.0",
-        "https-proxy-agent": "^7.0.2",
+        "http-proxy-agent": "^7.0.1",
+        "https-proxy-agent": "^7.0.3",
         "lru-cache": "^7.14.1",
         "pac-proxy-agent": "^7.0.1",
         "proxy-from-env": "^1.1.0",
@@ -26895,8 +26969,9 @@
     },
     "node_modules/proxy-agent/node_modules/agent-base": {
       "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
+      "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "debug": "^4.3.4"
       },
@@ -26905,9 +26980,10 @@
       }
     },
     "node_modules/proxy-agent/node_modules/http-proxy-agent": {
-      "version": "7.0.0",
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
+      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "agent-base": "^7.1.0",
         "debug": "^4.3.4"
@@ -26917,9 +26993,10 @@
       }
     },
     "node_modules/proxy-agent/node_modules/https-proxy-agent": {
-      "version": "7.0.2",
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.4.tgz",
+      "integrity": "sha512-wlwpilI7YdjSkWaQ/7omYBMTliDcmCN8OLihO6I9B86g06lMyAoqgoDpV0XqoaPOKj+0DIdAvnsWfyAAhmimcg==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "agent-base": "^7.0.2",
         "debug": "4"
@@ -26930,16 +27007,18 @@
     },
     "node_modules/proxy-agent/node_modules/lru-cache": {
       "version": "7.18.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-7.18.3.tgz",
+      "integrity": "sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA==",
       "dev": true,
-      "license": "ISC",
       "engines": {
         "node": ">=12"
       }
     },
     "node_modules/proxy-agent/node_modules/socks-proxy-agent": {
       "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/socks-proxy-agent/-/socks-proxy-agent-8.0.2.tgz",
+      "integrity": "sha512-8zuqoLv1aP/66PHF5TqwJ7Czm3Yv32urJQHrVyhD7mmA6d61Zv8cIXQYPTWwmg6qlupnPvs/QKDmfa4P/qct2g==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "agent-base": "^7.0.2",
         "debug": "^4.3.4",
@@ -26996,39 +27075,45 @@
       }
     },
     "node_modules/puppeteer": {
-      "version": "21.5.2",
+      "version": "22.2.0",
+      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.2.0.tgz",
+      "integrity": "sha512-0Ax7zeqqbQL6Zcpo1WAvrqWQAnGsLB4tmQUUwsb5Cfo05XaQ78LWUUjaO4um7qaddKpZfk0vXlGcRVwtedpWfg==",
       "dev": true,
       "hasInstallScript": true,
-      "license": "Apache-2.0",
       "dependencies": {
-        "@puppeteer/browsers": "1.8.0",
-        "cosmiconfig": "8.3.6",
-        "puppeteer-core": "21.5.2"
+        "@puppeteer/browsers": "2.1.0",
+        "cosmiconfig": "9.0.0",
+        "puppeteer-core": "22.2.0"
+      },
+      "bin": {
+        "puppeteer": "lib/esm/puppeteer/node/cli.js"
       },
       "engines": {
-        "node": ">=16.13.2"
+        "node": ">=18"
       }
     },
     "node_modules/puppeteer-core": {
-      "version": "21.5.2",
+      "version": "22.2.0",
+      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.2.0.tgz",
+      "integrity": "sha512-rxLM860FP05CxCPAn6dwY0KnVhbnogsXu4XORb+2hb/va69v7R1VdJWLMGHd7EE5wfpT8oFZ7Q6NN85OhOtV9Q==",
       "dev": true,
-      "license": "Apache-2.0",
       "dependencies": {
-        "@puppeteer/browsers": "1.8.0",
-        "chromium-bidi": "0.4.33",
+        "@puppeteer/browsers": "2.1.0",
+        "chromium-bidi": "0.5.9",
         "cross-fetch": "4.0.0",
         "debug": "4.3.4",
-        "devtools-protocol": "0.0.1203626",
-        "ws": "8.14.2"
+        "devtools-protocol": "0.0.1249869",
+        "ws": "8.16.0"
       },
       "engines": {
-        "node": ">=16.13.2"
+        "node": ">=18"
       }
     },
     "node_modules/puppeteer-core/node_modules/ws": {
-      "version": "8.14.2",
+      "version": "8.16.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz",
+      "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==",
       "dev": true,
-      "license": "MIT",
       "engines": {
         "node": ">=10.0.0"
       },
@@ -27045,6 +27130,50 @@
         }
       }
     },
+    "node_modules/puppeteer/node_modules/argparse": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+      "dev": true
+    },
+    "node_modules/puppeteer/node_modules/cosmiconfig": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
+      "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
+      "dev": true,
+      "dependencies": {
+        "env-paths": "^2.2.1",
+        "import-fresh": "^3.3.0",
+        "js-yaml": "^4.1.0",
+        "parse-json": "^5.2.0"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/d-fischer"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.9.5"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/puppeteer/node_modules/js-yaml": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
+      "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
+      "dev": true,
+      "dependencies": {
+        "argparse": "^2.0.1"
+      },
+      "bin": {
+        "js-yaml": "bin/js-yaml.js"
+      }
+    },
     "node_modules/pure-rand": {
       "version": "6.0.4",
       "dev": true,
@@ -27109,8 +27238,9 @@
     },
     "node_modules/queue-tick": {
       "version": "1.0.1",
-      "dev": true,
-      "license": "MIT"
+      "resolved": "https://registry.npmjs.org/queue-tick/-/queue-tick-1.0.1.tgz",
+      "integrity": "sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==",
+      "dev": true
     },
     "node_modules/quick-lru": {
       "version": "4.0.1",
@@ -29011,12 +29141,16 @@
       "license": "MIT"
     },
     "node_modules/streamx": {
-      "version": "2.15.5",
+      "version": "2.16.1",
+      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.16.1.tgz",
+      "integrity": "sha512-m9QYj6WygWyWa3H1YY69amr4nVgy61xfjys7xO7kviL5rfIEc2naf+ewFiOA+aEJD7y0JO3h2GoiUv4TDwEGzQ==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "fast-fifo": "^1.1.0",
         "queue-tick": "^1.0.1"
+      },
+      "optionalDependencies": {
+        "bare-events": "^2.2.0"
       }
     },
     "node_modules/string_decoder": {
@@ -29885,19 +30019,24 @@
       }
     },
     "node_modules/tar-fs": {
-      "version": "3.0.4",
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.5.tgz",
+      "integrity": "sha512-JOgGAmZyMgbqpLwct7ZV8VzkEB6pxXFBVErLtb+XCOqzc6w1xiWKI9GVd6bwk68EX7eJ4DWmfXVmq8K2ziZTGg==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
-        "mkdirp-classic": "^0.5.2",
         "pump": "^3.0.0",
         "tar-stream": "^3.1.5"
+      },
+      "optionalDependencies": {
+        "bare-fs": "^2.1.1",
+        "bare-path": "^2.1.0"
       }
     },
     "node_modules/tar-fs/node_modules/tar-stream": {
-      "version": "3.1.6",
+      "version": "3.1.7",
+      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.7.tgz",
+      "integrity": "sha512-qJj60CXt7IU1Ffyc3NJMjh6EkuCFej46zUqJ4J7pqYlThyd9bO0XBTmcOIhSzZJVWfsLks0+nle/j538YAW9RQ==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "b4a": "^1.6.4",
         "fast-fifo": "^1.2.0",
@@ -30690,8 +30829,9 @@
     },
     "node_modules/unbzip2-stream": {
       "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.4.3.tgz",
+      "integrity": "sha512-mlExGW4w71ebDJviH16lQLtZS32VKqsSfk80GCfUlwT/4/hNRFsoscrF/c++9xinkMzECL1uL9DDwXqFWkruPg==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "buffer": "^5.2.1",
         "through": "^2.3.8"
@@ -31052,9 +31192,10 @@
       "license": "MIT"
     },
     "node_modules/urlpattern-polyfill": {
-      "version": "9.0.0",
-      "dev": true,
-      "license": "MIT"
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/urlpattern-polyfill/-/urlpattern-polyfill-10.0.0.tgz",
+      "integrity": "sha512-H/A06tKD7sS1O1X2SshBVeA5FLycRpjqiBeqGKmBwBDBy28EnRjORxTNe269KSSr5un5qyWi1iL61wLxpd+ZOg==",
+      "dev": true
     },
     "node_modules/use": {
       "version": "3.1.1",
diff --git a/package.json b/package.json
index 7226b71f0..4b0907204 100644
--- a/package.json
+++ b/package.json
@@ -84,7 +84,7 @@
     "postcss-scss": "^4.0.6",
     "prettier": "3.0.0",
     "prop-types": "^15.8.1",
-    "puppeteer": "^21.5.2",
+    "puppeteer": "^22.2.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "rollup": "^3.26.3",

From 0aa3a860259848f4c4c552aa7343e7145d50860d Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Fri, 23 Feb 2024 18:24:13 -0300
Subject: [PATCH 06/10] chore: use centered prop

---
 packages/core/src/components.d.ts               |  2 ++
 .../carousel/carousel-item/carousel-item.scss   |  3 +--
 .../core/src/components/carousel/carousel.tsx   |  3 +++
 .../carousel/stories/carousel.core.stories.tsx  | 17 ++++++++++++-----
 .../src/components/carousel/stories/style.css   |  8 ++++----
 5 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts
index 3fd6e61ff..a2da80cfb 100644
--- a/packages/core/src/components.d.ts
+++ b/packages/core/src/components.d.ts
@@ -54,6 +54,7 @@ export namespace Components {
         "autoplay"?: boolean;
         "autoplayDelay"?: AutoplayOptions['delay'];
         "centerInsufficientSlides"?: boolean;
+        "centeredSlides"?: boolean;
         "freeMode"?: boolean;
         "loop"?: boolean;
         "navigation"?: boolean;
@@ -498,6 +499,7 @@ declare namespace LocalJSX {
         "autoplay"?: boolean;
         "autoplayDelay"?: AutoplayOptions['delay'];
         "centerInsufficientSlides"?: boolean;
+        "centeredSlides"?: boolean;
         "freeMode"?: boolean;
         "loop"?: boolean;
         "navigation"?: boolean;
diff --git a/packages/core/src/components/carousel/carousel-item/carousel-item.scss b/packages/core/src/components/carousel/carousel-item/carousel-item.scss
index 52392ceda..0414161c1 100644
--- a/packages/core/src/components/carousel/carousel-item/carousel-item.scss
+++ b/packages/core/src/components/carousel/carousel-item/carousel-item.scss
@@ -1,6 +1,5 @@
 @import '~@atomium/scss-utils/index';
 
 .atom-carousel-item {
-  display: flex;
-  justify-content: center;
+  width: fit-content;
 }
diff --git a/packages/core/src/components/carousel/carousel.tsx b/packages/core/src/components/carousel/carousel.tsx
index fcbdd1ca5..613736c1c 100644
--- a/packages/core/src/components/carousel/carousel.tsx
+++ b/packages/core/src/components/carousel/carousel.tsx
@@ -32,6 +32,8 @@ export class AtomCarousel {
   @Prop({ mutable: true })
   autoplayDelay?: AutoplayOptions['delay']
   @Prop({ mutable: true })
+  centeredSlides?: boolean = false
+  @Prop({ mutable: true })
   centerInsufficientSlides?: boolean = false
   @Prop({ mutable: true })
   freeMode?: boolean
@@ -127,6 +129,7 @@ export class AtomCarousel {
           injectStyles={this.injectStyles}
           touch-start-prevent-default='false'
           center-insufficient-slides={this.centerInsufficientSlides}
+          centered-slides={this.centeredSlides}
         ></swiper-container>
       </Host>
     )
diff --git a/packages/core/src/components/carousel/stories/carousel.core.stories.tsx b/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
index da0242547..431541e76 100644
--- a/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
+++ b/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
@@ -40,7 +40,12 @@ const createComponent = (args, itemClass: string) => {
 
   ${args.loop !== undefined ? `loop="${args.loop}"` : ''}
   ${args.autoplay !== undefined ? `autoplay="${args.autoplay}"` : ''}
-  ${args.speed !== undefined ? `speed="${args.speed}"` : ''} >
+  ${args.speed !== undefined ? `speed="${args.speed}"` : ''} 
+  ${
+    args.centeredSlides !== undefined
+      ? `centered-slides="${args.centeredSlides}"`
+      : ''
+  } >
     <atom-carousel-item><div class="${itemClass}">Slide 1</div></atom-carousel-item>
     <atom-carousel-item><div class="${itemClass}">Slide 2</div></atom-carousel-item>
     <atom-carousel-item><div class="${itemClass}">Slide 3</div></atom-carousel-item>
@@ -77,9 +82,10 @@ export const Default: StoryObj = {
     createComponent(
       {
         pagination: true,
-        slidesPerView: 3,
+        slidesPerView: 'auto',
         spaceBetween: 40,
         paginationClickable: true,
+        centeredSlides: true,
       },
       'item-default'
     ),
@@ -121,11 +127,12 @@ export const CenterItemContent: StoryObj = {
     createComponent(
       {
         pagination: true,
-        slidesPerView: 1,
-        spaceBetween: 40,
+        slidesPerView: 'auto',
+        slidesPerGroup: 'auto',
+        spaceBetween: 20,
         paginationClickable: true,
+        centeredSlides: true,
       },
       'item-smaller'
     ),
 }
-
diff --git a/packages/core/src/components/carousel/stories/style.css b/packages/core/src/components/carousel/stories/style.css
index 4ca3dfe5b..696b563b1 100644
--- a/packages/core/src/components/carousel/stories/style.css
+++ b/packages/core/src/components/carousel/stories/style.css
@@ -4,7 +4,7 @@
   display: flex;
   height: 400px;
   justify-content: center;
-  width: 100% !important;
+  width: 100%;
 }
 
 .item-loop {
@@ -13,7 +13,7 @@
   display: flex;
   height: 400px;
   justify-content: center;
-  width: 100% !important;
+  width: 100%;
 }
 
 .item-pag-type {
@@ -22,7 +22,7 @@
   display: flex;
   height: 400px;
   justify-content: center;
-  width: 100% !important;
+  width: 100%;
 }
 
 .item-smaller {
@@ -31,5 +31,5 @@
   display: flex;
   height: 400px;
   justify-content: center;
-  width: 250px;
+  width: 400px;
 }

From 245f97ce47536d9414ed2ff9c4dd7efedaa29f4b Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Fri, 23 Feb 2024 18:33:46 -0300
Subject: [PATCH 07/10] chore: remove auto for docs

---
 .../src/components/carousel/stories/carousel.core.stories.tsx  | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/core/src/components/carousel/stories/carousel.core.stories.tsx b/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
index 431541e76..de18b734b 100644
--- a/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
+++ b/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
@@ -82,7 +82,6 @@ export const Default: StoryObj = {
     createComponent(
       {
         pagination: true,
-        slidesPerView: 'auto',
         spaceBetween: 40,
         paginationClickable: true,
         centeredSlides: true,
@@ -122,7 +121,7 @@ export const PaginationType: StoryObj = {
     ),
 }
 
-export const CenterItemContent: StoryObj = {
+export const CenteredSlide: StoryObj = {
   render: () =>
     createComponent(
       {

From 9e17961d0d3b5ad81afb9c7316ab12a96f9d2322 Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Mon, 26 Feb 2024 16:38:17 -0300
Subject: [PATCH 08/10] feat: add navigation button size

---
 packages/core/src/components.d.ts             |  2 ++
 .../src/components/carousel/carousel.scss     |  9 +++------
 .../core/src/components/carousel/carousel.tsx | 20 +++++++++++--------
 .../stories/carousel.core.stories.tsx         |  6 +++++-
 4 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts
index a2da80cfb..8be206d92 100644
--- a/packages/core/src/components.d.ts
+++ b/packages/core/src/components.d.ts
@@ -58,6 +58,7 @@ export namespace Components {
         "freeMode"?: boolean;
         "loop"?: boolean;
         "navigation"?: boolean;
+        "navigationButtonSize"?: 'medium' | 'xxlarge';
         "pagination"?: boolean;
         "paginationClickable"?: boolean;
         "paginationType"?: PaginationOptions['type'] | 'thumbnails';
@@ -503,6 +504,7 @@ declare namespace LocalJSX {
         "freeMode"?: boolean;
         "loop"?: boolean;
         "navigation"?: boolean;
+        "navigationButtonSize"?: 'medium' | 'xxlarge';
         "onAtomChange"?: (event: AtomCarouselCustomEvent<string>) => void;
         "onAtomClickNext"?: (event: AtomCarouselCustomEvent<string>) => void;
         "onAtomClickPrev"?: (event: AtomCarouselCustomEvent<string>) => void;
diff --git a/packages/core/src/components/carousel/carousel.scss b/packages/core/src/components/carousel/carousel.scss
index 1e76c887e..b43ca04e7 100644
--- a/packages/core/src/components/carousel/carousel.scss
+++ b/packages/core/src/components/carousel/carousel.scss
@@ -4,22 +4,19 @@
 
 ::part(button-prev),
 ::part(button-next) {
-  background: var(--color-neutral-white);
-  border: 1px solid transparent;
+  background: var(--color-brand-secondary-regular);
   border-radius: var(--border-radius-full);
   box-shadow: var(--elevation-3);
-  color: var(--color-brand-secondary-regular);
-  height: var(--spacing-medium);
+  color: var(--color-neutral-white);
   padding: var(--spacing-small);
   transition:
     border var(--transition-duration),
     box-shadow var(--transition-duration),
     opacity var(--transition-duration);
-  width: var(--spacing-medium);
   will-change: border, box-shadow;
 
   &:hover {
-    border-color: var(--color-brand-secondary-regular);
+    background: var(--color-brand-secondary-light-1);
   }
 }
 
diff --git a/packages/core/src/components/carousel/carousel.tsx b/packages/core/src/components/carousel/carousel.tsx
index 613736c1c..85d1edfa3 100644
--- a/packages/core/src/components/carousel/carousel.tsx
+++ b/packages/core/src/components/carousel/carousel.tsx
@@ -7,8 +7,9 @@ import {
   Prop,
   h,
 } from '@stencil/core'
-import 'swiper/swiper-element-bundle.js'
+import { register } from 'swiper/element/bundle'
 import { AutoplayOptions, PaginationOptions, Swiper } from 'swiper/types'
+register()
 
 import { renderThumbs } from './utils/render-thumbs'
 
@@ -59,12 +60,8 @@ export class AtomCarousel {
   thumbnailImages?: string = ''
   @Prop({ mutable: true })
   videoIcons?: boolean = false
-
-  // If you need more info please read the ADR 0012 at Caveat sections
-  private injectStyles = [
-    '.swiper-button-disabled { opacity: 0 !important}',
-    '.swiper-pagination-custom { display: flex; justify-content: center; column-gap: var(--spacing-base); } ',
-  ]
+  @Prop({ mutable: true })
+  navigationButtonSize?: 'medium' | 'xxlarge' = 'medium'
 
   componentDidLoad() {
     this.swiperEl = this.host.querySelector('swiper-container')
@@ -113,6 +110,13 @@ export class AtomCarousel {
     Object.assign(this.swiperEl, params)
   }
   render() {
+    const injectStyles = [
+      '.swiper-button-disabled { opacity: 0 !important}',
+      '.swiper-pagination-custom { display: flex; justify-content: center; column-gap: var(--spacing-base); } ',
+      `.swiper-button-next { width: var(--spacing-${this.navigationButtonSize}); height: var(--spacing-${this.navigationButtonSize}); }`,
+      `.swiper-button-prev { width: var(--spacing-${this.navigationButtonSize}); height: var(--spacing-${this.navigationButtonSize}); }`,
+    ]
+
     return (
       <Host>
         <swiper-container
@@ -126,7 +130,7 @@ export class AtomCarousel {
           free-mode={this.freeMode}
           autoplay={this.autoplay}
           autoplay-delay={this.autoplayDelay}
-          injectStyles={this.injectStyles}
+          injectStyles={injectStyles}
           touch-start-prevent-default='false'
           center-insufficient-slides={this.centerInsufficientSlides}
           centered-slides={this.centeredSlides}
diff --git a/packages/core/src/components/carousel/stories/carousel.core.stories.tsx b/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
index de18b734b..dfa715ce1 100644
--- a/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
+++ b/packages/core/src/components/carousel/stories/carousel.core.stories.tsx
@@ -37,7 +37,11 @@ const createComponent = (args, itemClass: string) => {
       : ''
   }
 
-
+  ${
+    args.navigationButtonSize !== undefined
+      ? `navigationButtonSize="${args.navigationButtonSize}"`
+      : ''
+  }
   ${args.loop !== undefined ? `loop="${args.loop}"` : ''}
   ${args.autoplay !== undefined ? `autoplay="${args.autoplay}"` : ''}
   ${args.speed !== undefined ? `speed="${args.speed}"` : ''} 

From f7e210a21027581d8b2c5a46c0df98e4b3027a9f Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Mon, 26 Feb 2024 17:02:31 -0300
Subject: [PATCH 09/10] chore: remove register

---
 packages/core/src/components/carousel/carousel.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/core/src/components/carousel/carousel.tsx b/packages/core/src/components/carousel/carousel.tsx
index 85d1edfa3..1fd61b763 100644
--- a/packages/core/src/components/carousel/carousel.tsx
+++ b/packages/core/src/components/carousel/carousel.tsx
@@ -7,9 +7,8 @@ import {
   Prop,
   h,
 } from '@stencil/core'
-import { register } from 'swiper/element/bundle'
+import 'swiper/swiper-element-bundle.js'
 import { AutoplayOptions, PaginationOptions, Swiper } from 'swiper/types'
-register()
 
 import { renderThumbs } from './utils/render-thumbs'
 

From bd2a7a368d159aabb4641eced3956efc989aff65 Mon Sep 17 00:00:00 2001
From: MayaraRMA <mayara.rma@gmail.com>
Date: Mon, 26 Feb 2024 17:02:48 -0300
Subject: [PATCH 10/10] chore: update swiper

---
 package-lock.json | 7 ++++---
 package.json      | 2 +-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 12d5aca94..c10a78280 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,7 @@
       "dependencies": {
         "@ionic/core": "^7.7.3",
         "@stencil/core": "^4.12.3",
-        "swiper": "^11.0.3"
+        "swiper": "^11.0.6"
       },
       "devDependencies": {
         "@babel/core": "^7.23.7",
@@ -29880,7 +29880,9 @@
       }
     },
     "node_modules/swiper": {
-      "version": "11.0.3",
+      "version": "11.0.6",
+      "resolved": "https://registry.npmjs.org/swiper/-/swiper-11.0.6.tgz",
+      "integrity": "sha512-W/Me7MQl5rNgdM5x9i3Gll76WsyVpnHn91GhBOyL7RCFUeg62aVnflzlVfIpXzZ/87FtJOfAoDH79ZH2Yq76zA==",
       "funding": [
         {
           "type": "patreon",
@@ -29891,7 +29893,6 @@
           "url": "http://opencollective.com/swiper"
         }
       ],
-      "license": "MIT",
       "engines": {
         "node": ">= 4.7.0"
       }
diff --git a/package.json b/package.json
index 9cedf3023..ea6f471b9 100644
--- a/package.json
+++ b/package.json
@@ -31,7 +31,7 @@
   "dependencies": {
     "@ionic/core": "^7.7.3",
     "@stencil/core": "^4.12.3",
-    "swiper": "^11.0.3"
+    "swiper": "^11.0.6"
   },
   "devDependencies": {
     "@babel/core": "^7.23.7",