@orangesk/orange-design-system 2.1.0 → 2.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orangesk/orange-design-system",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "private": false,
   "engines": {
     "node": ">=20.x"
@@ -55,7 +55,7 @@
     "@cloudfour/transition-hidden-element": "^2.0.2",
     "@mdx-js/loader": "^3.1.1",
     "@mdx-js/react": "^3.1.1",
-    "@next/mdx": "16.2.7",
+    "@next/mdx": "16.2.9",
     "@orangesk/accessible-autocomplete": "3.2.2",
     "@popperjs/core": "^2.11.8",
     "@types/mdx": "^2.0.14",
@@ -63,11 +63,11 @@
     "classnames": "^2.5.1",
     "daypickr": "^0.3.4",
     "diff2html": "^3.4.56",
-    "dompurify": "^3.4.8",
+    "dompurify": "^3.4.11",
     "html-react-parser": "6.1.3",
     "lorem-ipsum": "3.0.0",
     "minisearch": "7.2.0",
-    "next": "16.2.7",
+    "next": "16.2.9",
     "normalize.css": "^8.0.1",
     "nouislider": "^15.8.1",
     "prism-react-renderer": "^2.4.1",
@@ -86,10 +86,10 @@
     "wnumb": "^1.2.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.29.7",
-    "@babel/preset-env": "^7.29.7",
-    "@babel/preset-react": "^7.29.7",
-    "@babel/preset-typescript": "^7.29.7",
+    "@babel/core": "8.0.1",
+    "@babel/preset-env": "8.0.2",
+    "@babel/preset-react": "8.0.1",
+    "@babel/preset-typescript": "8.0.1",
     "@biomejs/biome": "latest",
     "@rollup/plugin-alias": "6.0.0",
     "@rollup/plugin-babel": "7.1.0",
@@ -99,20 +99,20 @@
     "@rollup/plugin-terser": "1.0.0",
     "@rollup/plugin-typescript": "^12.3.0",
     "@rollup/plugin-url": "^8.0.2",
-    "@rollup/rollup-darwin-arm64": "^4.61.1",
+    "@rollup/rollup-darwin-arm64": "^4.62.0",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
-    "@types/node": "25.9.2",
+    "@types/node": "25.9.3",
     "@types/react": "19.2.17",
     "@types/react-dom": "19.2.3",
     "@types/wnumb": "^1.2.3",
     "@vitejs/plugin-react": "6.0.2",
-    "@vitest/browser": "^4.1.8",
-    "@vitest/browser-playwright": "^4.1.8",
-    "@vitest/coverage-v8": "^4.1.8",
-    "@vitest/ui": "^4.1.8",
+    "@vitest/browser": "^4.1.9",
+    "@vitest/browser-playwright": "^4.1.9",
+    "@vitest/coverage-v8": "^4.1.9",
+    "@vitest/ui": "^4.1.9",
     "canvas": "^3.2.3",
     "fs-extra": "^11.3.5",
     "glob": "13.0.6",
@@ -121,16 +121,16 @@
     "identity-obj-proxy": "^3.0.0",
     "jsdom": "29.1.1",
     "lint-staged": "17.0.7",
-    "playwright": "^1.60.0",
+    "playwright": "^1.61.0",
     "prettier": "^3.8.4",
-    "rollup": "^4.61.1",
+    "rollup": "^4.62.0",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.4.1",
     "rollup-plugin-postcss": "^4.0.2",
-    "sass": "^1.100.0",
+    "sass": "^1.101.0",
     "svg-sprite": "^2.0.4",
     "typescript": "6.0.3",
-    "vitest": "^4.1.8",
+    "vitest": "^4.1.9",
     "vitest-axe": "^0.1.0",
     "vitest-browser-react": "^2.2.0"
   },

package/src/assets/icons/pictogram-communication--dark.svg

@@ -0,0 +1,4 @@
+<svg width="62" height="64" viewBox="0 0 62 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M52.2187 10C54.8594 10 57 12.1043 57 14.7V47.6H26.7187L17.1562 57V47.6H10.7812C8.14064 47.6 6 45.4957 6 42.9V10H52.2187Z" fill="#DA8436"/>
+<path d="M32.6629 37.3735C29.4817 34.1855 26.4411 30.4931 27.8953 29.0376C31.5515 25.3741 31.7953 25.6594 28.1019 21.0573C24.4002 16.451 24.5489 17.278 19.9136 22.0083C17.4761 24.6381 19.7896 33.0484 28.3828 41.649C36.9842 50.2495 45.6104 52.4658 48.0149 50.1296C52.9518 45.2215 53.3401 45.4986 48.9651 41.9426C44.3669 38.2377 44.6354 38.5023 40.9916 42.1493C39.5374 43.6006 35.8481 40.5532 32.6629 37.3694V37.3735Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/assets/icons/pictogram-communication.svg

@@ -0,0 +1,4 @@
+<svg width="62" height="64" viewBox="0 0 62 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M52.2187 10C54.8594 10 57 12.1043 57 14.7V47.6H26.7187L17.1562 57V47.6H10.7812C8.14064 47.6 6 45.4957 6 42.9V10H52.2187Z" fill="#FFC48F"/>
+<path d="M32.6629 37.3735C29.4817 34.1855 26.4411 30.4931 27.8953 29.0376C31.5515 25.3741 31.7953 25.6594 28.1019 21.0573C24.4002 16.451 24.5489 17.278 19.9136 22.0083C17.4761 24.6381 19.7896 33.0484 28.3828 41.649C36.9842 50.2495 45.6104 52.4658 48.0149 50.1296C52.9518 45.2215 53.3401 45.4986 48.9651 41.9426C44.3669 38.2377 44.6354 38.5023 40.9916 42.1493C39.5374 43.6006 35.8481 40.5532 32.6629 37.3694V37.3735Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/assets/icons/pictogram-coverage--dark.svg

