@telia/teddy 0.3.3 → 0.3.5

package/dist/components/card/card-button.cjs

@@ -28,14 +28,14 @@ const Button = React.forwardRef(
       },
       className
     );
-    const ref = utils_composeRefs.composeRefs(context == null ? void 0 : context.buttonRef, forwardRef);
+    const ref = utils_composeRefs.useComposedRefs(forwardRef, context == null ? void 0 : context.buttonRef);
     return /* @__PURE__ */ jsxRuntime.jsxs(components_flex_flex.Flex, { className: wrapperClasses, children: [
       disclaimer && /* @__PURE__ */ jsxRuntime.jsx(components_text_text.Text, { mr: "100", variant: "additional-100", children: disclaimer }),
       /* @__PURE__ */ jsxRuntime.jsx(
         components_button_button.Button,
         {
-          ...!iconOnly || !props["aria-label"] ? { iconOnly: false, "aria-label": void 0 } : { iconOnly: true, "aria-label": props["aria-label"] },
           ref,
+          ...!iconOnly || !props["aria-label"] ? { iconOnly: false, "aria-label": void 0 } : { iconOnly: true, "aria-label": props["aria-label"] },
           variant: getButtonVariant(context == null ? void 0 : context.variant),
           ...props,
           className: classes

package/dist/components/card/card-button.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import React__default from "react";
 import clsx from "clsx";
 import { RootContext, s as styles, actionElementIdentifier, rootClassName } from "./card.js";
-import { composeRefs } from "../../utils/composeRefs.js";
+import { useComposedRefs } from "../../utils/composeRefs.js";
 import { Button as Button$1 } from "../button/button.js";
 import { Flex } from "../flex/flex.js";
 import { Text } from "../text/text.js";
@@ -26,14 +26,14 @@ const Button = React__default.forwardRef(
       },
       className
     );
-    const ref = composeRefs(context == null ? void 0 : context.buttonRef, forwardRef);
+    const ref = useComposedRefs(forwardRef, context == null ? void 0 : context.buttonRef);
     return /* @__PURE__ */ jsxs(Flex, { className: wrapperClasses, children: [
       disclaimer && /* @__PURE__ */ jsx(Text, { mr: "100", variant: "additional-100", children: disclaimer }),
       /* @__PURE__ */ jsx(
         Button$1,
         {
-          ...!iconOnly || !props["aria-label"] ? { iconOnly: false, "aria-label": void 0 } : { iconOnly: true, "aria-label": props["aria-label"] },
           ref,
+          ...!iconOnly || !props["aria-label"] ? { iconOnly: false, "aria-label": void 0 } : { iconOnly: true, "aria-label": props["aria-label"] },
           variant: getButtonVariant(context == null ? void 0 : context.variant),
           ...props,
           className: classes

package/dist/components/card/card.cjs

@@ -100,13 +100,13 @@ const Root = React.forwardRef(
         ...props,
         className: classes,
         style: customStyle,
-        onClick: utils_composeEventHandlers.composeEventHandlers(props.onClick, (e) => {
-          var _a;
+        onPointerDown: utils_composeEventHandlers.composeEventHandlers(props.onPointerDown, (e) => {
           if (e.isDefaultPrevented())
             return;
-          if (linkRef.current)
+          if (linkRef.current && e.target !== linkRef.current)
             return linkRef.current.click();
-          (_a = buttonRef.current) == null ? void 0 : _a.click();
+          if (buttonRef.current && e.target !== buttonRef.current)
+            return buttonRef.current.click();
         }),
         ref: forwardRef,
         children

package/dist/components/card/card.js

@@ -98,13 +98,13 @@ const Root = React__default.forwardRef(
         ...props,
         className: classes,
         style: customStyle,
-        onClick: composeEventHandlers(props.onClick, (e) => {
-          var _a;
+        onPointerDown: composeEventHandlers(props.onPointerDown, (e) => {
           if (e.isDefaultPrevented())
             return;
-          if (linkRef.current)
+          if (linkRef.current && e.target !== linkRef.current)
             return linkRef.current.click();
-          (_a = buttonRef.current) == null ? void 0 : _a.click();
+          if (buttonRef.current && e.target !== buttonRef.current)
+            return buttonRef.current.click();
         }),
         ref: forwardRef,
         children

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

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const clsx = require("clsx");
 const DrawerPrimitive = require("@radix-ui/react-dialog");
-const drawer_module = require("../../drawer.module-khivHSFm.cjs");
+const drawer_module = require("../../drawer.module-C4NZoZUc.cjs");
 const components_drawer_drawerRoot = require("./drawer-root.cjs");
 require("../../assets/sprite.1321fab0-teddy.svg");
 const components_icon_icon = require("../icon/icon.cjs");

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

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import React__default from "react";
 import clsx from "clsx";
 import * as DrawerPrimitive from "@radix-ui/react-dialog";
-import { s as styles } from "../../drawer.module-Bh77Byg_.js";
+import { s as styles } from "../../drawer.module-jxIDBwQn.js";
 import { rootClassName } from "./drawer-root.js";
 import "../../assets/sprite.1321fab0-teddy.svg";
 import { Icon } from "../icon/icon.js";

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

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const clsx = require("clsx");
 const DrawerPrimitive = require("@radix-ui/react-dialog");
-const drawer_module = require("../../drawer.module-khivHSFm.cjs");
+const drawer_module = require("../../drawer.module-C4NZoZUc.cjs");
 const components_drawer_drawerRoot = require("./drawer-root.cjs");
 const components_drawer_drawerOverlay = require("./drawer-overlay.cjs");
 const components_flex_flex = require("../flex/flex.cjs");

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

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import React__default from "react";
 import clsx from "clsx";
 import * as DrawerPrimitive from "@radix-ui/react-dialog";
-import { s as styles } from "../../drawer.module-Bh77Byg_.js";
+import { s as styles } from "../../drawer.module-jxIDBwQn.js";
 import { rootClassName } from "./drawer-root.js";
 import { OverlayContext, Overlay } from "./drawer-overlay.js";
 import { Flex } from "../flex/flex.js";

package/dist/components/drawer/drawer-description.cjs

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const clsx = require("clsx");
 const DrawerPrimitive = require("@radix-ui/react-dialog");
-const drawer_module = require("../../drawer.module-khivHSFm.cjs");
+const drawer_module = require("../../drawer.module-C4NZoZUc.cjs");
 const components_drawer_drawerRoot = require("./drawer-root.cjs");
 const components_text_text = require("../text/text.cjs");
 function _interopNamespaceDefault(e) {

package/dist/components/drawer/drawer-description.js

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import React__default from "react";
 import clsx from "clsx";
 import * as DrawerPrimitive from "@radix-ui/react-dialog";
-import { s as styles } from "../../drawer.module-Bh77Byg_.js";
+import { s as styles } from "../../drawer.module-jxIDBwQn.js";
 import { rootClassName } from "./drawer-root.js";
 import { Text } from "../text/text.js";
 const DescriptionContext = React__default.createContext(false);

package/dist/components/drawer/drawer-footer.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 drawer_module = require("../../drawer.module-khivHSFm.cjs");
+const drawer_module = require("../../drawer.module-C4NZoZUc.cjs");
 const components_drawer_drawerRoot = require("./drawer-root.cjs");
 const components_flex_flex = require("../flex/flex.cjs");
 const Footer = React.forwardRef(

package/dist/components/drawer/drawer-footer.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 "../../drawer.module-Bh77Byg_.js";
+import { s as styles } from "../../drawer.module-jxIDBwQn.js";
 import { rootClassName } from "./drawer-root.js";
 import { Flex } from "../flex/flex.js";
 const Footer = React__default.forwardRef(

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

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

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

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

package/dist/components/drawer/drawer-title.cjs

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const clsx = require("clsx");
 const DrawerPrimitive = require("@radix-ui/react-dialog");
-const drawer_module = require("../../drawer.module-khivHSFm.cjs");
+const drawer_module = require("../../drawer.module-C4NZoZUc.cjs");
 const components_drawer_drawerRoot = require("./drawer-root.cjs");
 const components_heading_heading = require("../heading/heading.cjs");
 function _interopNamespaceDefault(e) {

package/dist/components/drawer/drawer-title.js

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import React__default from "react";
 import clsx from "clsx";
 import * as DrawerPrimitive from "@radix-ui/react-dialog";
-import { s as styles } from "../../drawer.module-Bh77Byg_.js";
+import { s as styles } from "../../drawer.module-jxIDBwQn.js";
 import { rootClassName } from "./drawer-root.js";
 import { Heading } from "../heading/heading.js";
 const Title = React__default.forwardRef(

package/dist/components/drawer/index.cjs

@@ -8,21 +8,20 @@ const components_drawer_drawerOverlay = require("./drawer-overlay.cjs");
 const components_drawer_drawerRoot = require("./drawer-root.cjs");
 const components_drawer_drawerTitle = require("./drawer-title.cjs");
 const components_drawer_drawerTrigger = require("./drawer-trigger.cjs");
-components_drawer_drawerClose.Close.displayName = "Drawer.Close";
-components_drawer_drawerContent.Content.displayName = "Drawer.Content";
-components_drawer_drawerDescription.Description.displayName = "Drawer.Description";
-components_drawer_drawerFooter.Footer.displayName = "Drawer.Footer";
-components_drawer_drawerOverlay.Overlay.displayName = "Drawer.Overlay";
-components_drawer_drawerRoot.Root.displayName = "Drawer";
-components_drawer_drawerTitle.Title.displayName = "Drawer.Title";
-components_drawer_drawerTrigger.Trigger.displayName = "Drawer.Trigger";
-const Drawer = Object.assign(components_drawer_drawerRoot.Root, {
-  Title: components_drawer_drawerTitle.Title,
-  Description: components_drawer_drawerDescription.Description,
-  Trigger: components_drawer_drawerTrigger.Trigger,
-  Overlay: components_drawer_drawerOverlay.Overlay,
-  Content: components_drawer_drawerContent.Content,
-  Footer: components_drawer_drawerFooter.Footer,
-  Close: components_drawer_drawerClose.Close
-});
+const Drawer = components_drawer_drawerRoot.Root;
+Drawer.displayName = "Drawer";
+Drawer.Trigger = components_drawer_drawerTrigger.Trigger;
+Drawer.Trigger.displayName = "Drawer.Trigger";
+Drawer.Content = components_drawer_drawerContent.Content;
+Drawer.Content.displayName = "Drawer.Content";
+Drawer.Title = components_drawer_drawerTitle.Title;
+Drawer.Title.displayName = "Drawer.Title";
+Drawer.Description = components_drawer_drawerDescription.Description;
+Drawer.Description.displayName = "Drawer.Description";
+Drawer.Overlay = components_drawer_drawerOverlay.Overlay;
+Drawer.Overlay.displayName = "Drawer.Overlay";
+Drawer.Footer = components_drawer_drawerFooter.Footer;
+Drawer.Footer.displayName = "Drawer.Footer";
+Drawer.Close = components_drawer_drawerClose.Close;
+Drawer.Close.displayName = "Drawer.Close";
 exports.Drawer = Drawer;

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

@@ -7,16 +7,7 @@ import { Root, RootProps } from './drawer-root';
 import { Title, TitleProps } from './drawer-title';
 import { Trigger, TriggerProps } from './drawer-trigger';
 
-export declare const Drawer: typeof Root & {
-    Title: typeof Title;
-    Description: typeof Description;
-    Trigger: typeof Trigger;
-    Overlay: typeof Overlay;
-    Content: typeof Content;
-    Footer: typeof Footer;
-    Close: typeof Close;
-};
-export type DrawerProps = {
+type DrawerProps = {
     Root: RootProps;
     Title: TitleProps;
     Description: DescriptionProps;
@@ -26,3 +17,124 @@ export type DrawerProps = {
     Footer: FooterProps;
     Close: CloseProps;
 };
+/**
+ * Drawer is a sliding panel that appears from the side of the screen.
+ * It's commonly used for navigation, settings, or displaying additional content without leaving the current page.
+ *
+ * @component
+ *
+ * @example
+ * // Basic usage
+ * <Drawer>
+ *   <Drawer.Trigger>
+ *     <Button variant="primary">Open Drawer</Button>
+ *   </Drawer.Trigger>
+ *   <Drawer.Content>
+ *     <Drawer.Title as="h3">Drawer Title</Drawer.Title>
+ *     <Drawer.Close slot="floating" aria-label="close" />
+ *     <Drawer.Description>Drawer content goes here.</Drawer.Description>
+ *     <Drawer.Footer>
+ *       <Button variant="primary">Save</Button>
+ *     </Drawer.Footer>
+ *   </Drawer.Content>
+ * </Drawer>
+ */
+declare const Drawer: typeof Root & {
+    /**
+     * Trigger component that opens the drawer when clicked.
+     * Must be passed a single child component that will be used as the trigger.
+     *
+     * @component
+     *
+     * @example
+     * <Drawer.Trigger>
+     *   <Button variant="primary">Open Drawer</Button>
+     * </Drawer.Trigger>
+     */
+    Trigger: typeof Trigger;
+    /**
+     * Content component that contains the drawer's content.
+     * Handles the positioning and scrolling behavior of the drawer content.
+     *
+     * @component
+     *
+     * @example
+     * <Drawer.Content>
+     *   <Drawer.Title>Title</Drawer.Title>
+     *   <Drawer.Description>Content</Drawer.Description>
+     * </Drawer.Content>
+     */
+    Content: typeof Content;
+    /**
+     * An accessible title to be announced when the drawer is opened.
+     * It will render the internal Heading component.
+     * If you want to hide the title, wrap it inside our Visually Hidden utility like this `<VisuallyHidden asChild>`.
+     *
+     * @component
+     *
+     * @example
+     * <Drawer.Title as="h3">Drawer Title</Drawer.Title>
+     */
+    Title: typeof Title;
+    /**
+     * An optional accessible description to be announced when the drawer is opened.
+     * This will render the internal Text component with a default p tag.
+     *
+     * If you want to hide the description, wrap it inside our Visually Hidden utility like this `<VisuallyHidden asChild>`.
+     *
+     * @component
+     *
+     * @example
+     * <Drawer.Description>
+     *   This is the main content of the drawer.
+     *   It can contain multiple paragraphs and other components.
+     * </Drawer.Description>
+     */
+    Description: typeof Description;
+    /**
+     * Overlay component provides the backdrop for the drawer.
+     * Handles the background dimming and click-outside behavior.
+     *
+     * @component
+     *
+     * @example
+     * <Drawer.Overlay>
+     *   <Drawer.Content>
+     *     {/* Content will slide in from the side *\/}
+     *   </Drawer.Content>
+     * </Drawer.Overlay>
+     */
+    Overlay: typeof Overlay;
+    /**
+     * Footer component for organizing action buttons or additional content at the bottom of the drawer.
+     * Provides consistent spacing and styling for footer content.
+     *
+     * @component
+     *
+     * @example
+     * <Drawer.Footer>
+     *   <Button variant="tertiary-purple">Cancel</Button>
+     *   <Button variant="primary">Save Changes</Button>
+     * </Drawer.Footer>
+     */
+    Footer: typeof Footer;
+    /**
+     * Close component provides a button to close the drawer.
+     * Can be used either as a floating close button or within content.
+     *
+     * @component
+     *
+     * @example
+     * // Floating close button
+     * <Drawer.Close slot="floating" aria-label="Lukk" />
+     *
+     * @example
+     * // Close button within content
+     * <Drawer.Close slot="content">
+     *   <Button variant="primary">Done</Button>
+     * </Drawer.Close>
+     */
+    Close: typeof Close;
+};
+export { Drawer };
+export type { DrawerProps };

package/dist/components/drawer/index.js

@@ -6,23 +6,22 @@ import { Overlay } from "./drawer-overlay.js";
 import { Root } from "./drawer-root.js";
 import { Title } from "./drawer-title.js";
 import { Trigger } from "./drawer-trigger.js";
-Close.displayName = "Drawer.Close";
-Content.displayName = "Drawer.Content";
-Description.displayName = "Drawer.Description";
-Footer.displayName = "Drawer.Footer";
-Overlay.displayName = "Drawer.Overlay";
-Root.displayName = "Drawer";
-Title.displayName = "Drawer.Title";
-Trigger.displayName = "Drawer.Trigger";
-const Drawer = Object.assign(Root, {
-  Title,
-  Description,
-  Trigger,
-  Overlay,
-  Content,
-  Footer,
-  Close
-});
+const Drawer = Root;
+Drawer.displayName = "Drawer";
+Drawer.Trigger = Trigger;
+Drawer.Trigger.displayName = "Drawer.Trigger";
+Drawer.Content = Content;
+Drawer.Content.displayName = "Drawer.Content";
+Drawer.Title = Title;
+Drawer.Title.displayName = "Drawer.Title";
+Drawer.Description = Description;
+Drawer.Description.displayName = "Drawer.Description";
+Drawer.Overlay = Overlay;
+Drawer.Overlay.displayName = "Drawer.Overlay";
+Drawer.Footer = Footer;
+Drawer.Footer.displayName = "Drawer.Footer";
+Drawer.Close = Close;
+Drawer.Close.displayName = "Drawer.Close";
 export {
   Drawer
 };

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

@@ -88,7 +88,7 @@ declare const Modal: import('react').FC<RootProps> & {
     /**
      * An accessible title to be announced when the dialog is opened.
      * It will render the internal Heading component
-     * If you want to hide the title, wrap it inside our Visually Hidden utility like this <VisuallyHidden asChild>.
+     * If you want to hide the title, wrap it inside our Visually Hidden utility like this`<VisuallyHidden asChild>`.
      *
      * @component
      *
@@ -100,7 +100,7 @@ declare const Modal: import('react').FC<RootProps> & {
      * An optional accessible description to be announced when the dialog is opened.
      * This will render the internal Text component with an default p tag
      *
-     * If you want to hide the description, wrap it inside our Visually Hidden utility like this <VisuallyHidden asChild>
+     * If you want to hide the description, wrap it inside our Visually Hidden utility like this  `<VisuallyHidden asChild>`
      *
      * @component
      *

package/dist/drawer.module-C4NZoZUc.cjs

@@ -0,0 +1,15 @@
+"use strict";
+const styles = {
+  "teddy-drawer__overlay": "_teddy-drawer__overlay_16gp4_26",
+  "teddy-overlay-no-op": "_teddy-overlay-no-op_16gp4_1",
+  "teddy-fade-in": "_teddy-fade-in_16gp4_1",
+  "teddy-fade-out": "_teddy-fade-out_16gp4_1",
+  "teddy-drawer__overlay--container": "_teddy-drawer__overlay--container_16gp4_60",
+  "teddy-drawer__content": "_teddy-drawer__content_16gp4_66",
+  "teddy-drawer__title": "_teddy-drawer__title_16gp4_70",
+  "drawer-content-show": "_drawer-content-show_16gp4_1",
+  "drawer-content-hide": "_drawer-content-hide_16gp4_1",
+  "teddy-drawer__content--lg": "_teddy-drawer__content--lg_16gp4_101",
+  "teddy-drawer__close--floating": "_teddy-drawer__close--floating_16gp4_106"
+};
+exports.styles = styles;

package/dist/drawer.module-jxIDBwQn.js

@@ -0,0 +1,16 @@
+const styles = {
+  "teddy-drawer__overlay": "_teddy-drawer__overlay_16gp4_26",
+  "teddy-overlay-no-op": "_teddy-overlay-no-op_16gp4_1",
+  "teddy-fade-in": "_teddy-fade-in_16gp4_1",
+  "teddy-fade-out": "_teddy-fade-out_16gp4_1",
+  "teddy-drawer__overlay--container": "_teddy-drawer__overlay--container_16gp4_60",
+  "teddy-drawer__content": "_teddy-drawer__content_16gp4_66",
+  "teddy-drawer__title": "_teddy-drawer__title_16gp4_70",
+  "drawer-content-show": "_drawer-content-show_16gp4_1",
+  "drawer-content-hide": "_drawer-content-hide_16gp4_1",
+  "teddy-drawer__content--lg": "_teddy-drawer__content--lg_16gp4_101",
+  "teddy-drawer__close--floating": "_teddy-drawer__close--floating_16gp4_106"
+};
+export {
+  styles as s
+};

package/dist/style.css

@@ -2404,7 +2404,7 @@
   right: 100%;
   transform: rotate(180deg);
 }@layer reset, flex, button, link, heading, drawer;
-@keyframes _teddy-fade-in_1hfde_1 {
+@keyframes _teddy-fade-in_16gp4_1 {
   from {
     opacity: 0;
   }
@@ -2412,7 +2412,7 @@
     opacity: 1;
   }
 }
-@keyframes _teddy-fade-out_1hfde_1 {
+@keyframes _teddy-fade-out_16gp4_1 {
   from {
     opacity: 1;
   }
@@ -2420,7 +2420,7 @@
     opacity: 0;
   }
 }
-@keyframes _teddy-overlay-no-op_1hfde_1 {
+@keyframes _teddy-overlay-no-op_16gp4_1 {
   from {
     opacity: 1;
   }
@@ -2428,11 +2428,11 @@
     opacity: 1;
   }
 }
-._teddy-drawer__overlay_1hfde_26 {
+._teddy-drawer__overlay_16gp4_26 {
   box-sizing: border-box;
 }
 @layer drawer {
-  ._teddy-drawer__overlay_1hfde_26 {
+  ._teddy-drawer__overlay_16gp4_26 {
     box-sizing: border-box;
     position: fixed;
     inset: 0;
@@ -2441,37 +2441,37 @@
     z-index: 40;
   }
   @media (prefers-reduced-motion: no-preference) {
-    ._teddy-drawer__overlay_1hfde_26 {
+    ._teddy-drawer__overlay_16gp4_26 {
       /* Keep the overlay mounted until the children have animated */
     }
-    ._teddy-drawer__overlay_1hfde_26:where([data-state=closed]) {
-      animation: _teddy-overlay-no-op_1hfde_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__overlay_16gp4_26:where([data-state=closed]) {
+      animation: _teddy-overlay-no-op_16gp4_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
     }
-    ._teddy-drawer__overlay_1hfde_26:where([data-state=open])::before {
-      animation: _teddy-fade-in_1hfde_1 500ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__overlay_16gp4_26:where([data-state=open])::before {
+      animation: _teddy-fade-in_16gp4_1 500ms cubic-bezier(0.16, 1, 0.3, 1);
     }
-    ._teddy-drawer__overlay_1hfde_26:where([data-state=closed])::before {
+    ._teddy-drawer__overlay_16gp4_26:where([data-state=closed])::before {
       opacity: 0;
-      animation: _teddy-fade-out_1hfde_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
+      animation: _teddy-fade-out_16gp4_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
     }
   }
-  ._teddy-drawer__overlay_1hfde_26::before {
+  ._teddy-drawer__overlay_16gp4_26::before {
     position: fixed;
     content: "";
     inset: 0;
     background-color: var(--teddy-color-overlay-default);
   }
-  ._teddy-drawer__overlay--container_1hfde_60 {
+  ._teddy-drawer__overlay--container_16gp4_60 {
     position: absolute;
   }
-  ._teddy-drawer__overlay--container_1hfde_60::before {
+  ._teddy-drawer__overlay--container_16gp4_60::before {
     position: absolute;
   }
-  ._teddy-drawer__overlay--container_1hfde_60 ._teddy-drawer__content_1hfde_66 {
+  ._teddy-drawer__overlay--container_16gp4_60 ._teddy-drawer__content_16gp4_66 {
     position: absolute;
     inset: 0;
   }
-  ._teddy-drawer__title_1hfde_70 {
+  ._teddy-drawer__title_16gp4_70 {
     position: sticky;
     padding: var(--teddy-spacing-300) 0 var(--teddy-spacing-200);
     background-color: var(--teddy-color-background-primary);
@@ -2479,7 +2479,7 @@
     margin: calc(-1 * var(--teddy-spacing-300)) 0 calc(-1 * var(--teddy-spacing-200));
     z-index: 2;
   }
-  ._teddy-drawer__content_1hfde_66 {
+  ._teddy-drawer__content_16gp4_66 {
     background-color: var(--teddy-color-background-primary);
     box-shadow: var(--teddy-shadow-lg);
     z-index: 40;
@@ -2495,27 +2495,26 @@
     min-width: min(100%, 400px);
   }
   @media (prefers-reduced-motion: no-preference) {
-    ._teddy-drawer__content_1hfde_66:where([data-state=open]) {
-      animation: _drawer-content-show_1hfde_1 450ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__content_16gp4_66:where([data-state=open]) {
+      animation: _drawer-content-show_16gp4_1 450ms cubic-bezier(0.16, 1, 0.3, 1);
     }
-    ._teddy-drawer__content_1hfde_66:where([data-state=closed]) {
-      opacity: 0;
-      animation: _drawer-content-hide_1hfde_1 350ms cubic-bezier(0.16, 1, 0.3, 1);
+    ._teddy-drawer__content_16gp4_66:where([data-state=closed]) {
+      animation: _drawer-content-hide_16gp4_1 350ms cubic-bezier(0.16, 1, 0.3, 1);
     }
   }
-  ._teddy-drawer__content--lg_1hfde_102 {
+  ._teddy-drawer__content--lg_16gp4_101 {
     min-width: min(100%, 30rem);
     width: 30vw;
     max-width: initial;
   }
-  ._teddy-drawer__close--floating_1hfde_107 {
+  ._teddy-drawer__close--floating_16gp4_106 {
     position: fixed;
     z-index: 3;
     top: var(--teddy-spacing-200);
     right: var(--teddy-spacing-200);
   }
 }
-@keyframes _drawer-content-show_1hfde_1 {
+@keyframes _drawer-content-show_16gp4_1 {
   from {
     transform: translateX(100%);
   }
@@ -2523,7 +2522,7 @@
     transform: translateX(0px);
   }
 }
-@keyframes _drawer-content-hide_1hfde_1 {
+@keyframes _drawer-content-hide_16gp4_1 {
   from {
     transform: translateX(0px);
   }

package/package.json

@@ -20,7 +20,7 @@
     "pnpm": ">=9"
   },
   "private": false,
-  "version": "0.3.3",
+  "version": "0.3.5",
   "sideEffects": [
     "**/*.css",
     "**/*.svg"

package/dist/drawer.module-Bh77Byg_.js

@@ -1,16 +0,0 @@
-const styles = {
-  "teddy-drawer__overlay": "_teddy-drawer__overlay_1hfde_26",
-  "teddy-overlay-no-op": "_teddy-overlay-no-op_1hfde_1",
-  "teddy-fade-in": "_teddy-fade-in_1hfde_1",
-  "teddy-fade-out": "_teddy-fade-out_1hfde_1",
-  "teddy-drawer__overlay--container": "_teddy-drawer__overlay--container_1hfde_60",
-  "teddy-drawer__content": "_teddy-drawer__content_1hfde_66",
-  "teddy-drawer__title": "_teddy-drawer__title_1hfde_70",
-  "drawer-content-show": "_drawer-content-show_1hfde_1",
-  "drawer-content-hide": "_drawer-content-hide_1hfde_1",
-  "teddy-drawer__content--lg": "_teddy-drawer__content--lg_1hfde_102",
-  "teddy-drawer__close--floating": "_teddy-drawer__close--floating_1hfde_107"
-};
-export {
-  styles as s
-};

package/dist/drawer.module-khivHSFm.cjs

@@ -1,15 +0,0 @@
-"use strict";
-const styles = {
-  "teddy-drawer__overlay": "_teddy-drawer__overlay_1hfde_26",
-  "teddy-overlay-no-op": "_teddy-overlay-no-op_1hfde_1",
-  "teddy-fade-in": "_teddy-fade-in_1hfde_1",
-  "teddy-fade-out": "_teddy-fade-out_1hfde_1",
-  "teddy-drawer__overlay--container": "_teddy-drawer__overlay--container_1hfde_60",
-  "teddy-drawer__content": "_teddy-drawer__content_1hfde_66",
-  "teddy-drawer__title": "_teddy-drawer__title_1hfde_70",
-  "drawer-content-show": "_drawer-content-show_1hfde_1",
-  "drawer-content-hide": "_drawer-content-hide_1hfde_1",
-  "teddy-drawer__content--lg": "_teddy-drawer__content--lg_1hfde_102",
-  "teddy-drawer__close--floating": "_teddy-drawer__close--floating_1hfde_107"
-};
-exports.styles = styles;