@blakesteve/roster 5.16.0 → 5.18.0

package/dist/components/organisms/Sheet/Sheet.js

@@ -1,39 +1,40 @@
 "use client";
-import { jsxs as l, Fragment as H, jsx as n } from "react/jsx-runtime";
+import { jsxs as l, Fragment as Z, jsx as n } from "react/jsx-runtime";
 import * as s from "react";
-import { Description as J } from "../../../node_modules/@headlessui/react/dist/components/description/description.js";
-import { Dialog as Z, DialogBackdrop as W, DialogPanel as O, DialogTitle as tt } from "../../../node_modules/@headlessui/react/dist/components/dialog/dialog.js";
-import { TransitionChild as et } from "../../../node_modules/@headlessui/react/dist/components/transition/transition.js";
+import { Description as O } from "../../../node_modules/@headlessui/react/dist/components/description/description.js";
+import { Dialog as tt, DialogBackdrop as et, DialogPanel as rt, DialogTitle as st } from "../../../node_modules/@headlessui/react/dist/components/dialog/dialog.js";
+import { TransitionChild as nt } from "../../../node_modules/@headlessui/react/dist/components/transition/transition.js";
 import { cn as d } from "../../../lib/utils.js";
-import { withLabels as rt } from "../../../lib/labels.js";
-import { useDarkScope as st } from "../../../internal/popup.js";
-import { useReducedMotion as nt } from "../../../internal/motion.js";
-import { lockPage as ot } from "../../../internal/page-inert.js";
-import { sheetDragOutcome as at, sheetReleaseVelocity as it, exceedsSheetTapSlop as ct } from "./sheet-drag.js";
-import { titleSignature as ut } from "./sheet-title.js";
-import { useKeyFocus as lt } from "../../../internal/key-focus.js";
-const dt = { close: "Close" }, ft = "rst:transition-transform rst:duration-(--roster-sheet-enter-duration) rst:ease-(--roster-sheet-enter-easing) rst:data-leave:duration-(--roster-sheet-leave-duration) rst:data-leave:ease-(--roster-sheet-leave-easing) rst:data-closed:translate-y-full", pt = "rst:transition-opacity rst:duration-(--roster-sheet-fade-duration) rst:ease-out rst:data-closed:opacity-0", mt = "rst:transition-opacity rst:duration-(--roster-sheet-enter-duration) rst:ease-out rst:data-leave:duration-(--roster-sheet-leave-duration) rst:data-closed:opacity-0", ht = "rst:transition-opacity rst:duration-(--roster-sheet-fade-duration) rst:ease-out rst:data-closed:opacity-0", gt = [
+import { withLabels as ot } from "../../../lib/labels.js";
+import { useDarkScope as at } from "../../../internal/popup.js";
+import { useReducedMotion as it } from "../../../internal/motion.js";
+import { lockPage as ct } from "../../../internal/page-inert.js";
+import { useLeaveWatchdog as ut } from "../../../internal/leave-watchdog.js";
+import { sheetDragOutcome as lt, sheetReleaseVelocity as dt, exceedsSheetTapSlop as ft } from "./sheet-drag.js";
+import { titleSignature as pt } from "./sheet-title.js";
+import { useKeyFocus as mt } from "../../../internal/key-focus.js";
+const ht = { close: "Close" }, gt = "rst:transition-transform rst:duration-(--roster-sheet-enter-duration) rst:ease-(--roster-sheet-enter-easing) rst:data-leave:duration-(--roster-sheet-leave-duration) rst:data-leave:ease-(--roster-sheet-leave-easing) rst:data-closed:translate-y-full", yt = "rst:transition-opacity rst:duration-(--roster-sheet-fade-duration) rst:ease-out rst:data-closed:opacity-0", bt = "rst:transition-opacity rst:duration-(--roster-sheet-enter-duration) rst:ease-out rst:data-leave:duration-(--roster-sheet-leave-duration) rst:data-closed:opacity-0", vt = "rst:transition-opacity rst:duration-(--roster-sheet-fade-duration) rst:ease-out rst:data-closed:opacity-0", Y = { slide: 200, fade: 150 }, xt = [
   "input:not([type=checkbox]):not([type=radio]):not([type=button]):not([type=submit]):not([type=reset]):not([type=range]):not([type=color]):not([type=file]):not([type=image])",
   "textarea",
   "select",
   "[contenteditable]:not([contenteditable=false])"
 ].join(",");
-function yt(r) {
+function Et(r) {
   return r ? "current" in r ? r.current : r : null;
 }
-function bt({ target: r }) {
+function Rt({ target: r }) {
   const u = s.useRef(r), f = s.useRef(!1);
   return s.useEffect(() => {
     u.current = r;
   }), s.useEffect(() => (f.current = !1, () => {
     f.current = !0, queueMicrotask(() => {
       if (!f.current) return;
-      const p = yt(u.current);
+      const p = Et(u.current);
       p?.isConnected && p.focus();
     });
   }), []), null;
 }
-function vt() {
+function kt() {
   return /* @__PURE__ */ n(
     "svg",
     {
@@ -49,74 +50,74 @@ function vt() {
     }
   );
 }
-const Mt = ({
+const Bt = ({
   isOpen: r,
   onClose: u,
   onAfterClose: f,
   title: p,
-  hideTitle: z = !1,
-  description: C,
-  actions: N,
+  hideTitle: _ = !1,
+  description: N,
+  actions: D,
   maxWidth: v = 560,
   initialFocus: x,
-  returnFocus: B,
+  returnFocus: T,
   busy: m = !1,
   dragToDismiss: E = !0,
   contentKey: h,
-  labels: Y,
-  className: T,
-  children: _
+  labels: q,
+  className: V,
+  children: $
 }) => {
-  lt();
-  const q = rt(dt, Y), { ref: R, inDarkScope: $ } = st(), D = nt();
+  mt();
+  const K = ot(ht, q), { ref: R, inDarkScope: U } = at(), k = it(), I = s.useRef(null), i = s.useRef(null), S = ut(I, i, r, k ? Y.fade : Y.slide, f);
   s.useLayoutEffect(() => {
     if (r)
-      return ot(R.current);
+      return ct(R.current);
   }, [r, R]);
-  const i = s.useRef(null), I = s.useRef(null), w = s.useRef(null), k = s.useRef(null), L = s.useRef(null), S = s.useId(), g = ut(p), P = s.useRef({ signature: g, contentKey: h, open: r, busy: m });
+  const w = s.useRef(null), P = s.useRef(null), L = s.useRef(null), C = s.useRef(null), M = s.useId(), g = pt(p), A = s.useRef({ signature: g, contentKey: h, open: r, busy: m });
   s.useEffect(() => {
-    const t = P.current;
-    if (P.current = { signature: g, contentKey: h, open: r, busy: m }, !t.open || !r) return;
+    const t = A.current;
+    if (A.current = { signature: g, contentKey: h, open: r, busy: m }, !t.open || !r) return;
     const e = t.contentKey !== h, o = t.signature !== g && !t.busy;
-    !e && !o || (w.current?.focus(), L.current && (L.current.scrollTop = 0));
+    !e && !o || (P.current?.focus(), C.current && (C.current.scrollTop = 0));
   }, [g, h, r, m]), s.useEffect(() => {
     if (!r) return;
     const t = requestAnimationFrame(() => {
       const e = i.current, o = document.activeElement;
-      !e || o && e.contains(o) || (x?.current ?? k.current)?.focus();
+      !e || o && e.contains(o) || (x?.current ?? L.current)?.focus();
     });
     return () => cancelAnimationFrame(t);
   }, [r, x]);
-  const [M, A] = s.useState(null);
+  const [F, j] = s.useState(null);
   s.useEffect(() => {
     if (!r) return;
     const t = window.visualViewport;
     if (!t) return;
     const e = () => {
-      const o = document.activeElement, c = !!o && !!i.current?.contains(o) && o.matches(gt);
-      A(c ? Math.round(t.height) : null);
+      const o = document.activeElement, c = !!o && !!i.current?.contains(o) && o.matches(xt);
+      j(c ? Math.round(t.height) : null);
     };
     return t.addEventListener("resize", e), document.addEventListener("focusin", e), document.addEventListener("focusout", e), () => {
-      t.removeEventListener("resize", e), document.removeEventListener("focusin", e), document.removeEventListener("focusout", e), A(null);
+      t.removeEventListener("resize", e), document.removeEventListener("focusin", e), document.removeEventListener("focusout", e), j(null);
     };
   }, [r]);
-  const a = s.useRef(null), y = s.useRef(!1), F = s.useRef(r);
+  const a = s.useRef(null), y = s.useRef(!1), z = s.useRef(r);
   s.useEffect(() => {
-    F.current = r;
+    z.current = r;
   }, [r]);
   const b = (t) => {
     i.current?.style.setProperty("--rst-sheet-drag", `${t}px`);
-  }, j = (t) => {
+  }, B = (t) => {
     const e = i.current;
     a.current = null, e && (delete e.dataset.dragging, t === "close" ? (u(), requestAnimationFrame(() => {
-      F.current && !a.current && b(0);
+      z.current && !a.current && b(0);
     })) : b(0));
   };
   s.useEffect(() => {
     !r && a.current && (a.current = null, i.current && delete i.current.dataset.dragging), r && !a.current && b(0);
   }, [r]);
-  const K = (t) => {
-    a.current || (y.current = !1, !(!E || !r) && (t.pointerType === "mouse" && (t.button !== 0 || !I.current?.contains(t.target)) || (a.current = {
+  const X = (t) => {
+    a.current || (y.current = !1, !(!E || !r) && (t.pointerType === "mouse" && (t.button !== 0 || !w.current?.contains(t.target)) || (a.current = {
       pointerId: t.pointerId,
       x0: t.clientX,
       y0: t.clientY,
@@ -124,12 +125,12 @@ const Mt = ({
       phase: "pending",
       samples: [{ t: t.timeStamp, y: t.clientY }]
     })));
-  }, U = (t) => {
+  }, G = (t) => {
     const e = a.current;
     if (!e || t.pointerId !== e.pointerId) return;
     const o = t.clientX - e.x0, c = t.clientY - e.y0;
     if (e.phase === "pending") {
-      if (!ct(o, c)) return;
+      if (!ft(o, c)) return;
       if (Math.abs(o) > Math.abs(c)) {
         e.phase = "ignored";
         return;
@@ -142,7 +143,7 @@ const Mt = ({
       i.current && (i.current.dataset.dragging = "");
     }
     e.phase === "dragging" && (e.dy = c, e.samples.push({ t: t.timeStamp, y: t.clientY }), e.samples.length > 32 && e.samples.shift(), b(Math.max(0, c)));
-  }, V = (t) => {
+  }, Q = (t) => {
     const e = a.current;
     if (!e || t.pointerId !== e.pointerId) return;
     if (e.phase !== "dragging") {
@@ -151,46 +152,47 @@ const Mt = ({
     }
     e.samples.push({ t: t.timeStamp, y: t.clientY });
     const o = t.clientY - e.y0, c = i.current?.getBoundingClientRect().height ?? 0;
-    j(at(o, c, it(e.samples)));
-  }, X = (t) => {
+    B(lt(o, c, dt(e.samples)));
+  }, H = (t) => {
     const e = a.current;
-    !e || t.pointerId !== e.pointerId || (e.phase === "dragging" ? j("stay") : a.current = null);
-  }, G = (t) => {
+    !e || t.pointerId !== e.pointerId || (e.phase === "dragging" ? B("stay") : a.current = null);
+  }, J = (t) => {
     !y.current || t.detail === 0 || (y.current = !1, t.preventDefault(), t.stopPropagation());
-  }, Q = {
+  }, W = {
     "--rst-sheet-max-width": typeof v == "number" ? `${v}px` : v,
-    ...M !== null && { "--rst-sheet-keyboard-cap": `${M}px` }
+    ...F !== null && { "--rst-sheet-keyboard-cap": `${F}px` }
   };
-  return /* @__PURE__ */ l(H, { children: [
+  return /* @__PURE__ */ l(Z, { children: [
     /* @__PURE__ */ n("span", { ref: R, hidden: !0 }),
     /* @__PURE__ */ l(
-      Z,
+      tt,
       {
+        ref: I,
         open: r,
         as: "div",
         onClose: u,
-        initialFocus: x ?? k,
+        initialFocus: x ?? L,
         className: d(
-          "rst:font-ui rst:relative rst:z-50 rst:focus:outline-hidden",
-          $ && "dark"
+          "rst:font-ui rst:fixed rst:inset-0 rst:z-50 rst:focus:outline-hidden",
+          U && "dark"
         ),
         children: [
           /* @__PURE__ */ n(
-            W,
+            et,
             {
               transition: !0,
               "data-testid": "sheet-backdrop",
               className: d(
                 "rst:fixed rst:inset-0 rst:bg-[var(--roster-backdrop,var(--roster-sheet-backdrop))]",
-                D ? ht : mt
+                k ? vt : bt
               )
             }
           ),
-          /* @__PURE__ */ n("div", { className: "rst:fixed rst:inset-0 rst:flex rst:items-end rst:justify-center", children: /* @__PURE__ */ n(et, { afterLeave: f, children: /* @__PURE__ */ l(
-            O,
+          /* @__PURE__ */ n("div", { className: "rst:fixed rst:inset-0 rst:flex rst:items-end rst:justify-center", children: /* @__PURE__ */ n(nt, { afterLeave: S.afterLeave, children: /* @__PURE__ */ l(
+            rt,
             {
               ref: i,
-              style: Q,
+              style: W,
               "data-testid": "sheet-panel",
               className: d(
                 /* 92dvh, or the visual viewport while the keyboard is up,
@@ -204,9 +206,9 @@ const Mt = ({
                 "rst:[--roster-ring-offset:var(--roster-popover-bg)]",
                 "rst:pb-[env(safe-area-inset-bottom)]",
                 "rst:translate-y-[var(--rst-sheet-drag,0px)]",
-                D ? pt : ft,
+                k ? yt : gt,
                 "rst:data-dragging:transition-none",
-                T
+                V
               ),
               children: [
                 /* @__PURE__ */ l(
@@ -214,16 +216,16 @@ const Mt = ({
                   {
                     "data-testid": "sheet-drag-zone",
                     className: d("rst:shrink-0", E && "rst:touch-none"),
-                    onPointerDown: K,
-                    onPointerMove: U,
-                    onPointerUp: V,
-                    onPointerCancel: X,
-                    onClickCapture: G,
+                    onPointerDown: X,
+                    onPointerMove: G,
+                    onPointerUp: Q,
+                    onPointerCancel: H,
+                    onClickCapture: J,
                     children: [
                       /* @__PURE__ */ n(
                         "div",
                         {
-                          ref: I,
+                          ref: w,
                           "aria-hidden": "true",
                           "data-testid": "sheet-handle",
                           className: d(
@@ -241,40 +243,40 @@ const Mt = ({
                       /* @__PURE__ */ l("div", { className: "rst:-mt-3 rst:flex rst:items-start rst:gap-2 rst:px-5 rst:pb-4", children: [
                         /* @__PURE__ */ l("div", { className: "rst:min-w-0 rst:flex-1 rst:pt-2", children: [
                           /* @__PURE__ */ n(
-                            tt,
+                            st,
                             {
                               as: "h2",
-                              id: S,
-                              ref: w,
+                              id: M,
+                              ref: P,
                               tabIndex: -1,
                               className: d(
                                 "rst:text-lg rst:font-semibold rst:text-inherit rst:focus:outline-hidden",
-                                z && "rst:sr-only"
+                                _ && "rst:sr-only"
                               ),
                               children: p
                             }
                           ),
-                          C && /* @__PURE__ */ n(
-                            J,
+                          N && /* @__PURE__ */ n(
+                            O,
                             {
                               as: "p",
                               className: "rst:mt-1 rst:text-sm rst:text-inherit rst:opacity-75",
-                              children: C
+                              children: N
                             }
                           )
                         ] }),
-                        N && /* 44px tall like the close button, so actions of any
+                        D && /* 44px tall like the close button, so actions of any
                         height center on the same line as it. */
-                        /* @__PURE__ */ n("div", { className: "rst:flex rst:h-11 rst:shrink-0 rst:items-center rst:gap-1", children: N }),
+                        /* @__PURE__ */ n("div", { className: "rst:flex rst:h-11 rst:shrink-0 rst:items-center rst:gap-1", children: D }),
                         /* @__PURE__ */ n(
                           "button",
                           {
-                            ref: k,
+                            ref: L,
                             type: "button",
                             onClick: u,
-                            "aria-label": q.close,
+                            "aria-label": K.close,
                             className: "rst:inline-flex rst:size-11 rst:shrink-0 rst:-mr-2 rst:cursor-pointer rst:items-center rst:justify-center rst:rounded-md rst:bg-transparent rst:text-inherit rst:opacity-60 rst:transition-opacity rst:hover:opacity-100 rst:focus:outline-hidden rst:focus-visible:opacity-100 rst:focus-visible:ring-2 rst:focus-visible:ring-ring rst:focus-visible:ring-offset-2 rst:ring-offset-background",
-                            children: /* @__PURE__ */ n(vt, {})
+                            children: /* @__PURE__ */ n(kt, {})
                           }
                         )
                       ] })
@@ -284,25 +286,26 @@ const Mt = ({
                 /* @__PURE__ */ n(
                   "div",
                   {
-                    ref: L,
+                    ref: C,
                     role: "region",
-                    "aria-labelledby": S,
+                    "aria-labelledby": M,
                     tabIndex: 0,
                     "data-testid": "sheet-content",
                     "aria-busy": m || void 0,
                     className: "rst:min-h-0 rst:flex-1 rst:overflow-y-auto rst:overscroll-contain rst:px-5 rst:pb-4 rst:focus:outline-hidden rst:ring-inset rst:focus-visible:ring-2 rst:focus-visible:ring-ring",
-                    children: _
+                    children: $
                   }
                 ),
-                /* @__PURE__ */ n(bt, { target: B })
+                /* @__PURE__ */ n(Rt, { target: T })
               ]
             }
           ) }) })
         ]
-      }
+      },
+      S.key
     )
   ] });
 };
 export {
-  Mt as Sheet
+  Bt as Sheet
 };

package/dist/index.d.ts

@@ -58,6 +58,8 @@ export * from './components/molecules/CheckboxGroup/CheckboxGroup';
 export * from './components/molecules/CheckboxGroup/checkbox-group-variants';
 export * from './components/molecules/RadioGroup/RadioGroup';
 export * from './components/molecules/RadioGroup/radio-group-variants';
+export * from './components/molecules/RadioTileGroup/RadioTileGroup';
+export * from './components/molecules/RadioTileGroup/radio-tile-group-variants';
 export * from './components/molecules/Breadcrumbs/Breadcrumbs';
 export * from './components/molecules/Breadcrumbs/breadcrumb-variants';
 export * from './components/molecules/Tabs/Tabs';
@@ -79,6 +81,7 @@ export * from './components/molecules/Pagination/Pagination';
 export * from './components/molecules/SkeletonPresets/SkeletonPresets';
 export * from './components/molecules/ProgressField/ProgressField';
 export * from './components/molecules/StepProgress/StepProgress';
+export * from './components/molecules/Timeline/Timeline';
 export * from './components/molecules/ErrorState/ErrorState';
 export * from './components/molecules/ErrorState/error-state-variants';
 export * from './components/molecules/MatchupCard/MatchupCard';

package/dist/internal/leave-watchdog.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react");function w(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const u=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,u.get?u:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const c=w(v),l=300;function g(e,t){return typeof e.getAnimations!="function"?!1:e.getAnimations({subtree:!0}).some(n=>{if(!("transitionProperty"in n)||n.playState!=="running")return!1;const u=n.effect?.target;return!(u&&t&&u!==t&&t.contains(u))})}const E=16;function y(e,t){e.reported||(e.reported=!0,t?.())}function L(e,t,n,u,d){const[m,b]=c.useState(0),f=c.useRef({onAfterClose:d,leaveMs:u});c.useEffect(()=>{f.current={onAfterClose:d,leaveMs:u}});const o=c.useRef(null),a=c.useRef(n),S=c.useCallback(()=>{const r=o.current;if(!r)return;const s=()=>{if(o.current!==r||r.reported)return;const i=e.current;if(i?.isConnected&&g(i,t.current)){window.setTimeout(s,E);return}y(r,f.current.onAfterClose)};s()},[e,t]);return c.useEffect(()=>{if(n){a.current=!0;return}if(!a.current)return;a.current=!1;const r={timer:0,reported:!1,removed:!1};o.current=r;const s=()=>{const i=e.current;if(i?.isConnected){if(g(i,t.current)){r.timer=window.setTimeout(s,l);return}r.removed=!0,b(p=>p+1)}};return r.timer=window.setTimeout(s,f.current.leaveMs+l),()=>{window.clearTimeout(r.timer),o.current===r&&(o.current=null)}},[n,e,t]),c.useLayoutEffect(()=>{const r=o.current;r?.removed&&(o.current=null,y(r,f.current.onAfterClose))},[m]),{key:m,afterLeave:S}}exports.LEAVE_MARGIN_MS=l;exports.useLeaveWatchdog=L;

package/dist/internal/leave-watchdog.d.ts

@@ -0,0 +1,62 @@
+import * as React from "react";
+/**
+ * Makes sure a closed `Dialog` or `Sheet` leaves the page, and says so once.
+ *
+ * Internal, and not exported from the package.
+ *
+ * Headless UI removes a dialog when its leave transition has ended, and it
+ * finds that end by reading the panel's transitions once, a frame after the
+ * classes change, then waiting for those. A close that arrives during the
+ * entrance doesn't start a leave: it turns the entrance around. When that
+ * turned-around transition ends, Headless UI 2.2.9 checks once more, and if
+ * any transition on the element is still unfinished it returns without
+ * waiting for it and never checks again. The dialog stays mounted, closed,
+ * over the page, taking every click, and `afterLeave` never comes. Rare, and
+ * commoner the busier the machine: in real Escapes during the entrance, 2
+ * stuck in 1,800 at a load of 13 to 20, none in 2,700 at 3 to 5.
+ *
+ * Upstream, this is Headless UI's issue #3902
+ * (https://github.com/tailwindlabs/headlessui/issues/3902). PR #3895
+ * (https://github.com/tailwindlabs/headlessui/pull/3895), open and unreviewed
+ * on 29 Oct 2026, reads the transitions again each time a batch of them
+ * settles, which covers this. When a Headless UI release carries that fix,
+ * the removal can come out. The wait in `afterLeave` (below) stays until a
+ * release also stops ending a leave before it has run, which #3895 doesn't
+ * (https://github.com/tailwindlabs/headlessui/issues/3902#issuecomment-6511980829).
+ *
+ * So each close is watched. A leave that ends goes as it always has: Headless
+ * UI calls `afterLeave`, then removes the dialog. If the dialog is still
+ * mounted `leaveMs` plus a margin after the close, with no transition running
+ * inside it, nothing is going to remove it, and Roster does: `key` changes,
+ * which remounts Headless UI's `Dialog` closed, and the stuck tree goes with
+ * the old one. A transition still running (a leave made longer than its
+ * default, say) is waited out, then checked again.
+ *
+ * Remounted rather than rendered only while open, so the way a dialog opens
+ * is untouched: Headless UI's helper that finds the page behind is in place
+ * before the open, as it always was, and a dialog open on its first render
+ * behaves as it did.
+ *
+ * `onAfterClose` fires once for each close: after `afterLeave`, once no
+ * transition runs on the dialog's own parts or it has gone (Headless UI can
+ * call `afterLeave` with the leave still to run), or, when `afterLeave` never
+ * came, once the stuck dialog is gone. A watched close that ends with `afterLeave` stays
+ * watched until the dialog leaves the page, because the backdrop has its own
+ * transition and can be the part left behind. Reopening during the leave ends
+ * the watch, and that close never reports; so does unmounting.
+ */
+/** How long past its leave a closed dialog may stay mounted, with nothing running, before it counts as stuck. */
+export declare const LEAVE_MARGIN_MS = 300;
+export interface LeaveWatchdog {
+    /** For Headless UI's `Dialog`: changes when a stuck dialog is removed. */
+    key: number;
+    /** For the panel's `TransitionChild`, in place of `onAfterClose`. */
+    afterLeave: () => void;
+}
+/**
+ * `ref` is on Headless UI's `Dialog`, the element that holds the backdrop and
+ * the panel, `panelRef` is on its `DialogPanel`, and `open` is what that
+ * `Dialog` is given. `leaveMs` is the leave's default length, the panel's and
+ * the backdrop's, whichever is longer.
+ */
+export declare function useLeaveWatchdog(ref: React.RefObject<HTMLElement | null>, panelRef: React.RefObject<HTMLElement | null>, open: boolean, leaveMs: number, onAfterClose?: () => void): LeaveWatchdog;

package/dist/internal/leave-watchdog.js

@@ -0,0 +1,64 @@
+"use client";
+import * as n from "react";
+const d = 300;
+function w(t, r) {
+  return typeof t.getAnimations != "function" ? !1 : t.getAnimations({ subtree: !0 }).some((u) => {
+    if (!("transitionProperty" in u) || u.playState !== "running") return !1;
+    const o = u.effect?.target;
+    return !(o && r && o !== r && r.contains(o));
+  });
+}
+const y = 16;
+function g(t, r) {
+  t.reported || (t.reported = !0, r?.());
+}
+function T(t, r, u, o, l) {
+  const [m, E] = n.useState(0), f = n.useRef({ onAfterClose: l, leaveMs: o });
+  n.useEffect(() => {
+    f.current = { onAfterClose: l, leaveMs: o };
+  });
+  const c = n.useRef(null), a = n.useRef(u), L = n.useCallback(() => {
+    const e = c.current;
+    if (!e) return;
+    const s = () => {
+      if (c.current !== e || e.reported) return;
+      const i = t.current;
+      if (i?.isConnected && w(i, r.current)) {
+        window.setTimeout(s, y);
+        return;
+      }
+      g(e, f.current.onAfterClose);
+    };
+    s();
+  }, [t, r]);
+  return n.useEffect(() => {
+    if (u) {
+      a.current = !0;
+      return;
+    }
+    if (!a.current) return;
+    a.current = !1;
+    const e = { timer: 0, reported: !1, removed: !1 };
+    c.current = e;
+    const s = () => {
+      const i = t.current;
+      if (i?.isConnected) {
+        if (w(i, r.current)) {
+          e.timer = window.setTimeout(s, d);
+          return;
+        }
+        e.removed = !0, E((v) => v + 1);
+      }
+    };
+    return e.timer = window.setTimeout(s, f.current.leaveMs + d), () => {
+      window.clearTimeout(e.timer), c.current === e && (c.current = null);
+    };
+  }, [u, t, r]), n.useLayoutEffect(() => {
+    const e = c.current;
+    e?.removed && (c.current = null, g(e, f.current.onAfterClose));
+  }, [m]), { key: m, afterLeave: L };
+}
+export {
+  d as LEAVE_MARGIN_MS,
+  T as useLeaveWatchdog
+};

package/dist/internal/step-check.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=()=>e.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",fill:"none",stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:e.jsx("path",{d:"M20 6 9 17l-5-5"})});exports.StepCheck=t;

package/dist/internal/step-check.d.ts

@@ -0,0 +1,2 @@
+/** The check a finished step's marker shows in place of its number. */
+export declare const StepCheck: () => import("react/jsx-runtime").JSX.Element;

package/dist/internal/step-check.js

@@ -0,0 +1,6 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+const r = () => /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ e("path", { d: "M20 6 9 17l-5-5" }) });
+export {
+  r as StepCheck
+};

package/dist/internal/step-marker.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../lib/utils.cjs"),s=r=>t.cn("rst:relative rst:z-10 rst:flex rst:h-8 rst:w-8 rst:items-center rst:justify-center rst:rounded-full rst:text-sm rst:font-semibold rst:tabular-nums",r==="done"&&"rst:bg-primary-600 rst:text-primary-600-ink rst:dark:bg-primary-400 rst:dark:text-gray-950 rst:forced-colors:forced-color-adjust-none rst:forced-colors:bg-[Highlight] rst:forced-colors:text-[HighlightText]",r==="current"&&"rst:border-2 rst:border-primary-600 rst:bg-[var(--roster-card-bg)] rst:text-primary-600 rst:dark:border-primary-400 rst:dark:text-primary-400",r==="upcoming"&&"rst:bg-[var(--roster-skeleton)] rst:text-gray-600 rst:dark:text-gray-300 rst:forced-colors:border");exports.stepMarkerClass=s;

package/dist/internal/step-marker.d.ts

@@ -0,0 +1,10 @@
+/**
+ * A step's marker, shared by `StepProgress` and `Timeline`, so a finished,
+ * current or upcoming step looks the same in both. The check it shows when
+ * done is `StepCheck`, in `step-check.tsx`.
+ *
+ * Internal, and not exported from the package.
+ */
+export type StepState = "done" | "current" | "upcoming";
+/** The marker's classes: a 32px circle, filled when done, ringed when current. */
+export declare const stepMarkerClass: (state: StepState) => string;

package/dist/internal/step-marker.js

@@ -0,0 +1,12 @@
+import { cn as t } from "../lib/utils.js";
+const e = (r) => t(
+  "rst:relative rst:z-10 rst:flex rst:h-8 rst:w-8 rst:items-center rst:justify-center rst:rounded-full rst:text-sm rst:font-semibold rst:tabular-nums",
+  r === "done" && "rst:bg-primary-600 rst:text-primary-600-ink rst:dark:bg-primary-400 rst:dark:text-gray-950 rst:forced-colors:forced-color-adjust-none rst:forced-colors:bg-[Highlight] rst:forced-colors:text-[HighlightText]",
+  /* A border, not a ring: forced colors keep a border and drop the shadow a
+     ring is drawn with. */
+  r === "current" && "rst:border-2 rst:border-primary-600 rst:bg-[var(--roster-card-bg)] rst:text-primary-600 rst:dark:border-primary-400 rst:dark:text-primary-400",
+  r === "upcoming" && "rst:bg-[var(--roster-skeleton)] rst:text-gray-600 rst:dark:text-gray-300 rst:forced-colors:border"
+);
+export {
+  e as stepMarkerClass
+};

package/dist/meta.json

@@ -1,5 +1,5 @@
 {
-  "version": "5.16.0",
-  "tests": 2564,
-  "testFiles": 651
+  "version": "5.18.0",
+  "tests": 2701,
+  "testFiles": 699
 }