@@ -0,0 +1,5 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path d="M29.5322 20C30.7293 20.4927 29.8769 22.9723 31.3925 23.0258C31.3813 24.3843 32.1503 23.5344 32.75 23.9404C32.9084 24.1832 32.9512 25.1498 32.9767 25.4789C32.863 25.7566 33.2456 26.0804 33.1339 26.2367C32.8922 26.5788 32.1387 27.5427 32.8969 27.7123C33.6259 27.8752 33.8016 27.1056 34.427 27.026C36.1749 28.0769 35.7215 27.0712 36.3445 25.4902C36.7258 25.5604 36.7279 25.3777 36.9797 25.0492C38.0305 24.7432 37.497 24.7994 38.0807 24.026C38.298 23.7387 38.8919 24.2782 39.2381 23.7683C39.4562 23.7397 40.0337 24.2065 40.3804 24.3426C42.6267 23.1012 42.9122 26.8019 45.0857 24.6258C45.8215 24.6289 45.5709 24.1933 45.1809 23.8145C45.779 22.8361 46.0138 23.7516 46.5735 23.7963C46.9772 23.8287 47.1838 23.0584 47.4451 22.8362C48.8282 23.6192 49.4719 23.316 50.8993 23.3038C51.5709 23.7706 51.7727 24.1981 52.3248 24.7487C52.4652 24.5611 52.7853 24.0776 52.9916 24.2766C54.051 25.2967 54.5911 25.7495 54.8317 27.31C55.3278 27.8105 56.5971 27.734 56.7212 28.4016C56.8111 28.8855 57.6667 28.7212 57.9321 28.8186C58.1937 28.9147 58.3302 29.3581 58.5685 29.4867C59.1504 29.8011 59.4427 29.4557 60.0001 29.8836C59.8651 30.3795 59.8589 30.7696 59.8015 31.2786C59.7749 31.517 59.3008 31.5166 59.1741 31.7134C58.4306 32.8648 58.7983 34.629 57.9306 35.7023C57.8348 37.0141 57.2264 37.8705 56.2693 38.7731C55.4449 39.5502 56.9327 41.9724 55.6256 42.5643C55.3673 42.6814 54.5444 42.613 54.1431 42.6979C53.5411 42.8252 52.6769 43.7038 52.0547 43.3079C51.1642 42.7418 51.0241 41.6113 50.7548 40.7058C50.6466 40.3411 50.2925 40.5328 50.0605 40.4298C49.9399 40.3764 49.8672 39.6606 49.2229 39.349C49.0674 39.2737 48.0061 39.4988 47.8687 39.6371C47.6816 39.8257 47.7265 40.1829 47.4608 40.3126C46.7724 40.2605 46.6875 40.1407 45.9265 40.6024C45.6242 40.497 45.5642 40.3251 45.2902 40.164C44.9181 39.9451 43.8131 39.6434 43.3602 39.5613C43.2071 39.3978 43.0463 39.2071 42.8663 39.0987C42.1933 39.2756 41.5201 39.484 40.8477 39.6686C39.958 39.9128 39.7288 39.7595 39.7781 40.7648C39.2041 41.9246 38.8289 44.2246 37.684 44.9225C37.1201 44.318 37.1865 45.1403 36.6986 45.0384C35.9015 44.8721 36.4418 45.7911 35.7706 46.014C35.0742 46.2437 34.8167 46.9039 34.2337 47.188C33.9111 47.3455 33.552 46.7444 33.2929 46.6128C32.5293 47.0466 32.8924 45.7782 31.8905 45.9091C31.7823 45.7354 31.5784 45.3577 31.3848 45.382C30.214 45.4743 29.8896 46.3665 29.9616 47.4495C29.3468 48.0032 28.9071 47.9114 28.0839 47.8877C27.9023 48.0494 27.6209 48.2971 27.413 48.387C26.0543 48.1792 24.9038 48.3948 23.5821 48.7833C23.3776 49.0077 23.2745 49.3617 23.1523 49.6746C22.3761 49.9325 22.8098 50.2075 22.7943 50.3288C22.6219 51.6782 22.4812 51.6786 23.3961 52.5109C22.9401 52.7604 22.5817 53.3384 22.1426 53.5027C21.7472 53.6506 21.223 53.1869 20.8697 53.2346C20.193 53.3257 19.4315 53.3876 18.7678 53.5515C18.5854 53.5963 18.2371 53.8268 18.0123 53.8848C17.4397 54.0261 16.9012 53.7402 16.3132 53.7773C15.1415 53.8509 13.4079 54.4159 12.4199 53.4655C12.0284 53.0891 11.7485 52.346 11.1716 52.5841C10.6785 51.9751 10.1421 51.4338 9.7273 50.7644C9.2371 49.9742 7.94485 48.6601 7.00131 49.3967C6.54748 48.8335 5.85999 48.6471 6.30651 47.7256C6.20378 47.5693 6.0594 47.2419 5.95941 47.0499C5.22988 46.8168 5.35588 46.414 5.24708 45.6502C5.08695 44.5261 4.82278 43.6513 4.05035 42.9605C3.60838 42.1575 4.49915 40.2493 5.03062 39.6585C5.12026 39.0986 4.98318 38.7015 5.02657 38.1061C5.44848 37.6008 5.56413 36.3517 5.84763 35.7356C6.21972 34.927 6.7174 33.914 7.62529 33.6636C7.95627 33.5723 8.89655 34.5752 9.9847 34.0836C10.3383 34.2936 10.3812 34.563 10.8019 34.6532C11.9431 33.9928 12.8695 32.9594 13.9756 32.6279C14.9587 32.3334 13.8881 30.5996 15.4753 30.8538C16.8295 30.1722 16.2158 28.3095 16.6421 27.0753C17.0603 25.8558 18.3263 25.7178 19.1507 24.8565C19.1678 24.0355 19.2338 24.3269 19.6232 23.9316C19.855 23.7063 19.9868 23.2874 20.2673 23.1355C21.2502 22.6034 20.8621 21.8984 22.2485 22.2953C22.5702 22.3874 22.8183 21.9624 23.0708 21.7658C23.3796 21.7336 24.6159 21.6758 24.773 22.077C24.8298 22.2223 24.6566 23.9047 24.9234 24.0041C25.3934 24.1791 25.6725 23.371 26.1759 23.8841C26.3372 24.0485 26.7529 23.8137 26.9267 23.7258C26.9492 23.5905 27.0101 23.1555 27.0758 23.0179C27.6873 22.5873 27.0614 21.4646 28.3151 21.4621C28.5976 21.4615 29.3689 20.3105 29.5322 20Z" fill="#DA8436"/>
+  <path d="M27.5 18V33.4531L32.2676 28.3193L33.7324 29.6807L26.5 37.4697L19.2676 29.6807L20.7324 28.3193L25.5 33.4531V18H27.5ZM45.7324 15.3193L44.2676 16.6807L39.5 11.5459V27H37.5V11.5459L32.7324 16.6807L31.2676 15.3193L38.5 7.53027L45.7324 15.3193Z" fill="white"/>
+</svg>

