From f3464d8219d35d7a067cb5767ab6df4a60a410c4 Mon Sep 17 00:00:00 2001 From: MAYARA ALENCAR <37077860+MayaraRMA@users.noreply.github.com> Date: Tue, 27 Feb 2024 14:50:25 -0300 Subject: [PATCH] fix(carousel): centralize the slide item content (#385) Co-authored-by: Felipe Fialho --- package-lock.json | 370 ++++++++++++------ package.json | 4 +- packages/core/src/components.d.ts | 4 + packages/core/src/components/badge/badge.scss | 2 + .../core/src/components/button/button.scss | 2 + .../carousel/carousel-item/carousel-item.scss | 5 + .../carousel/carousel-item/carousel-item.tsx | 1 + .../src/components/carousel/carousel.scss | 12 +- .../core/src/components/carousel/carousel.tsx | 20 +- .../stories/carousel.core.stories.tsx | 56 ++- .../src/components/carousel/stories/style.css | 15 +- packages/core/src/components/chip/chip.scss | 2 + packages/core/src/components/grid/grid.scss | 2 + packages/core/src/components/input/input.scss | 2 + .../core/src/components/select/select.scss | 2 + packages/core/src/components/tag/tag.scss | 2 + .../src/components/textarea/textarea.scss | 2 + 17 files changed, 354 insertions(+), 149 deletions(-) create mode 100644 packages/core/src/components/carousel/carousel-item/carousel-item.scss diff --git a/package-lock.json b/package-lock.json index 353374662..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", @@ -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", @@ -5385,15 +5385,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" }, @@ -5401,9 +5403,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, @@ -9839,8 +9874,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", @@ -10265,8 +10301,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": "*" @@ -11612,9 +11649,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", @@ -12036,6 +12074,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, @@ -12084,9 +12159,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" } @@ -12620,12 +12696,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": "*" @@ -14109,8 +14186,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" } @@ -14408,9 +14486,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" } @@ -14604,8 +14683,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", @@ -14617,8 +14697,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" }, @@ -14731,9 +14812,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", @@ -16187,8 +16269,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", @@ -16206,8 +16289,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" }, @@ -16225,8 +16309,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", @@ -17059,46 +17144,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": { @@ -18122,11 +18193,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, @@ -24461,8 +24527,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", @@ -24568,8 +24635,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" } @@ -25802,8 +25870,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", @@ -25820,8 +25889,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" }, @@ -25830,9 +25900,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" @@ -25842,9 +25913,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" @@ -25855,8 +25927,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", @@ -25867,12 +25940,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": { @@ -26879,14 +26952,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", @@ -26898,8 +26972,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" }, @@ -26908,9 +26983,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" @@ -26920,9 +26996,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" @@ -26933,16 +27010,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", @@ -26999,39 +27078,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" }, @@ -27048,6 +27133,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, @@ -27112,8 +27241,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", @@ -29014,12 +29144,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": { @@ -29746,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", @@ -29757,7 +29893,6 @@ "url": "http://opencollective.com/swiper" } ], - "license": "MIT", "engines": { "node": ">= 4.7.0" } @@ -29888,19 +30023,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", @@ -30693,8 +30833,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" @@ -31055,9 +31196,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 c3837d9ae..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", @@ -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", diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts index 3fd6e61ff..8be206d92 100644 --- a/packages/core/src/components.d.ts +++ b/packages/core/src/components.d.ts @@ -54,9 +54,11 @@ export namespace Components { "autoplay"?: boolean; "autoplayDelay"?: AutoplayOptions['delay']; "centerInsufficientSlides"?: boolean; + "centeredSlides"?: boolean; "freeMode"?: boolean; "loop"?: boolean; "navigation"?: boolean; + "navigationButtonSize"?: 'medium' | 'xxlarge'; "pagination"?: boolean; "paginationClickable"?: boolean; "paginationType"?: PaginationOptions['type'] | 'thumbnails'; @@ -498,9 +500,11 @@ declare namespace LocalJSX { "autoplay"?: boolean; "autoplayDelay"?: AutoplayOptions['delay']; "centerInsufficientSlides"?: boolean; + "centeredSlides"?: boolean; "freeMode"?: boolean; "loop"?: boolean; "navigation"?: boolean; + "navigationButtonSize"?: 'medium' | 'xxlarge'; "onAtomChange"?: (event: AtomCarouselCustomEvent) => void; "onAtomClickNext"?: (event: AtomCarouselCustomEvent) => void; "onAtomClickPrev"?: (event: AtomCarouselCustomEvent) => void; 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 new file mode 100644 index 000000000..0414161c1 --- /dev/null +++ b/packages/core/src/components/carousel/carousel-item/carousel-item.scss @@ -0,0 +1,5 @@ +@import '~@atomium/scss-utils/index'; + +.atom-carousel-item { + width: fit-content; +} 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/carousel.scss b/packages/core/src/components/carousel/carousel.scss index 855dbb7cf..b43ca04e7 100644 --- a/packages/core/src/components/carousel/carousel.scss +++ b/packages/core/src/components/carousel/carousel.scss @@ -1,24 +1,22 @@ +@import '~@atomium/scss-utils/index'; @import '~swiper/swiper-bundle.css'; @import '~swiper/swiper.css'; ::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-dark-1); - 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-dark-1); + background: var(--color-brand-secondary-light-1); } } @@ -64,4 +62,4 @@ height: var(--spacing-giant); object-fit: contain; width: var(--spacing-giant); -} \ No newline at end of file +} diff --git a/packages/core/src/components/carousel/carousel.tsx b/packages/core/src/components/carousel/carousel.tsx index fcbdd1ca5..1fd61b763 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 @@ -57,12 +59,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') @@ -111,6 +109,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 ( ) 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..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,23 +37,32 @@ 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}"` : ''} > -
Slide 1
-
Slide 2
-
Slide 3
-
Slide 4
-
Slide 5
-
Slide 6
-
Slide 7
-
Slide 8
- -
Slide 9 - -
-
+ ${args.speed !== undefined ? `speed="${args.speed}"` : ''} + ${ + args.centeredSlides !== undefined + ? `centered-slides="${args.centeredSlides}"` + : '' + } > +
Slide 1
+
Slide 2
+
Slide 3
+
Slide 4
+
Slide 5
+
Slide 6
+
Slide 7
+
Slide 8
+ +
Slide 9 + +
+