@addsign/moje-agenda-shared-lib 2.0.11 → 2.0.13

package/dist/components/ui/toast.js

@@ -0,0 +1,742 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import { r as reactDomExports } from "../../index-CQ3u2ZB9.js";
+import { c as createContextScope, a as useCallbackRef, b as composeEventHandlers, u as useLayoutEffect2 } from "../../index-CDCkSjVs.js";
+import { u as useComposedRefs } from "../../index-D9mvqz1C.js";
+import { c as createCollection } from "../../index-E5yk6fTE.js";
+import { B as Branch, R as Root } from "../../index-CEVipgcd.js";
+import { P as Portal } from "../../index-cAAySw6z.js";
+import { P as Presence } from "../../index-CA2QNu6z.js";
+import { P as Primitive, d as dispatchDiscreteCustomEvent } from "../../index-BkUJPEGE.js";
+import { u as useControllableState } from "../../index-DFSwSCB0.js";
+import { V as VisuallyHidden } from "../../index-DiJxz9_S.js";
+import { c as cva } from "../../index-udNDzvjB.js";
+import { cn } from "../../utils/utils.js";
+import { X } from "../../x-DciOkaU0.js";
+var PROVIDER_NAME = "ToastProvider";
+var [Collection, useCollection, createCollectionScope] = createCollection("Toast");
+var [createToastContext, createToastScope] = createContextScope("Toast", [createCollectionScope]);
+var [ToastProviderProvider, useToastProviderContext] = createToastContext(PROVIDER_NAME);
+var ToastProvider$1 = (props) => {
+  const {
+    __scopeToast,
+    label = "Notification",
+    duration = 5e3,
+    swipeDirection = "right",
+    swipeThreshold = 50,
+    children
+  } = props;
+  const [viewport, setViewport] = React.useState(null);
+  const [toastCount, setToastCount] = React.useState(0);
+  const isFocusedToastEscapeKeyDownRef = React.useRef(false);
+  const isClosePausedRef = React.useRef(false);
+  if (!label.trim()) {
+    console.error(
+      `Invalid prop \`label\` supplied to \`${PROVIDER_NAME}\`. Expected non-empty \`string\`.`
+    );
+  }
+  return /* @__PURE__ */ jsx(Collection.Provider, { scope: __scopeToast, children: /* @__PURE__ */ jsx(
+    ToastProviderProvider,
+    {
+      scope: __scopeToast,
+      label,
+      duration,
+      swipeDirection,
+      swipeThreshold,
+      toastCount,
+      viewport,
+      onViewportChange: setViewport,
+      onToastAdd: React.useCallback(() => setToastCount((prevCount) => prevCount + 1), []),
+      onToastRemove: React.useCallback(() => setToastCount((prevCount) => prevCount - 1), []),
+      isFocusedToastEscapeKeyDownRef,
+      isClosePausedRef,
+      children
+    }
+  ) });
+};
+ToastProvider$1.displayName = PROVIDER_NAME;
+var VIEWPORT_NAME = "ToastViewport";
+var VIEWPORT_DEFAULT_HOTKEY = ["F8"];
+var VIEWPORT_PAUSE = "toast.viewportPause";
+var VIEWPORT_RESUME = "toast.viewportResume";
+var ToastViewport$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const {
+      __scopeToast,
+      hotkey = VIEWPORT_DEFAULT_HOTKEY,
+      label = "Notifications ({hotkey})",
+      ...viewportProps
+    } = props;
+    const context = useToastProviderContext(VIEWPORT_NAME, __scopeToast);
+    const getItems = useCollection(__scopeToast);
+    const wrapperRef = React.useRef(null);
+    const headFocusProxyRef = React.useRef(null);
+    const tailFocusProxyRef = React.useRef(null);
+    const ref = React.useRef(null);
+    const composedRefs = useComposedRefs(forwardedRef, ref, context.onViewportChange);
+    const hotkeyLabel = hotkey.join("+").replace(/Key/g, "").replace(/Digit/g, "");
+    const hasToasts = context.toastCount > 0;
+    React.useEffect(() => {
+      const handleKeyDown = (event) => {
+        var _a;
+        const isHotkeyPressed = hotkey.length !== 0 && hotkey.every((key) => event[key] || event.code === key);
+        if (isHotkeyPressed)
+          (_a = ref.current) == null ? void 0 : _a.focus();
+      };
+      document.addEventListener("keydown", handleKeyDown);
+      return () => document.removeEventListener("keydown", handleKeyDown);
+    }, [hotkey]);
+    React.useEffect(() => {
+      const wrapper = wrapperRef.current;
+      const viewport = ref.current;
+      if (hasToasts && wrapper && viewport) {
+        const handlePause = () => {
+          if (!context.isClosePausedRef.current) {
+            const pauseEvent = new CustomEvent(VIEWPORT_PAUSE);
+            viewport.dispatchEvent(pauseEvent);
+            context.isClosePausedRef.current = true;
+          }
+        };
+        const handleResume = () => {
+          if (context.isClosePausedRef.current) {
+            const resumeEvent = new CustomEvent(VIEWPORT_RESUME);
+            viewport.dispatchEvent(resumeEvent);
+            context.isClosePausedRef.current = false;
+          }
+        };
+        const handleFocusOutResume = (event) => {
+          const isFocusMovingOutside = !wrapper.contains(event.relatedTarget);
+          if (isFocusMovingOutside)
+            handleResume();
+        };
+        const handlePointerLeaveResume = () => {
+          const isFocusInside = wrapper.contains(document.activeElement);
+          if (!isFocusInside)
+            handleResume();
+        };
+        wrapper.addEventListener("focusin", handlePause);
+        wrapper.addEventListener("focusout", handleFocusOutResume);
+        wrapper.addEventListener("pointermove", handlePause);
+        wrapper.addEventListener("pointerleave", handlePointerLeaveResume);
+        window.addEventListener("blur", handlePause);
+        window.addEventListener("focus", handleResume);
+        return () => {
+          wrapper.removeEventListener("focusin", handlePause);
+          wrapper.removeEventListener("focusout", handleFocusOutResume);
+          wrapper.removeEventListener("pointermove", handlePause);
+          wrapper.removeEventListener("pointerleave", handlePointerLeaveResume);
+          window.removeEventListener("blur", handlePause);
+          window.removeEventListener("focus", handleResume);
+        };
+      }
+    }, [hasToasts, context.isClosePausedRef]);
+    const getSortedTabbableCandidates = React.useCallback(
+      ({ tabbingDirection }) => {
+        const toastItems = getItems();
+        const tabbableCandidates = toastItems.map((toastItem) => {
+          const toastNode = toastItem.ref.current;
+          const toastTabbableCandidates = [toastNode, ...getTabbableCandidates(toastNode)];
+          return tabbingDirection === "forwards" ? toastTabbableCandidates : toastTabbableCandidates.reverse();
+        });
+        return (tabbingDirection === "forwards" ? tabbableCandidates.reverse() : tabbableCandidates).flat();
+      },
+      [getItems]
+    );
+    React.useEffect(() => {
+      const viewport = ref.current;
+      if (viewport) {
+        const handleKeyDown = (event) => {
+          var _a, _b, _c;
+          const isMetaKey = event.altKey || event.ctrlKey || event.metaKey;
+          const isTabKey = event.key === "Tab" && !isMetaKey;
+          if (isTabKey) {
+            const focusedElement = document.activeElement;
+            const isTabbingBackwards = event.shiftKey;
+            const targetIsViewport = event.target === viewport;
+            if (targetIsViewport && isTabbingBackwards) {
+              (_a = headFocusProxyRef.current) == null ? void 0 : _a.focus();
+              return;
+            }
+            const tabbingDirection = isTabbingBackwards ? "backwards" : "forwards";
+            const sortedCandidates = getSortedTabbableCandidates({ tabbingDirection });
+            const index = sortedCandidates.findIndex((candidate) => candidate === focusedElement);
+            if (focusFirst(sortedCandidates.slice(index + 1))) {
+              event.preventDefault();
+            } else {
+              isTabbingBackwards ? (_b = headFocusProxyRef.current) == null ? void 0 : _b.focus() : (_c = tailFocusProxyRef.current) == null ? void 0 : _c.focus();
+            }
+          }
+        };
+        viewport.addEventListener("keydown", handleKeyDown);
+        return () => viewport.removeEventListener("keydown", handleKeyDown);
+      }
+    }, [getItems, getSortedTabbableCandidates]);
+    return /* @__PURE__ */ jsxs(
+      Branch,
+      {
+        ref: wrapperRef,
+        role: "region",
+        "aria-label": label.replace("{hotkey}", hotkeyLabel),
+        tabIndex: -1,
+        style: { pointerEvents: hasToasts ? void 0 : "none" },
+        children: [
+          hasToasts && /* @__PURE__ */ jsx(
+            FocusProxy,
+            {
+              ref: headFocusProxyRef,
+              onFocusFromOutsideViewport: () => {
+                const tabbableCandidates = getSortedTabbableCandidates({
+                  tabbingDirection: "forwards"
+                });
+                focusFirst(tabbableCandidates);
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(Collection.Slot, { scope: __scopeToast, children: /* @__PURE__ */ jsx(Primitive.ol, { tabIndex: -1, ...viewportProps, ref: composedRefs }) }),
+          hasToasts && /* @__PURE__ */ jsx(
+            FocusProxy,
+            {
+              ref: tailFocusProxyRef,
+              onFocusFromOutsideViewport: () => {
+                const tabbableCandidates = getSortedTabbableCandidates({
+                  tabbingDirection: "backwards"
+                });
+                focusFirst(tabbableCandidates);
+              }
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+ToastViewport$1.displayName = VIEWPORT_NAME;
+var FOCUS_PROXY_NAME = "ToastFocusProxy";
+var FocusProxy = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeToast, onFocusFromOutsideViewport, ...proxyProps } = props;
+    const context = useToastProviderContext(FOCUS_PROXY_NAME, __scopeToast);
+    return /* @__PURE__ */ jsx(
+      VisuallyHidden,
+      {
+        "aria-hidden": true,
+        tabIndex: 0,
+        ...proxyProps,
+        ref: forwardedRef,
+        style: { position: "fixed" },
+        onFocus: (event) => {
+          var _a;
+          const prevFocusedElement = event.relatedTarget;
+          const isFocusFromOutsideViewport = !((_a = context.viewport) == null ? void 0 : _a.contains(prevFocusedElement));
+          if (isFocusFromOutsideViewport)
+            onFocusFromOutsideViewport();
+        }
+      }
+    );
+  }
+);
+FocusProxy.displayName = FOCUS_PROXY_NAME;
+var TOAST_NAME = "Toast";
+var TOAST_SWIPE_START = "toast.swipeStart";
+var TOAST_SWIPE_MOVE = "toast.swipeMove";
+var TOAST_SWIPE_CANCEL = "toast.swipeCancel";
+var TOAST_SWIPE_END = "toast.swipeEnd";
+var Toast$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { forceMount, open: openProp, defaultOpen, onOpenChange, ...toastProps } = props;
+    const [open = true, setOpen] = useControllableState({
+      prop: openProp,
+      defaultProp: defaultOpen,
+      onChange: onOpenChange
+    });
+    return /* @__PURE__ */ jsx(Presence, { present: forceMount || open, children: /* @__PURE__ */ jsx(
+      ToastImpl,
+      {
+        open,
+        ...toastProps,
+        ref: forwardedRef,
+        onClose: () => setOpen(false),
+        onPause: useCallbackRef(props.onPause),
+        onResume: useCallbackRef(props.onResume),
+        onSwipeStart: composeEventHandlers(props.onSwipeStart, (event) => {
+          event.currentTarget.setAttribute("data-swipe", "start");
+        }),
+        onSwipeMove: composeEventHandlers(props.onSwipeMove, (event) => {
+          const { x, y } = event.detail.delta;
+          event.currentTarget.setAttribute("data-swipe", "move");
+          event.currentTarget.style.setProperty("--radix-toast-swipe-move-x", `${x}px`);
+          event.currentTarget.style.setProperty("--radix-toast-swipe-move-y", `${y}px`);
+        }),
+        onSwipeCancel: composeEventHandlers(props.onSwipeCancel, (event) => {
+          event.currentTarget.setAttribute("data-swipe", "cancel");
+          event.currentTarget.style.removeProperty("--radix-toast-swipe-move-x");
+          event.currentTarget.style.removeProperty("--radix-toast-swipe-move-y");
+          event.currentTarget.style.removeProperty("--radix-toast-swipe-end-x");
+          event.currentTarget.style.removeProperty("--radix-toast-swipe-end-y");
+        }),
+        onSwipeEnd: composeEventHandlers(props.onSwipeEnd, (event) => {
+          const { x, y } = event.detail.delta;
+          event.currentTarget.setAttribute("data-swipe", "end");
+          event.currentTarget.style.removeProperty("--radix-toast-swipe-move-x");
+          event.currentTarget.style.removeProperty("--radix-toast-swipe-move-y");
+          event.currentTarget.style.setProperty("--radix-toast-swipe-end-x", `${x}px`);
+          event.currentTarget.style.setProperty("--radix-toast-swipe-end-y", `${y}px`);
+          setOpen(false);
+        })
+      }
+    ) });
+  }
+);
+Toast$1.displayName = TOAST_NAME;
+var [ToastInteractiveProvider, useToastInteractiveContext] = createToastContext(TOAST_NAME, {
+  onClose() {
+  }
+});
+var ToastImpl = React.forwardRef(
+  (props, forwardedRef) => {
+    const {
+      __scopeToast,
+      type = "foreground",
+      duration: durationProp,
+      open,
+      onClose,
+      onEscapeKeyDown,
+      onPause,
+      onResume,
+      onSwipeStart,
+      onSwipeMove,
+      onSwipeCancel,
+      onSwipeEnd,
+      ...toastProps
+    } = props;
+    const context = useToastProviderContext(TOAST_NAME, __scopeToast);
+    const [node, setNode] = React.useState(null);
+    const composedRefs = useComposedRefs(forwardedRef, (node2) => setNode(node2));
+    const pointerStartRef = React.useRef(null);
+    const swipeDeltaRef = React.useRef(null);
+    const duration = durationProp || context.duration;
+    const closeTimerStartTimeRef = React.useRef(0);
+    const closeTimerRemainingTimeRef = React.useRef(duration);
+    const closeTimerRef = React.useRef(0);
+    const { onToastAdd, onToastRemove } = context;
+    const handleClose = useCallbackRef(() => {
+      var _a;
+      const isFocusInToast = node == null ? void 0 : node.contains(document.activeElement);
+      if (isFocusInToast)
+        (_a = context.viewport) == null ? void 0 : _a.focus();
+      onClose();
+    });
+    const startTimer = React.useCallback(
+      (duration2) => {
+        if (!duration2 || duration2 === Infinity)
+          return;
+        window.clearTimeout(closeTimerRef.current);
+        closeTimerStartTimeRef.current = (/* @__PURE__ */ new Date()).getTime();
+        closeTimerRef.current = window.setTimeout(handleClose, duration2);
+      },
+      [handleClose]
+    );
+    React.useEffect(() => {
+      const viewport = context.viewport;
+      if (viewport) {
+        const handleResume = () => {
+          startTimer(closeTimerRemainingTimeRef.current);
+          onResume == null ? void 0 : onResume();
+        };
+        const handlePause = () => {
+          const elapsedTime = (/* @__PURE__ */ new Date()).getTime() - closeTimerStartTimeRef.current;
+          closeTimerRemainingTimeRef.current = closeTimerRemainingTimeRef.current - elapsedTime;
+          window.clearTimeout(closeTimerRef.current);
+          onPause == null ? void 0 : onPause();
+        };
+        viewport.addEventListener(VIEWPORT_PAUSE, handlePause);
+        viewport.addEventListener(VIEWPORT_RESUME, handleResume);
+        return () => {
+          viewport.removeEventListener(VIEWPORT_PAUSE, handlePause);
+          viewport.removeEventListener(VIEWPORT_RESUME, handleResume);
+        };
+      }
+    }, [context.viewport, duration, onPause, onResume, startTimer]);
+    React.useEffect(() => {
+      if (open && !context.isClosePausedRef.current)
+        startTimer(duration);
+    }, [open, duration, context.isClosePausedRef, startTimer]);
+    React.useEffect(() => {
+      onToastAdd();
+      return () => onToastRemove();
+    }, [onToastAdd, onToastRemove]);
+    const announceTextContent = React.useMemo(() => {
+      return node ? getAnnounceTextContent(node) : null;
+    }, [node]);
+    if (!context.viewport)
+      return null;
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      announceTextContent && /* @__PURE__ */ jsx(
+        ToastAnnounce,
+        {
+          __scopeToast,
+          role: "status",
+          "aria-live": type === "foreground" ? "assertive" : "polite",
+          "aria-atomic": true,
+          children: announceTextContent
+        }
+      ),
+      /* @__PURE__ */ jsx(ToastInteractiveProvider, { scope: __scopeToast, onClose: handleClose, children: reactDomExports.createPortal(
+        /* @__PURE__ */ jsx(Collection.ItemSlot, { scope: __scopeToast, children: /* @__PURE__ */ jsx(
+          Root,
+          {
+            asChild: true,
+            onEscapeKeyDown: composeEventHandlers(onEscapeKeyDown, () => {
+              if (!context.isFocusedToastEscapeKeyDownRef.current)
+                handleClose();
+              context.isFocusedToastEscapeKeyDownRef.current = false;
+            }),
+            children: /* @__PURE__ */ jsx(
+              Primitive.li,
+              {
+                role: "status",
+                "aria-live": "off",
+                "aria-atomic": true,
+                tabIndex: 0,
+                "data-state": open ? "open" : "closed",
+                "data-swipe-direction": context.swipeDirection,
+                ...toastProps,
+                ref: composedRefs,
+                style: { userSelect: "none", touchAction: "none", ...props.style },
+                onKeyDown: composeEventHandlers(props.onKeyDown, (event) => {
+                  if (event.key !== "Escape")
+                    return;
+                  onEscapeKeyDown == null ? void 0 : onEscapeKeyDown(event.nativeEvent);
+                  if (!event.nativeEvent.defaultPrevented) {
+                    context.isFocusedToastEscapeKeyDownRef.current = true;
+                    handleClose();
+                  }
+                }),
+                onPointerDown: composeEventHandlers(props.onPointerDown, (event) => {
+                  if (event.button !== 0)
+                    return;
+                  pointerStartRef.current = { x: event.clientX, y: event.clientY };
+                }),
+                onPointerMove: composeEventHandlers(props.onPointerMove, (event) => {
+                  if (!pointerStartRef.current)
+                    return;
+                  const x = event.clientX - pointerStartRef.current.x;
+                  const y = event.clientY - pointerStartRef.current.y;
+                  const hasSwipeMoveStarted = Boolean(swipeDeltaRef.current);
+                  const isHorizontalSwipe = ["left", "right"].includes(context.swipeDirection);
+                  const clamp = ["left", "up"].includes(context.swipeDirection) ? Math.min : Math.max;
+                  const clampedX = isHorizontalSwipe ? clamp(0, x) : 0;
+                  const clampedY = !isHorizontalSwipe ? clamp(0, y) : 0;
+                  const moveStartBuffer = event.pointerType === "touch" ? 10 : 2;
+                  const delta = { x: clampedX, y: clampedY };
+                  const eventDetail = { originalEvent: event, delta };
+                  if (hasSwipeMoveStarted) {
+                    swipeDeltaRef.current = delta;
+                    handleAndDispatchCustomEvent(TOAST_SWIPE_MOVE, onSwipeMove, eventDetail, {
+                      discrete: false
+                    });
+                  } else if (isDeltaInDirection(delta, context.swipeDirection, moveStartBuffer)) {
+                    swipeDeltaRef.current = delta;
+                    handleAndDispatchCustomEvent(TOAST_SWIPE_START, onSwipeStart, eventDetail, {
+                      discrete: false
+                    });
+                    event.target.setPointerCapture(event.pointerId);
+                  } else if (Math.abs(x) > moveStartBuffer || Math.abs(y) > moveStartBuffer) {
+                    pointerStartRef.current = null;
+                  }
+                }),
+                onPointerUp: composeEventHandlers(props.onPointerUp, (event) => {
+                  const delta = swipeDeltaRef.current;
+                  const target = event.target;
+                  if (target.hasPointerCapture(event.pointerId)) {
+                    target.releasePointerCapture(event.pointerId);
+                  }
+                  swipeDeltaRef.current = null;
+                  pointerStartRef.current = null;
+                  if (delta) {
+                    const toast = event.currentTarget;
+                    const eventDetail = { originalEvent: event, delta };
+                    if (isDeltaInDirection(delta, context.swipeDirection, context.swipeThreshold)) {
+                      handleAndDispatchCustomEvent(TOAST_SWIPE_END, onSwipeEnd, eventDetail, {
+                        discrete: true
+                      });
+                    } else {
+                      handleAndDispatchCustomEvent(
+                        TOAST_SWIPE_CANCEL,
+                        onSwipeCancel,
+                        eventDetail,
+                        {
+                          discrete: true
+                        }
+                      );
+                    }
+                    toast.addEventListener("click", (event2) => event2.preventDefault(), {
+                      once: true
+                    });
+                  }
+                })
+              }
+            )
+          }
+        ) }),
+        context.viewport
+      ) })
+    ] });
+  }
+);
+var ToastAnnounce = (props) => {
+  const { __scopeToast, children, ...announceProps } = props;
+  const context = useToastProviderContext(TOAST_NAME, __scopeToast);
+  const [renderAnnounceText, setRenderAnnounceText] = React.useState(false);
+  const [isAnnounced, setIsAnnounced] = React.useState(false);
+  useNextFrame(() => setRenderAnnounceText(true));
+  React.useEffect(() => {
+    const timer = window.setTimeout(() => setIsAnnounced(true), 1e3);
+    return () => window.clearTimeout(timer);
+  }, []);
+  return isAnnounced ? null : /* @__PURE__ */ jsx(Portal, { asChild: true, children: /* @__PURE__ */ jsx(VisuallyHidden, { ...announceProps, children: renderAnnounceText && /* @__PURE__ */ jsxs(Fragment, { children: [
+    context.label,
+    " ",
+    children
+  ] }) }) });
+};
+var TITLE_NAME = "ToastTitle";
+var ToastTitle$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeToast, ...titleProps } = props;
+    return /* @__PURE__ */ jsx(Primitive.div, { ...titleProps, ref: forwardedRef });
+  }
+);
+ToastTitle$1.displayName = TITLE_NAME;
+var DESCRIPTION_NAME = "ToastDescription";
+var ToastDescription$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeToast, ...descriptionProps } = props;
+    return /* @__PURE__ */ jsx(Primitive.div, { ...descriptionProps, ref: forwardedRef });
+  }
+);
+ToastDescription$1.displayName = DESCRIPTION_NAME;
+var ACTION_NAME = "ToastAction";
+var ToastAction$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { altText, ...actionProps } = props;
+    if (!altText.trim()) {
+      console.error(
+        `Invalid prop \`altText\` supplied to \`${ACTION_NAME}\`. Expected non-empty \`string\`.`
+      );
+      return null;
+    }
+    return /* @__PURE__ */ jsx(ToastAnnounceExclude, { altText, asChild: true, children: /* @__PURE__ */ jsx(ToastClose$1, { ...actionProps, ref: forwardedRef }) });
+  }
+);
+ToastAction$1.displayName = ACTION_NAME;
+var CLOSE_NAME = "ToastClose";
+var ToastClose$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeToast, ...closeProps } = props;
+    const interactiveContext = useToastInteractiveContext(CLOSE_NAME, __scopeToast);
+    return /* @__PURE__ */ jsx(ToastAnnounceExclude, { asChild: true, children: /* @__PURE__ */ jsx(
+      Primitive.button,
+      {
+        type: "button",
+        ...closeProps,
+        ref: forwardedRef,
+        onClick: composeEventHandlers(props.onClick, interactiveContext.onClose)
+      }
+    ) });
+  }
+);
+ToastClose$1.displayName = CLOSE_NAME;
+var ToastAnnounceExclude = React.forwardRef((props, forwardedRef) => {
+  const { __scopeToast, altText, ...announceExcludeProps } = props;
+  return /* @__PURE__ */ jsx(
+    Primitive.div,
+    {
+      "data-radix-toast-announce-exclude": "",
+      "data-radix-toast-announce-alt": altText || void 0,
+      ...announceExcludeProps,
+      ref: forwardedRef
+    }
+  );
+});
+function getAnnounceTextContent(container) {
+  const textContent = [];
+  const childNodes = Array.from(container.childNodes);
+  childNodes.forEach((node) => {
+    if (node.nodeType === node.TEXT_NODE && node.textContent)
+      textContent.push(node.textContent);
+    if (isHTMLElement(node)) {
+      const isHidden = node.ariaHidden || node.hidden || node.style.display === "none";
+      const isExcluded = node.dataset.radixToastAnnounceExclude === "";
+      if (!isHidden) {
+        if (isExcluded) {
+          const altText = node.dataset.radixToastAnnounceAlt;
+          if (altText)
+            textContent.push(altText);
+        } else {
+          textContent.push(...getAnnounceTextContent(node));
+        }
+      }
+    }
+  });
+  return textContent;
+}
+function handleAndDispatchCustomEvent(name, handler, detail, { discrete }) {
+  const currentTarget = detail.originalEvent.currentTarget;
+  const event = new CustomEvent(name, { bubbles: true, cancelable: true, detail });
+  if (handler)
+    currentTarget.addEventListener(name, handler, { once: true });
+  if (discrete) {
+    dispatchDiscreteCustomEvent(currentTarget, event);
+  } else {
+    currentTarget.dispatchEvent(event);
+  }
+}
+var isDeltaInDirection = (delta, direction, threshold = 0) => {
+  const deltaX = Math.abs(delta.x);
+  const deltaY = Math.abs(delta.y);
+  const isDeltaX = deltaX > deltaY;
+  if (direction === "left" || direction === "right") {
+    return isDeltaX && deltaX > threshold;
+  } else {
+    return !isDeltaX && deltaY > threshold;
+  }
+};
+function useNextFrame(callback = () => {
+}) {
+  const fn = useCallbackRef(callback);
+  useLayoutEffect2(() => {
+    let raf1 = 0;
+    let raf2 = 0;
+    raf1 = window.requestAnimationFrame(() => raf2 = window.requestAnimationFrame(fn));
+    return () => {
+      window.cancelAnimationFrame(raf1);
+      window.cancelAnimationFrame(raf2);
+    };
+  }, [fn]);
+}
+function isHTMLElement(node) {
+  return node.nodeType === node.ELEMENT_NODE;
+}
+function getTabbableCandidates(container) {
+  const nodes = [];
+  const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
+    acceptNode: (node) => {
+      const isHiddenInput = node.tagName === "INPUT" && node.type === "hidden";
+      if (node.disabled || node.hidden || isHiddenInput)
+        return NodeFilter.FILTER_SKIP;
+      return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
+    }
+  });
+  while (walker.nextNode())
+    nodes.push(walker.currentNode);
+  return nodes;
+}
+function focusFirst(candidates) {
+  const previouslyFocusedElement = document.activeElement;
+  return candidates.some((candidate) => {
+    if (candidate === previouslyFocusedElement)
+      return true;
+    candidate.focus();
+    return document.activeElement !== previouslyFocusedElement;
+  });
+}
+var Provider = ToastProvider$1;
+var Viewport = ToastViewport$1;
+var Root2 = Toast$1;
+var Title = ToastTitle$1;
+var Description = ToastDescription$1;
+var Action = ToastAction$1;
+var Close = ToastClose$1;
+const ToastProvider = Provider;
+const ToastViewport = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Viewport,
+  {
+    ref,
+    className: cn(
+      "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
+      className
+    ),
+    ...props
+  }
+));
+ToastViewport.displayName = Viewport.displayName;
+const toastVariants = cva(
+  "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
+  {
+    variants: {
+      variant: {
+        default: "border bg-background text-foreground",
+        destructive: "destructive group border-destructive bg-destructive text-destructive-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+const Toast = React.forwardRef(({ className, variant, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    Root2,
+    {
+      ref,
+      className: cn(toastVariants({ variant }), className),
+      ...props
+    }
+  );
+});
+Toast.displayName = Root2.displayName;
+const ToastAction = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Action,
+  {
+    ref,
+    className: cn(
+      "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
+      className
+    ),
+    ...props
+  }
+));
+ToastAction.displayName = Action.displayName;
+const ToastClose = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Close,
+  {
+    ref,
+    className: cn(
+      "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
+      className
+    ),
+    "toast-close": "",
+    ...props,
+    children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+  }
+));
+ToastClose.displayName = Close.displayName;
+const ToastTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Title,
+  {
+    ref,
+    className: cn("text-sm font-semibold", className),
+    ...props
+  }
+));
+ToastTitle.displayName = Title.displayName;
+const ToastDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Description,
+  {
+    ref,
+    className: cn("text-sm opacity-90", className),
+    ...props
+  }
+));
+ToastDescription.displayName = Description.displayName;
+export {
+  Toast,
+  ToastAction,
+  ToastClose,
+  ToastDescription,
+  ToastProvider,
+  ToastTitle,
+  ToastViewport
+};
+//# sourceMappingURL=toast.js.map