@nok-integration/storefront-react 0.19.37 → 0.19.39

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -5476,8 +5476,8 @@ function Skeleton({ width, height, radius, className, circle }) {
5476
5476
  style
5477
5477
  });
5478
5478
  }
5479
- const surface$1 = "_surface_cfqo9_10";
5480
- const fill = "_fill_cfqo9_35";
5479
+ const surface$1 = "_surface_zq8bq_10";
5480
+ const fill = "_fill_zq8bq_35";
5481
5481
  const styles$O = {
5482
5482
  surface: surface$1,
5483
5483
  fill
@@ -6551,23 +6551,27 @@ function renderValue(key, pricing, format, t) {
6551
6551
  }
6552
6552
  return key === "discount" ? null : format(pricing[key]);
6553
6553
  }
6554
- const lines$1 = "_lines_dpw0l_19";
6555
- const line$2 = "_line_dpw0l_19";
6556
- const thumb$2 = "_thumb_dpw0l_34";
6557
- const image$9 = "_image_dpw0l_44";
6558
- const placeholder$8 = "_placeholder_dpw0l_51";
6559
- const lineBody = "_lineBody_dpw0l_56";
6560
- const lineText = "_lineText_dpw0l_65";
6561
- const lineTitle = "_lineTitle_dpw0l_75";
6562
- const lineMeta = "_lineMeta_dpw0l_107";
6563
- const detail$1 = "_detail_dpw0l_104";
6564
- const linePrice = "_linePrice_dpw0l_128";
6565
- const paid$3 = "_paid_dpw0l_140";
6566
- const was$4 = "_was_dpw0l_153";
6567
- const card$4 = "_card_dpw0l_176";
6568
- const cardTitle = "_cardTitle_dpw0l_184";
6569
- const cardBody = "_cardBody_dpw0l_196";
6570
- const summaryCard = "_summaryCard_dpw0l_168";
6554
+ const lines$1 = "_lines_10z1i_19";
6555
+ const line$2 = "_line_10z1i_19";
6556
+ const thumb$2 = "_thumb_10z1i_34";
6557
+ const image$9 = "_image_10z1i_44";
6558
+ const placeholder$8 = "_placeholder_10z1i_51";
6559
+ const lineBody = "_lineBody_10z1i_56";
6560
+ const lineText = "_lineText_10z1i_65";
6561
+ const lineTitle = "_lineTitle_10z1i_75";
6562
+ const lineMeta = "_lineMeta_10z1i_107";
6563
+ const detail$1 = "_detail_10z1i_104";
6564
+ const linePrice = "_linePrice_10z1i_128";
6565
+ const paid$3 = "_paid_10z1i_140";
6566
+ const was$4 = "_was_10z1i_153";
6567
+ const card$4 = "_card_10z1i_176";
6568
+ const cardTitle = "_cardTitle_10z1i_184";
6569
+ const cardBody = "_cardBody_10z1i_196";
6570
+ const summaryCard = "_summaryCard_10z1i_168";
6571
+ const itemsHeader = "_itemsHeader_10z1i_14";
6572
+ const itemsTitle = "_itemsTitle_10z1i_239";
6573
+ const itemsCount = "_itemsCount_10z1i_250";
6574
+ const cardLines = "_cardLines_10z1i_269";
6571
6575
  const styles$F = {
6572
6576
  lines: lines$1,
6573
6577
  line: line$2,
@@ -6585,7 +6589,11 @@ const styles$F = {
6585
6589
  card: card$4,
6586
6590
  cardTitle,
6587
6591
  cardBody,
6588
- summaryCard
6592
+ summaryCard,
6593
+ itemsHeader,
6594
+ itemsTitle,
6595
+ itemsCount,
6596
+ cardLines
6589
6597
  };
6590
6598
  const SUMMARY_ROWS = [{
6591
6599
  label: "Subtotal",
@@ -6665,6 +6673,29 @@ function OrderLines({ order }) {
6665
6673
  }, item2.line_ref))
6666
6674
  });
6667
6675
  }
