@telia/teddy 0.0.35 → 0.0.37

package/dist/style.css

@@ -30,12 +30,13 @@
   ._teddy-ribbon--iconPlacement-center_14u2k_22 svg {
     align-self: center;
   }
-}._teddy-expandable-card_12yyw_1 {
+}._teddy-expandable-card_15whs_1 {
   display: flex;
   flex-direction: column;
   gap: var(--teddy-spacing-400);
+  position: relative;
 }
-._teddy-expandable-card__item_12yyw_6 {
+._teddy-expandable-card__item_15whs_7 {
   width: 100%;
   display: flex;
   flex-direction: column;
@@ -43,7 +44,7 @@
   border: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
   box-shadow: var(--teddy-shadow-sm);
 }
-._teddy-expandable-card__trigger_12yyw_14 {
+._teddy-expandable-card__trigger_15whs_15 {
   border: unset;
   display: flex;
   flex-direction: column;
@@ -59,15 +60,15 @@
   transition-property: background-color, color;
   text-align: start;
 }
-._teddy-expandable-card__trigger_12yyw_14:hover {
+._teddy-expandable-card__trigger_15whs_15:hover {
   background-color: var(--teddy-color-background-interactive-transparent-hover);
 }
 @media (prefers-reduced-motion: no-preference) {
-  ._teddy-expandable-card__trigger_12yyw_14:active {
+  ._teddy-expandable-card__trigger_15whs_15:active {
     background-color: var(--teddy-color-background-interactive-transparent-active);
   }
 }
-._teddy-expandable-card__trigger_12yyw_14 ._teddy-expandable-card__indicator_12yyw_38 {
+._teddy-expandable-card__trigger_15whs_15 ._teddy-expandable-card__indicator_15whs_39 {
   flex-shrink: 0;
   transform: rotate(0);
   margin-left: var(--teddy-spacing-100);
@@ -75,76 +76,79 @@
   min-height: var(--teddy-spacing-300);
 }
 @media (prefers-reduced-motion: no-preference) {
-  ._teddy-expandable-card__trigger_12yyw_14 ._teddy-expandable-card__indicator_12yyw_38 {
+  ._teddy-expandable-card__trigger_15whs_15 ._teddy-expandable-card__indicator_15whs_39 {
     transition: transform var(--teddy-motion-duration-300) var(--teddy-motion-easing-ease-in-out);
   }
 }
-._teddy-expandable-card__trigger_12yyw_14 ._teddy-expandable-card__hidden_12yyw_50 {
+._teddy-expandable-card__trigger_15whs_15 ._teddy-expandable-card__hidden_15whs_51 {
   width: 100%;
 }
-._teddy-expandable-card__trigger_12yyw_14[data-state=open] {
+._teddy-expandable-card__trigger_15whs_15[data-state=open] {
   padding-bottom: var(--teddy-spacing-0);
 }
-._teddy-expandable-card__trigger_12yyw_14[data-state=open] ._teddy-expandable-card__line_12yyw_56 {
+._teddy-expandable-card__trigger_15whs_15[data-state=open] ._teddy-expandable-card__line_15whs_57 {
   margin-bottom: var(--teddy-spacing-0);
 }
-._teddy-expandable-card__trigger_12yyw_14[data-state=open] ._teddy-expandable-card__content_12yyw_59 {
+._teddy-expandable-card__trigger_15whs_15[data-state=open] ._teddy-expandable-card__content_15whs_60 {
   padding-top: var(--teddy-spacing-200);
 }
-._teddy-expandable-card__trigger_12yyw_14[data-state=open] ._teddy-expandable-card__indicator_12yyw_38 {
+._teddy-expandable-card__trigger_15whs_15[data-state=open] ._teddy-expandable-card__indicator_15whs_39 {
   transform: rotate(180deg);
 }
-._teddy-expandable-card__trigger_12yyw_14[data-state=open] ._teddy-expandable-card__hidden_12yyw_50 {
+._teddy-expandable-card__trigger_15whs_15[data-state=open] ._teddy-expandable-card__hidden_15whs_51 {
   display: none;
 }
-._teddy-expandable-card__description_12yyw_68 {
+._teddy-expandable-card__description_15whs_69 {
   display: flex;
   justify-content: space-between;
   flex-grow: 1;
   flex-direction: column;
 }
 @media (min-width: 600px) {
-  ._teddy-expandable-card__description_12yyw_68 {
+  ._teddy-expandable-card__description_15whs_69 {
     flex-direction: row;
   }
 }
-._teddy-expandable-card__price_12yyw_79 {
+._teddy-expandable-card__price_15whs_80 {
   display: flex;
   align-items: center;
 }
-._teddy-expandable-card__header_12yyw_83 {
+._teddy-expandable-card__header_15whs_84 {
   display: flex;
   width: 100%;
 }
-._teddy-expandable-card__line_12yyw_56 {
+._teddy-expandable-card__line_15whs_57 {
   border: 0;
   border-top: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
 }
-._teddy-expandable-card__slot_12yyw_91 {
+._teddy-expandable-card__slot_15whs_92 {
   display: flex;
   gap: var(--teddy-spacing-150);
-  transform: translateY(0%);
+  transform: translateY(-50%);
+}
+._teddy-expandable-card__slot--bottom_15whs_97 {
+  transform: translateY(50%);
 }
-._teddy-expandable-card__slot--center_12yyw_96 {
-  transform: translate(-50%, -10%);
+._teddy-expandable-card__slot--center_15whs_100 {
+  transform: translate(-50%, -50%);
 }
-._teddy-expandable-card__slot--bottom_12yyw_99._teddy-expandable-card__slot--center_12yyw_96 {
-  transform: translate(-50%, 10%);
+._teddy-expandable-card__slot--bottom_15whs_97._teddy-expandable-card__slot--center_15whs_100 {
+  transform: translate(-50%, 50%);
 }
-._teddy-expandable-card__content_12yyw_59 {
+._teddy-expandable-card__content_15whs_60 {
   overflow: hidden;
   padding: var(--teddy-spacing-300);
 }
-._teddy-expandable-card__content_12yyw_59[data-state=open] {
+._teddy-expandable-card__content_15whs_60[data-state=open] {
   padding-top: var(--teddy-spacing-200);
 }
-._teddy-expandable-card__content_12yyw_59 > *:not(:first-child) {
+._teddy-expandable-card__content_15whs_60 > *:not(:first-child) {
   margin-top: var(--teddy-spacing-200);
 }
-._teddy-expandable-card__button--right_12yyw_112 {
+._teddy-expandable-card__button--right_15whs_116 {
   float: right;
 }
-._teddy-expandable-card__button--left_12yyw_115 {
+._teddy-expandable-card__button--left_15whs_119 {
   float: left;
 }._teddy-spinner--xxs_ywden_1 {
   height: var(--teddy-spacing-250);
@@ -483,6 +487,46 @@
   ._teddy-button--icon-only_aswkh_56 ._teddy-button__loading_aswkh_261 {
     background-color: var(--teddy-color-gray-100);
   }
+}@layer icon {
+  ._teddy-icon_1rwgf_2 {
+    display: inline;
+    align-self: center;
+    fill: currentColor;
+  }
+  ._teddy-icon--font_1rwgf_7 {
+    width: 1em;
+    height: 1em;
+  }
+  ._teddy-icon--xxs_1rwgf_11 {
+    width: var(--teddy-spacing-150);
+    height: var(--teddy-spacing-150);
+  }
+  ._teddy-icon--xs_1rwgf_15 {
+    width: var(--teddy-spacing-200);
+    height: var(--teddy-spacing-200);
+  }
+  ._teddy-icon--sm_1rwgf_19 {
+    width: var(--teddy-spacing-250);
+    height: var(--teddy-spacing-250);
+  }
+  ._teddy-icon--md_1rwgf_23 {
+    width: var(--teddy-spacing-300);
+    height: var(--teddy-spacing-300);
+  }
+  ._teddy-icon--lg_1rwgf_27 {
+    width: var(--teddy-spacing-400);
+    height: var(--teddy-spacing-400);
+  }
+  ._teddy-icon--xl_1rwgf_31 {
+    width: var(--teddy-spacing-600);
+    height: var(--teddy-spacing-600);
+  }
+  ._teddy-icon-with-children_1rwgf_35 {
+    display: inline-flex;
+    align-items: center;
+    font-family: var(--teddy-typography-family-default);
+    gap: var(--teddy-spacing-100);
+  }
 }._teddy-color-dot_cywb7_1 {
   border-radius: var(--teddy-border-radius-full);
   height: var(--size);
@@ -636,46 +680,6 @@
     font-size: clamp(var(--teddy-typography-scale-800), 3cqw, var(--teddy-typography-scale-1000));
     line-height: var(--teddy-typography-line-height-tight);
   }
-}@layer icon {
-  ._teddy-icon_1rwgf_2 {
-    display: inline;
-    align-self: center;
-    fill: currentColor;
-  }
-  ._teddy-icon--font_1rwgf_7 {
-    width: 1em;
-    height: 1em;
-  }
-  ._teddy-icon--xxs_1rwgf_11 {
-    width: var(--teddy-spacing-150);
-    height: var(--teddy-spacing-150);
-  }
-  ._teddy-icon--xs_1rwgf_15 {
-    width: var(--teddy-spacing-200);
-    height: var(--teddy-spacing-200);
-  }
-  ._teddy-icon--sm_1rwgf_19 {
-    width: var(--teddy-spacing-250);
-    height: var(--teddy-spacing-250);
-  }
-  ._teddy-icon--md_1rwgf_23 {
-    width: var(--teddy-spacing-300);
-    height: var(--teddy-spacing-300);
-  }
-  ._teddy-icon--lg_1rwgf_27 {
-    width: var(--teddy-spacing-400);
-    height: var(--teddy-spacing-400);
-  }
-  ._teddy-icon--xl_1rwgf_31 {
-    width: var(--teddy-spacing-600);
-    height: var(--teddy-spacing-600);
-  }
-  ._teddy-icon-with-children_1rwgf_35 {
-    display: inline-flex;
-    align-items: center;
-    font-family: var(--teddy-typography-family-default);
-    gap: var(--teddy-spacing-100);
-  }
 }._teddy-tooltip__content_14d9w_1 {
   box-sizing: border-box;
   max-width: calc(17rem * var(--teddy-rescale));
@@ -1015,8 +1019,8 @@
     right: 100%;
     transform: rotate(180deg);
   }
-}@layer reset, flex, button, link, drawer;
-@keyframes _teddy-fade-in_xphhg_1 {
+}@layer reset, flex, button, link, heading, drawer;
+@keyframes _teddy-fade-in_ugum0_1 {
   from {
     opacity: 0;
   }
@@ -1024,7 +1028,7 @@
     opacity: 1;
   }
 }
-@keyframes _teddy-fade-out_xphhg_1 {
+@keyframes _teddy-fade-out_ugum0_1 {
   from {
     opacity: 1;
   }
@@ -1032,7 +1036,7 @@
     opacity: 0;
   }
 }
-@keyframes _teddy-overlay-no-op_xphhg_1 {
+@keyframes _teddy-overlay-no-op_ugum0_1 {
   from {
     opacity: 1;
   }
@@ -1040,53 +1044,64 @@
     opacity: 1;
   }
 }
-._teddy-drawer__overlay_xphhg_26 {
+._teddy-drawer__overlay_ugum0_26 {
   box-sizing: border-box;
 }
 @layer drawer {
-  ._teddy-drawer__overlay_xphhg_26 {
+  ._teddy-drawer__overlay_ugum0_26 {
     box-sizing: border-box;
     position: fixed;
     inset: 0;
+    display: grid;
+    justify-items: end;
     z-index: 40;
   }
   @media (prefers-reduced-motion: no-preference) {
-    ._teddy-drawer__overlay_xphhg_26 {
+    ._teddy-drawer__overlay_ugum0_26 {
       /* Keep the overlay mounted until the children have animated */
     }
-    ._teddy-drawer__overlay_xphhg_26:where([data-state=closed]) {
-      animation: _teddy-overlay-no-op_xphhg_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__overlay_ugum0_26:where([data-state=closed]) {
+      animation: _teddy-overlay-no-op_ugum0_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
     }
-    ._teddy-drawer__overlay_xphhg_26:where([data-state=open])::before {
-      animation: _teddy-fade-in_xphhg_1 500ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__overlay_ugum0_26:where([data-state=open])::before {
+      animation: _teddy-fade-in_ugum0_1 500ms cubic-bezier(0.16, 1, 0.3, 1);
     }
-    ._teddy-drawer__overlay_xphhg_26:where([data-state=closed])::before {
-      animation: _teddy-fade-out_xphhg_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__overlay_ugum0_26:where([data-state=closed])::before {
+      animation: _teddy-fade-out_ugum0_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
     }
   }
-  ._teddy-drawer__overlay_xphhg_26::before {
+  ._teddy-drawer__overlay_ugum0_26::before {
     position: fixed;
     content: "";
     inset: 0;
     background-color: var(--teddy-color-overlay-default);
   }
-  ._teddy-drawer__overlay--container_xphhg_57 {
+  ._teddy-drawer__overlay--container_ugum0_59 {
     position: absolute;
   }
-  ._teddy-drawer__overlay--container_xphhg_57::before {
+  ._teddy-drawer__overlay--container_ugum0_59::before {
     position: absolute;
   }
-  ._teddy-drawer__overlay--container_xphhg_57 ._teddy-drawer__content_xphhg_63 {
+  ._teddy-drawer__overlay--container_ugum0_59 ._teddy-drawer__content_ugum0_65 {
     position: absolute;
+    inset: 0;
+  }
+  ._teddy-drawer__title_ugum0_69 {
+    position: sticky;
+    padding-top: var(--teddy-spacing-300);
+    background-color: var(--teddy-color-background-primary);
+    top: -1.5rem;
+    margin-top: -1.5rem;
   }
-  ._teddy-drawer__content_xphhg_63 {
+  ._teddy-drawer__content_ugum0_65 {
     background-color: var(--teddy-color-background-primary);
     box-shadow: var(--teddy-shadow-lg);
-    position: fixed;
-    overflow: hidden;
-    inset: 0 0 0 auto;
+    z-index: 40;
+    overflow-y: auto;
+    overflow-x: hidden;
+    margin-left: auto;
     box-sizing: border-box;
-    padding: var(--teddy-spacing-300);
+    padding: var(--teddy-spacing-300) var(--teddy-spacing-300);
     display: flex;
     flex-direction: column;
     gap: var(--teddy-spacing-200);
@@ -1094,26 +1109,26 @@
     min-width: min(100%, 400px);
   }
   @media (prefers-reduced-motion: no-preference) {
-    ._teddy-drawer__content_xphhg_63:where([data-state=open]) {
-      animation: _drawer-content-show_xphhg_1 450ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__content_ugum0_65:where([data-state=open]) {
+      animation: _drawer-content-show_ugum0_1 450ms cubic-bezier(0.16, 1, 0.3, 1);
     }
-    ._teddy-drawer__content_xphhg_63:where([data-state=closed]) {
-      animation: _drawer-content-hide_xphhg_1 350ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__content_ugum0_65:where([data-state=closed]) {
+      animation: _drawer-content-hide_ugum0_1 350ms cubic-bezier(0.16, 1, 0.3, 1);
     }
   }
-  ._teddy-drawer__content--lg_xphhg_88 {
+  ._teddy-drawer__content--lg_ugum0_99 {
     min-width: min(100%, 30rem);
     width: 30vw;
     max-width: initial;
   }
-  ._teddy-drawer__close--floating_xphhg_93 {
-    position: absolute;
+  ._teddy-drawer__close--floating_ugum0_104 {
+    position: fixed;
     z-index: 2;
     top: var(--teddy-spacing-200);
     right: var(--teddy-spacing-200);
   }
 }
-@keyframes _drawer-content-show_xphhg_1 {
+@keyframes _drawer-content-show_ugum0_1 {
   from {
     transform: translateX(100%);
   }
@@ -1121,7 +1136,7 @@
     transform: translateX(0px);
   }
 }
-@keyframes _drawer-content-hide_xphhg_1 {
+@keyframes _drawer-content-hide_ugum0_1 {
   from {
     transform: translateX(0px);
   }
@@ -2578,7 +2593,7 @@
 ._teddy-field-error-text__indicator_1735t_12 {
   color: var(--teddy-color-text-status-error-medium);
   line-height: var(--teddy-typography-line-height-tight);
-}._teddy-badge_1fsdh_1 {
+}._teddy-badge_wlyo5_1 {
   font-family: var(--teddy-typography-family-default);
   font-weight: var(--teddy-typography-weight-medium);
   font-size: var(--teddy-typography-scale-75);
@@ -2590,13 +2605,17 @@
   align-items: center;
   gap: var(--teddy-spacing-50);
 }
-._teddy-badge--counter-badge_1fsdh_13 {
+._teddy-badge--counter-badge_wlyo5_13 {
   padding: var(--teddy-spacing-10) var(--teddy-spacing-50);
+  box-sizing: border-box;
   border-radius: var(--teddy-spacing-100);
   font-size: var(--teddy-typography-scale-50);
   line-height: var(--teddy-typography-line-height-tight);
+  min-width: var(--teddy-spacing-200);
+  justify-content: center;
+  text-align: center;
 }
-._teddy-badge--alert-badge_1fsdh_19 {
+._teddy-badge--alert-badge_wlyo5_23 {
   display: block;
   padding: 0;
   min-height: initial;
@@ -2606,54 +2625,54 @@
   height: var(--teddy-spacing-100);
   border: var(--teddy-border-width-sm) solid;
 }
-._teddy-badge--attention_1fsdh_29 {
+._teddy-badge--attention_wlyo5_33 {
   background-color: var(--teddy-color-background-status-attention);
   color: var(--teddy-color-text-status-attention);
 }
-._teddy-badge--attention_1fsdh_29._teddy-badge--alert-badge_1fsdh_19 {
+._teddy-badge--attention_wlyo5_33._teddy-badge--alert-badge_wlyo5_23 {
   border-color: var(--teddy-color-background-status-special);
 }
-._teddy-badge--special_1fsdh_36 {
+._teddy-badge--special_wlyo5_40 {
   background-color: var(--teddy-color-background-status-special);
   color: var(--teddy-color-text-status-special);
 }
-._teddy-badge--neutral_1fsdh_40 {
+._teddy-badge--neutral_wlyo5_44 {
   background-color: var(--teddy-color-background-status-neutral);
   color: var(--teddy-color-text-status-neutral);
 }
-._teddy-badge--neutral_1fsdh_40._teddy-badge--alert-badge_1fsdh_19 {
+._teddy-badge--neutral_wlyo5_44._teddy-badge--alert-badge_wlyo5_23 {
   background-color: var(--teddy-color-text-status-neutral);
   border-color: var(--teddy-color-background-status-neutral);
 }
-._teddy-badge--information_1fsdh_48 {
+._teddy-badge--information_wlyo5_52 {
   background-color: var(--teddy-color-background-status-info-strong);
   color: var(--teddy-color-text-status-info-strong);
 }
-._teddy-badge--information_1fsdh_48._teddy-badge--alert-badge_1fsdh_19 {
+._teddy-badge--information_wlyo5_52._teddy-badge--alert-badge_wlyo5_23 {
   background-color: var(--teddy-color-text-status-info-strong);
   border-color: var(--teddy-color-background-status-info-strong);
 }
-._teddy-badge--success_1fsdh_56 {
+._teddy-badge--success_wlyo5_60 {
   background-color: var(--teddy-color-background-status-success-strong);
   color: var(--teddy-color-text-status-success-strong);
 }
-._teddy-badge--success_1fsdh_56._teddy-badge--alert-badge_1fsdh_19 {
+._teddy-badge--success_wlyo5_60._teddy-badge--alert-badge_wlyo5_23 {
   background-color: var(--teddy-color-text-status-success-strong);
   border-color: var(--teddy-color-background-status-success-strong);
 }
-._teddy-badge--warning_1fsdh_64 {
+._teddy-badge--warning_wlyo5_68 {
   background-color: var(--teddy-color-background-status-warning-strong);
   color: var(--teddy-color-text-status-warning-strong);
 }
-._teddy-badge--warning_1fsdh_64._teddy-badge--alert-badge_1fsdh_19 {
+._teddy-badge--warning_wlyo5_68._teddy-badge--alert-badge_wlyo5_23 {
   background-color: var(--teddy-color-text-status-warning-strong);
   border-color: var(--teddy-color-background-status-warning-strong);
 }
-._teddy-badge--error_1fsdh_72 {
+._teddy-badge--error_wlyo5_76 {
   background-color: var(--teddy-color-background-status-error-strong);
   color: var(--teddy-color-text-status-error-strong);
 }
-._teddy-badge--error_1fsdh_72._teddy-badge--alert-badge_1fsdh_19 {
+._teddy-badge--error_wlyo5_76._teddy-badge--alert-badge_wlyo5_23 {
   background-color: var(--teddy-color-text-status-error-strong);
   border-color: var(--teddy-color-background-status-error-strong);
 }@layer heading, link, accordion;

package/package.json

@@ -20,7 +20,7 @@
     "pnpm": ">=8"
   },
   "private": false,
-  "version": "0.0.35",
+  "version": "0.0.37",
   "sideEffects": [
     "**/*.css"
   ],

package/dist/drawer.module-BPXo6-Q2.js

@@ -1,15 +0,0 @@
-const styles = {
-  "teddy-drawer__overlay": "_teddy-drawer__overlay_xphhg_26",
-  "teddy-overlay-no-op": "_teddy-overlay-no-op_xphhg_1",
-  "teddy-fade-in": "_teddy-fade-in_xphhg_1",
-  "teddy-fade-out": "_teddy-fade-out_xphhg_1",
-  "teddy-drawer__overlay--container": "_teddy-drawer__overlay--container_xphhg_57",
-  "teddy-drawer__content": "_teddy-drawer__content_xphhg_63",
-  "drawer-content-show": "_drawer-content-show_xphhg_1",
-  "drawer-content-hide": "_drawer-content-hide_xphhg_1",
-  "teddy-drawer__content--lg": "_teddy-drawer__content--lg_xphhg_88",
-  "teddy-drawer__close--floating": "_teddy-drawer__close--floating_xphhg_93"
-};
-export {
-  styles as s
-};

package/dist/drawer.module-_pUdp_M1.cjs

@@ -1,14 +0,0 @@
-"use strict";
-const styles = {
-  "teddy-drawer__overlay": "_teddy-drawer__overlay_xphhg_26",
-  "teddy-overlay-no-op": "_teddy-overlay-no-op_xphhg_1",
-  "teddy-fade-in": "_teddy-fade-in_xphhg_1",
-  "teddy-fade-out": "_teddy-fade-out_xphhg_1",
-  "teddy-drawer__overlay--container": "_teddy-drawer__overlay--container_xphhg_57",
-  "teddy-drawer__content": "_teddy-drawer__content_xphhg_63",
-  "drawer-content-show": "_drawer-content-show_xphhg_1",
-  "drawer-content-hide": "_drawer-content-hide_xphhg_1",
-  "teddy-drawer__content--lg": "_teddy-drawer__content--lg_xphhg_88",
-  "teddy-drawer__close--floating": "_teddy-drawer__close--floating_xphhg_93"
-};
-exports.styles = styles;