@orangesk/orange-design-system 3.3.0 → 3.4.0

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

@@ -74,6 +74,7 @@
 @mixin wrapper {
   position: relative;
   isolation: isolate;
+  z-index: 0;
   width: 100%;
   max-width: convert.to-rem(350px);
 }

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

@@ -21,6 +21,10 @@
     &__wrapper {
       @include mixins.wrapper();
 
+      &:has(.autocomplete__menu--visible) {
+        z-index: 2;
+      }
+
       &--search-icon,
       &--search-icon-with-placeholder {
         isolation: isolate;

package/src/components/Forms/Autocomplete/tests/Autocomplete.styles.unit.test.jsx

@@ -12,6 +12,9 @@ describe("Autocomplete styles", () => {
 
     expect(result.css).toContain(".autocomplete__wrapper");
     expect(result.css).toContain("isolation: isolate;");
+    expect(result.css).toContain("z-index: 0;");
+    expect(result.css).toContain(":has(.autocomplete__menu--visible)");
+    expect(result.css).toContain("z-index: 2;");
     expect(result.css).toContain(".autocomplete__menu");
     expect(result.css).toContain("z-index: 1;");
     expect(result.css).toContain(".autocomplete__option::before");

package/src/components/Megamenu/LogoJeTu.tsx

@@ -6,9 +6,8 @@ export const LogoJeTu: React.FC = () => {
       viewBox="0 0 40 67"
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
-      aria-hidden="true"
     >
-      <g clipPath="url(#clip0_897_389)">
+      <g clipPath="url(#clip0_21208_2750)">
         <rect width="40" height="40" fill="white" />
         <rect width="40" height="40" fill="#FF7900" />
         <path
@@ -20,11 +19,17 @@ export const LogoJeTu: React.FC = () => {
         <path
           fillRule="evenodd"
           clipRule="evenodd"
-          d="M29.417 36.2296V30.969L28.1861 30.9718L28.0717 31.6068C27.9581 31.3346 27.5374 30.8676 26.4692 30.8676C25.2875 30.869 24.2354 31.9085 24.2354 33.7662C24.2354 35.6451 25.2565 36.5437 26.5508 36.5437C27.4001 36.5437 27.7537 36.1493 27.9861 35.7352L28.0058 35.7549V36.4014C28.0058 37.2704 27.6382 37.6338 26.879 37.6338C26.0607 37.6338 25.8945 37.3606 25.8339 37.0873L24.3903 37.3197C24.5931 38.2747 25.6058 38.7042 26.6973 38.7042C29.3466 38.6873 29.417 37.1592 29.417 36.2296ZM28.0116 33.4775C28.0116 34.2155 27.9187 35.3437 26.8088 35.3521C25.7356 35.3592 25.6877 34.2254 25.6877 33.538C25.6877 32.2859 26.2736 31.9028 26.799 31.9028C27.5891 31.9028 28.0116 32.6099 28.0116 33.4775Z"
+          d="M30.2988 33.7648C30.2988 35.5929 31.2763 36.645 32.9143 36.645C34.0566 36.645 34.9045 36.231 35.3763 35.445L34.3045 34.8507C33.9622 35.3324 33.5974 35.5549 33.0439 35.5549C32.1833 35.5549 31.7467 35.0239 31.7354 33.9718H35.4354C35.4354 33.9274 35.4382 33.8817 35.441 33.8352C35.4438 33.7873 35.4467 33.7387 35.4467 33.6901C35.4467 31.8831 34.496 30.8619 32.8904 30.8619C31.2847 30.8619 30.2988 31.9366 30.2988 33.7648ZM32.8904 31.8507C33.5876 31.8507 34.0101 32.2873 34.0101 33.031H31.7636C31.8186 32.2732 32.2312 31.8507 32.8904 31.8507Z"
           fill="white"
         />
         <path
-          d="M18.2451 31.1366L19.455 30.969L19.5874 31.6281C20.2705 31.1281 20.8127 30.8619 21.4958 30.8619C22.6395 30.8619 23.2282 31.469 23.2282 32.6704V36.5394H21.7677V32.9253C21.7677 32.245 21.5902 31.9394 21.0634 31.9394C20.6268 31.9394 20.1916 32.1408 19.6958 32.5563V36.5422H18.2451V31.1366Z"
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M29.4168 36.2296V30.969L28.1858 30.9718L28.0715 31.6068C27.9579 31.3346 27.5372 30.8676 26.4689 30.8676C25.2872 30.869 24.2351 31.9085 24.2351 33.7662C24.2351 35.6451 25.2562 36.5437 26.5506 36.5437C27.3999 36.5437 27.7534 36.1493 27.9858 35.7352L28.0055 35.7549V36.4014C28.0055 37.2704 27.6379 37.6338 26.8788 37.6338C26.0605 37.6338 25.8943 37.3606 25.8337 37.0873L24.39 37.3197C24.5929 38.2747 25.6055 38.7042 26.6971 38.7042C29.3464 38.6873 29.4168 37.1592 29.4168 36.2296ZM28.0114 33.4775C28.0114 34.2155 27.9184 35.3437 26.8086 35.3521C25.7353 35.3592 25.6874 34.2254 25.6874 33.538C25.6874 32.2859 26.2734 31.9028 26.7987 31.9028C27.5889 31.9028 28.0114 32.6099 28.0114 33.4775Z"
+          fill="white"
+        />
+        <path
+          d="M18.2454 31.1366L19.4552 30.969L19.5876 31.6281C20.2707 31.1281 20.813 30.8619 21.4961 30.8619C22.6397 30.8619 23.2285 31.469 23.2285 32.6704V36.5394H21.7679V32.9253C21.7679 32.245 21.5904 31.9394 21.0637 31.9394C20.6271 31.9394 20.1918 32.1408 19.6961 32.5563V36.5422H18.2454V31.1366Z"
           fill="white"
         />
         <path
@@ -34,7 +39,7 @@ export const LogoJeTu: React.FC = () => {
           fill="white"
         />
         <path
-          d="M8.6665 30.9859H10.0566V31.6394C10.4389 31.1829 10.9931 30.905 11.5876 30.8718C11.6507 30.8702 11.7138 30.8735 11.7764 30.8817V32.2535H11.7059C11.0693 32.2535 10.3735 32.3521 10.1566 32.8465V36.5422H8.6665V30.9859Z"
+          d="M8.66626 30.9859H10.0564V31.6394C10.4387 31.1829 10.9929 30.905 11.5874 30.8718C11.6505 30.8702 11.7136 30.8735 11.7761 30.8817V32.2535H11.7057C11.0691 32.2535 10.3733 32.3521 10.1564 32.8465V36.5422H8.66626V30.9859Z"
           fill="white"
         />
         <path
@@ -45,13 +50,13 @@ export const LogoJeTu: React.FC = () => {
         />
       </g>
       <path
-        d="M5.17969 48.9411V58.7468C5.17969 59.2294 5.12509 59.648 5.01562 60.0016C4.91726 60.3582 4.73898 60.6555 4.47949 60.8903C4.23191 61.1371 3.89372 61.3132 3.46875 61.4225C3.0428 61.5441 2.50378 61.6052 1.85352 61.6052C1.55111 61.6051 1.27791 61.5807 1.03418 61.5319L0.994141 61.5241V59.3054L1.06055 59.3298C1.18473 59.3749 1.35864 59.3991 1.58398 59.3991C1.84091 59.3991 2.06009 59.3467 2.24316 59.2438L2.24707 59.2419C2.42478 59.1581 2.52441 58.961 2.52441 58.6208V48.9411H5.17969ZM11.8213 48.6891C12.6199 48.6892 13.3186 48.8463 13.915 49.1628H13.9141C14.5085 49.4661 14.9944 49.8788 15.3711 50.4011C15.7592 50.9225 16.0385 51.5165 16.208 52.1823C16.3774 52.8477 16.437 53.5433 16.3887 54.2682L16.3857 54.3151H9.67871C9.72089 55.1097 9.92711 55.6774 10.29 56.029C10.6618 56.3892 11.1996 56.5729 11.9111 56.5729C12.4182 56.5729 12.8515 56.4489 13.2139 56.2038C13.5812 55.9431 13.7993 55.6758 13.8789 55.403L13.8896 55.3669H16.2461L16.2246 55.4323C15.8623 56.5556 15.3051 57.3652 14.5488 57.8532C13.7953 58.3393 12.885 58.5807 11.8213 58.5807C11.0842 58.5807 10.4178 58.4665 9.82324 58.236L9.82227 58.235C9.22819 57.9925 8.72374 57.653 8.31055 57.2155C7.89778 56.7784 7.57681 56.2565 7.34668 55.6511V55.6501C7.12849 55.044 7.01953 54.378 7.01953 53.653C7.01953 52.9515 7.13393 52.2972 7.36426 51.6911C7.59452 51.0852 7.9226 50.5629 8.34766 50.1257C8.77222 49.6771 9.27584 49.3254 9.85742 49.071C10.4523 48.816 11.1072 48.6891 11.8213 48.6891ZM32.832 48.9411V54.2468C32.832 55.0107 32.9512 55.5757 33.1836 55.9479L33.2773 56.072C33.5157 56.3432 33.8929 56.4831 34.4199 56.4831C35.1062 56.4831 35.5922 56.2819 35.8916 55.8903C36.1935 55.4835 36.3496 54.8133 36.3496 53.8688V48.9411H39.0059V58.3474H36.4756V57.0866C36.1522 57.6029 35.7387 57.981 35.2324 58.2165C34.7104 58.4592 34.1754 58.5807 33.6279 58.5807C33.0259 58.5807 32.5133 58.5119 32.0918 58.3718L31.917 58.3073C31.4782 58.1245 31.1281 57.8675 30.8701 57.5358V57.5349C30.6134 57.1925 30.4306 56.784 30.3213 56.3102L30.3203 56.3093C30.2236 55.8255 30.1758 55.2933 30.1758 54.7145V48.9411H32.832ZM27.167 46.1511V48.9411H29.0391V50.7507H27.167V55.3093C27.167 55.5226 27.1851 55.698 27.2197 55.8366C27.2544 55.9753 27.305 56.0741 27.3682 56.1374C27.4314 56.2007 27.5301 56.2521 27.6689 56.2868C27.8076 56.3215 27.9837 56.3386 28.1973 56.3386C28.3398 56.3386 28.4762 56.3328 28.6064 56.321C28.7368 56.3091 28.8614 56.2919 28.9795 56.2682L29.0391 56.2556V58.3395L28.9971 58.3464C28.7788 58.3827 28.5369 58.4066 28.2715 58.4186C28.0068 58.4307 27.7479 58.4372 27.4951 58.4372C27.0966 58.4372 26.7154 58.4069 26.3525 58.3464V58.3454C25.9998 58.2965 25.6819 58.194 25.4004 58.0349L25.3994 58.0339C25.1273 57.873 24.9109 57.6445 24.751 57.3493C24.5897 57.0515 24.5108 56.664 24.5107 56.1911V50.7507H22.9629V48.9411H24.5107V46.1511H27.167ZM11.749 50.7145C11.397 50.7146 11.0978 50.7697 10.8496 50.8766L10.7461 50.9255C10.4882 51.0544 10.2772 51.2174 10.1143 51.4147C9.96152 51.6145 9.85138 51.8264 9.78125 52.0485L9.78027 52.0475C9.72704 52.2502 9.69442 52.4329 9.67969 52.5954H13.7217C13.6007 51.9822 13.3926 51.5194 13.0986 51.2028L13.0977 51.2018C12.8104 50.8803 12.3642 50.7145 11.749 50.7145ZM5.17969 45.3952V47.6013H2.52441V45.3952H5.17969Z"
+        d="M5.17993 48.9411V58.7468C5.17993 59.2294 5.12534 59.648 5.01587 60.0016C4.91751 60.3582 4.73923 60.6555 4.47974 60.8903C4.23215 61.1371 3.89396 61.3132 3.46899 61.4225C3.04305 61.5441 2.50403 61.6052 1.85376 61.6052C1.55135 61.6051 1.27816 61.5807 1.03442 61.5319L0.994385 61.5241V59.3054L1.06079 59.3298C1.18497 59.3749 1.35889 59.3991 1.58423 59.3991C1.84115 59.3991 2.06033 59.3467 2.24341 59.2438L2.24731 59.2419C2.42503 59.1581 2.52466 58.961 2.52466 58.6208V48.9411H5.17993ZM11.8215 48.6891C12.6201 48.6892 13.3188 48.8463 13.9153 49.1628H13.9143C14.5087 49.4661 14.9946 49.8788 15.3713 50.4011C15.7594 50.9225 16.0387 51.5165 16.2083 52.1823C16.3776 52.8477 16.4372 53.5433 16.3889 54.2682L16.386 54.3151H9.67896C9.72114 55.1097 9.92735 55.6774 10.2903 56.029C10.6621 56.3892 11.1998 56.5729 11.9114 56.5729C12.4184 56.5729 12.8518 56.4489 13.2141 56.2038C13.5814 55.9431 13.7996 55.6758 13.8792 55.403L13.8899 55.3669H16.2463L16.2249 55.4323C15.8625 56.5556 15.3054 57.3652 14.5491 57.8532C13.7956 58.3393 12.8853 58.5807 11.8215 58.5807C11.0844 58.5807 10.418 58.4665 9.82349 58.236L9.82251 58.235C9.22844 57.9925 8.72398 57.653 8.31079 57.2155C7.89803 56.7784 7.57705 56.2565 7.34692 55.6511V55.6501C7.12873 55.044 7.01978 54.378 7.01978 53.653C7.01978 52.9515 7.13417 52.2972 7.3645 51.6911C7.59477 51.0852 7.92285 50.5629 8.3479 50.1257C8.77246 49.6771 9.27609 49.3254 9.85767 49.071C10.4525 48.816 11.1075 48.6891 11.8215 48.6891ZM32.8323 48.9411V54.2468C32.8323 55.0107 32.9514 55.5757 33.1838 55.9479L33.2776 56.072C33.516 56.3432 33.8932 56.4831 34.4202 56.4831C35.1064 56.4831 35.5924 56.2819 35.8918 55.8903C36.1938 55.4835 36.3499 54.8133 36.3499 53.8688V48.9411H39.0061V58.3474H36.4758V57.0866C36.1525 57.6029 35.739 57.981 35.2327 58.2165C34.7106 58.4592 34.1756 58.5807 33.6282 58.5807C33.0262 58.5807 32.5135 58.5119 32.092 58.3718L31.9172 58.3073C31.4784 58.1245 31.1284 57.8675 30.8704 57.5358V57.5349C30.6136 57.1925 30.4309 56.784 30.3215 56.3102L30.3206 56.3093C30.2238 55.8255 30.176 55.2933 30.176 54.7145V48.9411H32.8323ZM27.1672 46.1511V48.9411H29.0393V50.7507H27.1672V55.3093C27.1673 55.5226 27.1854 55.698 27.22 55.8366C27.2547 55.9753 27.3053 56.0741 27.3684 56.1374C27.4317 56.2007 27.5304 56.2521 27.6692 56.2868C27.8079 56.3215 27.9839 56.3386 28.1975 56.3386C28.34 56.3386 28.4764 56.3328 28.6067 56.321C28.7371 56.3091 28.8616 56.2919 28.9797 56.2682L29.0393 56.2556V58.3395L28.9973 58.3464C28.7791 58.3827 28.5372 58.4066 28.2717 58.4186C28.007 58.4307 27.7482 58.4372 27.4954 58.4372C27.0969 58.4372 26.7157 58.4069 26.3528 58.3464V58.3454C26 58.2965 25.6822 58.194 25.4006 58.0349L25.3997 58.0339C25.1276 57.873 24.9112 57.6445 24.7512 57.3493C24.5899 57.0515 24.511 56.664 24.511 56.1911V50.7507H22.9631V48.9411H24.511V46.1511H27.1672ZM11.7493 50.7145C11.3972 50.7146 11.098 50.7697 10.8499 50.8766L10.7463 50.9255C10.4885 51.0544 10.2774 51.2174 10.1145 51.4147C9.96176 51.6145 9.85162 51.8264 9.78149 52.0485L9.78052 52.0475C9.72728 52.2502 9.69466 52.4329 9.67993 52.5954H13.7219C13.601 51.9822 13.3928 51.5194 13.0989 51.2028L13.0979 51.2018C12.8106 50.8803 12.3645 50.7145 11.7493 50.7145ZM5.17993 45.3952V47.6013H2.52466V45.3952H5.17993Z"
         fill="var(--color-text-default)"
         stroke="var(--color-text-default)"
         strokeWidth="0.1"
       />
       <defs>
-        <clipPath id="clip0_897_389">
+        <clipPath id="clip0_21208_2750">
           <rect width="40" height="40" fill="white" />
         </clipPath>
       </defs>

package/src/components/Megamenu/Megamenu.static.ts

@@ -449,7 +449,7 @@ export default class Megamenu {
         topElement.classList.remove("is-hidden");
         this.element.classList.remove("top-hidden");
       }
-    } else if (this.element.classList.contains("is-sticky") && hasBrandMark) {
+    } else if (!this.element.classList.contains("non-sticky") && hasBrandMark) {
       this.element.classList.toggle("top-hidden", shouldHideTop);
     }
   }