@telia/teddy 0.7.49 → 0.7.51

package/dist/components/card/card.cjs

@@ -86,17 +86,17 @@ const Root = React.forwardRef(
       "navigation-horizontal-small-centered",
       "navigation-horizontal-large"
     ].includes(layout ?? "");
-    const customStyle = backgroundImageSrc ? imageGradient === "light" ? {
+    const customStyle = backgroundImageSrc ? imageGradient === "none" ? { backgroundImage: `url(${backgroundImageSrc})`, ...props.style } : imageGradient === "light" ? {
       backgroundImage: `
-        linear-gradient(${tokens_color_variables.teddyColorTransparentWhite850} 0%, 
-        ${tokens_color_variables.teddyColorTransparentWhite800} 50%, 
-        ${tokens_color_variables.teddyColorTransparentWhite100} 100%), 
+        linear-gradient(${tokens_color_variables.teddyColorTransparentWhite850} 0%,
+        ${tokens_color_variables.teddyColorTransparentWhite800} 50%,
+        ${tokens_color_variables.teddyColorTransparentWhite100} 100%),
         url(${backgroundImageSrc})`,
       ...props.style
     } : {
       backgroundImage: `
         linear-gradient(${tokens_color_variables.teddyColorTransparentBlack600} 0%,
-        ${tokens_color_variables.teddyColorTransparentBlack200} 100%), 
+        ${tokens_color_variables.teddyColorTransparentBlack200} 100%),
         url(${backgroundImageSrc})`,
       ...props.style
     } : props.style;

package/dist/components/card/card.d.ts

@@ -5,7 +5,7 @@ import { Variant } from './utils';
 export declare const rootClassName = "teddy-card";
 export declare const actionElementIdentifier = "teddy-card__action";
 export type Layout = 'navigation-vertical' | 'navigation-horizontal-small' | 'navigation-horizontal-small-centered' | 'navigation-horizontal-large' | 'rich-card' | 'rich-card-large' | 'default' | 'product';
-type Gradient = 'light' | 'dark' | 'default';
+type Gradient = 'light' | 'dark' | 'default' | 'none';
 export type CardType = 'regular' | 'product';
 export declare const RootContext: React.Context<{
     buttonRef: React.RefObject<HTMLButtonElement>;

package/dist/components/card/card.js

@@ -84,17 +84,17 @@ const Root = React__default.forwardRef(
       "navigation-horizontal-small-centered",
       "navigation-horizontal-large"
     ].includes(layout ?? "");
-    const customStyle = backgroundImageSrc ? imageGradient === "light" ? {
+    const customStyle = backgroundImageSrc ? imageGradient === "none" ? { backgroundImage: `url(${backgroundImageSrc})`, ...props.style } : imageGradient === "light" ? {
       backgroundImage: `
-        linear-gradient(${teddyColorTransparentWhite850} 0%, 
-        ${teddyColorTransparentWhite800} 50%, 
-        ${teddyColorTransparentWhite100} 100%), 
+        linear-gradient(${teddyColorTransparentWhite850} 0%,
+        ${teddyColorTransparentWhite800} 50%,
+        ${teddyColorTransparentWhite100} 100%),
         url(${backgroundImageSrc})`,
       ...props.style
     } : {
       backgroundImage: `
         linear-gradient(${teddyColorTransparentBlack600} 0%,
-        ${teddyColorTransparentBlack200} 100%), 
+        ${teddyColorTransparentBlack200} 100%),
         url(${backgroundImageSrc})`,
       ...props.style
     } : props.style;

package/dist/components/checkbox-card-group/checkbox-card-group-indicator.cjs

@@ -85,7 +85,7 @@ require("../container/container.cjs");
 require("../carousel/carousel-root.cjs");
 require("../slider/slider.cjs");
 require("../textarea/index.cjs");
-const modal_module = require("../../modal.module-BfeNqXoN.cjs");
+const modal_module = require("../../modal.module-DC_f9KzI.cjs");
 const components_modal_modalImage = require("../modal/modal-image.cjs");
 const components_radioCardGroup_radioCardGroupIndicator = require("../radio-card-group/radio-card-group-indicator.cjs");
 const components_radioCardGroup_radioCardGroupItemBody = require("../radio-card-group/radio-card-group-item-body.cjs");

package/dist/components/checkbox-card-group/checkbox-card-group-indicator.js

@@ -83,7 +83,7 @@ import "../container/container.js";
 import "../carousel/carousel-root.js";
 import "../slider/slider.js";
 import "../textarea/index.js";
-import { s as styles$4 } from "../../modal.module-DuP4in7f.js";
+import { s as styles$4 } from "../../modal.module-1dzCSzkb.js";
 import { Image } from "../modal/modal-image.js";
 import { Indicator as Indicator$2 } from "../radio-card-group/radio-card-group-indicator.js";
 import { Body as Body$1 } from "../radio-card-group/radio-card-group-item-body.js";

package/dist/components/modal/modal-close.cjs

@@ -67,6 +67,6 @@ require("../container/container.cjs");
 require("../carousel/carousel-root.cjs");
 require("../slider/slider.cjs");
 require("../textarea/index.cjs");
-require("../../modal.module-BfeNqXoN.cjs");
+require("../../modal.module-DC_f9KzI.cjs");
 require("./modal-root.cjs");
 exports.Close = components_checkboxCardGroup_checkboxCardGroupIndicator.Close$1;

package/dist/components/modal/modal-close.js

@@ -65,7 +65,7 @@ import "../container/container.js";
 import "../carousel/carousel-root.js";
 import "../slider/slider.js";
 import "../textarea/index.js";
-import "../../modal.module-DuP4in7f.js";
+import "../../modal.module-1dzCSzkb.js";
 import "./modal-root.js";
 export {
   g as Close

package/dist/components/modal/modal-content.cjs

@@ -5,7 +5,7 @@ const React = require("react");
 const DrawerPrimitive = require("@radix-ui/react-dialog");
 const components_flex_flex = require("../flex/flex.cjs");
 const clsx = require("clsx");
-const modal_module = require("../../modal.module-BfeNqXoN.cjs");
+const modal_module = require("../../modal.module-DC_f9KzI.cjs");
 const components_modal_modalRoot = require("./modal-root.cjs");
 const components_modal_modalOverlay = require("./modal-overlay.cjs");
 function _interopNamespaceDefault(e) {
@@ -26,7 +26,7 @@ function _interopNamespaceDefault(e) {
 }
 const DrawerPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(DrawerPrimitive);
 const InnerContent = React.forwardRef(
-  function InnerContent2({ asChild, children, className, ...props }, forwardedRef) {
+  function InnerContent2({ asChild, children, className, size, ...props }, forwardedRef) {
     const classes = clsx([modal_module.styles[`${components_modal_modalRoot.rootClassName}__scroll`]], className);
     const context = React.useContext(components_modal_modalRoot.RootContext);
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -34,7 +34,7 @@ const InnerContent = React.forwardRef(
       {
         ...props,
         ref: forwardedRef,
-        className: clsx([modal_module.styles[`${components_modal_modalRoot.rootClassName}__content`]]),
+        className: clsx([modal_module.styles[`${components_modal_modalRoot.rootClassName}__content`], size && modal_module.styles[`${components_modal_modalRoot.rootClassName}__content--${size}`]]),
         asChild: true,
         children: /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { children: /* @__PURE__ */ jsxRuntime.jsx(
           components_flex_flex.Flex,
@@ -42,7 +42,6 @@ const InnerContent = React.forwardRef(
             ...asChild ? { as: void 0, asChild } : {},
             direction: "column",
             align: "start",
-            maxWidth: { md: "600px" },
             className: classes,
             ref: context.scrollRef,
             children
@@ -54,11 +53,11 @@ const InnerContent = React.forwardRef(
 );
 InnerContent.displayName = "InnerContent";
 const Content = React.forwardRef(
-  ({ forceMount, ...contentProps }, forwardedRef) => {
+  ({ forceMount, size, ...contentProps }, forwardedRef) => {
     const hasOverlay = React.useContext(components_modal_modalOverlay.OverlayContext);
     if (!hasOverlay)
-      return /* @__PURE__ */ jsxRuntime.jsx(components_modal_modalOverlay.Overlay, { forceMount, children: /* @__PURE__ */ jsxRuntime.jsx(InnerContent, { ref: forwardedRef, ...contentProps }) });
-    return /* @__PURE__ */ jsxRuntime.jsx(InnerContent, { ref: forwardedRef, ...contentProps });
+      return /* @__PURE__ */ jsxRuntime.jsx(components_modal_modalOverlay.Overlay, { forceMount, children: /* @__PURE__ */ jsxRuntime.jsx(InnerContent, { ref: forwardedRef, size, ...contentProps }) });
+    return /* @__PURE__ */ jsxRuntime.jsx(InnerContent, { ref: forwardedRef, size, ...contentProps });
   }
 );
 Content.displayName = "Content";

package/dist/components/modal/modal-content.d.ts

@@ -1,7 +1,12 @@
 import { default as React } from 'react';
 
 import * as DialogPrimitive from '@radix-ui/react-dialog';
-type ContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;
-declare const Content: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+type Size = 'sm' | 'md' | 'lg';
+type ContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {
+    size?: Size;
+};
+declare const Content: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    size?: Size | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
 export { Content };
 export type { ContentProps };

package/dist/components/modal/modal-content.js

@@ -3,11 +3,11 @@ import React__default from "react";
 import * as DrawerPrimitive from "@radix-ui/react-dialog";
 import { Flex } from "../flex/flex.js";
 import clsx from "clsx";
-import { s as styles } from "../../modal.module-DuP4in7f.js";
+import { s as styles } from "../../modal.module-1dzCSzkb.js";
 import { rootClassName, RootContext } from "./modal-root.js";
 import { OverlayContext, Overlay } from "./modal-overlay.js";
 const InnerContent = React__default.forwardRef(
-  function InnerContent2({ asChild, children, className, ...props }, forwardedRef) {
+  function InnerContent2({ asChild, children, className, size, ...props }, forwardedRef) {
     const classes = clsx([styles[`${rootClassName}__scroll`]], className);
     const context = React__default.useContext(RootContext);
     return /* @__PURE__ */ jsx(
@@ -15,7 +15,7 @@ const InnerContent = React__default.forwardRef(
       {
         ...props,
         ref: forwardedRef,
-        className: clsx([styles[`${rootClassName}__content`]]),
+        className: clsx([styles[`${rootClassName}__content`], size && styles[`${rootClassName}__content--${size}`]]),
         asChild: true,
         children: /* @__PURE__ */ jsx(Flex, { children: /* @__PURE__ */ jsx(
           Flex,
@@ -23,7 +23,6 @@ const InnerContent = React__default.forwardRef(
             ...asChild ? { as: void 0, asChild } : {},
             direction: "column",
             align: "start",
-            maxWidth: { md: "600px" },
             className: classes,
             ref: context.scrollRef,
             children
@@ -35,11 +34,11 @@ const InnerContent = React__default.forwardRef(
 );
 InnerContent.displayName = "InnerContent";
 const Content = React__default.forwardRef(
-  ({ forceMount, ...contentProps }, forwardedRef) => {
+  ({ forceMount, size, ...contentProps }, forwardedRef) => {
     const hasOverlay = React__default.useContext(OverlayContext);
     if (!hasOverlay)
-      return /* @__PURE__ */ jsx(Overlay, { forceMount, children: /* @__PURE__ */ jsx(InnerContent, { ref: forwardedRef, ...contentProps }) });
-    return /* @__PURE__ */ jsx(InnerContent, { ref: forwardedRef, ...contentProps });
+      return /* @__PURE__ */ jsx(Overlay, { forceMount, children: /* @__PURE__ */ jsx(InnerContent, { ref: forwardedRef, size, ...contentProps }) });
+    return /* @__PURE__ */ jsx(InnerContent, { ref: forwardedRef, size, ...contentProps });
   }
 );
 Content.displayName = "Content";

package/dist/components/modal/modal-group.cjs

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const components_flex_flex = require("../flex/flex.cjs");
 const clsx = require("clsx");
-const modal_module = require("../../modal.module-BfeNqXoN.cjs");
+const modal_module = require("../../modal.module-DC_f9KzI.cjs");
 const components_modal_modalRoot = require("./modal-root.cjs");
 const GroupContext = React.createContext(false);
 const Group = React.forwardRef(

package/dist/components/modal/modal-group.js

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import React__default, { useEffect } from "react";
 import { Flex } from "../flex/flex.js";
 import clsx from "clsx";
-import { s as styles } from "../../modal.module-DuP4in7f.js";
+import { s as styles } from "../../modal.module-1dzCSzkb.js";
 import { RootContext, rootClassName } from "./modal-root.js";
 const GroupContext = React__default.createContext(false);
 const Group = React__default.forwardRef(

package/dist/components/modal/modal-image.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const clsx = require("clsx");
-const modal_module = require("../../modal.module-BfeNqXoN.cjs");
+const modal_module = require("../../modal.module-DC_f9KzI.cjs");
 const reactSlot = require("@radix-ui/react-slot");
 const utils_composeRefs = require("../../utils/composeRefs.cjs");
 const components_modal_modalRoot = require("./modal-root.cjs");

package/dist/components/modal/modal-image.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React__default from "react";
 import clsx from "clsx";
-import { s as styles } from "../../modal.module-DuP4in7f.js";
+import { s as styles } from "../../modal.module-1dzCSzkb.js";
 import { Slot } from "@radix-ui/react-slot";
 import { composeRefs } from "../../utils/composeRefs.js";
 import { rootClassName, RootContext } from "./modal-root.js";

package/dist/components/modal/modal-overlay.cjs

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const DrawerPrimitive = require("@radix-ui/react-dialog");
 const clsx = require("clsx");
-const modal_module = require("../../modal.module-BfeNqXoN.cjs");
+const modal_module = require("../../modal.module-DC_f9KzI.cjs");
 const components_modal_modalRoot = require("./modal-root.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });

package/dist/components/modal/modal-overlay.js

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import React__default from "react";
 import * as DrawerPrimitive from "@radix-ui/react-dialog";
 import clsx from "clsx";
-import { s as styles } from "../../modal.module-DuP4in7f.js";
+import { s as styles } from "../../modal.module-1dzCSzkb.js";
 import { rootClassName } from "./modal-root.js";
 const OverlayContext = React__default.createContext(false);
 const Overlay = React__default.forwardRef(

package/dist/components/notification/index.d.ts

@@ -35,7 +35,6 @@ declare const Notification: import('react').ForwardRefExoticComponent<Omit<Omit<
     asChild: true;
     as?: undefined;
 } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
-    asChild?: boolean | undefined;
     /**
      * Footer component displays the footer of the notification.
      *
@@ -44,11 +43,12 @@ declare const Notification: import('react').ForwardRefExoticComponent<Omit<Omit<
      * @example
      * <Notification.Footer">Notification Footer</Notification.Footer>
      */
+    asChild?: boolean | undefined;
     variant?: "beige" | "white" | "gray" | "purple-light" | "beige-light" | "purple-dark" | undefined;
     bordered?: boolean | undefined;
     shadow?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
-    imageGradient?: ("dark" | "light" | "default") | undefined;
+    imageGradient?: ("none" | "dark" | "light" | "default") | undefined;
     layout?: import('../card/card').Layout | undefined;
 } & import('react').RefAttributes<HTMLDivElement>, "ref"> | Omit<Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('../../utils/generate-styling/flex').FlexChildren & import('../../utils/generate-styling/grid').GridChildren & import('../../utils/generate-styling/position').PositionProps & import('../../utils/generate-styling/inset').InsetProps & import('../../utils/generate-styling/radius').RadiusProps & import('../../utils/generate-styling/margin').MarginProps & import('../../utils/generate-styling/padding').PaddingProps & import('../../utils/generate-styling/width').WidthProps & import('../../utils/generate-styling/height').HeightProps & import('../../utils/generate-styling/color').ColorProps & {
     display?: import('../../utils/generate-styling').DisplayChildren | undefined;
@@ -59,7 +59,6 @@ declare const Notification: import('react').ForwardRefExoticComponent<Omit<Omit<
     as?: "span" | undefined;
     asChild?: false | undefined;
 } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
-    asChild?: boolean | undefined;
     /**
      * Footer component displays the footer of the notification.
      *
@@ -68,11 +67,12 @@ declare const Notification: import('react').ForwardRefExoticComponent<Omit<Omit<
      * @example
      * <Notification.Footer">Notification Footer</Notification.Footer>
      */
+    asChild?: boolean | undefined;
     variant?: "beige" | "white" | "gray" | "purple-light" | "beige-light" | "purple-dark" | undefined;
     bordered?: boolean | undefined;
     shadow?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
-    imageGradient?: ("dark" | "light" | "default") | undefined;
+    imageGradient?: ("none" | "dark" | "light" | "default") | undefined;
     layout?: import('../card/card').Layout | undefined;
 } & import('react').RefAttributes<HTMLDivElement>, "ref"> | Omit<Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('../../utils/generate-styling/flex').FlexChildren & import('../../utils/generate-styling/grid').GridChildren & import('../../utils/generate-styling/position').PositionProps & import('../../utils/generate-styling/inset').InsetProps & import('../../utils/generate-styling/radius').RadiusProps & import('../../utils/generate-styling/margin').MarginProps & import('../../utils/generate-styling/padding').PaddingProps & import('../../utils/generate-styling/width').WidthProps & import('../../utils/generate-styling/height').HeightProps & import('../../utils/generate-styling/color').ColorProps & {
     display?: import('../../utils/generate-styling').DisplayChildren | undefined;
@@ -83,7 +83,6 @@ declare const Notification: import('react').ForwardRefExoticComponent<Omit<Omit<
     as: "div";
     asChild?: false | undefined;
 } & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
-    asChild?: boolean | undefined;
     /**
      * Footer component displays the footer of the notification.
      *
@@ -92,11 +91,12 @@ declare const Notification: import('react').ForwardRefExoticComponent<Omit<Omit<
      * @example
      * <Notification.Footer">Notification Footer</Notification.Footer>
      */
+    asChild?: boolean | undefined;
     variant?: "beige" | "white" | "gray" | "purple-light" | "beige-light" | "purple-dark" | undefined;
     bordered?: boolean | undefined;
     shadow?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
-    imageGradient?: ("dark" | "light" | "default") | undefined;
+    imageGradient?: ("none" | "dark" | "light" | "default") | undefined;
     layout?: import('../card/card').Layout | undefined;
 } & import('react').RefAttributes<HTMLDivElement>, "ref">, "variant" | "layout" | "as"> & {
     variant?: "error" | "warning" | "beige" | "gray" | "teal" | "information" | "success" | undefined;

package/dist/components/notification/notification-root.d.ts

@@ -34,7 +34,7 @@ export declare const Root: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<R
     bordered?: boolean | undefined;
     shadow?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
-    imageGradient?: ("dark" | "light" | "default") | undefined;
+    imageGradient?: ("none" | "dark" | "light" | "default") | undefined;
     layout?: import('../card/card').Layout | undefined;
 } & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('../../utils/generate-styling/flex').FlexChildren & import('../../utils/generate-styling/grid').GridChildren & import('../../utils/generate-styling/position').PositionProps & import('../../utils/generate-styling/inset').InsetProps & import('../../utils/generate-styling/radius').RadiusProps & import('../../utils/generate-styling/margin').MarginProps & import('../../utils/generate-styling/padding').PaddingProps & import('../../utils/generate-styling/width').WidthProps & import('../../utils/generate-styling/height').HeightProps & import('../../utils/generate-styling/color').ColorProps & {
     display?: import('../../utils/generate-styling').DisplayChildren | undefined;
@@ -50,7 +50,7 @@ export declare const Root: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<R
     bordered?: boolean | undefined;
     shadow?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
-    imageGradient?: ("dark" | "light" | "default") | undefined;
+    imageGradient?: ("none" | "dark" | "light" | "default") | undefined;
     layout?: import('../card/card').Layout | undefined;
 } & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('../../utils/generate-styling/flex').FlexChildren & import('../../utils/generate-styling/grid').GridChildren & import('../../utils/generate-styling/position').PositionProps & import('../../utils/generate-styling/inset').InsetProps & import('../../utils/generate-styling/radius').RadiusProps & import('../../utils/generate-styling/margin').MarginProps & import('../../utils/generate-styling/padding').PaddingProps & import('../../utils/generate-styling/width').WidthProps & import('../../utils/generate-styling/height').HeightProps & import('../../utils/generate-styling/color').ColorProps & {
     display?: import('../../utils/generate-styling').DisplayChildren | undefined;
@@ -66,7 +66,7 @@ export declare const Root: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<R
     bordered?: boolean | undefined;
     shadow?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
-    imageGradient?: ("dark" | "light" | "default") | undefined;
+    imageGradient?: ("none" | "dark" | "light" | "default") | undefined;
     layout?: import('../card/card').Layout | undefined;
 } & React.RefAttributes<HTMLDivElement>, "ref">, "variant" | "layout" | "as"> & {
     /**

package/dist/modal.module-1dzCSzkb.js

@@ -0,0 +1,23 @@
+const styles = {
+  "teddy-modal__overlay": "_teddy-modal__overlay_mucyt_25",
+  "teddy-modal__content": "_teddy-modal__content_mucyt_37",
+  "teddy-modal__content--sm": "_teddy-modal__content--sm_mucyt_56",
+  "teddy-modal__content--md": "_teddy-modal__content--md_mucyt_61",
+  "teddy-modal__content--lg": "_teddy-modal__content--lg_mucyt_66",
+  "teddy-modal__scroll": "_teddy-modal__scroll_mucyt_70",
+  "teddy-modal__image": "_teddy-modal__image_mucyt_74",
+  "teddy-modal__close--floating": "_teddy-modal__close--floating_mucyt_84",
+  "teddy-modal__group": "_teddy-modal__group_mucyt_94",
+  "teddy-modal__group--title": "_teddy-modal__group--title_mucyt_98",
+  "teddy-modal__group--scroll": "_teddy-modal__group--scroll_mucyt_109",
+  "teddy-modal__group--action": "_teddy-modal__group--action_mucyt_118",
+  "modal-overlay-no-op": "_modal-overlay-no-op_mucyt_1",
+  "teddy-fade-in": "_teddy-fade-in_mucyt_1",
+  "teddy-fade-out": "_teddy-fade-out_mucyt_1",
+  "modal-content-show": "_modal-content-show_mucyt_1",
+  "modal-content-hide": "_modal-content-hide_mucyt_1",
+  "teddy-overlay-no-op": "_teddy-overlay-no-op_mucyt_1"
+};
+export {
+  styles as s
+};

package/dist/modal.module-DC_f9KzI.cjs

@@ -0,0 +1,22 @@
+"use strict";
+const styles = {
+  "teddy-modal__overlay": "_teddy-modal__overlay_mucyt_25",
+  "teddy-modal__content": "_teddy-modal__content_mucyt_37",
+  "teddy-modal__content--sm": "_teddy-modal__content--sm_mucyt_56",
+  "teddy-modal__content--md": "_teddy-modal__content--md_mucyt_61",
+  "teddy-modal__content--lg": "_teddy-modal__content--lg_mucyt_66",
+  "teddy-modal__scroll": "_teddy-modal__scroll_mucyt_70",
+  "teddy-modal__image": "_teddy-modal__image_mucyt_74",
+  "teddy-modal__close--floating": "_teddy-modal__close--floating_mucyt_84",
+  "teddy-modal__group": "_teddy-modal__group_mucyt_94",
+  "teddy-modal__group--title": "_teddy-modal__group--title_mucyt_98",
+  "teddy-modal__group--scroll": "_teddy-modal__group--scroll_mucyt_109",
+  "teddy-modal__group--action": "_teddy-modal__group--action_mucyt_118",
+  "modal-overlay-no-op": "_modal-overlay-no-op_mucyt_1",
+  "teddy-fade-in": "_teddy-fade-in_mucyt_1",
+  "teddy-fade-out": "_teddy-fade-out_mucyt_1",
+  "modal-content-show": "_modal-content-show_mucyt_1",
+  "modal-content-hide": "_modal-content-hide_mucyt_1",
+  "teddy-overlay-no-op": "_teddy-overlay-no-op_mucyt_1"
+};
+exports.styles = styles;

package/dist/style.css

@@ -5800,7 +5800,7 @@
 }
 ._teddy-chip__indicator_69tae_83 {
   display: none;
-}@keyframes _teddy-fade-in_1mjv8_1 {
+}@keyframes _teddy-fade-in_mucyt_1 {
   from {
     opacity: 0;
   }
@@ -5808,7 +5808,7 @@
     opacity: 1;
   }
 }
-@keyframes _teddy-fade-out_1mjv8_1 {
+@keyframes _teddy-fade-out_mucyt_1 {
   from {
     opacity: 1;
   }
@@ -5816,7 +5816,7 @@
     opacity: 0;
   }
 }
-@keyframes _teddy-overlay-no-op_1mjv8_1 {
+@keyframes _teddy-overlay-no-op_mucyt_1 {
   from {
     opacity: 1;
   }
@@ -5824,19 +5824,19 @@
     opacity: 1;
   }
 }
-._teddy-modal__overlay_1mjv8_25 {
+._teddy-modal__overlay_mucyt_25 {
   position: fixed;
   inset: 0;
   display: grid;
   place-items: center;
 }
-._teddy-modal__overlay_1mjv8_25::before {
+._teddy-modal__overlay_mucyt_25::before {
   position: fixed;
   content: "";
   inset: 0;
   background-color: var(--teddy-color-overlay-default);
 }
-._teddy-modal__content_1mjv8_37 {
+._teddy-modal__content_mucyt_37 {
   background-color: var(--teddy-color-background-primary);
   box-shadow: var(--teddy-shadow-lg);
   position: relative;
@@ -5845,7 +5845,7 @@
   width: 100%;
 }
 @media (min-width: 600px) {
-  ._teddy-modal__content_1mjv8_37 {
+  ._teddy-modal__content_mucyt_37 {
     max-width: 720px;
     max-height: 80%;
     min-height: 360px;
@@ -5854,11 +5854,26 @@
     border-radius: var(--teddy-border-radius-lg);
   }
 }
-._teddy-modal__scroll_1mjv8_55 {
+@media (min-width: 600px) {
+  ._teddy-modal__content--sm_mucyt_56 {
+    max-width: 480px;
+  }
+}
+@media (min-width: 600px) {
+  ._teddy-modal__content--md_mucyt_61 {
+    max-width: 720px;
+  }
+}
+@media (min-width: 600px) {
+  ._teddy-modal__content--lg_mucyt_66 {
+    max-width: 1000px;
+  }
+}
+._teddy-modal__scroll_mucyt_70 {
   overflow: auto;
   padding-inline: var(--teddy-spacing-300);
 }
-._teddy-modal__image_1mjv8_59 {
+._teddy-modal__image_mucyt_74 {
   max-width: calc(100% + var(--teddy-spacing-300) * 2);
   height: auto;
   vertical-align: middle;
@@ -5868,41 +5883,41 @@
   shape-margin: 0.75rem;
   margin-inline: calc(var(--teddy-spacing-300) * -1);
 }
-._teddy-modal__close--floating_1mjv8_69 {
+._teddy-modal__close--floating_mucyt_84 {
   position: absolute;
   top: var(--teddy-spacing-100);
   right: var(--teddy-spacing-100);
 }
 @media (max-width: 600px) {
-  ._teddy-modal__close--floating_1mjv8_69 {
+  ._teddy-modal__close--floating_mucyt_84 {
     top: var(--teddy-spacing-50);
   }
 }
-._teddy-modal__group_1mjv8_79 {
+._teddy-modal__group_mucyt_94 {
   width: 100%;
   margin-bottom: var(--teddy-spacing-200);
 }
-._teddy-modal__group--title_1mjv8_83 {
+._teddy-modal__group--title_mucyt_98 {
   position: sticky;
   inset: 0 0 auto 0;
   background-color: var(--teddy-color-background-primary);
   padding-top: var(--teddy-spacing-300);
 }
 @media (max-width: 600px) {
-  ._teddy-modal__group--title_1mjv8_83 {
+  ._teddy-modal__group--title_mucyt_98 {
     padding-top: var(--teddy-spacing-250);
   }
 }
-._teddy-modal__group--title_1mjv8_83._teddy-modal__group--scroll_1mjv8_94 {
+._teddy-modal__group--title_mucyt_98._teddy-modal__group--scroll_mucyt_109 {
   padding-block: var(--teddy-spacing-200);
 }
-._teddy-modal__group--title_1mjv8_83._teddy-modal__group--scroll_1mjv8_94::before {
+._teddy-modal__group--title_mucyt_98._teddy-modal__group--scroll_mucyt_109::before {
   content: "";
   position: absolute;
   inset: 0 calc(var(--teddy-spacing-300) * -1) 0 calc(var(--teddy-spacing-300) * -1);
   border-bottom: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
 }
-._teddy-modal__group--action_1mjv8_103 {
+._teddy-modal__group--action_mucyt_118 {
   height: 100%;
   position: sticky;
   inset: auto 0 0 0;
@@ -5910,7 +5925,7 @@
   padding: var(--teddy-spacing-200) 0 var(--teddy-spacing-300);
   background-color: var(--teddy-color-background-primary);
 }
-._teddy-modal__group--action_1mjv8_103._teddy-modal__group--scroll_1mjv8_94::before {
+._teddy-modal__group--action_mucyt_118._teddy-modal__group--scroll_mucyt_109::before {
   content: "";
   position: absolute;
   inset: 0 calc(var(--teddy-spacing-300) * -1) 0 calc(var(--teddy-spacing-300) * -1);
@@ -5918,7 +5933,7 @@
   box-shadow: 0 0 20px 15px var(--teddy-color-background-primary);
 }
 @media (prefers-reduced-motion: no-preference) {
-  @keyframes _modal-overlay-no-op_1mjv8_1 {
+  @keyframes _modal-overlay-no-op_mucyt_1 {
     from {
       opacity: 1;
     }
@@ -5926,7 +5941,7 @@
       opacity: 1;
     }
   }
-  @keyframes _modal-content-show_1mjv8_1 {
+  @keyframes _modal-content-show_mucyt_1 {
     from {
       opacity: 0;
       transform: translateY(5px) scale(0.97);
@@ -5936,7 +5951,7 @@
       transform: translateY(0px) scale(1);
     }
   }
-  @keyframes _modal-content-hide_1mjv8_1 {
+  @keyframes _modal-content-hide_mucyt_1 {
     from {
       opacity: 1;
       transform: translateY(0px) scale(1);
@@ -5946,25 +5961,25 @@
       transform: translateY(5px) scale(0.99);
     }
   }
-  ._teddy-modal__overlay_1mjv8_25 {
+  ._teddy-modal__overlay_mucyt_25 {
     /* Keep the overlay mounted until the children have animated */
   }
-  ._teddy-modal__overlay_1mjv8_25:where([data-state=closed]) {
-    animation: _modal-overlay-no-op_1mjv8_1 250ms cubic-bezier(0.16, 1, 0.3, 1);
+  ._teddy-modal__overlay_mucyt_25:where([data-state=closed]) {
+    animation: _modal-overlay-no-op_mucyt_1 250ms cubic-bezier(0.16, 1, 0.3, 1);
   }
-  ._teddy-modal__overlay_1mjv8_25:where([data-state=open])::before {
-    animation: _teddy-fade-in_1mjv8_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
+  ._teddy-modal__overlay_mucyt_25:where([data-state=open])::before {
+    animation: _teddy-fade-in_mucyt_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
   }
-  ._teddy-modal__overlay_1mjv8_25:where([data-state=closed])::before {
+  ._teddy-modal__overlay_mucyt_25:where([data-state=closed])::before {
     opacity: 0;
-    animation: _teddy-fade-out_1mjv8_1 250ms cubic-bezier(0.16, 1, 0.3, 1);
+    animation: _teddy-fade-out_mucyt_1 250ms cubic-bezier(0.16, 1, 0.3, 1);
   }
-  ._teddy-modal__content_1mjv8_37:where([data-state=open]) {
-    animation: _modal-content-show_1mjv8_1 200ms cubic-bezier(0.16, 1, 0.3, 1);
+  ._teddy-modal__content_mucyt_37:where([data-state=open]) {
+    animation: _modal-content-show_mucyt_1 200ms cubic-bezier(0.16, 1, 0.3, 1);
   }
-  ._teddy-modal__content_1mjv8_37:where([data-state=closed]) {
+  ._teddy-modal__content_mucyt_37:where([data-state=closed]) {
     opacity: 0;
-    animation: _modal-content-hide_1mjv8_1 150ms cubic-bezier(0.16, 1, 0.3, 1);
+    animation: _modal-content-hide_mucyt_1 150ms cubic-bezier(0.16, 1, 0.3, 1);
   }
 }@layer heading, button, card, notification;
 @layer notification {

package/package.json

@@ -20,7 +20,7 @@
     "pnpm": ">=10"
   },
   "private": false,
-  "version": "0.7.49",
+  "version": "0.7.51",
   "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.13.5",
+    "axios": "1.15.0",
     "eslint": "8.57.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-import-resolver-alias": "1.1.2",

package/dist/modal.module-BfeNqXoN.cjs

@@ -1,19 +0,0 @@
-"use strict";
-const styles = {
-  "teddy-modal__overlay": "_teddy-modal__overlay_1mjv8_25",
-  "teddy-modal__content": "_teddy-modal__content_1mjv8_37",
-  "teddy-modal__scroll": "_teddy-modal__scroll_1mjv8_55",
-  "teddy-modal__image": "_teddy-modal__image_1mjv8_59",
-  "teddy-modal__close--floating": "_teddy-modal__close--floating_1mjv8_69",
-  "teddy-modal__group": "_teddy-modal__group_1mjv8_79",
-  "teddy-modal__group--title": "_teddy-modal__group--title_1mjv8_83",
-  "teddy-modal__group--scroll": "_teddy-modal__group--scroll_1mjv8_94",
-  "teddy-modal__group--action": "_teddy-modal__group--action_1mjv8_103",
-  "modal-overlay-no-op": "_modal-overlay-no-op_1mjv8_1",
-  "teddy-fade-in": "_teddy-fade-in_1mjv8_1",
-  "teddy-fade-out": "_teddy-fade-out_1mjv8_1",
-  "modal-content-show": "_modal-content-show_1mjv8_1",
-  "modal-content-hide": "_modal-content-hide_1mjv8_1",
-  "teddy-overlay-no-op": "_teddy-overlay-no-op_1mjv8_1"
-};
-exports.styles = styles;

package/dist/modal.module-DuP4in7f.js

@@ -1,20 +0,0 @@
-const styles = {
-  "teddy-modal__overlay": "_teddy-modal__overlay_1mjv8_25",
-  "teddy-modal__content": "_teddy-modal__content_1mjv8_37",
-  "teddy-modal__scroll": "_teddy-modal__scroll_1mjv8_55",
-  "teddy-modal__image": "_teddy-modal__image_1mjv8_59",
-  "teddy-modal__close--floating": "_teddy-modal__close--floating_1mjv8_69",
-  "teddy-modal__group": "_teddy-modal__group_1mjv8_79",
-  "teddy-modal__group--title": "_teddy-modal__group--title_1mjv8_83",
-  "teddy-modal__group--scroll": "_teddy-modal__group--scroll_1mjv8_94",
-  "teddy-modal__group--action": "_teddy-modal__group--action_1mjv8_103",
-  "modal-overlay-no-op": "_modal-overlay-no-op_1mjv8_1",
-  "teddy-fade-in": "_teddy-fade-in_1mjv8_1",
-  "teddy-fade-out": "_teddy-fade-out_1mjv8_1",
-  "modal-content-show": "_modal-content-show_1mjv8_1",
-  "modal-content-hide": "_modal-content-hide_1mjv8_1",
-  "teddy-overlay-no-op": "_teddy-overlay-no-op_1mjv8_1"
-};
-export {
-  styles as s
-};