@expcat/tigercat-react 1.0.7 → 1.2.0

package/dist/{chunk-2LUDQBVY.mjs → chunk-AG4HRAW2.mjs}

@@ -1,14 +1,45 @@
-import { useChartInteraction } from './chunk-3CDAG4HD.mjs';
-import { ChartLegend } from './chunk-Z6F67MJE.mjs';
-import { ChartSeries } from './chunk-SDLMB34Y.mjs';
-import { ChartTooltip } from './chunk-LVC43YX2.mjs';
-import { ChartAxis } from './chunk-RQSQXQN6.mjs';
-import { ChartCanvas } from './chunk-IS467WAO.mjs';
-import { ChartGrid } from './chunk-677VSTPW.mjs';
-import { useRef, useState, useEffect, useMemo } from 'react';
-import { getScatterGradientPrefix, getChartInnerRect, getNumberExtent, createLinearScale, resolveChartPalette, getChartElementOpacity, getScatterHoverSize, buildChartLegendItems, resolveChartTooltipContent, classNames, SCATTER_ENTRANCE_KEYFRAMES, getScatterHoverShadow, SCATTER_ENTRANCE_CLASS, scatterPointTransitionClasses, getScatterPointPath } from '@expcat/tigercat-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import {
+  useChartInteraction
+} from "./chunk-6QML6T3Y.mjs";
+import {
+  ChartLegend
+} from "./chunk-UBP7HZSU.mjs";
+import {
+  ChartSeries
+} from "./chunk-SDLMB34Y.mjs";
+import {
+  ChartTooltip
+} from "./chunk-NASC6XHN.mjs";
+import {
+  ChartAxis
+} from "./chunk-RQSQXQN6.mjs";
+import {
+  ChartCanvas
+} from "./chunk-DKNVSQSV.mjs";
+import {
+  ChartGrid
+} from "./chunk-677VSTPW.mjs";
 