package/src/assets/icons/pictogram-coverage.svg

@@ -0,0 +1,5 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path d="M29.5322 20C30.7293 20.4927 29.8769 22.9723 31.3925 23.0258C31.3813 24.3843 32.1503 23.5344 32.75 23.9404C32.9084 24.1832 32.9512 25.1498 32.9767 25.4789C32.863 25.7566 33.2456 26.0804 33.1339 26.2367C32.8922 26.5788 32.1387 27.5427 32.8969 27.7123C33.6259 27.8752 33.8016 27.1056 34.427 27.026C36.1749 28.0769 35.7215 27.0712 36.3445 25.4902C36.7258 25.5604 36.7279 25.3777 36.9797 25.0492C38.0305 24.7432 37.497 24.7994 38.0807 24.026C38.298 23.7387 38.8919 24.2782 39.2381 23.7683C39.4562 23.7397 40.0337 24.2065 40.3804 24.3426C42.6267 23.1012 42.9122 26.8019 45.0857 24.6258C45.8215 24.6289 45.5709 24.1933 45.1809 23.8145C45.779 22.8361 46.0138 23.7516 46.5735 23.7963C46.9772 23.8287 47.1838 23.0584 47.4451 22.8362C48.8282 23.6192 49.4719 23.316 50.8993 23.3038C51.5709 23.7706 51.7727 24.1981 52.3248 24.7487C52.4652 24.5611 52.7853 24.0776 52.9916 24.2766C54.051 25.2967 54.5911 25.7495 54.8317 27.31C55.3278 27.8105 56.5971 27.734 56.7212 28.4016C56.8111 28.8855 57.6667 28.7212 57.9321 28.8186C58.1937 28.9147 58.3302 29.3581 58.5685 29.4867C59.1504 29.8011 59.4427 29.4557 60.0001 29.8836C59.8651 30.3795 59.8589 30.7696 59.8015 31.2786C59.7749 31.517 59.3008 31.5166 59.1741 31.7134C58.4306 32.8648 58.7983 34.629 57.9306 35.7023C57.8348 37.0141 57.2264 37.8705 56.2693 38.7731C55.4449 39.5502 56.9327 41.9724 55.6256 42.5643C55.3673 42.6814 54.5444 42.613 54.1431 42.6979C53.5411 42.8252 52.6769 43.7038 52.0547 43.3079C51.1642 42.7418 51.0241 41.6113 50.7548 40.7058C50.6466 40.3411 50.2925 40.5328 50.0605 40.4298C49.9399 40.3764 49.8672 39.6606 49.2229 39.349C49.0674 39.2737 48.0061 39.4988 47.8687 39.6371C47.6816 39.8257 47.7265 40.1829 47.4608 40.3126C46.7724 40.2605 46.6875 40.1407 45.9265 40.6024C45.6242 40.497 45.5642 40.3251 45.2902 40.164C44.9181 39.9451 43.8131 39.6434 43.3602 39.5613C43.2071 39.3978 43.0463 39.2071 42.8663 39.0987C42.1933 39.2756 41.5201 39.484 40.8477 39.6686C39.958 39.9128 39.7288 39.7595 39.7781 40.7648C39.2041 41.9246 38.8289 44.2246 37.684 44.9225C37.1201 44.318 37.1865 45.1403 36.6986 45.0384C35.9015 44.8721 36.4418 45.7911 35.7706 46.014C35.0742 46.2437 34.8167 46.9039 34.2337 47.188C33.9111 47.3455 33.552 46.7444 33.2929 46.6128C32.5293 47.0466 32.8924 45.7782 31.8905 45.9091C31.7823 45.7354 31.5784 45.3577 31.3848 45.382C30.214 45.4743 29.8896 46.3665 29.9616 47.4495C29.3468 48.0032 28.9071 47.9114 28.0839 47.8877C27.9023 48.0494 27.6209 48.2971 27.413 48.387C26.0543 48.1792 24.9038 48.3948 23.5821 48.7833C23.3776 49.0077 23.2745 49.3617 23.1523 49.6746C22.3761 49.9325 22.8098 50.2075 22.7943 50.3288C22.6219 51.6782 22.4812 51.6786 23.3961 52.5109C22.9401 52.7604 22.5817 53.3384 22.1426 53.5027C21.7472 53.6506 21.223 53.1869 20.8697 53.2346C20.193 53.3257 19.4315 53.3876 18.7678 53.5515C18.5854 53.5963 18.2371 53.8268 18.0123 53.8848C17.4397 54.0261 16.9012 53.7402 16.3132 53.7773C15.1415 53.8509 13.4079 54.4159 12.4199 53.4655C12.0284 53.0891 11.7485 52.346 11.1716 52.5841C10.6785 51.9751 10.1421 51.4338 9.7273 50.7644C9.2371 49.9742 7.94485 48.6601 7.00131 49.3967C6.54748 48.8335 5.85999 48.6471 6.30651 47.7256C6.20378 47.5693 6.0594 47.2419 5.95941 47.0499C5.22988 46.8168 5.35588 46.414 5.24708 45.6502C5.08695 44.5261 4.82278 43.6513 4.05035 42.9605C3.60838 42.1575 4.49915 40.2493 5.03062 39.6585C5.12026 39.0986 4.98318 38.7015 5.02657 38.1061C5.44848 37.6008 5.56413 36.3517 5.84763 35.7356C6.21972 34.927 6.7174 33.914 7.62529 33.6636C7.95627 33.5723 8.89655 34.5752 9.9847 34.0836C10.3383 34.2936 10.3812 34.563 10.8019 34.6532C11.9431 33.9928 12.8695 32.9594 13.9756 32.6279C14.9587 32.3334 13.8881 30.5996 15.4753 30.8538C16.8295 30.1722 16.2158 28.3095 16.6421 27.0753C17.0603 25.8558 18.3263 25.7178 19.1507 24.8565C19.1678 24.0355 19.2338 24.3269 19.6232 23.9316C19.855 23.7063 19.9868 23.2874 20.2673 23.1355C21.2502 22.6034 20.8621 21.8984 22.2485 22.2953C22.5702 22.3874 22.8183 21.9624 23.0708 21.7658C23.3796 21.7336 24.6159 21.6758 24.773 22.077C24.8298 22.2223 24.6566 23.9047 24.9234 24.0041C25.3934 24.1791 25.6725 23.371 26.1759 23.8841C26.3372 24.0485 26.7529 23.8137 26.9267 23.7258C26.9492 23.5905 27.0101 23.1555 27.0758 23.0179C27.6873 22.5873 27.0614 21.4646 28.3151 21.4621C28.5976 21.4615 29.3689 20.3105 29.5322 20Z" fill="#FFC48F"/>
+  <path d="M27.5 18V33.4531L32.2676 28.3193L33.7324 29.6807L26.5 37.4697L19.2676 29.6807L20.7324 28.3193L25.5 33.4531V18H27.5ZM45.7324 15.3193L44.2676 16.6807L39.5 11.5459V27H37.5V11.5459L32.7324 16.6807L31.2676 15.3193L38.5 7.53027L45.7324 15.3193Z" fill="black"/>
+</svg>

