@sonic-equipment/ui 168.0.0 → 170.0.0

package/dist/styles.css

@@ -5522,7 +5522,7 @@ button.swiper-pagination-bullet {
 .search-result-panel-module-KBrc9 {
   overflow: auto;
   width: 100%;
-  height: calc(100dvh - var(--header-height) - var(--search-input-height));
+  height: calc(100dvh - var(--header-bottom) - var(--search-input-height));
   box-sizing: border-box;
   background-color: var(--color-white);
   box-shadow: var(--box-shadow-heavy);
@@ -5654,187 +5654,6 @@ button.swiper-pagination-bullet {
       }
         }
 
-.announcement-module-Xi0L5 {
-  --z: 1;
-  --icon-color: currentcolor;
-  --close-button-size: var(--space-48);
-  --background-color: var(--color-white);
-  --text-color: var(--color-brand-dark-gray);
-  --border-color: var(--color-brand-light-gray);
-}
-
-  .announcement-module-Xi0L5,
-  .announcement-module-Xi0L5 * {
-    box-sizing: border-box;
-  }
-
-  .announcement-module-Xi0L5 {
-
-  position: relative;
-  z-index: var(--z);
-  display: flex;
-  overflow: hidden;
-  align-items: flex-end;
-  justify-content: stretch;
-  background-color: var(--background-color);
-  border-block: 1px solid var(--border-color);
-  color: var(--text-color);
-  font-family: var(--font-family-sonic);
-  font-size: var(--font-size-base);
-  font-style: italic;
-  line-height: 1;
-}
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD {
-    display: grid;
-    align-items: center;
-    grid-template: 'icon content close';
-    grid-template-columns: var(--close-button-size) 1fr var(--close-button-size);
-    grid-template-rows: minmax(var(--close-button-size), min-content);
-    inline-size: 100%;
-  }
-
-  @media (width >= 576px) {
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD {
-      grid-template: '. . icon . content . close';
-      grid-template-columns:
-        var(--close-button-size) 1fr var(--space-24) var(--space-8)
-        minmax(0, max-content) 1fr var(--close-button-size)
-  }
-    }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD svg {
-      display: block;
-    }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-lxmA2 {
-      color: var(--icon-color);
-      grid-area: icon;
-      justify-self: center;
-    }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y {
-      padding: var(--space-8) 0;
-      grid-area: content;
-    }
-
-  @media (width >= 576px) {
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y {
-        display: flex;
-        flex-flow: row wrap
-    }
-      }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module-8k2rK {
-        flex-shrink: 1;
-        margin: 0;
-        font-size: var(--font-size-base);
-        font-weight: var(--font-weight-black);
-        text-transform: uppercase;
-      }
-
-  @media (width >= 576px) {
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module-8k2rK:has(+ .announcement-module--Bhqj, + .announcement-module-yXGsN)::after {
-          content: '-';
-          font-weight: var(--font-weight-normal);
-          margin-inline: var(--space-4)
-      }
-        }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module-yXGsN {
-        flex-shrink: 1;
-        margin: 0;
-      }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module--Bhqj {
-        position: static;
-        flex-shrink: 1;
-        color: currentcolor;
-      }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module--Bhqj:hover {
-          text-decoration: underline;
-        }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module--Bhqj::after {
-          position: absolute;
-          background: transparent;
-          content: '';
-          inset: 0;
-        }
-
-  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-gZ9ae {
-      z-index: 1;
-      grid-area: close;
-      justify-self: center;
-    }
-
-  .announcement-module-Xi0L5:where(.announcement-module-0LTWL) {
-    --icon-color: var(--color-semantic-information);
-  }
-
-  .announcement-module-Xi0L5:where(.announcement-module-Ga3lN) {
-    --icon-color: var(--color-semantic-notify);
-  }
-
-  .announcement-module-Xi0L5:where(.announcement-module-S3nSW) {
-    --icon-color: var(--color-semantic-stop);
-  }
-
-  .announcement-module-Xi0L5:where(.announcement-module-E6DqW) {
-    --z: 2;
-    --background-color: var(--color-brand-red);
-    --text-color: var(--color-white);
-    --icon-color: var(--color-white);
-    --border-color: var(--color-white);
-  }
-
-  .announcement-module-Xi0L5:where(.announcement-module-E6DqW):has([href]):hover {
-      --background-color: var(--color-brand-dark-red);
-    }
-
-:root {
-  --announcements-bottom: var(--announcements-height);
-}
-
-.announcement-list-module-Nn6HC {
-  position: relative;
-  z-index: var(--announcements-layer);
-}
-
-.announcement-list-module-Nn6HC.announcement-list-module-icXq8 {
-    position: sticky;
-    top: 0;
-  }
-
-.announcement-list-module-Nn6HC .announcement-list-module-cgFNU {
-    display: flex;
-    flex-direction: column;
-  }
-
-.announcement-list-module-Nn6HC .announcement-list-module-fUupi {
-    margin-block: -1px;
-  }
-
-.announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-W10mi,
-    .announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-tyqE0 {
-      transition: all var(--transition-duration-short) linear;
-    }
-
-.announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-W10mi,
-    .announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-tyqE0.announcement-list-module-dUOEB {
-      z-index: -1;
-      height: 0;
-    }
-
-.announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-W10mi.announcement-list-module-1Rfn0,
-    .announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-tyqE0 {
-      height: auto;
-    }
-
 .menu-list-module-TloB9 {
   --ml-font-size: var(--font-size-16);
   --ml-font-weight: var(--font-weight-normal);
@@ -6242,10 +6061,12 @@ button.swiper-pagination-bullet {
     }
 
 .desktop-navigation-drawer-module-rXWPO {
+  --drawer-bottom-margin: var(--header-height);
+
   /* TODO: wish I could get this to height auto with a max height */
   block-size: min(
     100%,
-    calc(100svh - var(--header-height) - var(--header-height))
+    calc(100svh - var(--header-bottom) - var(--drawer-bottom-margin))
   );
 }
 
@@ -6633,7 +6454,7 @@ button.swiper-pagination-bullet {
 .blank-page-spacer-module-lXxle {
   display: grid;
   width: 100%;
-  height: calc(100dvh - var(--header-height));
+  height: calc(100dvh - var(--header-bottom));
   background-color: var(--color-white);
   place-items: center;
 }
@@ -6861,6 +6682,187 @@ button.swiper-pagination-bullet {
   gap: 1rem;
 }
 
+.announcement-module-Xi0L5 {
+  --z: 1;
+  --icon-color: currentcolor;
+  --close-button-size: var(--space-48);
+  --background-color: var(--color-white);
+  --text-color: var(--color-brand-dark-gray);
+  --border-color: var(--color-brand-light-gray);
+}
+
+  .announcement-module-Xi0L5,
+  .announcement-module-Xi0L5 * {
+    box-sizing: border-box;
+  }
+
+  .announcement-module-Xi0L5 {
+
+  position: relative;
+  z-index: var(--z);
+  display: flex;
+  overflow: hidden;
+  align-items: flex-end;
+  justify-content: stretch;
+  background-color: var(--background-color);
+  border-block: 1px solid var(--border-color);
+  color: var(--text-color);
+  font-family: var(--font-family-sonic);
+  font-size: var(--font-size-base);
+  font-style: italic;
+  line-height: 1;
+}
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD {
+    display: grid;
+    align-items: center;
+    grid-template: 'icon content close';
+    grid-template-columns: var(--close-button-size) 1fr var(--close-button-size);
+    grid-template-rows: minmax(var(--close-button-size), min-content);
+    inline-size: 100%;
+  }
+
+  @media (width >= 576px) {
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD {
+      grid-template: '. . icon . content . close';
+      grid-template-columns:
+        var(--close-button-size) 1fr var(--space-24) var(--space-8)
+        minmax(0, max-content) 1fr var(--close-button-size)
+  }
+    }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD svg {
+      display: block;
+    }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-lxmA2 {
+      color: var(--icon-color);
+      grid-area: icon;
+      justify-self: center;
+    }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y {
+      padding: var(--space-8) 0;
+      grid-area: content;
+    }
+
+  @media (width >= 576px) {
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y {
+        display: flex;
+        flex-flow: row wrap
+    }
+      }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module-8k2rK {
+        flex-shrink: 1;
+        margin: 0;
+        font-size: var(--font-size-base);
+        font-weight: var(--font-weight-black);
+        text-transform: uppercase;
+      }
+
+  @media (width >= 576px) {
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module-8k2rK:has(+ .announcement-module--Bhqj, + .announcement-module-yXGsN)::after {
+          content: '-';
+          font-weight: var(--font-weight-normal);
+          margin-inline: var(--space-4)
+      }
+        }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module-yXGsN {
+        flex-shrink: 1;
+        margin: 0;
+      }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module--Bhqj {
+        position: static;
+        flex-shrink: 1;
+        color: currentcolor;
+      }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module--Bhqj:hover {
+          text-decoration: underline;
+        }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-1Jn7y .announcement-module--Bhqj::after {
+          position: absolute;
+          background: transparent;
+          content: '';
+          inset: 0;
+        }
+
+  .announcement-module-Xi0L5 .announcement-module-4XVjD .announcement-module-gZ9ae {
+      z-index: 1;
+      grid-area: close;
+      justify-self: center;
+    }
+
+  .announcement-module-Xi0L5:where(.announcement-module-0LTWL) {
+    --icon-color: var(--color-semantic-information);
+  }
+
+  .announcement-module-Xi0L5:where(.announcement-module-Ga3lN) {
+    --icon-color: var(--color-semantic-notify);
+  }
+
+  .announcement-module-Xi0L5:where(.announcement-module-S3nSW) {
+    --icon-color: var(--color-semantic-stop);
+  }
+
+  .announcement-module-Xi0L5:where(.announcement-module-E6DqW) {
+    --z: 2;
+    --background-color: var(--color-brand-red);
+    --text-color: var(--color-white);
+    --icon-color: var(--color-white);
+    --border-color: var(--color-white);
+  }
+
+  .announcement-module-Xi0L5:where(.announcement-module-E6DqW):has([href]):hover {
+      --background-color: var(--color-brand-dark-red);
+    }
+
+:root {
+  --announcements-bottom: var(--announcements-height);
+}
+
+.announcement-list-module-Nn6HC {
+  position: relative;
+  z-index: var(--announcements-layer);
+}
+
+.announcement-list-module-Nn6HC.announcement-list-module-icXq8 {
+    position: sticky;
+    top: 0;
+  }
+
+.announcement-list-module-Nn6HC .announcement-list-module-cgFNU {
+    display: flex;
+    flex-direction: column;
+  }
+
+.announcement-list-module-Nn6HC .announcement-list-module-fUupi {
+    margin-block: -1px;
+  }
+
+.announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-W10mi,
+    .announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-tyqE0 {
+      transition: all var(--transition-duration-short) linear;
+    }
+
+.announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-W10mi,
+    .announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-tyqE0.announcement-list-module-dUOEB {
+      z-index: -1;
+      height: 0;
+    }
+
+.announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-W10mi.announcement-list-module-1Rfn0,
+    .announcement-list-module-Nn6HC .announcement-list-module-fUupi.announcement-list-module-tyqE0 {
+      height: auto;
+    }
+
 .create-account-form-module-TMU8F {
   min-inline-size: 270px;
 }
@@ -7112,7 +7114,7 @@ button.swiper-pagination-bullet {
   .checkout-page-layout-module-lULV3 .checkout-page-layout-module-wGAXb {
     position: fixed;
     z-index: var(--top-actions-sticky-layer);
-    top: var(--header-height);
+    top: var(--header-bottom);
     right: 0;
     left: 0;
     width: 100%;
@@ -7351,7 +7353,7 @@ button.swiper-pagination-bullet {
 
   .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ .product-details-page-layout-module-3-19O {
       position: sticky;
-      top: calc(var(--header-height) + var(--space-8));
+      top: calc(var(--header-bottom) + var(--space-8));
       height: -moz-fit-content;
       height: fit-content;
     }
@@ -8539,7 +8541,7 @@ button.swiper-pagination-bullet {
   }
 }
 .toast-provider-module-EoPKW {
-  top: calc(var(--header-height) + var(--space-12));
+  top: calc(var(--header-bottom) + var(--space-12));
   right: auto;
   left: auto;
   display: flex;
@@ -8550,7 +8552,7 @@ button.swiper-pagination-bullet {
 }
 
   @media (width >= 1024px) {.toast-provider-module-EoPKW {
-    top: calc(var(--header-height) + var(--space-12));
+    top: calc(var(--header-bottom) + var(--space-12));
     right: var(--toastify-toast-right);
     width: -moz-fit-content;
     width: fit-content;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sonic-equipment/ui",
-  "version": "168.0.0",
+  "version": "170.0.0",
   "type": "module",
   "license": "MIT",
   "engines": {

package/dist/shared/routing/route-button.d.ts

@@ -1 +0,0 @@
-export declare const RouteButton: React.ForwardRefExoticComponent<import("../../buttons/button/button").ButtonProps & import("./with-routing").WithRoutingProps & React.RefAttributes<HTMLElement>>;

package/dist/shared/routing/route-button.js

@@ -1,7 +0,0 @@
-"use client";
-import { Button } from '../../buttons/button/button.js';
-import { withRouting } from './with-routing.js';
-
-const RouteButton = withRouting(Button);
-
-export { RouteButton };

package/dist/shared/routing/route-icon-button.d.ts

@@ -1 +0,0 @@
-export declare const RouteIconButton: React.ForwardRefExoticComponent<import("../../buttons/icon-button/icon-button").IconButtonProps & import("./with-routing").WithRoutingProps & React.RefAttributes<HTMLElement>>;

package/dist/shared/routing/route-icon-button.js

@@ -1,7 +0,0 @@
-"use client";
-import { IconButton } from '../../buttons/icon-button/icon-button.js';
-import { withRouting } from './with-routing.js';
-
-const RouteIconButton = withRouting(IconButton);
-
-export { RouteIconButton };

package/dist/shared/routing/route-link.d.ts

@@ -1 +0,0 @@
-export declare const RouteLink: React.ForwardRefExoticComponent<Omit<import("../../buttons/link/link").LinkProps & React.RefAttributes<HTMLElement> & import("./with-routing").WithRoutingProps, "ref"> & React.RefAttributes<HTMLElement>>;

package/dist/shared/routing/route-link.js

@@ -1,7 +0,0 @@
-"use client";
-import { Link } from '../../buttons/link/link.js';
-import { withRouting } from './with-routing.js';
-
-const RouteLink = withRouting(Link);
-
-export { RouteLink };