@nok-integration/storefront-react 0.29.0 → 0.29.1

package/dist/index.mjs

@@ -10937,11 +10937,11 @@ function CartLineItem({ item: item2, title: title2, image: image2, compareAt: co
     })]
   });
 }
-const box$1 = "_box_w9fja_1";
-const row$4 = "_row_w9fja_10";
-const icon$2 = "_icon_w9fja_16";
-const label$1 = "_label_w9fja_22";
-const divider$1 = "_divider_w9fja_29";
+const box$1 = "_box_tuawd_1";
+const row$4 = "_row_tuawd_10";
+const icon$2 = "_icon_tuawd_16";
+const label$1 = "_label_tuawd_22";
+const divider$1 = "_divider_tuawd_29";
 const styles$q = {
   box: box$1,
   row: row$4,
@@ -15888,19 +15888,19 @@ function ShopBar({ onBack, onMenu, title: title2, showCart, floating: floating2
     })]
   });
 }
-const overlay = "_overlay_1vpmg_5";
-const scrim = "_scrim_1vpmg_21";
-const sheet = "_sheet_1vpmg_31";
-const header = "_header_1vpmg_80";
-const close = "_close_1vpmg_86";
-const list$1 = "_list_1vpmg_105";
-const row = "_row_1vpmg_120";
-const icon = "_icon_1vpmg_149";
-const text = "_text_1vpmg_157";
-const title = "_title_1vpmg_165";
-const subtitle = "_subtitle_1vpmg_172";
-const chevron = "_chevron_1vpmg_178";
-const dropdown = "_dropdown_1vpmg_187";
+const overlay = "_overlay_sz96n_5";
+const scrim = "_scrim_sz96n_21";
+const sheet = "_sheet_sz96n_31";
+const header = "_header_sz96n_80";
+const close = "_close_sz96n_86";
+const list$1 = "_list_sz96n_105";
+const row = "_row_sz96n_120";
+const icon = "_icon_sz96n_149";
+const text = "_text_sz96n_157";
+const title = "_title_sz96n_165";
+const subtitle = "_subtitle_sz96n_172";
+const chevron = "_chevron_sz96n_178";
+const dropdown = "_dropdown_sz96n_187";
 const styles$1 = {
   overlay,
   scrim,

package/dist/standalone/storefront.mjs

@@ -10937,11 +10937,11 @@ function CartLineItem({ item: item2, title: title2, image: image2, compareAt: co
     })]
   });
 }
-const box$1 = "_box_w9fja_1";
-const row$4 = "_row_w9fja_10";
-const icon$2 = "_icon_w9fja_16";
-const label$1 = "_label_w9fja_22";
-const divider$1 = "_divider_w9fja_29";
+const box$1 = "_box_tuawd_1";
+const row$4 = "_row_tuawd_10";
+const icon$2 = "_icon_tuawd_16";
+const label$1 = "_label_tuawd_22";
+const divider$1 = "_divider_tuawd_29";
 const styles$q = {
   box: box$1,
   row: row$4,
@@ -15888,19 +15888,19 @@ function ShopBar({ onBack, onMenu, title: title2, showCart, floating: floating2
     })]
   });
 }
-const overlay = "_overlay_1vpmg_5";
-const scrim = "_scrim_1vpmg_21";
-const sheet = "_sheet_1vpmg_31";
-const header = "_header_1vpmg_80";
-const close = "_close_1vpmg_86";
-const list$1 = "_list_1vpmg_105";
-const row = "_row_1vpmg_120";
-const icon = "_icon_1vpmg_149";
-const text = "_text_1vpmg_157";
-const title = "_title_1vpmg_165";
-const subtitle = "_subtitle_1vpmg_172";
-const chevron = "_chevron_1vpmg_178";
-const dropdown = "_dropdown_1vpmg_187";
+const overlay = "_overlay_sz96n_5";
+const scrim = "_scrim_sz96n_21";
+const sheet = "_sheet_sz96n_31";
+const header = "_header_sz96n_80";
+const close = "_close_sz96n_86";
+const list$1 = "_list_sz96n_105";
+const row = "_row_sz96n_120";
+const icon = "_icon_sz96n_149";
+const text = "_text_sz96n_157";
+const title = "_title_sz96n_165";
+const subtitle = "_subtitle_sz96n_172";
+const chevron = "_chevron_sz96n_178";
+const dropdown = "_dropdown_sz96n_187";
 const styles$1 = {
   overlay,
   scrim,

package/dist/standalone/styles.css

@@ -3019,7 +3019,7 @@
   text-decoration: line-through;
   white-space: nowrap;
 }