package/src/assets/icons/pictogram-credit--dark.svg

@@ -0,0 +1,7 @@
+<svg width="62" height="64" viewBox="0 0 62 64" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <rect x="1" y="25.564" width="29.0819" height="50.114" rx="10" transform="rotate(-45 1 25.564)" fill="#DA8436"/>
+  <path d="M30.2297 22.9778H48.5391" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <path d="M30.2297 30.1709H45.9235" stroke="white" stroke-width="2" stroke-linecap="round"/>
+  <path d="M53.7703 36.0562C47.2313 46.5186 33.4992 41.2873 33.4992 26.9011C33.4992 10.5536 48.5391 5.97613 53.7703 17.0927" stroke="white" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/src/assets/icons/pictogram-credit.svg

@@ -0,0 +1,6 @@
+<svg width="62" height="64" viewBox="0 0 62 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="1" y="25.564" width="29.0819" height="50.114" rx="10" transform="rotate(-45 1 25.564)" fill="#FFC48F"/>
+<path d="M30.2297 22.9778H48.5391" stroke="black" stroke-width="2" stroke-linecap="round"/>
+<path d="M30.2297 30.1709H45.9235" stroke="black" stroke-width="2" stroke-linecap="round"/>
+<path d="M53.7703 36.0562C47.2313 46.5186 33.4992 41.2873 33.4992 26.9011C33.4992 10.5536 48.5391 5.97613 53.7703 17.0927" stroke="black" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/src/assets/icons/pictogram-modem--dark.svg