6676
+ function OrderItemsCard({ order }) {
6677
+ const t = useT();
6678
+ const itemCount = order.items.reduce((n, i) => n + i.qty, 0);
6679
+ return jsxs("section", {
6680
+ className: styles$F.card,
6681
+ "aria-label": t("Items"),
6682
+ children: [jsxs("div", {
6683
+ className: styles$F.itemsHeader,
6684
+ children: [jsx("h2", {
6685
+ className: styles$F.itemsTitle,
6686
+ children: "Items"
6687
+ }), jsx("span", {
6688
+ className: styles$F.itemsCount,
6689
+ children: itemCount
6690
+ })]
6691
+ }), jsx("ul", {
6692
+ className: [styles$F.lines, styles$F.cardLines].join(" "),
6693
+ children: order.items.map((item2) => jsx(OrderLine, {
6694
+ item: item2
6695
+ }, item2.line_ref))
6696
+ })]
6697
+ });
6698
+ }
6668
6699
  function ShippingAddressCard({ order }) {
6669
6700
  const t = useT();
6670
6701
  return jsxs("section", {
@@ -7713,7 +7744,7 @@ function OrderTrackingContent({ orderRef, locale: localeProp, onStartReturn, onO
7713
7744
  loading: reordering,
7714
7745
  onClick: () => void reorder(order),
7715
7746
  children: "Reorder"
7716
- }), jsx(OrderLines, {
7747
+ }), jsx(OrderItemsCard, {
7717
7748
  order
7718
7749
  }), jsx(ShippingAddressCard, {
7719
7750
  order
@@ -11609,4 +11640,4 @@ export {
11609
11640
  useToast,
11610
11641
  variantLabel
11611
11642
  };
11612
-
11643
+ //# sourceMappingURL=index.mjs.map
@@ -5476,8 +5476,8 @@ function Skeleton({ width, height, radius, className, circle }) {
5476
5476
  style
5477
5477
  });
5478
5478
  }
5479
- const surface$1 = "_surface_cfqo9_10";
5480
- const fill = "_fill_cfqo9_35";
5479
+ const surface$1 = "_surface_zq8bq_10";
5480
+ const fill = "_fill_zq8bq_35";
5481
5481
  const styles$O = {
5482
5482
  surface: surface$1,
5483
5483
  fill
@@ -6551,23 +6551,27 @@ function renderValue(key, pricing, format, t) {
6551
6551
  }
6552
6552
  return key === "discount" ? null : format(pricing[key]);
6553
6553
  }
6554
- const lines$1 = "_lines_dpw0l_19";
6555
- const line$2 = "_line_dpw0l_19";
6556
- const thumb$2 = "_thumb_dpw0l_34";
6557
- const image$9 = "_image_dpw0l_44";
6558
- const placeholder$8 = "_placeholder_dpw0l_51";
6559
- const lineBody = "_lineBody_dpw0l_56";
6560
- const lineText = "_lineText_dpw0l_65";
6561
- const lineTitle = "_lineTitle_dpw0l_75";
6562
- const lineMeta = "_lineMeta_dpw0l_107";
6563
- const detail$1 = "_detail_dpw0l_104";
6564
- const linePrice = "_linePrice_dpw0l_128";
6565
- const paid$3 = "_paid_dpw0l_140";
6566
- const was$4 = "_was_dpw0l_153";
6567
- const card$4 = "_card_dpw0l_176";
6568
- const cardTitle = "_cardTitle_dpw0l_184";
6569
- const cardBody = "_cardBody_dpw0l_196";
6570
- const summaryCard = "_summaryCard_dpw0l_168";
6554
+ const lines$1 = "_lines_10z1i_19";
6555
+ const line$2 = "_line_10z1i_19";
6556
+ const thumb$2 = "_thumb_10z1i_34";
6557
+ const image$9 = "_image_10z1i_44";
6558
+ const placeholder$8 = "_placeholder_10z1i_51";
6559
+ const lineBody = "_lineBody_10z1i_56";
6560
+ const lineText = "_lineText_10z1i_65";
6561
+ const lineTitle = "_lineTitle_10z1i_75";
6562
+ const lineMeta = "_lineMeta_10z1i_107";
6563
+ const detail$1 = "_detail_10z1i_104";
6564
+ const linePrice = "_linePrice_10z1i_128";
6565
+ const paid$3 = "_paid_10z1i_140";
6566
+ const was$4 = "_was_10z1i_153";
6567
+ const card$4 = "_card_10z1i_176";
6568
+ const cardTitle = "_cardTitle_10z1i_184";
6569
+ const cardBody = "_cardBody_10z1i_196";
6570
+ const summaryCard = "_summaryCard_10z1i_168";
6571
+ const itemsHeader = "_itemsHeader_10z1i_14";
6572
+ const itemsTitle = "_itemsTitle_10z1i_239";
6573
+ const itemsCount = "_itemsCount_10z1i_250";
6574
+ const cardLines = "_cardLines_10z1i_269";
6571
6575
  const styles$F = {
6572
6576
  lines: lines$1,
6573
6577
  line: line$2,
@@ -6585,7 +6589,11 @@ const styles$F = {
6585
6589
  card: card$4,
6586
6590
  cardTitle,
6587
6591
  cardBody,
6588
- summaryCard
6592
+ summaryCard,
6593
+ itemsHeader,
6594
+ itemsTitle,
6595
+ itemsCount,
6596
+ cardLines
6589
6597
  };
6590
6598
  const SUMMARY_ROWS = [{
6591
6599
  label: "Subtotal",
@@ -6665,6 +6673,29 @@ function OrderLines({ order }) {
6665
6673
  }, item2.line_ref))
6666
6674
  });
6667
6675
  }
6676
+ function OrderItemsCard({ order }) {
6677
+ const t = useT();
6678
+ const itemCount = order.items.reduce((n, i) => n + i.qty, 0);
6679
+ return jsxs("section", {
6680
+ className: styles$F.card,
6681
+ "aria-label": t("Items"),
6682
+ children: [jsxs("div", {
6683
+ className: styles$F.itemsHeader,
6684
+ children: [jsx("h2", {
6685
+ className: styles$F.itemsTitle,
6686
+ children: "Items"
6687
+ }), jsx("span", {
6688
+ className: styles$F.itemsCount,
6689
+ children: itemCount
6690
+ })]
6691
+ }), jsx("ul", {
6692
+ className: [styles$F.lines, styles$F.cardLines].join(" "),
6693
+ children: order.items.map((item2) => jsx(OrderLine, {
6694
+ item: item2
6695
+ }, item2.line_ref))
6696
+ })]
6697
+ });
6698
+ }
6668
6699
  function ShippingAddressCard({ order }) {
6669
6700
  const t = useT();
6670
6701
  return jsxs("section", {
@@ -7713,7 +7744,7 @@ function OrderTrackingContent({ orderRef, locale: localeProp, onStartReturn, onO
7713
7744
  loading: reordering,
7714
7745
  onClick: () => void reorder(order),
7715
7746
  children: "Reorder"
7716
- }), jsx(OrderLines, {
7747
+ }), jsx(OrderItemsCard, {
7717
7748
  order
7718
7749
  }), jsx(ShippingAddressCard, {
7719
7750
  order
@@ -11609,4 +11640,4 @@ export {
11609
11640
  useToast,
11610
11641
  variantLabel
11611
11642
  };
11612
-
11643
+ //# sourceMappingURL=storefront.mjs.map
@@ -216,7 +216,7 @@
216
216
  background-position: 0 50%;
217
217
  }
218
218
  }
219
- ._surface_cfqo9_10 {
219
+ ._surface_zq8bq_10 {
220
220
  font-family: var(--font-family-base);
221
221
  font-weight: var(--font-weight-regular);
222
222
  font-size: var(--type-paragraph-size);
@@ -226,43 +226,44 @@
226
226
  -webkit-font-smoothing: antialiased;
227
227
  text-rendering: optimizeLegibility;
228
228
  }
229
- ._surface_cfqo9_10 *,
230
- ._surface_cfqo9_10 *::before,
231
- ._surface_cfqo9_10 *::after {
229
+ ._surface_zq8bq_10 *,
230
+ ._surface_zq8bq_10 *::before,
231
+ ._surface_zq8bq_10 *::after {
232
232
  box-sizing: border-box;
233
233
  }
234
- ._fill_cfqo9_35 {
234
+ ._fill_zq8bq_35 {
235
235
  min-height: 100vh;
236
236
  min-height: calc(100dvh - var(--surface-top, 0px));
237
+ box-shadow: 0 calc(100lvh - 100dvh) 0 var(--color-surface-default);
237
238
  }
238
- :where(._surface_cfqo9_10) :where(h1, h2, h3) {
239
+ :where(._surface_zq8bq_10) :where(h1, h2, h3) {
239
240
  margin: 0;
240
241
  font-weight: var(--font-weight-bold);
241
242
  }
242
- :where(._surface_cfqo9_10) :where(h1) {
243
+ :where(._surface_zq8bq_10) :where(h1) {
243
244
  font-size: var(--type-heading-lg-size);
244
245
  line-height: var(--type-heading-lg-line);
245
246
  }
246
- :where(._surface_cfqo9_10) :where(h2) {
247
+ :where(._surface_zq8bq_10) :where(h2) {
247
248
  font-size: var(--type-heading-md-size);
248
249
  line-height: var(--type-heading-md-line);
249
250
  }
250
- ._surface_cfqo9_10 a:not([class]) {
251
+ ._surface_zq8bq_10 a:not([class]) {
251
252
  color: inherit;
252
253
  }
253
- ._surface_cfqo9_10 img {
254
+ ._surface_zq8bq_10 img {
254
255
  max-width: 100%;
255
256
  height: auto;
256
257
  }
257
- ._surface_cfqo9_10 :focus-visible {
258
+ ._surface_zq8bq_10 :focus-visible {
258
259
  outline: 2px solid var(--color-surface-max);
259
260
  outline-offset: 2px;
260
261
  border-radius: var(--radius-4);
261
262
  }
262
263
  @media (prefers-reduced-motion: reduce) {
263
- ._surface_cfqo9_10 *,
264
- ._surface_cfqo9_10 *::before,
265
- ._surface_cfqo9_10 *::after {
264
+ ._surface_zq8bq_10 *,
265
+ ._surface_zq8bq_10 *::before,
266
+ ._surface_zq8bq_10 *::after {
266
267
  animation-duration: 0.001ms !important;
267
268
  animation-iteration-count: 1 !important;
268
269
  transition-duration: 0.001ms !important;
@@ -686,7 +687,7 @@
686
687
  ._row_1hsxt_16._discount_1hsxt_69 dd {
687
688
  color: var(--color-state-text-success);
688
689
  }
689
- ._lines_dpw0l_19 {
690
+ ._lines_10z1i_19 {
690
691
  list-style: none;
691
692
  margin: 0;
692
693
  padding: 0;
@@ -694,12 +695,12 @@
694
695
  flex-direction: column;
695
696
  gap: var(--space-16);
696
697
  }
697
- ._line_dpw0l_19 {
698
+ ._line_10z1i_19 {
698
699
  display: flex;
699
700
  align-items: center;
700
701
  gap: var(--space-12);
701
702
  }
702
- ._thumb_dpw0l_34 {
703
+ ._thumb_10z1i_34 {
703
704
  position: relative;
704
705
  flex-shrink: 0;
705
706
  width: 48px;
@@ -708,15 +709,15 @@
708
709
  overflow: hidden;
709
710
  background: var(--color-surface-soft);
710
711
  }
711
- ._image_dpw0l_44 {
712
+ ._image_10z1i_44 {
712
713
  object-fit: cover;
713
714
  object-position: top;
714
715
  }
715
- ._placeholder_dpw0l_51 {
716
+ ._placeholder_10z1i_51 {
716
717
  width: 100%;
717
718
  height: 100%;
718
719
  }
719
- ._lineBody_dpw0l_56 {
720
+ ._lineBody_10z1i_56 {
720
721
  display: flex;
721
722
  align-items: flex-start;
722
723
  justify-content: space-between;
@@ -724,14 +725,14 @@
724
725
  flex: 1 1 0;
725
726
  min-width: 0;
726
727
  }
727
- ._lineText_dpw0l_65 {
728
+ ._lineText_10z1i_65 {
728
729
  display: flex;
729
730
  flex-direction: column;
730
731
  gap: var(--space-12);
731
732
  flex: 1 1 0;
732
733
  min-width: 0;
733
734
  }
734
- ._lineTitle_dpw0l_75 {
735
+ ._lineTitle_10z1i_75 {
735
736
  margin: -6px 0;
736
737
  padding: 6px 0;
737
738
  font-size: var(--type-trimmed-sm-size);
@@ -741,7 +742,7 @@
741
742
  overflow: hidden;
742
743
  text-overflow: ellipsis;
743
744
  }
744
- ._lineMeta_dpw0l_107 {
745
+ ._lineMeta_10z1i_107 {
745
746
  display: flex;
746
747
  align-items: center;
747
748
  flex-wrap: wrap;
@@ -751,10 +752,10 @@
751
752
  line-height: 11px;
752
753
  color: var(--color-text-subtle);
753
754
  }
754
- ._detail_dpw0l_104 {
755
+ ._detail_10z1i_104 {
755
756
  white-space: nowrap;
756
757
  }
757
- ._linePrice_dpw0l_128 {
758
+ ._linePrice_10z1i_128 {
758
759
  display: flex;
759
760
  flex-direction: column;
760
761
  align-items: flex-end;
@@ -763,12 +764,12 @@
763
764
  white-space: nowrap;
764
765
  font-variant-numeric: tabular-nums;
765
766
  }
766
- ._paid_dpw0l_140 {
767
+ ._paid_10z1i_140 {
767
768
  font-size: var(--type-trimmed-md-size);
768
769
  line-height: 11px;
769
770
  font-weight: var(--font-weight-bold);
770
771
  }
771
- ._was_dpw0l_153 {
772
+ ._was_10z1i_153 {
772
773
  display: flex;
773
774
  align-items: center;
774
775
  justify-content: flex-end;
@@ -778,14 +779,14 @@
778
779
  color: var(--color-text-disabled);
779
780
  text-decoration: line-through;
780
781
  }
781
- ._card_dpw0l_176 {
782
+ ._card_10z1i_176 {
782
783
  display: flex;
783
784
  flex-direction: column;
784
785
  box-shadow: inset 0 0 0 1px var(--color-border-default);
785
786
  border-radius: var(--radius-18);
786
787
  overflow: hidden;
787
788
  }
788
- ._cardTitle_dpw0l_184 {
789
+ ._cardTitle_10z1i_184 {
789
790
  display: flex;
790
791
  align-items: center;
791
792
  margin: 0;
@@ -796,18 +797,53 @@
796
797
  line-height: 1.38;
797
798
  font-weight: var(--font-weight-bold);
798
799
  }
799
- ._cardBody_dpw0l_196 {
800
+ ._cardBody_10z1i_196 {
800
801
  margin: 0;
801
802
  padding: var(--space-16);
802
803
  font-size: var(--type-trimmed-sm-size);
803
804
  line-height: 1.5;
804
805
  }
805
- ._summaryCard_dpw0l_168 {
806
+ ._summaryCard_10z1i_168 {
806
807
  background: var(--color-surface-soft);
807
808
  }
808
- ._summaryCard_dpw0l_168 > :last-child {
809
+ ._summaryCard_10z1i_168 > :last-child {
809
810
  padding: 0 var(--space-16);
810
811
  }
812
+ ._itemsHeader_10z1i_14 {
813
+ display: flex;
814
+ align-items: center;
815
+ gap: var(--space-12);
816
+ min-height: 60px;
817
+ padding: 0 var(--space-16);
818
+ border-bottom: 1px solid var(--color-border-default);
819
+ }
820
+ ._itemsTitle_10z1i_239 {
821
+ flex: 1 0 0;
822
+ min-width: 0;
823
+ margin: 0;
824
+ font-size: var(--type-heading-md-size);
825
+ line-height: 1.38;
826
+ font-weight: var(--font-weight-bold);
827
+ }
828
+ ._itemsCount_10z1i_250 {
829
+ display: inline-flex;
830
+ align-items: center;
831
+ justify-content: center;
832
+ flex-shrink: 0;
833
+ min-width: 16px;
834
+ height: 16px;
835
+ padding: 0 var(--space-4);
836
+ border-radius: var(--radius-full);
837
+ background: var(--color-surface-subtle);
838
+ font-size: var(--type-trimmed-xs-size);
839
+ font-weight: var(--font-weight-bold);
840
+ letter-spacing: 0.12px;
841
+ font-variant-numeric: tabular-nums;
842
+ }
843
+ ._cardLines_10z1i_269 {
844
+ gap: var(--space-12);
845
+ padding: var(--space-12) var(--space-16);
846
+ }
811
847
  ._header_1f3nh_7 {
812
848
  display: flex;
813
849
  align-items: flex-start;
package/dist/styles.css CHANGED
@@ -216,7 +216,7 @@
216
216
  background-position: 0 50%;
217
217
  }
218
218
  }
219
- ._surface_cfqo9_10 {
219
+ ._surface_zq8bq_10 {
220
220
  font-family: var(--font-family-base);
221
221
  font-weight: var(--font-weight-regular);
222
222
  font-size: var(--type-paragraph-size);
@@ -226,43 +226,44 @@
226
226
  -webkit-font-smoothing: antialiased;
227
227
  text-rendering: optimizeLegibility;
228
228
  }
229
- ._surface_cfqo9_10 *,
230
- ._surface_cfqo9_10 *::before,
231
- ._surface_cfqo9_10 *::after {
229
+ ._surface_zq8bq_10 *,
230
+ ._surface_zq8bq_10 *::before,
231
+ ._surface_zq8bq_10 *::after {
232
232
  box-sizing: border-box;
233
233
  }
234
- ._fill_cfqo9_35 {
234
+ ._fill_zq8bq_35 {
235
235
  min-height: 100vh;
236
236
  min-height: calc(100dvh - var(--surface-top, 0px));
237
+ box-shadow: 0 calc(100lvh - 100dvh) 0 var(--color-surface-default);
237
238
  }
238
- :where(._surface_cfqo9_10) :where(h1, h2, h3) {
239
+ :where(._surface_zq8bq_10) :where(h1, h2, h3) {
239
240
  margin: 0;
240
241
  font-weight: var(--font-weight-bold);
241
242
  }
242
- :where(._surface_cfqo9_10) :where(h1) {
243
+ :where(._surface_zq8bq_10) :where(h1) {
243
244
  font-size: var(--type-heading-lg-size);
244
245
  line-height: var(--type-heading-lg-line);
245
246
  }
246
- :where(._surface_cfqo9_10) :where(h2) {
247
+ :where(._surface_zq8bq_10) :where(h2) {
247
248
  font-size: var(--type-heading-md-size);
248
249
  line-height: var(--type-heading-md-line);
249
250
  }
250
- ._surface_cfqo9_10 a:not([class]) {
251
+ ._surface_zq8bq_10 a:not([class]) {
251
252
  color: inherit;
252
253
  }
253
- ._surface_cfqo9_10 img {
254
+ ._surface_zq8bq_10 img {
254
255
  max-width: 100%;
255
256
  height: auto;
256
257
  }
257
- ._surface_cfqo9_10 :focus-visible {
258
+ ._surface_zq8bq_10 :focus-visible {
258
259
  outline: 2px solid var(--color-surface-max);
259
260
  outline-offset: 2px;
260
261
  border-radius: var(--radius-4);
261
262
  }
262
263
  @media (prefers-reduced-motion: reduce) {
263
- ._surface_cfqo9_10 *,
264
- ._surface_cfqo9_10 *::before,
265
- ._surface_cfqo9_10 *::after {
264
+ ._surface_zq8bq_10 *,
265
+ ._surface_zq8bq_10 *::before,
266
+ ._surface_zq8bq_10 *::after {
266
267
  animation-duration: 0.001ms !important;
267
268
  animation-iteration-count: 1 !important;
268
269
  transition-duration: 0.001ms !important;
@@ -686,7 +687,7 @@
686
687
  ._row_1hsxt_16._discount_1hsxt_69 dd {
687
688
  color: var(--color-state-text-success);
688
689
  }
689
- ._lines_dpw0l_19 {
690
+ ._lines_10z1i_19 {
690
691
  list-style: none;
691
692
  margin: 0;
692
693
  padding: 0;
@@ -694,12 +695,12 @@
694
695
  flex-direction: column;
695
696
  gap: var(--space-16);
696
697
  }
697
- ._line_dpw0l_19 {
698
+ ._line_10z1i_19 {
698
699
  display: flex;
699
700
  align-items: center;
700
701
  gap: var(--space-12);
701
702
  }
702
- ._thumb_dpw0l_34 {
703
+ ._thumb_10z1i_34 {
703
704
  position: relative;
704
705
  flex-shrink: 0;
705
706
  width: 48px;
@@ -708,15 +709,15 @@
708
709
  overflow: hidden;
709
710
  background: var(--color-surface-soft);
710
711
  }
711
- ._image_dpw0l_44 {
712
+ ._image_10z1i_44 {
712
713
  object-fit: cover;
713
714
  object-position: top;
714
715
  }
715
- ._placeholder_dpw0l_51 {
716
+ ._placeholder_10z1i_51 {
716
717
  width: 100%;
717
718
  height: 100%;
718
719
  }
719
- ._lineBody_dpw0l_56 {
720
+ ._lineBody_10z1i_56 {
720
721
  display: flex;
721
722
  align-items: flex-start;
722
723
  justify-content: space-between;
@@ -724,14 +725,14 @@
724
725
  flex: 1 1 0;
725
726
  min-width: 0;
726
727
  }
727
- ._lineText_dpw0l_65 {
728
+ ._lineText_10z1i_65 {
728
729
  display: flex;
729
730
  flex-direction: column;
730
731
  gap: var(--space-12);
731
732
  flex: 1 1 0;
732
733
  min-width: 0;
733
734
  }
734
- ._lineTitle_dpw0l_75 {
735
+ ._lineTitle_10z1i_75 {
735
736
  margin: -6px 0;
736
737
  padding: 6px 0;
737
738
  font-size: var(--type-trimmed-sm-size);
@@ -741,7 +742,7 @@
741
742
  overflow: hidden;
742
743
  text-overflow: ellipsis;
743
744
  }
744
- ._lineMeta_dpw0l_107 {
745
+ ._lineMeta_10z1i_107 {
745
746
  display: flex;
746
747
  align-items: center;
747
748
  flex-wrap: wrap;
@@ -751,10 +752,10 @@
751
752
  line-height: 11px;
752
753
  color: var(--color-text-subtle);
753
754
  }
754
- ._detail_dpw0l_104 {
755
+ ._detail_10z1i_104 {
755
756
  white-space: nowrap;
756
757
  }
757
- ._linePrice_dpw0l_128 {
758
+ ._linePrice_10z1i_128 {
758
759
  display: flex;
759
760
  flex-direction: column;
760
761
  align-items: flex-end;
@@ -763,12 +764,12 @@
763
764
  white-space: nowrap;
764
765
  font-variant-numeric: tabular-nums;
765
766
  }
766
- ._paid_dpw0l_140 {
767
+ ._paid_10z1i_140 {
767
768
  font-size: var(--type-trimmed-md-size);
768
769
  line-height: 11px;
769
770
  font-weight: var(--font-weight-bold);
770
771
  }
771
- ._was_dpw0l_153 {
772
+ ._was_10z1i_153 {
772
773
  display: flex;
773
774
  align-items: center;
774
775
  justify-content: flex-end;
@@ -778,14 +779,14 @@
778
779
  color: var(--color-text-disabled);
779
780
  text-decoration: line-through;
780
781
  }
781
- ._card_dpw0l_176 {
782
+ ._card_10z1i_176 {
782
783
  display: flex;
783
784
  flex-direction: column;
784
785
  box-shadow: inset 0 0 0 1px var(--color-border-default);
785
786
  border-radius: var(--radius-18);
786
787
  overflow: hidden;
787
788
  }
788
- ._cardTitle_dpw0l_184 {
789
+ ._cardTitle_10z1i_184 {
789
790
  display: flex;
790
791
  align-items: center;
791
792
  margin: 0;
@@ -796,18 +797,53 @@
796
797
  line-height: 1.38;
797
798
  font-weight: var(--font-weight-bold);
798
799
  }
799
- ._cardBody_dpw0l_196 {
800
+ ._cardBody_10z1i_196 {
800
801
  margin: 0;
801
802
  padding: var(--space-16);
802
803
  font-size: var(--type-trimmed-sm-size);
803
804
  line-height: 1.5;
804
805
  }
805
- ._summaryCard_dpw0l_168 {
806
+ ._summaryCard_10z1i_168 {
806
807
  background: var(--color-surface-soft);
807
808
  }
808
- ._summaryCard_dpw0l_168 > :last-child {
809
+ ._summaryCard_10z1i_168 > :last-child {
809
810
  padding: 0 var(--space-16);
810
811
  }
812
+ ._itemsHeader_10z1i_14 {
813
+ display: flex;
814
+ align-items: center;
815
+ gap: var(--space-12);
816
+ min-height: 60px;
817
+ padding: 0 var(--space-16);
818
+ border-bottom: 1px solid var(--color-border-default);
819
+ }
820
+ ._itemsTitle_10z1i_239 {
821
+ flex: 1 0 0;
822
+ min-width: 0;
823
+ margin: 0;
824
+ font-size: var(--type-heading-md-size);
825
+ line-height: 1.38;
826
+ font-weight: var(--font-weight-bold);
827
+ }
828
+ ._itemsCount_10z1i_250 {
829
+ display: inline-flex;
830
+ align-items: center;
831
+ justify-content: center;
832
+ flex-shrink: 0;
833
+ min-width: 16px;
834
+ height: 16px;
835
+ padding: 0 var(--space-4);
836
+ border-radius: var(--radius-full);
837
+ background: var(--color-surface-subtle);
838
+ font-size: var(--type-trimmed-xs-size);
839
+ font-weight: var(--font-weight-bold);
840
+ letter-spacing: 0.12px;
841
+ font-variant-numeric: tabular-nums;
842
+ }
843
+ ._cardLines_10z1i_269 {
844
+ gap: var(--space-12);
845
+ padding: var(--space-12) var(--space-16);
846
+ }
811
847
  ._header_1f3nh_7 {
812
848
  display: flex;
813
849
  align-items: flex-start;
package/package.json CHANGED
@@ -1,11 +1,14 @@
1
1
  {
2
2
  "name": "@nok-integration/storefront-react",
3
- "version": "0.19.37",
3
+ "version": "0.19.39",
4
4
  "description": "Mountable React storefront components: catalogue, product detail and cart, mounted directly into a host DOM tree. No iframe.",
5
5
  "license": "UNLICENSED",
6
+ "publishConfig": {
7
+ "access": "public",
8
+ "registry": "https://registry.npmjs.org/"
9
+ },
6
10
  "type": "module",
7
11
  "main": "./dist/index.mjs",
8
- "module": "./dist/index.mjs",
9
12
  "types": "./dist/index.d.ts",
10
13
  "exports": {
11
14
  ".": {
@@ -20,18 +23,34 @@
20
23
  "dist",
21
24
  "!dist/**/*.map"
22
25
  ],
23
- "sideEffects": [
24
- "*.css"
25
- ],
26
+ "scripts": {
27
+ "build": "pnpm build:package && pnpm build:standalone",
28
+ "build:package": "vite build",
29
+ "build:standalone": "BUILD_TARGET=standalone vite build",
30
+ "typecheck": "tsc --noEmit",
31
+ "build:partner": "PARTNER_DROP=1 pnpm build && pnpm pack"
32
+ },
26
33
  "peerDependencies": {
27
34
  "react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
28
35
  "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
29
36
  },
37
+ "devDependencies": {
38
+ "@microsoft/api-extractor": "^7.58.12",
39
+ "@raqmix/contracts": "^2.0.0",
40
+ "@types/react": "^19.1.0",
41
+ "@types/react-dom": "^19.1.0",
42
+ "@vitejs/plugin-react": "^4.3.4",
43
+ "esbuild": "^0.28.1",
44
+ "terser": "^5.50.0",
45
+ "typescript": "^5.7.3",
46
+ "vite": "^7.0.0",
47
+ "vite-plugin-dts": "^5.0.3"
48
+ },
49
+ "module": "./dist/index.mjs",
50
+ "sideEffects": [
51
+ "*.css"
52
+ ],
30
53
  "dependencies": {
31
54
  "zod": "^3.24.1"
32
- },
33
- "publishConfig": {
34
- "access": "public",
35
- "registry": "https://registry.npmjs.org/"
36
55
  }
37
56
  }