@telia/teddy 0.7.39 → 0.7.41

package/dist/style.css

@@ -1,4 +1,162 @@
-@charset 'UTF-8';._teddy-spinner--xxs_ywden_1 {
+@charset 'UTF-8';@layer icon {
+  ._teddy-icon_1ur3a_2 {
+    display: inline;
+    align-self: center;
+    fill: currentColor;
+    flex-shrink: 0;
+  }
+  ._teddy-icon--font_1ur3a_8 {
+    width: 1em;
+    height: 1em;
+  }
+  ._teddy-icon--xxs_1ur3a_12 {
+    width: var(--teddy-spacing-150);
+    height: var(--teddy-spacing-150);
+  }
+  ._teddy-icon--xs_1ur3a_16 {
+    width: var(--teddy-spacing-200);
+    height: var(--teddy-spacing-200);
+  }
+  ._teddy-icon--sm_1ur3a_20 {
+    width: var(--teddy-spacing-250);
+    height: var(--teddy-spacing-250);
+  }
+  ._teddy-icon--md_1ur3a_24 {
+    width: var(--teddy-spacing-300);
+    height: var(--teddy-spacing-300);
+  }
+  ._teddy-icon--lg_1ur3a_28 {
+    width: var(--teddy-spacing-400);
+    height: var(--teddy-spacing-400);
+  }
+  ._teddy-icon--xl_1ur3a_32 {
+    width: var(--teddy-spacing-600);
+    height: var(--teddy-spacing-600);
+  }
+  ._teddy-icon-with-children_1ur3a_36 {
+    display: inline-flex;
+    align-items: center;
+    font-family: var(--teddy-typography-family-default);
+    gap: var(--teddy-spacing-100);
+  }
+}._teddy-top-row-buttons_1ytqf_1 {
+  width: 100%;
+}
+._teddy-top-row-buttons__track_1ytqf_4 {
+  display: flex;
+  gap: var(--teddy-spacing-200);
+  overflow-x: auto;
+  scroll-snap-type: x mandatory;
+  scroll-behavior: smooth;
+  scrollbar-width: none;
+  padding-bottom: var(--teddy-spacing-50);
+  width: 100%;
+}
+._teddy-top-row-buttons__track_1ytqf_4::-webkit-scrollbar {
+  display: none;
+}
+._teddy-top-row-buttons__track--centered_1ytqf_17 {
+  justify-content: center;
+}
+._teddy-top-row-buttons__track--scroll_1ytqf_20 {
+  justify-content: flex-start;
+}
+._teddy-top-row-buttons__item_1ytqf_23 {
+  flex: 0 0 auto;
+  scroll-snap-align: start;
+}
+._teddy-top-row-buttons__button_1ytqf_27 {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--teddy-spacing-100);
+  padding: var(--teddy-spacing-150) var(--teddy-spacing-200);
+  border-radius: var(--teddy-border-radius-md);
+  text-decoration: none;
+  color: inherit;
+  min-height: 44px;
+  white-space: nowrap;
+  cursor: pointer;
+  font-family: var(--teddy-typography-family-default);
+  font-size: var(--teddy-typography-scale-100);
+  transition-property: background-color;
+  transition-duration: var(--teddy-motion-duration-150);
+  transition-timing-function: var(--teddy-motion-easing-ease-in-out);
+  position: relative;
+}
+._teddy-top-row-buttons__button_1ytqf_27:focus::before {
+  border-radius: inherit;
+  box-shadow: 0 0 0 var(--teddy-border-width-sm) var(--teddy-color-border-interactive-focus);
+  content: "";
+  opacity: 1;
+  display: block;
+  inset: calc(var(--teddy-spacing-25) * -1);
+  position: absolute;
+}
+._teddy-top-row-buttons__button_1ytqf_27:focus:not(:focus-visible)::before {
+  opacity: 0;
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=beige] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]), ._teddy-top-row-buttons__button_1ytqf_27[data-color=beige] {
+  background-color: var(--teddy-color-background-beige);
+  color: var(--teddy-color-text-default);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=beige] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):hover, ._teddy-top-row-buttons__button_1ytqf_27[data-color=beige]:hover {
+  background-color: var(--teddy-color-background-beige-hover);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=beige] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):active, ._teddy-top-row-buttons__button_1ytqf_27[data-color=beige]:active {
+  background-color: var(--teddy-color-background-beige-active);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=beige] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):focus-visible, ._teddy-top-row-buttons__button_1ytqf_27[data-color=beige]:focus-visible {
+  background-color: var(--teddy-color-background-beige);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=grey] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]), ._teddy-top-row-buttons__button_1ytqf_27[data-color=grey] {
+  background-color: var(--teddy-color-background-secondary);
+  color: var(--teddy-color-text-default);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=grey] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):hover, ._teddy-top-row-buttons__button_1ytqf_27[data-color=grey]:hover {
+  background-color: var(--teddy-color-background-secondary-hover);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=grey] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):active, ._teddy-top-row-buttons__button_1ytqf_27[data-color=grey]:active {
+  background-color: var(--teddy-color-background-secondary-active);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=grey] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):focus-visible, ._teddy-top-row-buttons__button_1ytqf_27[data-color=grey]:focus-visible {
+  background-color: var(--teddy-color-background-secondary);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=white] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]), ._teddy-top-row-buttons__button_1ytqf_27[data-color=white] {
+  background-color: var(--teddy-color-brand-white);
+  color: var(--teddy-color-text-default);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=white] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):hover, ._teddy-top-row-buttons__button_1ytqf_27[data-color=white]:hover {
+  background-color: var(--teddy-color-background-interactive-transparent-hover);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=white] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):active, ._teddy-top-row-buttons__button_1ytqf_27[data-color=white]:active {
+  background-color: var(--teddy-color-background-interactive-transparent-active);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=white] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):focus-visible, ._teddy-top-row-buttons__button_1ytqf_27[data-color=white]:focus-visible {
+  background-color: var(--teddy-color-brand-white);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=purple] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]), ._teddy-top-row-buttons__button_1ytqf_27[data-color=purple] {
+  background-color: var(--teddy-color-background-interactive-primary);
+  color: var(--teddy-color-text-interactive-on-primary);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=purple] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):hover, ._teddy-top-row-buttons__button_1ytqf_27[data-color=purple]:hover {
+  background-color: var(--teddy-color-background-interactive-primary-hover);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=purple] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):active, ._teddy-top-row-buttons__button_1ytqf_27[data-color=purple]:active {
+  background-color: var(--teddy-color-background-interactive-primary-active);
+}
+._teddy-top-row-buttons__track_1ytqf_4[data-color=purple] ._teddy-top-row-buttons__button_1ytqf_27:not([data-color]):focus-visible, ._teddy-top-row-buttons__button_1ytqf_27[data-color=purple]:focus-visible {
+  background-color: var(--teddy-color-background-interactive-primary);
+}
+._teddy-top-row-buttons__label_1ytqf_109 {
+  white-space: nowrap;
+}
+._teddy-top-row-buttons__emoji_1ytqf_112 {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 1.25rem;
+  line-height: 1;
+}._teddy-spinner--xxs_ywden_1 {
   height: var(--teddy-spacing-250);
   width: var(--teddy-spacing-250);
 }