+// src/components/ScatterChart.tsx
+import { useId, useMemo, useState, useEffect } from "react";
+import {
+  classNames,
+  createLinearScale,
+  getChartElementOpacity,
+  getChartInnerRect,
+  getNumberExtent,
+  getStableChartGradientPrefix,
+  getScatterHoverShadow,
+  getScatterHoverSize,
+  getScatterPointPath,
+  scatterPointTransitionClasses,
+  SCATTER_ENTRANCE_KEYFRAMES,
+  SCATTER_ENTRANCE_CLASS,
+  resolveChartPalette,
+  buildChartLegendItems,
+  resolveChartTooltipContent
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
 var ScatterChart = ({
   width = 320,
   height = 200,
@@ -65,8 +96,11 @@ var ScatterChart = ({
   desc,
   className
 }) => {
-  const gradientPrefixRef = useRef(getScatterGradientPrefix());
-  const gradientPrefix = gradientPrefixRef.current;
+  const gradientId = useId();
+  const gradientPrefix = useMemo(
+    () => getStableChartGradientPrefix("scatter", gradientId),
+    [gradientId]
+  );
   const [mounted, setMounted] = useState(false);
   useEffect(() => {
     if (animated) setMounted(true);
@@ -242,7 +276,7 @@ var ScatterChart = ({
           const styleObj = {
             ...filterStyle ? { filter: filterStyle } : {},
             ...animDelay ? {
-              animation: `${SCATTER_ENTRANCE_CLASS} 500ms cubic-bezier(.34,1.56,.64,1) ${animDelay} both`
+              animation: `${SCATTER_ENTRANCE_CLASS} var(--tiger-motion-duration-slow,500ms) var(--tiger-motion-ease-spring,cubic-bezier(.34,1.56,.64,1)) ${animDelay} both`
             } : {}
           };
           const sharedProps = {
@@ -250,7 +284,11 @@ var ScatterChart = ({
             opacity: point.opacity,
             stroke: pointBorderColor,
             strokeWidth: pointBorderWidth,
-            className: classNames(scatterPointTransitionClasses, interactive && "cursor-pointer"),
+            className: classNames(
+              scatterPointTransitionClasses,
+              animDelay && SCATTER_ENTRANCE_CLASS,
+              interactive && "cursor-pointer"
+            ),
             style: Object.keys(styleObj).length > 0 ? styleObj : void 0,
             tabIndex: selectable ? 0 : void 0,
             role: selectable ? "button" : "img",
@@ -322,4 +360,7 @@ var ScatterChart = ({
 };
 var ScatterChart_default = ScatterChart;
 
-export { ScatterChart, ScatterChart_default };
+export {
+  ScatterChart,
+  ScatterChart_default
+};

package/dist/chunk-AKZY7QYA.js

@@ -0,0 +1,238 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+
+
+var _chunkSTTQ5LXXjs = require('./chunk-STTQ5LXX.js');
+
+// src/components/Dropdown.tsx
+
+
+
+
+
+
+
+
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var _jsxruntime = require('react/jsx-runtime');
+var DropdownContext = _react.createContext.call(void 0, null);
+var DropdownMenu = ({
+  className,
+  style,
+  children,
+  role,
+  ...divProps
+}) => {
+  const menuClasses = _tigercatcore.classNames.call(void 0, _tigercatcore.getDropdownMenuClasses.call(void 0, ), className);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: menuClasses, style, role: _nullishCoalesce(role, () => ( "menu")), ...divProps, children });
+};
+var Dropdown = ({
+  trigger = "hover",
+  placement: initialPlacement = "bottom-start",
+  offset = 4,
+  disabled = false,
+  open: controlledOpen,
+  defaultOpen = false,
+  closeOnClick = true,
+  showArrow = true,
+  className,
+  style,
+  onOpenChange,
+  children,
+  ...divProps
+}) => {
+  const [internalVisible, setInternalVisible] = _react.useState.call(void 0, defaultOpen);
+  const visible = controlledOpen !== void 0 ? controlledOpen : internalVisible;
+  const containerRef = _react.useRef.call(void 0, null);
+  const triggerRef = _react.useRef.call(void 0, null);
+  const floatingRef = _react.useRef.call(void 0, null);
+  const hoverTimerRef = _react.useRef.call(void 0, null);
+  const previousActiveElementRef = _react.useRef.call(void 0, null);
+  const reactId = _react.useId.call(void 0, );
+  const menuId = _react.useMemo.call(void 0, () => `tiger-dropdown-menu-${reactId}`, [reactId]);
+  _react.useEffect.call(void 0, () => {
+    _tigercatcore.injectDropdownStyles.call(void 0, );
+  }, []);
+  const setVisible = _react.useCallback.call(void 0, 
+    (newVisible) => {
+      if (disabled && newVisible) return;
+      if (newVisible && !visible) {
+        previousActiveElementRef.current = _tigercatcore.captureActiveElement.call(void 0, );
+      }
+      if (controlledOpen === void 0) {
+        setInternalVisible(newVisible);
+      }
+      _optionalChain([onOpenChange, 'optionalCall', _ => _(newVisible)]);
+      if (newVisible) {
+        requestAnimationFrame(() => {
+          if (floatingRef.current) {
+            _tigercatcore.focusFirstMenuItem.call(void 0, floatingRef.current);
+          }
+        });
+      } else {
+        _tigercatcore.restoreFocus.call(void 0, previousActiveElementRef.current);
+        previousActiveElementRef.current = null;
+      }
+    },
+    [disabled, visible, controlledOpen, onOpenChange]
+  );
+  const handleItemClick = _react.useCallback.call(void 0, () => {
+    if (closeOnClick) {
+      setVisible(false);
+    }
+  }, [closeOnClick, setVisible]);
+  const handleMouseEnter = _react.useCallback.call(void 0, () => {
+    if (trigger !== "hover") return;
+    if (hoverTimerRef.current) {
+      clearTimeout(hoverTimerRef.current);
+    }
+    hoverTimerRef.current = setTimeout(() => {
+      setVisible(true);
+    }, 100);
+  }, [trigger, setVisible]);
+  const handleMouseLeave = _react.useCallback.call(void 0, () => {
+    if (trigger !== "hover") return;
+    if (hoverTimerRef.current) {
+      clearTimeout(hoverTimerRef.current);
+    }
+    hoverTimerRef.current = setTimeout(() => {
+      setVisible(false);
+    }, 150);
+  }, [trigger, setVisible]);
+  const handleClick = _react.useCallback.call(void 0, () => {
+    if (trigger !== "click") return;
+    setVisible(!visible);
+  }, [trigger, visible, setVisible]);
+  const handleMenuKeyDown = _react.useCallback.call(void 0, (event) => {
+    if (floatingRef.current) {
+      _tigercatcore.handleMenuNavigation.call(void 0, floatingRef.current, event.nativeEvent);
+    }
+  }, []);
+  _chunkSTTQ5LXXjs.useClickOutside.call(void 0, {
+    enabled: trigger === "click" && visible,
+    refs: [containerRef],
+    onOutsideClick: () => setVisible(false)
+  });
+  _chunkSTTQ5LXXjs.useEscapeKey.call(void 0, {
+    enabled: visible,
+    onEscape: () => setVisible(false)
+  });
+  const { x, y, placement } = _chunkSTTQ5LXXjs.useFloating.call(void 0, {
+    referenceRef: triggerRef,
+    floatingRef,
+    enabled: visible,
+    placement: initialPlacement,
+    offset
+  });
+  _react.useEffect.call(void 0, () => {
+    return () => {
+      if (hoverTimerRef.current) {
+        clearTimeout(hoverTimerRef.current);
+      }
+    };
+  }, []);
+  const containerClasses = _react.useMemo.call(void 0, 
+    () => _tigercatcore.classNames.call(void 0, _tigercatcore.getDropdownContainerClasses.call(void 0, ), "tiger-dropdown-container", className),
+    [className]
+  );
+  const triggerClasses = _react.useMemo.call(void 0, () => _tigercatcore.getDropdownTriggerClasses.call(void 0, disabled), [disabled]);
+  const menuWrapperClasses = _tigercatcore.classNames.call(void 0, "absolute z-50", _tigercatcore.DROPDOWN_ENTER_CLASS);
+  const menuWrapperStyles = _react.useMemo.call(void 0, 
+    () => ({
+      position: "absolute",
+      left: x,
+      top: y,
+      transformOrigin: _tigercatcore.getTransformOrigin.call(void 0, placement)
+    }),
+    [x, y, placement]
+  );
+  const contextValue = _react.useMemo.call(void 0, 
+    () => ({ closeOnClick, handleItemClick }),
+    [closeOnClick, handleItemClick]
+  );
+  const childrenArray = _react2.default.Children.toArray(children);
+  let triggerElement = null;
+  let menuElement = null;
+  childrenArray.forEach((child) => {
+    if (!_react2.default.isValidElement(child)) {
+      if (triggerElement == null) triggerElement = child;
+      return;
+    }
+    if (child.type === DropdownMenu) {
+      menuElement = child;
+      return;
+    }
+    if (triggerElement == null) {
+      triggerElement = child;
+    }
+  });
+  const chevronNode = showArrow ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "svg",
+    {
+      className: _tigercatcore.getDropdownChevronClasses.call(void 0, visible),
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: _tigercatcore.DROPDOWN_CHEVRON_PATH })
+    }
+  ) : null;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DropdownContext.Provider, { value: contextValue, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ref: containerRef, className: containerClasses, style, ...divProps, children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "div",
+      {
+        ref: triggerRef,
+        className: triggerClasses,
+        onClick: handleClick,
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        "aria-haspopup": "menu",
+        "aria-expanded": visible,
+        "aria-controls": visible ? menuId : void 0,
+        children: [
+          triggerElement,
+          chevronNode
+        ]
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "div",
+      {
+        ref: floatingRef,
+        className: menuWrapperClasses,
+        style: menuWrapperStyles,
+        hidden: !visible,
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        onKeyDown: handleMenuKeyDown,
+        children: menuElement && _react2.default.isValidElement(menuElement) ? _react2.default.cloneElement(menuElement, {
+          id: menuId
+        }) : menuElement
+      }
+    )
+  ] }) });
+};
+
+
+
+
+
+exports.DropdownContext = DropdownContext; exports.DropdownMenu = DropdownMenu; exports.Dropdown = Dropdown;

package/dist/chunk-AOZLBASY.mjs

@@ -1,8 +1,10 @@
-import React, { useMemo } from 'react';
-import { getDividerClasses, getDividerStyle } from '@expcat/tigercat-core';
-import { jsx } from 'react/jsx-runtime';
-
 // src/components/Divider.tsx
+import React, { useMemo } from "react";
+import {
+  getDividerClasses,
+  getDividerStyle
+} from "@expcat/tigercat-core";
+import { jsx } from "react/jsx-runtime";
 var Divider = React.memo(
   ({
     orientation = "horizontal",
@@ -35,4 +37,6 @@ var Divider = React.memo(
 );
 Divider.displayName = "Divider";
 
-export { Divider };
+export {
+  Divider
+};

package/dist/chunk-AUW7DCXL.js

@@ -1,10 +1,14 @@
-'use strict';
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/components/QRCode.tsx
+var _react = require('react');
+var _tigercatcore = require('@expcat/tigercat-core');
 
-var react = require('react');
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
 
-// src/components/QRCode.tsx
+
+
+
+
+
+var _jsxruntime = require('react/jsx-runtime');
 var QRCode = ({
   value,
   size = 128,
@@ -15,11 +19,11 @@ var QRCode = ({
   onRefresh,
   className
 }) => {
-  const matrix = react.useMemo(() => tigercatCore.generateQRMatrix(value), [value]);
-  const moduleSize = react.useMemo(() => size / matrix.length, [size, matrix.length]);
-  const containerClass = tigercatCore.classNames(tigercatCore.qrcodeContainerClasses, className);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: containerClass, style: { width: size, height: size }, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
+  const matrix = _react.useMemo.call(void 0, () => _tigercatcore.generateQRMatrix.call(void 0, value), [value]);
+  const moduleSize = _react.useMemo.call(void 0, () => size / matrix.length, [size, matrix.length]);
+  const containerClass = _tigercatcore.classNames.call(void 0, _tigercatcore.qrcodeContainerClasses, className);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: containerClass, style: { width: size, height: size }, children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
       "svg",
       {
         width: size,
@@ -29,10 +33,10 @@ var QRCode = ({
         role: "img",
         "aria-label": "QR Code",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx("rect", { width: size, height: size, fill: bgColor }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "rect", { width: size, height: size, fill: bgColor }),
           matrix.flatMap(
             (row, r) => row.map(
-              (cell, c) => cell ? /* @__PURE__ */ jsxRuntime.jsx(
+              (cell, c) => cell ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                 "rect",
                 {
                   x: c * moduleSize,
@@ -48,14 +52,16 @@ var QRCode = ({
         ]
       }
     ),
-    status === "expired" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tigercatCore.qrcodeOverlayClasses, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: tigercatCore.qrcodeExpiredTextClasses, children: "QR code expired" }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: tigercatCore.qrcodeRefreshClasses, onClick: onRefresh, children: "Refresh" })
+    status === "expired" && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.qrcodeOverlayClasses, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: _tigercatcore.qrcodeExpiredTextClasses, children: "QR code expired" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: _tigercatcore.qrcodeRefreshClasses, onClick: onRefresh, children: "Refresh" })
     ] }),
-    status === "loading" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: tigercatCore.qrcodeOverlayClasses, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-gray-500", children: "Loading..." }) })
+    status === "loading" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.qrcodeOverlayClasses, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-sm text-gray-500", children: "Loading..." }) })
   ] });
 };
 var QRCode_default = QRCode;
 
-exports.QRCode = QRCode;
-exports.QRCode_default = QRCode_default;
+
+
+
+exports.QRCode = QRCode; exports.QRCode_default = QRCode_default;

package/dist/chunk-AX5XRD2Q.js

@@ -1,9 +1,8 @@
-'use strict';
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/components/ChartSeries.tsx
 
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
 
-// src/components/ChartSeries.tsx
+var _tigercatcore = require('@expcat/tigercat-core');
+var _jsxruntime = require('react/jsx-runtime');
 var ChartSeries = ({
   data,
   name,
@@ -15,11 +14,11 @@ var ChartSeries = ({
   ...props
 }) => {
   const content = typeof children === "function" ? children({ data, name, color, opacity, type }) : children;
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     "g",
     {
       ...props,
-      className: tigercatCore.classNames(className),
+      className: _tigercatcore.classNames.call(void 0, className),
       "data-series-name": name,
       "data-series-type": type,
       fill: color,
@@ -31,5 +30,7 @@ var ChartSeries = ({
 };
 var ChartSeries_default = ChartSeries;
 
-exports.ChartSeries = ChartSeries;
-exports.ChartSeries_default = ChartSeries_default;
+
+
+
+exports.ChartSeries = ChartSeries; exports.ChartSeries_default = ChartSeries_default;

package/dist/{chunk-7O2OQKVY.mjs → chunk-AYHP2OAX.mjs}

@@ -1,10 +1,14 @@
-import { classNames, layoutRootClasses } from '@expcat/tigercat-core';
-import { jsx } from 'react/jsx-runtime';
-
 // src/components/Layout.tsx
+import {
+  classNames,
+  layoutRootClasses
+} from "@expcat/tigercat-core";
+import { jsx } from "react/jsx-runtime";
 var Layout = ({ className, children, ...props }) => {
   const layoutClasses = classNames(layoutRootClasses, className);
   return /* @__PURE__ */ jsx("div", { className: layoutClasses, ...props, children });
 };
 
-export { Layout };
+export {
+  Layout
+};

package/dist/{chunk-EIMAQHCQ.mjs → chunk-AZDNGGV7.mjs}

@@ -1,9 +1,30 @@
-import { StatusIcon } from './chunk-FLYJVZED.mjs';
-import { useState, useEffect } from 'react';
-import { createRoot } from 'react-dom/client';
-import { classNames, notificationContainerBaseClasses, notificationPositionClasses, getNotificationTypeClasses, notificationBaseClasses, getNotificationIconPath, notificationIconClasses, notificationContentClasses, notificationTitleClasses, notificationDescriptionClasses, notificationCloseButtonClasses, notificationCloseIconClasses, notificationCloseIconPath, normalizeStringOption, ANIMATION_DURATION_MS, isBrowser } from '@expcat/tigercat-core';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import {
+  StatusIcon
+} from "./chunk-FLYJVZED.mjs";
 
+// src/components/Notification.tsx
+import { useEffect, useState } from "react";
+import { createRoot } from "react-dom/client";
+import {
+  classNames,
+  getNotificationTypeClasses,
+  notificationContainerBaseClasses,
+  notificationPositionClasses,
+  notificationBaseClasses,
+  notificationIconClasses,
+  notificationContentClasses,
+  notificationTitleClasses,
+  notificationDescriptionClasses,
+  notificationCloseButtonClasses,
+  notificationCloseIconClasses,
+  getNotificationIconPath,
+  notificationCloseIconPath,
+  createNotificationStackUpdateScheduler,
+  isBrowser,
+  ANIMATION_DURATION_MS,
+  normalizeStringOption
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
 var NOTIFICATION_CONTAINER_ID_PREFIX = "tiger-notification-container";
 var notificationInstancesByPosition = {
   "top-left": [],
@@ -24,6 +45,12 @@ var updateCallbacks = {
   "bottom-left": null,
   "bottom-right": null
 };
+var stackUpdateScheduler = createNotificationStackUpdateScheduler();
+function scheduleNotificationStackUpdate(position) {
+  const callback = updateCallbacks[position];
+  if (!callback) return;
+  stackUpdateScheduler.schedule(position, callback);
+}
 function getNextInstanceId() {
   return ++instanceIdCounter;
 }
@@ -101,6 +128,7 @@ var NotificationContainer = ({
     };
     updateCallbacks[position]();
     return () => {
+      stackUpdateScheduler.cancel(position);
       updateCallbacks[position] = null;
     };
   }, [position]);
@@ -140,6 +168,7 @@ function ensureContainer(position) {
   if (containerRoots[position] && !existingRootEl) {
     containerRoots[position] = null;
     updateCallbacks[position] = null;
+    stackUpdateScheduler.cancel(position);
   }
   if (containerRoots[position]) {
     return;
@@ -160,6 +189,7 @@ function destroyContainer(position) {
     containerRoots[position] = null;
   }
   updateCallbacks[position] = null;
+  stackUpdateScheduler.cancel(position);
   if (isBrowser()) {
     document.getElementById(rootId)?.remove();
   }
@@ -182,7 +212,7 @@ function addNotification(config) {
     position
   };
   notificationInstancesByPosition[position].push(instance);
-  updateCallbacks[position]?.();
+  scheduleNotificationStackUpdate(position);
   if (instance.duration > 0) {
     setTimeout(() => {
       removeNotification(id, position);
@@ -197,7 +227,9 @@ function removeNotification(id, position) {
     const instance = instances[index];
     instances.splice(index, 1);
     instance.onClose?.();
-    updateCallbacks[position]?.();
+    if (notificationInstancesByPosition[position].length > 0) {
+      scheduleNotificationStackUpdate(position);
+    }
   }
   if (notificationInstancesByPosition[position].length === 0) {
     destroyContainer(position);
@@ -247,4 +279,8 @@ var notification = {
 };
 var Notification_default = notification;
 
-export { NotificationContainer, Notification_default, notification };
+export {
+  NotificationContainer,
+  notification,
+  Notification_default
+};