@@ -0,0 +1,9 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M31.833 27C33.766 27 35.333 28.567 35.333 30.5C35.333 32.433 33.766 34 31.833 34C29.9 34 28.333 32.433 28.333 30.5C28.333 28.567 29.9 27 31.833 27ZM31.833 29C31.0046 29 30.333 29.6716 30.333 30.5C30.333 31.3284 31.0046 32 31.833 32C32.6614 32 33.333 31.3284 33.333 30.5C33.333 29.6716 32.6614 29 31.833 29Z" fill="white"/>
+  <path d="M32.1035 21.292C35.7189 21.292 38.982 22.8303 41.2129 25.2744L39.7353 26.623C37.8751 24.585 35.1446 23.292 32.1035 23.292C29.0627 23.2921 26.3319 24.585 24.4717 26.623L22.9951 25.2744C25.226 22.8305 28.4885 21.2921 32.1035 21.292Z" fill="white"/>
+  <path d="M32.1035 15.1299C37.0676 15.1299 41.5356 17.2368 44.5957 20.5811L43.1201 21.9307C40.4304 18.9911 36.4939 17.1299 32.1035 17.1299C27.7144 17.13 23.7879 18.991 21.0859 21.9326L19.6143 20.5791C22.684 17.2371 27.1386 15.13 32.1035 15.1299Z" fill="white"/>
+  <path d="M32.1045 9C38.4058 9.00004 44.0675 11.6633 47.957 15.9082L46.4824 17.2598C42.9636 13.4194 37.8333 11 32.1045 11C26.3762 11 21.2565 13.4189 17.7373 17.2598L16.2627 15.9082C20.1519 11.6637 25.8025 9 32.1045 9Z" fill="white"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M52.9941 38H11.0059C9.34777 38.0044 8.00475 39.2635 8 40.818V44.182C8.00475 45.7365 9.34777 46.9956 11.0059 47H52.9941C54.6522 46.9956 55.9953 45.7365 56 44.182V40.818C55.9953 39.2635 54.6522 38.0044 52.9941 38ZM12.8 43.9999C11.9163 43.9999 11.2 43.3283 11.2 42.4998C11.2 41.6714 11.9163 40.9998 12.8 40.9998C13.6837 40.9998 14.4 41.6714 14.4 42.4998C14.4 43.3283 13.6837 43.9999 12.8 43.9999ZM17.6 44.0014C16.7163 44.0014 16 43.3298 16 42.5014C16 41.6729 16.7163 41.0013 17.6 41.0013C18.4837 41.0013 19.2 41.6729 19.2 42.5014C19.2 43.3298 18.4837 44.0014 17.6 44.0014ZM51.2 43.9999C50.3163 43.9999 49.6 43.3283 49.6 42.4998C49.6 41.6714 50.3163 40.9998 51.2 40.9998C52.0837 40.9998 52.8 41.6714 52.8 42.4998C52.8 43.3283 52.0837 43.9999 51.2 43.9999Z" fill="#DA8436"/>
+  <path d="M45 48V51H19V48H45Z" fill="#DA8436"/>
+</svg>

package/src/assets/icons/pictogram-modem.svg

@@ -0,0 +1,9 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M31.833 27C33.766 27 35.333 28.567 35.333 30.5C35.333 32.433 33.766 34 31.833 34C29.9 34 28.333 32.433 28.333 30.5C28.333 28.567 29.9 27 31.833 27ZM31.833 29C31.0046 29 30.333 29.6716 30.333 30.5C30.333 31.3284 31.0046 32 31.833 32C32.6614 32 33.333 31.3284 33.333 30.5C33.333 29.6716 32.6614 29 31.833 29Z" fill="black"/>
+  <path d="M32.1035 21.292C35.7189 21.292 38.982 22.8303 41.2129 25.2744L39.7353 26.623C37.8751 24.585 35.1446 23.292 32.1035 23.292C29.0627 23.2921 26.3319 24.585 24.4717 26.623L22.9951 25.2744C25.226 22.8305 28.4885 21.2921 32.1035 21.292Z" fill="black"/>
+  <path d="M32.1035 15.1299C37.0676 15.1299 41.5356 17.2368 44.5957 20.5811L43.1201 21.9307C40.4304 18.9911 36.4939 17.1299 32.1035 17.1299C27.7144 17.13 23.7879 18.991 21.0859 21.9326L19.6143 20.5791C22.684 17.2371 27.1386 15.13 32.1035 15.1299Z" fill="black"/>
+  <path d="M32.1045 9C38.4058 9.00004 44.0675 11.6633 47.957 15.9082L46.4824 17.2598C42.9636 13.4194 37.8333 11 32.1045 11C26.3762 11 21.2565 13.4189 17.7373 17.2598L16.2627 15.9082C20.1519 11.6637 25.8025 9 32.1045 9Z" fill="black"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M52.9941 38H11.0059C9.34777 38.0044 8.00475 39.2635 8 40.818V44.182C8.00475 45.7365 9.34777 46.9956 11.0059 47H52.9941C54.6522 46.9956 55.9953 45.7365 56 44.182V40.818C55.9953 39.2635 54.6522 38.0044 52.9941 38ZM12.8 43.9999C11.9163 43.9999 11.2 43.3283 11.2 42.4998C11.2 41.6714 11.9163 40.9998 12.8 40.9998C13.6837 40.9998 14.4 41.6714 14.4 42.4998C14.4 43.3283 13.6837 43.9999 12.8 43.9999ZM17.6 44.0014C16.7163 44.0014 16 43.3298 16 42.5014C16 41.6729 16.7163 41.0013 17.6 41.0013C18.4837 41.0013 19.2 41.6729 19.2 42.5014C19.2 43.3298 18.4837 44.0014 17.6 44.0014ZM51.2 43.9999C50.3163 43.9999 49.6 43.3283 49.6 42.4998C49.6 41.6714 50.3163 40.9998 51.2 40.9998C52.0837 40.9998 52.8 41.6714 52.8 42.4998C52.8 43.3283 52.0837 43.9999 51.2 43.9999Z" fill="#FFC48F"/>
+  <path d="M45 48V51H19V48H45Z" fill="#FFC48F"/>
+</svg>

package/src/assets/icons/pictogram-speed--dark.svg