@@ -361,47 +519,6 @@
   ._teddy-button--icon-only_18j14_56 ._teddy-button__loading_18j14_287 {
     background-color: var(--teddy-color-gray-100);
   }
-}@layer icon {
-  ._teddy-icon_1ur3a_2 {
-    display: inline;
-    align-self: center;
-    fill: currentColor;
-    flex-shrink: 0;
-  }
-  ._teddy-icon--font_1ur3a_8 {
-    width: 1em;
-    height: 1em;
-  }
-  ._teddy-icon--xxs_1ur3a_12 {
-    width: var(--teddy-spacing-150);
-    height: var(--teddy-spacing-150);
-  }
-  ._teddy-icon--xs_1ur3a_16 {
-    width: var(--teddy-spacing-200);
-    height: var(--teddy-spacing-200);
-  }
-  ._teddy-icon--sm_1ur3a_20 {
-    width: var(--teddy-spacing-250);
-    height: var(--teddy-spacing-250);
-  }
-  ._teddy-icon--md_1ur3a_24 {
-    width: var(--teddy-spacing-300);
-    height: var(--teddy-spacing-300);
-  }
-  ._teddy-icon--lg_1ur3a_28 {
-    width: var(--teddy-spacing-400);
-    height: var(--teddy-spacing-400);
-  }
-  ._teddy-icon--xl_1ur3a_32 {
-    width: var(--teddy-spacing-600);
-    height: var(--teddy-spacing-600);
-  }
-  ._teddy-icon-with-children_1ur3a_36 {
-    display: inline-flex;
-    align-items: center;
-    font-family: var(--teddy-typography-family-default);
-    gap: var(--teddy-spacing-100);
-  }
 }._teddy-dashed-button_1wq9c_1 {
   box-shadow: none;
   color: var(--teddy-color-text-default);
@@ -1034,13 +1151,13 @@
     opacity: 1;
     transform: translateX(0);
   }