-._box_w9fja_1 {
+._box_tuawd_1 {
   display: flex;
   flex-direction: column;
   gap: var(--space-12);
@@ -3027,26 +3027,31 @@
   border-radius: var(--radius-8);
   background: var(--color-surface-soft);
 }
-._row_w9fja_10 {
+._row_tuawd_10 {
   display: flex;
   align-items: center;
   gap: var(--space-12);
 }
-._icon_w9fja_16 {
+._icon_tuawd_16 {
   display: block;
   flex-shrink: 0;
   color: var(--color-surface-max);
 }
-._label_w9fja_22 {
+._label_tuawd_22 {
   margin: 0;
   font-size: var(--type-trimmed-sm-size);
   font-weight: var(--font-weight-bold);
   color: var(--color-text-default);
 }
-._divider_w9fja_29 {
+._divider_tuawd_29 {
   height: 1px;
   background: var(--color-border-default);
 }
+@media (min-width: 1200px) {
+  ._box_tuawd_1 {
+    background: var(--color-surface-default);
+  }
+}
 ._bar_23dkv_1 {
   position: sticky;
   bottom: 0;
@@ -5443,7 +5448,7 @@
   width: auto;
   text-align: center;
 }
-._overlay_1vpmg_5 {
+._overlay_sz96n_5 {
   position: fixed;
   inset: 0;
   z-index: 900;
@@ -5452,12 +5457,12 @@
   justify-content: center;
   padding: calc(var(--header-height) + var(--space-16) + env(safe-area-inset-top, 0px)) var(--space-16) var(--space-16);
 }
-._scrim_1vpmg_21 {
+._scrim_sz96n_21 {
   position: absolute;
   inset: 0;
   background: rgba(12, 22, 28, 0.32);
 }
-._sheet_1vpmg_31 {
+._sheet_sz96n_31 {
   position: relative;
   width: 100%;
   max-width: 343px;
@@ -5468,13 +5473,13 @@
   border-radius: var(--radius-12);
   display: flex;
   flex-direction: column;
-  animation: _menu-in_1vpmg_1 160ms ease;
+  animation: _menu-in_sz96n_1 160ms ease;
   scrollbar-width: none;
 }
-._sheet_1vpmg_31::-webkit-scrollbar {
+._sheet_sz96n_31::-webkit-scrollbar {
   display: none;
 }
-@keyframes _menu-in_1vpmg_1 {
+@keyframes _menu-in_sz96n_1 {
   from {
     opacity: 0;
     transform: translateY(-8px);
@@ -5485,16 +5490,16 @@
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  ._sheet_1vpmg_31 {
+  ._sheet_sz96n_31 {
     animation: none;
   }
 }
-._header_1vpmg_80 {
+._header_sz96n_80 {
   display: flex;
   justify-content: flex-end;
   border-bottom: 1px solid rgba(249, 250, 250, 0.2);
 }
-._close_1vpmg_86 {
+._close_sz96n_86 {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -5506,19 +5511,19 @@
   color: inherit;
   cursor: pointer;
 }
-._close_1vpmg_86:focus-visible {
+._close_sz96n_86:focus-visible {
   outline: none;
   box-shadow: var(--focus-ring);
   border-radius: var(--radius-4);
 }
-._list_1vpmg_105 {
+._list_sz96n_105 {
   list-style: none;
   margin: 0;
   padding: var(--space-6) 0;
   display: flex;
   flex-direction: column;
 }
-._row_1vpmg_120 {
+._row_sz96n_120 {
   display: flex;
   align-items: center;
   gap: var(--space-8);
@@ -5531,39 +5536,39 @@
   text-align: left;
   cursor: pointer;
 }
-._row_1vpmg_120[disabled] {
+._row_sz96n_120[disabled] {
   cursor: default;
 }
-._row_1vpmg_120:focus-visible {
+._row_sz96n_120:focus-visible {
   outline: none;
   box-shadow: var(--focus-ring);
 }
-._icon_1vpmg_149 {
+._icon_sz96n_149 {
   display: inline-flex;
   flex: 0 0 24px;
   width: 24px;
   height: 24px;
   color: var(--color-text-default);
 }
-._text_1vpmg_157 {
+._text_sz96n_157 {
   display: flex;
   flex: 1 1 auto;
   flex-direction: column;
   gap: var(--space-2);
   min-width: 0;
 }
-._title_1vpmg_165 {
+._title_sz96n_165 {
   font-size: var(--type-paragraph-size);
   font-weight: var(--font-weight-bold);
   line-height: 1;
   color: var(--color-text-default);
 }
-._subtitle_1vpmg_172 {
+._subtitle_sz96n_172 {
   font-size: var(--type-trimmed-xs-size);
   line-height: 1.52;
   color: var(--color-text-subtle);
 }
-._chevron_1vpmg_178 {
+._chevron_sz96n_178 {
   display: inline-flex;
   flex: 0 0 16px;
   width: 16px;
@@ -5571,24 +5576,24 @@
   color: var(--color-text-subtle);
 }
 @media (min-width: 1200px) {
-  ._dropdown_1vpmg_187 {
+  ._dropdown_sz96n_187 {
     padding: 0;
   }
-  ._dropdown_1vpmg_187 ._scrim_1vpmg_21 {
+  ._dropdown_sz96n_187 ._scrim_sz96n_21 {
     background: transparent;
   }
-  ._dropdown_1vpmg_187 ._sheet_1vpmg_31 {
+  ._dropdown_sz96n_187 ._sheet_sz96n_31 {
     position: absolute;
     top: calc(var(--shop-chrome-top, 0px) + 64px);
-    right: calc(max(176px, calc((100% - 1088px) / 2)) - 112px);
-    width: 320px;
-    max-width: 320px;
+    right: calc(max(176px, calc((100% - 1088px) / 2)) - 8px);
+    width: 343px;
+    max-width: 343px;
     max-height: calc(100dvh - var(--shop-chrome-top, 0px) - 80px);
     border: 1px solid rgba(249, 250, 250, 0.2);
     background: #f9fafa;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
   }
-  ._dropdown_1vpmg_187 ._list_1vpmg_105 li:not(:last-child) ._row_1vpmg_120 {
+  ._dropdown_sz96n_187 ._list_sz96n_105 li:not(:last-child) ._row_sz96n_120 {
     border-bottom: 1px solid #dddedf;
   }
 }

package/dist/styles.css

@@ -3019,7 +3019,7 @@
   text-decoration: line-through;
   white-space: nowrap;
 }
-._box_w9fja_1 {
+._box_tuawd_1 {
   display: flex;
   flex-direction: column;
   gap: var(--space-12);
@@ -3027,26 +3027,31 @@
   border-radius: var(--radius-8);
   background: var(--color-surface-soft);
 }
-._row_w9fja_10 {
+._row_tuawd_10 {
   display: flex;
   align-items: center;
   gap: var(--space-12);
 }
-._icon_w9fja_16 {
+._icon_tuawd_16 {
   display: block;
   flex-shrink: 0;
   color: var(--color-surface-max);
 }
-._label_w9fja_22 {
+._label_tuawd_22 {
   margin: 0;
   font-size: var(--type-trimmed-sm-size);
   font-weight: var(--font-weight-bold);
   color: var(--color-text-default);
 }
-._divider_w9fja_29 {
+._divider_tuawd_29 {
   height: 1px;
   background: var(--color-border-default);
 }
+@media (min-width: 1200px) {
+  ._box_tuawd_1 {
+    background: var(--color-surface-default);
+  }
+}
 ._bar_23dkv_1 {
   position: sticky;
   bottom: 0;
@@ -5443,7 +5448,7 @@
   width: auto;
   text-align: center;
 }
-._overlay_1vpmg_5 {
+._overlay_sz96n_5 {
   position: fixed;
   inset: 0;
   z-index: 900;
@@ -5452,12 +5457,12 @@
   justify-content: center;
   padding: calc(var(--header-height) + var(--space-16) + env(safe-area-inset-top, 0px)) var(--space-16) var(--space-16);
 }
-._scrim_1vpmg_21 {
+._scrim_sz96n_21 {
   position: absolute;
   inset: 0;
   background: rgba(12, 22, 28, 0.32);
 }
-._sheet_1vpmg_31 {
+._sheet_sz96n_31 {
   position: relative;
   width: 100%;
   max-width: 343px;
@@ -5468,13 +5473,13 @@
   border-radius: var(--radius-12);
   display: flex;
   flex-direction: column;
-  animation: _menu-in_1vpmg_1 160ms ease;
+  animation: _menu-in_sz96n_1 160ms ease;
   scrollbar-width: none;
 }
-._sheet_1vpmg_31::-webkit-scrollbar {
+._sheet_sz96n_31::-webkit-scrollbar {
   display: none;
 }
-@keyframes _menu-in_1vpmg_1 {
+@keyframes _menu-in_sz96n_1 {
   from {
     opacity: 0;
     transform: translateY(-8px);
@@ -5485,16 +5490,16 @@
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  ._sheet_1vpmg_31 {
+  ._sheet_sz96n_31 {
     animation: none;
   }
 }
-._header_1vpmg_80 {
+._header_sz96n_80 {
   display: flex;
   justify-content: flex-end;
   border-bottom: 1px solid rgba(249, 250, 250, 0.2);
 }
-._close_1vpmg_86 {
+._close_sz96n_86 {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -5506,19 +5511,19 @@
   color: inherit;
   cursor: pointer;
 }
-._close_1vpmg_86:focus-visible {
+._close_sz96n_86:focus-visible {
   outline: none;
   box-shadow: var(--focus-ring);
   border-radius: var(--radius-4);
 }
-._list_1vpmg_105 {
+._list_sz96n_105 {
   list-style: none;
   margin: 0;
   padding: var(--space-6) 0;
   display: flex;
   flex-direction: column;
 }
-._row_1vpmg_120 {
+._row_sz96n_120 {
   display: flex;
   align-items: center;
   gap: var(--space-8);
@@ -5531,39 +5536,39 @@
   text-align: left;
   cursor: pointer;
 }
-._row_1vpmg_120[disabled] {
+._row_sz96n_120[disabled] {
   cursor: default;
 }
-._row_1vpmg_120:focus-visible {
+._row_sz96n_120:focus-visible {
   outline: none;
   box-shadow: var(--focus-ring);
 }
-._icon_1vpmg_149 {
+._icon_sz96n_149 {
   display: inline-flex;
   flex: 0 0 24px;
   width: 24px;
   height: 24px;
   color: var(--color-text-default);
 }
-._text_1vpmg_157 {
+._text_sz96n_157 {
   display: flex;
   flex: 1 1 auto;
   flex-direction: column;
   gap: var(--space-2);
   min-width: 0;
 }
-._title_1vpmg_165 {
+._title_sz96n_165 {
   font-size: var(--type-paragraph-size);
   font-weight: var(--font-weight-bold);
   line-height: 1;
   color: var(--color-text-default);
 }
-._subtitle_1vpmg_172 {
+._subtitle_sz96n_172 {
   font-size: var(--type-trimmed-xs-size);
   line-height: 1.52;
   color: var(--color-text-subtle);
 }
-._chevron_1vpmg_178 {
+._chevron_sz96n_178 {
   display: inline-flex;
   flex: 0 0 16px;
   width: 16px;
@@ -5571,24 +5576,24 @@
   color: var(--color-text-subtle);
 }
 @media (min-width: 1200px) {
-  ._dropdown_1vpmg_187 {
+  ._dropdown_sz96n_187 {
     padding: 0;
   }
-  ._dropdown_1vpmg_187 ._scrim_1vpmg_21 {
+  ._dropdown_sz96n_187 ._scrim_sz96n_21 {
     background: transparent;
   }
-  ._dropdown_1vpmg_187 ._sheet_1vpmg_31 {
+  ._dropdown_sz96n_187 ._sheet_sz96n_31 {
     position: absolute;
     top: calc(var(--shop-chrome-top, 0px) + 64px);
-    right: calc(max(176px, calc((100% - 1088px) / 2)) - 112px);
-    width: 320px;
-    max-width: 320px;
+    right: calc(max(176px, calc((100% - 1088px) / 2)) - 8px);
+    width: 343px;
+    max-width: 343px;
     max-height: calc(100dvh - var(--shop-chrome-top, 0px) - 80px);
     border: 1px solid rgba(249, 250, 250, 0.2);
     background: #f9fafa;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
   }
-  ._dropdown_1vpmg_187 ._list_1vpmg_105 li:not(:last-child) ._row_1vpmg_120 {
+  ._dropdown_sz96n_187 ._list_sz96n_105 li:not(:last-child) ._row_sz96n_120 {
     border-bottom: 1px solid #dddedf;
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nok-integration/storefront-react",
-  "version": "0.29.0",
+  "version": "0.29.1",
   "description": "Mountable React storefront components: catalogue, product detail and cart, mounted directly into a host DOM tree. No iframe.",
   "license": "UNLICENSED",
   "type": "module",