@@ -0,0 +1,7 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path d="M9.22384 46.201C8.7696 42.969 9.00844 39.6773 9.92448 36.5447C10.8405 33.4121 12.4128 30.5103 14.5368 28.0322C16.6607 25.5541 19.2878 23.5564 22.2434 22.1719C25.199 20.7874 28.4154 20.0478 31.6789 20.0022C34.9423 19.9567 38.1781 20.6062 41.1712 21.9076C44.1643 23.209 46.8461 25.1326 49.0385 27.5504C51.2308 29.9682 52.8835 32.825 53.8867 35.9308C54.8898 39.0366 55.2205 42.3203 54.8567 45.5638L32 43L9.22384 46.201Z" fill="#DA8436"/>
+  <path d="M5.26282 46.7577C4.36811 40.3915 5.7743 33.9149 9.22848 28.4929C12.6827 23.071 17.9581 19.0594 24.106 17.1798C30.2539 15.3002 36.8707 15.6759 42.7662 18.2394C48.6618 20.8028 53.4493 25.3858 56.2675 31.1639L54.3261 32.1108C51.7333 26.7949 47.3289 22.5786 41.9049 20.2202C36.481 17.8618 30.3936 17.5162 24.7375 19.2454C19.0815 20.9746 14.228 24.6653 11.0502 29.6535C7.87237 34.6417 6.57867 40.6002 7.4018 46.4571L5.26282 46.7577Z" fill="white"/>
+  <path d="M34 42C34 43.1046 33.1046 44 32 44C30.8954 44 30 43.1046 30 42C30 40.8954 30.8954 40 32 40C33.1046 40 34 40.8954 34 42Z" fill="white"/>
+  <path d="M50.3418 36.4394L33.8418 42.4394L33.1582 40.5605L49.6582 34.5605L50.3418 36.4394Z" fill="white"/>
+</svg>

package/src/assets/icons/pictogram-speed.svg

@@ -0,0 +1,7 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path d="M9.22384 46.201C8.7696 42.969 9.00844 39.6773 9.92448 36.5447C10.8405 33.4121 12.4128 30.5103 14.5368 28.0322C16.6607 25.5541 19.2878 23.5564 22.2434 22.1719C25.199 20.7874 28.4154 20.0478 31.6789 20.0022C34.9423 19.9567 38.1781 20.6062 41.1712 21.9076C44.1643 23.209 46.8461 25.1326 49.0385 27.5504C51.2308 29.9682 52.8835 32.825 53.8867 35.9308C54.8898 39.0366 55.2205 42.3203 54.8567 45.5638L32 43L9.22384 46.201Z" fill="#FFC48F"/>
+  <path d="M5.26282 46.7577C4.36811 40.3915 5.7743 33.9149 9.22848 28.4929C12.6827 23.071 17.9581 19.0594 24.106 17.1798C30.2539 15.3002 36.8707 15.6759 42.7662 18.2394C48.6618 20.8028 53.4493 25.3858 56.2675 31.1639L54.3261 32.1108C51.7333 26.7949 47.3289 22.5786 41.9049 20.2202C36.481 17.8618 30.3936 17.5162 24.7375 19.2454C19.0815 20.9746 14.228 24.6653 11.0502 29.6535C7.87237 34.6417 6.57867 40.6002 7.4018 46.4571L5.26282 46.7577Z" fill="black"/>
+  <path d="M34 42C34 43.1046 33.1046 44 32 44C30.8954 44 30 43.1046 30 42C30 40.8954 30.8954 40 32 40C33.1046 40 34 40.8954 34 42Z" fill="black"/>
+  <path d="M50.3418 36.4394L33.8418 42.4394L33.1582 40.5605L49.6582 34.5605L50.3418 36.4394Z" fill="black"/>
+</svg>

package/src/assets/icons/pictogram-sunset--dark.svg

@@ -0,0 +1,10 @@
+<svg width="62" height="64" viewBox="0 0 62 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M31.5636 17.7227C22.2064 17.7227 14.6208 25.3249 14.6208 34.7028C14.6208 37.5155 15.3032 40.1685 16.5111 42.5046H46.6161C47.824 40.1685 48.5064 37.5155 48.5064 34.7028C48.5064 25.3249 40.9208 17.7227 31.5636 17.7227Z" fill="#DA8436"/>
+<path d="M5.0116 42.5049L58.6215 42.5049" stroke="white" stroke-width="2"/>
+<path d="M14.6208 47.5623L48.5064 47.5623" stroke="white" stroke-width="2"/>
+<path d="M22.713 52.6199L41.4258 52.6199" stroke="white" stroke-width="2"/>
+<path d="M52.0591 27.0142L58.0677 24.2975" stroke="white" stroke-width="2"/>
+<path d="M10.0341 26.9902L4 24.3306" stroke="white" stroke-width="2"/>
+<path d="M21.6822 14.9895L18.9238 8.99993" stroke="white" stroke-width="2"/>
+<path d="M40.4267 15.1489L43.1094 9.12508" stroke="white" stroke-width="2"/>
+</svg>

package/src/assets/icons/pictogram-sunset.svg

@@ -0,0 +1,10 @@
+<svg width="62" height="64" viewBox="0 0 62 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M31.5636 17.7227C22.2064 17.7227 14.6208 25.3249 14.6208 34.7028C14.6208 37.5155 15.3032 40.1685 16.5111 42.5046H46.6161C47.824 40.1685 48.5064 37.5155 48.5064 34.7028C48.5064 25.3249 40.9208 17.7227 31.5636 17.7227Z" fill="#FFC48F"/>
+<path d="M5.0116 42.5049L58.6215 42.5049" stroke="black" stroke-width="2"/>
+<path d="M14.6208 47.5623L48.5064 47.5623" stroke="black" stroke-width="2"/>
+<path d="M22.713 52.6199L41.4258 52.6199" stroke="black" stroke-width="2"/>
+<path d="M52.0591 27.0142L58.0677 24.2975" stroke="black" stroke-width="2"/>
+<path d="M10.0341 26.9902L4 24.3306" stroke="black" stroke-width="2"/>
+<path d="M21.6822 14.9895L18.9238 8.99993" stroke="black" stroke-width="2"/>
+<path d="M40.4267 15.1489L43.1094 9.12508" stroke="black" stroke-width="2"/>
+</svg>

package/src/assets/icons/pictogram-wallet--dark.svg