-}._item_kjt5a_1 {
+}._item_16o96_1 {
   position: relative;
   background-color: var(--teddy-color-functional-white);
   border-radius: var(--teddy-border-radius-md);
 }
 
-._breakageFeeInfo_kjt5a_7 {
+._breakageFeeInfo_16o96_7 {
   position: relative;
   font-family: var(--teddy-typography-family-default);
   font-weight: var(--teddy-typography-weight-normal);
@@ -1048,7 +1165,7 @@
   font-size: var(--teddy-typography-scale-100);
 }
 
-._itemIcon_kjt5a_15 {
+._itemIcon_16o96_15 {
   display: flex;
   height: 2rem;
   width: 2rem;
@@ -1059,14 +1176,14 @@
   color: var(--teddy-color-purple-700);
 }
 
-._nameWrapper_kjt5a_26 {
+._nameWrapper_16o96_26 {
   max-width: 18rem;
   display: flex;
   align-items: flex-start;
   flex-direction: column;
 }
 
-._link_kjt5a_33 {
+._link_16o96_33 {
   display: flex;
   align-items: center;
   padding-right: var(--teddy-spacing-400);
@@ -1076,69 +1193,78 @@
   font-weight: var(--teddy-typography-weight-bold);
 }
 
-._link_kjt5a_33 span {
-  margin-right: var(--teddy-spacing-100);
-}
-
 @media all and (min-width: 600px) {
-  ._link_kjt5a_33 {
+  ._link_16o96_33 {
     padding-right: 0;
   }
 }
 
-._discountDescription_kjt5a_51 {
+._link_16o96_33 span {
+  margin-right: var(--teddy-spacing-100);
+}
+
+._cartLink_16o96_51 {
+  font-weight: var(--teddy-typography-weight-bold);
+  color: var(--teddy-color-functional-black);
+}
+
+._cartLink_16o96_51:hover, ._cartLink_16o96_51:active, ._cartLink_16o96_51:focus {
+  color: var(--teddy-color-text-interactive-primary);
+}
+
+._discountDescription_16o96_59 {
   margin-right: var(--teddy-spacing-600);
   overflow: visible;
   margin-top: var(--teddy-spacing-50);
 }
 
-._name_kjt5a_26 {
+._name_16o96_26 {
   box-sizing: border-box;
   width: 100%;
   padding: var(--teddy-spacing-200) var(--teddy-spacing-200) 0 0;
   font-size: var(--teddy-typography-scale-100);
 }
 
-._nameContainer_kjt5a_64 {
+._nameContainer_16o96_72 {
   display: flex;
 }
 
-._subtitle_kjt5a_68 {
+._subtitle_16o96_76 {
   display: flex;
   flex-direction: column;
 }
 
-._subtitle_kjt5a_68 p {
+._subtitle_16o96_76 p {
   margin: 0;
 }
 
-._quantityPickerWrapper_kjt5a_76 {
+._quantityPickerWrapper_16o96_84 {
   display: flex;
   justify-content: flex-start;
   align-items: center;
   flex-wrap: wrap;
 }
 
-._pricePer_kjt5a_83 {
+._pricePer_16o96_91 {
   margin-left: var(--teddy-spacing-200);
 }
 
-._quantityPicker_kjt5a_76 {
+._quantityPicker_16o96_84 {
   display: flex;
   align-items: center;
 }
 
-._quantityPicker_kjt5a_76 p {
+._quantityPicker_16o96_84 p {
   margin: 0 var(--teddy-spacing-100);
 }
 
-._priceContainer_kjt5a_95 {
+._priceContainer_16o96_103 {
   display: flex;
   justify-content: space-between;
   margin-bottom: var(--teddy-spacing-100);
 }
 
-._priceCost_kjt5a_101 {
+._priceCost_16o96_109 {
   display: flex;
   flex-direction: column;
   font-family: var(--teddy-typography-family-default);
@@ -1146,12 +1272,12 @@
   margin-bottom: 0;
 }
 
-._priceLabel_kjt5a_109 {
+._priceLabel_16o96_117 {
   text-align: right;
   margin-bottom: 0;
 }
 
-._priceLinethrough_kjt5a_114 {
+._priceLinethrough_16o96_122 {
   font-size: var(--teddy-typography-scale-100);
   font-family: var(--teddy-typography-family-default);
   font-weight: var(--teddy-typography-weight-normal);
@@ -1161,7 +1287,7 @@
   color: var(--teddy-color-gray-500);
 }
 
-._priceLinethroughDisclaimer_kjt5a_124 {
+._priceLinethroughDisclaimer_16o96_132 {
   font-size: var(--teddy-typography-scale-100);
   font-family: var(--teddy-typography-family-default);
   font-weight: var(--teddy-typography-weight-normal);
@@ -1170,39 +1296,39 @@
   color: var(--teddy-color-gray-500);
 }
 
-._imageContainer_kjt5a_133 {
+._imageContainer_16o96_141 {
   max-width: 2.5rem;
   width: 2.5rem;
   margin: var(--teddy-spacing-200) var(--teddy-spacing-200) 0 var(--teddy-spacing-200);
 }
 
-._imageContainer_kjt5a_133 a:hover,
-._imageContainer_kjt5a_133 a:active,
-._imageContainer_kjt5a_133 a:focus,
-._imageContainer_kjt5a_133 a:focus-within {
+._imageContainer_16o96_141 a:hover,
+._imageContainer_16o96_141 a:active,
+._imageContainer_16o96_141 a:focus,
+._imageContainer_16o96_141 a:focus-within {
   color: var(--teddy-color-text-interactive-primary);
 }
 
-._noImageContainer_kjt5a_145 {
+._noImageContainer_16o96_153 {
   max-width: 2.5rem;
   width: 2.5rem;
   margin: var(--teddy-spacing-200) var(--teddy-spacing-200) 0 var(--teddy-spacing-200);
 }
 
-._image_kjt5a_133 {
+._image_16o96_141 {
   display: block;
   height: auto;
   max-width: 2.5rem;
   width: 2.5rem;
 }
 
-._iconImage_kjt5a_158 {
+._iconImage_16o96_166 {
   display: block;
   width: 2.5rem;
   height: 2.5rem;
 }
 
-._deleteButtonContainer_kjt5a_164 {
+._deleteButtonContainer_16o96_172 {
   box-sizing: border-box;
   display: flex;
   justify-content: center;
@@ -1220,81 +1346,74 @@
   padding: var(--teddy-spacing-50) var(--teddy-spacing-100);
 }
 
-._deleteButtonContainer_kjt5a_164:active, ._deleteButtonContainer_kjt5a_164:hover, ._deleteButtonContainer_kjt5a_164:focus {
+._deleteButtonContainer_16o96_172:active, ._deleteButtonContainer_16o96_172:hover, ._deleteButtonContainer_16o96_172:focus {
   background-color: var(--teddy-color-purple-700);
   color: var(--teddy-color-functional-white);
 }
 
-._deleteButtonContainer_kjt5a_164 svg {
+._deleteButtonContainer_16o96_172 svg {
   width: 1.06rem;
   height: 1.1rem;
   margin-bottom: 1px;
 }
 
-._uniqueDiscount_kjt5a_191 {
+._uniqueDiscount_16o96_199 {
   display: flex;
   justify-content: space-between;
   margin-top: var(--teddy-spacing-100);
   margin-bottom: var(--teddy-spacing-100);
 }
 
-._uniqueDiscountLabel_kjt5a_198 {
+._uniqueDiscountLabel_16o96_206 {
   font-family: var(--teddy-typography-family-default);
   font-weight: var(--teddy-typography-weight-normal);
   font-style: italic;
 }
 
-._uniqueDiscountPrice_kjt5a_204 {
+._uniqueDiscountPrice_16o96_212 {
   font-family: var(--teddy-typography-family-default);
   font-weight: var(--teddy-typography-weight-bold);
 }
 
-._onlyInShops_kjt5a_209 {
+._onlyInShops_16o96_217 {
   display: flex;
   align-items: center;
   margin-top: var(--teddy-spacing-100);
   margin-bottom: var(--teddy-spacing-100);
 }
 
-._onlyInShopsLabel_kjt5a_216 {
+._onlyInShopsLabel_16o96_224 {
   font-style: italic;
   font-family: var(--teddy-typography-family-default);
   font-weight: var(--teddy-typography-weight-normal);
 }
 
-._onlyInShopsTooltipWrapper_kjt5a_222 {
+._onlyInShopsTooltipWrapper_16o96_230 {
   margin-left: var(--teddy-spacing-100);
   display: flex;
   align-items: center;
 }
 
-._onlyInShopsTooltipIcon_kjt5a_228 {
+._onlyInShopsTooltipIcon_16o96_236 {
   cursor: pointer;
   width: 1.2rem;
   height: 1.2rem;
   color: var(--teddy-color-functional-black);
 }
 
-._tooltipTrigger_kjt5a_235 {
+._tooltipTrigger_16o96_243 {
   padding: var(--teddy-spacing-100);
 }
 
-._tooltipTrigger_kjt5a_235 svg {
+._tooltipTrigger_16o96_243 svg {
   width: 1.25rem;
   height: 1.25rem;
 }
 
-._priceWithTooltip_kjt5a_243 {
+._priceWrapper_16o96_251 {
   display: flex;
   align-items: center;
-}
-
-._cartLink_kjt5a_248 {
-  color: var(--teddy-color-functional-black);
-}
-
-._cartLink_kjt5a_248:hover, ._cartLink_kjt5a_248:active, ._cartLink_kjt5a_248:focus {
-  color: var(--teddy-color-text-interactive-primary);
+  justify-content: flex-end;
 }._teddy-progress-bar_j1bq2_1 {
   background: var(--teddy-color-transparent-black-100);
   overflow: hidden;
@@ -1321,36 +1440,36 @@
   0% {
     transform: translateX(-100%);
   }
-}._singleDisclaimer_1es5l_1 {
+}._singleDisclaimer_1995d_1 {
   font-size: var(--teddy-typography-scale-75);
   padding: var(--teddy-spacing-100) var(--teddy-spacing-200);
 }
 
-._disclaimer_1es5l_6 {
-  padding: var(--teddy-spacing-300) var(--teddy-spacing-200) var(--teddy-spacing-300) 0;
+._disclaimer_1995d_6 {
+  padding: var(--teddy-spacing-300) var(--teddy-spacing-200) 0 0;
   cursor: pointer;
   font-size: var(--teddy-typography-scale-75);
 }
 
-._disclaimerHeader_1es5l_12 {
+._disclaimerHeader_1995d_12 {
   display: flex;
   justify-content: space-between;
 }
 
-._disclaimerHeaderLeft_1es5l_17 {
+._disclaimerHeaderLeft_1995d_17 {
   display: flex;
   align-items: center;
 }
-._disclaimerHeaderLeft_1es5l_17 > * {
+._disclaimerHeaderLeft_1995d_17 > * {
   margin-right: var(--teddy-spacing-100);
 }
 
-._disclaimerIcon_1es5l_25 {
+._disclaimerIcon_1995d_25 {
   width: 1.5rem;
   height: 1.5rem;
 }
 
-._disclaimerItem_1es5l_30 {
+._disclaimerItem_1995d_30 {
   display: grid;
   grid-template-columns: auto auto;
   margin-top: var(--teddy-spacing-150);
@@ -1358,16 +1477,16 @@
   font-size: var(--teddy-typography-scale-75);
 }
 
-._disclaimerItemTotal_1es5l_38 {
+._disclaimerItemTotal_1995d_38 {
   text-align: right;
 }
 
-._disclaimerItemSubtitle_1es5l_42 {
+._disclaimerItemSubtitle_1995d_42 {
   grid-column: 1/3;
   color: var(--teddy-color-transparent-black-600);
 }
 
-._disclaimerTotal_1es5l_47 {
+._disclaimerTotal_1995d_47 {
   margin-top: var(--teddy-spacing-200);
   font-family: var(--teddy-typography-family-default);
   font-weight: var(--teddy-typography-weight-medium);

package/package.json

@@ -20,7 +20,7 @@
     "pnpm": ">=10"
   },
   "private": false,
-  "version": "0.7.39",
+  "version": "0.7.41",
   "sideEffects": [
     "**/*.css",
     "**/*.svg"
@@ -44,7 +44,7 @@
     "@typescript-eslint/eslint-plugin": "6.20.0",
     "@typescript-eslint/parser": "6.20.0",
     "@vitejs/plugin-react-swc": "3.7.0",
-    "axios": "1.12.0",
+    "axios": "1.13.5",
     "eslint": "8.57.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-import-resolver-alias": "1.1.2",
@@ -63,7 +63,7 @@
     "react-router-dom": "6.23.0",
     "rollup-plugin-visualizer": "5.12.0",
     "sass": "1.70.0",
-    "storybook": "9.0.17",
+    "storybook": "9.1.19",
     "storybook-addon-pseudo-states": "9.0.17",
     "style-dictionary": "3.9.2",
     "tsx": "4.7.0",