@wistia/ui 0.18.0-beta.978703a9.78cdfd1 → 0.18.0-beta.ce6c1712.725e361

package/dist/index.d.mts

@@ -123,11 +123,11 @@ declare const useFocusTrap: (active?: boolean, options?: UseFocusTrapOptions) =>
 declare const useForceUpdate: () => (() => void);
 
 type HoverProps = {
-    onFocus: () => void;
-    onMouseEnter: () => void;
-    onBlur: () => void;
-    onMouseLeave: () => void;
-    onMouseMove?: () => void;
+    onFocus: (event: React.FocusEvent) => void;
+    onMouseEnter: (event: React.MouseEvent) => void;
+    onBlur: (event: React.FocusEvent) => void;
+    onMouseLeave: (event: React.MouseEvent) => void;
+    onMouseMove?: (event: React.MouseEvent) => void;
 };
 declare const useIsHovered: () => [boolean, HoverProps, (hovered: boolean) => void];
 
@@ -430,7 +430,7 @@ declare const Button: react.ForwardRefExoticComponent<(Omit<BaseButtonProps & Om
 
 type ToastProps = ComponentPropsWithoutRef<'div'> & {
     /**
-     * Action can be passed a Button component for a custom button to be displayed in the toast
+     * Action can be undefined (default dismiss button), a Button component or false to hide the dismiss button
      */
     action?: React.ReactElement<typeof Button> | undefined;
     /**
@@ -445,15 +445,10 @@ type ToastProps = ComponentPropsWithoutRef<'div'> & {
      * The message displayed in the toast
      */
     message: ReactNode;
-    /**
-     * @ignore
-     * The ID given for the Toast by sonner
-     */
-    toastId?: string;
 };
 
 type Position = 'bottom-center' | 'bottom-left' | 'bottom-right' | 'top-center' | 'top-left' | 'top-right';
-type UseToastProps = Omit<ToastProps, 'toastId'> & {
+type UseToastProps = ToastProps & {
     position?: Position;
     duration?: number;
 };

package/dist/index.d.ts

@@ -123,11 +123,11 @@ declare const useFocusTrap: (active?: boolean, options?: UseFocusTrapOptions) =>
 declare const useForceUpdate: () => (() => void);
 
 type HoverProps = {
-    onFocus: () => void;
-    onMouseEnter: () => void;
-    onBlur: () => void;
-    onMouseLeave: () => void;
-    onMouseMove?: () => void;
+    onFocus: (event: React.FocusEvent) => void;
+    onMouseEnter: (event: React.MouseEvent) => void;
+    onBlur: (event: React.FocusEvent) => void;
+    onMouseLeave: (event: React.MouseEvent) => void;
+    onMouseMove?: (event: React.MouseEvent) => void;
 };
 declare const useIsHovered: () => [boolean, HoverProps, (hovered: boolean) => void];
 
@@ -430,7 +430,7 @@ declare const Button: react.ForwardRefExoticComponent<(Omit<BaseButtonProps & Om
 
 type ToastProps = ComponentPropsWithoutRef<'div'> & {
     /**
-     * Action can be passed a Button component for a custom button to be displayed in the toast
+     * Action can be undefined (default dismiss button), a Button component or false to hide the dismiss button
      */
     action?: React.ReactElement<typeof Button> | undefined;
     /**
@@ -445,15 +445,10 @@ type ToastProps = ComponentPropsWithoutRef<'div'> & {
      * The message displayed in the toast
      */
     message: ReactNode;
-    /**
-     * @ignore
-     * The ID given for the Toast by sonner
-     */
-    toastId?: string;
 };
 
 type Position = 'bottom-center' | 'bottom-left' | 'bottom-right' | 'top-center' | 'top-left' | 'top-right';
-type UseToastProps = Omit<ToastProps, 'toastId'> & {
+type UseToastProps = ToastProps & {
     position?: Position;
     duration?: number;
 };

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.18.0-beta.978703a9.78cdfd1
+ * @license @wistia/ui v0.18.0-beta.ce6c1712.725e361
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -2812,11 +2812,26 @@ var useForceUpdate = () => {
 import { useState as useState6 } from "react";
 var useIsHovered = () => {
   const [isHovered, setIsHovered] = useState6(false);
-  const onFocus = () => setIsHovered(true);
-  const onMouseEnter = () => setIsHovered(true);
-  const onMouseMove = () => setIsHovered(true);
-  const onBlur = () => setIsHovered(false);
-  const onMouseLeave = () => setIsHovered(false);
+  const onFocus = (event) => {
+    if (event.target !== event.currentTarget) return;
+    setIsHovered(true);
+  };
+  const onMouseEnter = (event) => {
+    if (event.target !== event.currentTarget) return;
+    setIsHovered(true);
+  };
+  const onMouseMove = (event) => {
+    if (event.target !== event.currentTarget) return;
+    setIsHovered(true);
+  };
+  const onBlur = (event) => {
+    if (event.target !== event.currentTarget) return;
+    setIsHovered(false);
+  };
+  const onMouseLeave = (event) => {
+    if (event.target !== event.currentTarget) return;
+    setIsHovered(false);
+  };
   const hoverProps = {
     onFocus,
     onMouseEnter,
@@ -3190,7 +3205,7 @@ var StyledToast = styled2.div`
   justify-content: space-between;
   min-height: 56px;
   width: 356px;
-  border-radius: var(--wui-border-radius-02);
+  border-radius: var(--wui-border-radius-01);
   background-color: var(--wui-color-bg-surface);
   border: 1px solid var(--wui-color-border);
   color: var(--wui-color-text);
@@ -3206,28 +3221,13 @@ var StyledToast = styled2.div`
     flex: 0 0 16px;
   }
 `;
-var Action = ({
-  actionButton,
-  toastId
-}) => {
+var Action = ({ actionButton }) => {
   if (isNotNil4(actionButton) && isValidElement(actionButton)) {
-    const { onClick, ...restProps } = actionButton.props;
-    const handleClick = (event) => {
-      if (onClick) {
-        onClick(
-          event,
-          toastId ?? ""
-        );
-      }
-    };
     return /* @__PURE__ */ jsx5(ActionWrapper, { children: cloneElement(actionButton, {
-      ...restProps,
       variant: "soft",
       // force Button variant
-      size: "sm",
+      size: "sm"
       // force Button size
-      onClick: handleClick
-      // decorate onClick function with new args
     }) });
   }
   return null;
@@ -3237,7 +3237,6 @@ var Toast = ({
   message,
   colorScheme = "inherit",
   icon,
-  toastId,
   ...props
 }) => {
   return /* @__PURE__ */ jsxs2(
@@ -3250,13 +3249,7 @@ var Toast = ({
           isNotNil4(icon) ? icon : null,
           /* @__PURE__ */ jsx5(Message, { lines: 3, children: message })
         ] }),
-        /* @__PURE__ */ jsx5(
-          Action,
-          {
-            actionButton: action,
-            toastId
-          }
-        )
+        /* @__PURE__ */ jsx5(Action, { actionButton: action })
       ]
     }
   );
@@ -3269,15 +3262,14 @@ var useToast = () => {
   return useCallback7(
     ({ message, action, colorScheme, icon, position = "bottom-left", duration = 3e3 }) => {
       sonnerToast.custom(
-        (toastId) => {
+        () => {
           return /* @__PURE__ */ jsx6(
             Toast,
             {
               action,
               colorScheme,
               icon,
-              message,
-              toastId: String(toastId)
+              message
             }
           );
         },