@@ -0,0 +1,6 @@
+<svg width="62" height="64" viewBox="0 0 62 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.20001 22.1C9.20001 19.0072 11.7072 16.5 14.8 16.5H49.8V20.7H54C54 33.7934 54 39.7026 54 51.5H14.8C11.7072 51.5 9.20001 48.9928 9.20001 45.9V22.1ZM48.4 17.9H16.2C15.4268 17.9 14.8 18.5268 14.8 19.3C14.8 20.0732 15.4268 20.7 16.2 20.7H48.4V17.9Z" fill="#DA8436"/>
+<path d="M27.2296 19.9778H45.5391" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M27.2296 27.1709H42.9234" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M50.7703 33.0562C44.2312 43.5186 30.4992 38.2873 30.4992 23.9011C30.4992 7.55361 45.5391 2.97613 50.7703 14.0927" stroke="white" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/src/assets/icons/pictogram-wallet.svg

@@ -0,0 +1,6 @@
+<svg width="62" height="64" viewBox="0 0 62 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.20001 22.1C9.20001 19.0072 11.7072 16.5 14.8 16.5H49.8V20.7H54C54 33.7934 54 39.7026 54 51.5H14.8C11.7072 51.5 9.20001 48.9928 9.20001 45.9V22.1ZM48.4 17.9H16.2C15.4268 17.9 14.8 18.5268 14.8 19.3C14.8 20.0732 15.4268 20.7 16.2 20.7H48.4V17.9Z" fill="#FFC48F"/>
+<path d="M27.2296 19.9778H45.5391" stroke="black" stroke-width="2" stroke-linecap="round"/>
+<path d="M27.2296 27.1709H42.9234" stroke="black" stroke-width="2" stroke-linecap="round"/>
+<path d="M50.7703 33.0562C44.2312 43.5186 30.4992 38.2873 30.4992 23.9011C30.4992 7.55361 45.5391 2.97613 50.7703 14.0927" stroke="black" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/src/components/BlockAction/styles/mixins.scss

@@ -19,7 +19,7 @@
 
 @mixin override {
   position: relative;
-  z-index: 1;
+  z-index: 2;
 }
 
 @mixin indicator($bg-color: "default", $config: config.$indicator-colors) {

package/src/components/BlockAction/styles/style.scss

@@ -35,7 +35,7 @@
     }
 
     &--border-on-hover:has(.block-action__control:hover),
-    &--border-on-hover:has(.block-action__control:focus) {
+    &--border-on-hover:has(.block-action__control:focus-visible) {
       @include mixins.border;
     }
   }

package/src/components/BlockAction/tests/BlockAction.styles.unit.test.jsx

@@ -0,0 +1,18 @@
+import path from "path";
+import sass from "sass";
+
+describe("BlockAction styles", () => {
+  it("keeps override above control overlay regardless of DOM order", () => {
+    const result = sass.compile(
+      path.resolve(
+        process.cwd(),
+        "src/components/BlockAction/styles/style.scss",
+      ),
+    );
+
+    expect(result.css).toContain(".block-action__control::before");
+    expect(result.css).toContain("z-index: 1;");
+    expect(result.css).toContain(".block-action__override");
+    expect(result.css).toContain("z-index: 2;");
+  });
+});

package/src/components/Card/styles/mixins.scss

@@ -37,7 +37,9 @@
 
 @mixin card-section($spacing) {
   @include card-spacing($spacing);
+}
 
+@mixin card-section-actions() {
   > {
     .btn,
     button {

package/src/components/Card/styles/style.scss

@@ -8,6 +8,7 @@
 
     &__section {
       @include mixins.card-section(null);
+      @include mixins.card-section-actions;
 
       &--space-small {
         @include mixins.card-section(space.get());

package/src/components/Carousel/Carousel.tsx

@@ -39,6 +39,10 @@ const Carousel: React.FC<CarouselProps> = ({
   ...other
 }) => {
   const [carouselRef] = useStatic(CarouselStatic);
+  const { ["data-swiper-options"]: _dataSwiperOptionsAttr, ...domProps } =
+    other as HTMLAttributes<HTMLDivElement> & {
+      "data-swiper-options"?: string;
+    };
 
   const carouselItems = items.map((item, i) => (
     <CarouselItem key={i.toString()}>{item}</CarouselItem>
@@ -55,7 +59,6 @@ const Carousel: React.FC<CarouselProps> = ({
     dots: cx(CLASS_DOTS, showScrollbar ? "hide" : "show-md"),
   };
 
-  // Only override pagination when showScrollbar is true
   const customSwiperOptions = showScrollbar
     ? {
         pagination: {
@@ -70,10 +73,10 @@ const Carousel: React.FC<CarouselProps> = ({
       className={classes}
       ref={carouselRef}
       data-carousel
-      {...(showScrollbar || swiperOptions
+      {...(showScrollbar || customSwiperOptions
         ? { "data-swiper-options": JSON.stringify(customSwiperOptions) }
         : {})}
-      {...other}
+      {...domProps}
     >
       <div className={CLASS_VIEWPORT_WRAPPER}>
         <div className={CLASS_VIEWPORT}>

package/src/components/CarouselHero/styles/mixins.scss

@@ -99,7 +99,7 @@
   cursor: pointer;
   color: var(--color-text-default);
   text-align: center;
-  flex: 0;
+  flex: 1;
   white-space: nowrap;
   font-weight: 700;
   font-size: convert.to-rem(14px);

package/src/components/CarouselPromotions/styles/mixins.scss

@@ -254,7 +254,7 @@
     @include generate.css-map(sass-map.get(config.$dot, "active"));
   }
 
-  .is-autoplay &.is-active:not(:focus) {
+  .is-autoplay &.is-active:not(:focus-visible) {
     outline: none;
   }
 
@@ -262,7 +262,7 @@
     @include generate.css-map(sass-map.get(config.$dot, "default"));
   }
 
-  &:focus:not(:active) {
+  &:focus-visible:not(:active) {
     @include generate.css-map(sass-map.get(config.$dot, "focus"));
   }
 }

package/src/components/Forms/File/styles/style.scss

@@ -35,7 +35,7 @@
       }
     }
 
-    &__control:focus + &__button {
+    &__control:focus-visible + &__button {
       @include mixins.control-focused;
     }
 

package/src/components/Forms/styles/mixins.scss

@@ -23,7 +23,7 @@
     @include generate.css-map($config, "invalid");
   }
 
-  &:focus + #{$display-selector} {
+  &:focus-visible + #{$display-selector} {
     @include generate.css-map($config, "focus");
   }
 

package/src/components/Icon/styles/mixins.scss

@@ -3,9 +3,10 @@
 @use "../../../styles/tools/generate";
 
 @mixin base() {
+  --icon-size: 1em;
   fill: currentColor;
-  width: 1em;
-  height: 1em;
+  width: var(--icon-size);
+  height: var(--icon-size);
   vertical-align: text-bottom;
 }
 
@@ -14,8 +15,7 @@
     @include breakpoint.get($breakpoint) {
       @each $variant, $size in $props {
         &#{generate.variant-name($variant)} {
-          width: $size;
-          height: $size;
+          --icon-size: #{$size};
         }
       }
     }

package/src/components/Link/styles/style.scss

@@ -27,7 +27,10 @@
       color: var(--color-text-accent);
       text-decoration: underline;
     }
-    &:focus {
+    &.text-accent:hover {
+      color: var(--color-text-default) !important;
+    }
+    &:focus-visible {
       outline: 2px solid var(--color-border-contrast);
       outline-offset: 2px;
     }

package/src/components/Tile/styles/mixins.scss

@@ -1,6 +1,21 @@
+@use "sass:map";
 @use "../../../styles/tokens/space";
 @use "../../../styles/tokens/breakpoint";
 @use "../../../styles/tools/convert";
+@use "../../Icon/styles/config" as icon-config;
+
+@function build-unsized-icon-selector($selector) {
+  $result: $selector;
+
+  @each $size-name in map.keys(map.get(icon-config.$sizes, default)) {
+    $result: "#{$result}:not(.icon--#{$size-name})";
+  }
+
+  @return $result;
+}
+
+$tile-unsized-icon-selector: build-unsized-icon-selector(">.icon") + ", " +
+  build-unsized-icon-selector(">svg");
 
 @mixin tile-base {
   display: flex;
@@ -19,6 +34,7 @@
   display: flex;
   flex-direction: column;
   align-items: flex-start;
+  justify-content: space-between;
   gap: space.get("medium");
   padding: space.get("medium");
   z-index: 1;
@@ -27,18 +43,20 @@
     margin-bottom: 0;
   }
 
-  > .icon,
-  > svg {
+  @include breakpoint.get("md") {
+    flex-direction: column;
+    padding: space.get("large");
+  }
+}
+
+@mixin tile-body-icon-ratio {
+  #{$tile-unsized-icon-selector} {
     width: convert.to-rem(24px);
     height: convert.to-rem(24px);
   }
 
   @include breakpoint.get("md") {
-    flex-direction: column;
-    padding: space.get("large");
-
-    > .icon,
-    > svg {
+    #{$tile-unsized-icon-selector} {
       width: convert.to-rem(32px);
       height: convert.to-rem(32px);
     }

package/src/components/Tile/styles/style.scss

@@ -8,6 +8,10 @@
       @include mixins.tile-body;
     }
 
+    &:not(.tile--action) .tile__body {
+      @include mixins.tile-body-icon-ratio;
+    }
+
     &--compact .tile__body {
       @include mixins.tile-body-compact;
     }
@@ -19,7 +23,7 @@
         @include mixins.tile-action;
       }
 
-      .icon {
+      .tile__body > .icon:last-child {
         @include mixins.tile-action-icon;
       }
     }

package/src/styles/tokens/base.scss

@@ -19,11 +19,6 @@ $focus-shadow:
 $selection-background: sasscolor.adjust(color.$orange-dark, $alpha: -0.1);
 
 @mixin focusring {
-  &:focus {
-    outline: $focus-outline;
-    outline-offset: $focusring-offset;
-  }
-
   &:focus-visible {
     outline: $focus-outline;
     outline-offset: $focusring-offset;
@@ -36,11 +31,6 @@ $selection-background: sasscolor.adjust(color.$orange-dark, $alpha: -0.1);
 }
 
 @mixin focusring-flush {
-  &:focus {
-    outline: $focus-outline;
-    outline-offset: 0 !important;
-  }
-
   &:focus-visible {
     outline: $focus-outline;
     outline-offset: 0 !important;
@@ -55,12 +45,6 @@ $selection-background: sasscolor.adjust(color.$orange-dark, $alpha: -0.1);
 @mixin focusring-round {
   border-radius: 100%;
 
-  &:focus {
-    outline-width: 0 !important;
-    outline-color: transparent !important;
-    box-shadow: $focus-shadow;
-  }
-
   &:focus-visible {
     outline-width: 0 !important;
     outline-color: transparent !important;

package/src/styles/typography/mixins.scss

@@ -50,7 +50,16 @@
     // Default štýly pre všetky p elementy
     @include generate.responsive-css-map(map.get($config, "default"));
 
-    a {
+    a:not(.no-underline):not(.underline-hover) {
+      text-decoration: underline !important;
+    }
+
+    a.no-underline,
+    a.underline-hover {
+      text-decoration: none !important;
+    }
+
+    a.underline-hover:hover {
       text-decoration: underline !important;
     }
   }