@box-kite/react 2.2.15 → 2.2.17

package/components/toaster.mjs

@@ -1,26 +1,27 @@
 "use client";
-import { c as e, t } from "../platform.mjs";
-import { t as n } from "../client.mjs";
-import { n as r } from "../effects.mjs";
-import { t as i } from "../interactions.mjs";
-import a from "../box.mjs";
-import { i as o } from "../reporting.mjs";
-import { n as s } from "../layer.mjs";
-import { t as c } from "../motion.mjs";
-import { useCallback as l, useRef as u } from "react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import { createPortal as p } from "react-dom";
-import { useSyncExternalStore as m } from "use-sync-external-store/shim";
+import { f as e } from "../react-shared.mjs";
+import { c as t, l as n, t as r } from "../platform.mjs";
+import { t as i } from "../client.mjs";
+import { n as a } from "../effects.mjs";
+import { t as o } from "../interactions.mjs";
+import s from "../box.mjs";
+import { i as c } from "../reporting.mjs";
+import { n as l } from "../layer.mjs";
+import { r as u } from "../motion.mjs";
+import { useCallback as d, useRef as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { createPortal as h } from "react-dom";
+import { useSyncExternalStore as g } from "use-sync-external-store/shim";
 //#region src/utils/toast/toastStore.ts
-var h = ["value"], g = {
+var _ = ["value"], v = {
 	toasts: [],
 	overflow: 0
-}, _ = 0;
-function v() {
-	return _ += 1, `toast-${_}`;
+}, y = 0;
+function b() {
+	return y += 1, `toast-${y}`;
 }
-function y(e) {
-	let t = [], n = g, r = e?.limit ?? 3, a = e?.duration ?? 5e3, o = !1, s = /* @__PURE__ */ new Set(), c = /* @__PURE__ */ new Map(), l = (e) => {
+function x(e) {
+	let t = [], n = v, r = e?.limit ?? 3, i = e?.duration ?? 5e3, a = !1, s = /* @__PURE__ */ new Set(), c = /* @__PURE__ */ new Map(), l = (e) => {
 		let t = c.get(e);
 		t?.handle && clearTimeout(t.handle), c.delete(e);
 	}, u = () => {
@@ -46,20 +47,20 @@ function y(e) {
 				remaining: n.duration,
 				startedAt: 0
 			};
-			c.set(n.id, t), !(o || t.handle) && (t.startedAt = Date.now(), t.handle = setTimeout(() => {
+			c.set(n.id, t), !(a || t.handle) && (t.startedAt = Date.now(), t.handle = setTimeout(() => {
 				c.delete(n.id), p(n.id, "timeout");
 			}, t.remaining));
 		}
 		for (let t of [...c.keys()]) e.has(t) || l(t);
 	}
-	let f = (e, t) => t ?? (e === "loading" ? Infinity : a);
+	let f = (e, t) => t ?? (e === "loading" ? Infinity : i);
 	function p(e, n = "imperative") {
 		let r = [];
 		t = t.map((t) => !t.open || e !== void 0 && t.id !== e ? t : (r.push(t), l(t.id), {
 			...t,
 			open: !1
 		})), r.length && (u(), r.forEach((e) => {
-			e.onDismiss?.(n), i({
+			e.onDismiss?.(n), o({
 				component: "toaster",
 				type: "dismiss",
 				reason: n,
@@ -68,61 +69,61 @@ function y(e) {
 					id: e.id,
 					kind: e.kind
 				},
-				content: h
+				content: _
 			});
 		}));
 	}
 	function m(e, n, r) {
-		let a = !1;
+		let i = !1;
 		t = t.map((t) => {
 			if (t.id !== e) return t;
-			a = !0, l(e);
-			let i = r?.kind ?? t.kind;
+			i = !0, l(e);
+			let a = r?.kind ?? t.kind;
 			return {
 				...t,
 				...r,
 				id: e,
 				message: n,
-				kind: i,
-				duration: r?.duration ?? (r?.kind ? f(i) : t.duration),
+				kind: a,
+				duration: r?.duration ?? (r?.kind ? f(a) : t.duration),
 				open: !0
 			};
-		}), a && (u(), i({
+		}), i && (u(), o({
 			component: "toaster",
 			type: "update",
 			reason: r?.kind,
 			value: n,
 			details: { id: e },
 			source: "app",
-			content: h
+			content: _
 		}));
 	}
-	function _(e, n) {
-		let r = n?.id ?? v();
+	function h(e, n) {
+		let r = n?.id ?? b();
 		if (n?.id && t.some((e) => e.id === r)) return m(r, e, n), r;
-		let a = n?.kind ?? "default";
+		let i = n?.kind ?? "default";
 		return t = [...t, {
 			id: r,
-			kind: a,
+			kind: i,
 			message: e,
 			description: n?.description,
-			duration: f(a, n?.duration),
+			duration: f(i, n?.duration),
 			action: n?.action,
 			dismissible: n?.dismissible ?? !0,
 			onDismiss: n?.onDismiss,
 			open: !0,
 			visible: !1
-		}], u(), i({
+		}], u(), o({
 			component: "toaster",
 			type: "show",
-			reason: a,
+			reason: i,
 			value: e,
 			details: {
 				id: r,
-				kind: a
+				kind: i
 			},
 			source: "app",
-			content: h
+			content: _
 		}), r;
 	}
 	return {
@@ -130,8 +131,8 @@ function y(e) {
 			return s.add(e), () => s.delete(e);
 		},
 		getSnapshot: () => n,
-		getServerSnapshot: () => g,
-		add: _,
+		getServerSnapshot: () => v,
+		add: h,
 		update: m,
 		dismiss: p,
 		remove(e) {
@@ -142,45 +143,45 @@ function y(e) {
 			e !== r && (r = e, u());
 		},
 		setDefaultDuration(e) {
-			a = e;
+			i = e;
 		},
 		pause() {
-			if (!o) {
-				o = !0;
+			if (!a) {
+				a = !0;
 				for (let e of c.values()) e.handle && (clearTimeout(e.handle), e.handle = null, e.remaining = Math.max(0, e.remaining - (Date.now() - e.startedAt)));
 			}
 		},
 		resume() {
-			o && (o = !1, d());
+			a && (a = !1, d());
 		},
 		reset() {
 			for (let e of [...c.keys()]) l(e);
-			t = [], n = g, s.forEach((e) => e());
+			t = [], n = v, s.forEach((e) => e());
 		}
 	};
 }
 //#endregion
 //#region src/components/toaster.tsx
-var b = y(), x = (e) => (t, n) => b.add(t, {
+var S = x(), C = (e) => (t, n) => S.add(t, {
 	...n,
 	kind: e
-}), S = Object.assign((e, t) => b.add(e, t), {
-	success: x("success"),
-	error: x("error"),
-	warning: x("warning"),
-	info: x("info"),
-	loading: x("loading"),
-	update: (e, t, n) => b.update(e, t, n),
-	dismiss: (e) => b.dismiss(e, "imperative"),
+}), w = Object.assign((e, t) => S.add(e, t), {
+	success: C("success"),
+	error: C("error"),
+	warning: C("warning"),
+	info: C("info"),
+	loading: C("loading"),
+	update: (e, t, n) => S.update(e, t, n),
+	dismiss: (e) => S.dismiss(e, "imperative"),
 	promise(e, t, n) {
-		let r = b.add(t.loading, {
+		let r = S.add(t.loading, {
 			...n,
 			id: n?.id,
 			kind: "loading"
 		}), i = (e, t) => typeof e == "function" ? e(t) : e;
-		return e.then((e) => b.update(r, i(t.success, e), { kind: "success" }), (e) => b.update(r, i(t.error, e), { kind: "error" })), e;
+		return e.then((e) => S.update(r, i(t.success, e), { kind: "success" }), (e) => S.update(r, i(t.error, e), { kind: "error" })), e;
 	}
-}), C = {
+}), T = {
 	"top-start": "topStart",
 	"top-center": "topCenter",
 	"top-end": "topEnd",
@@ -188,49 +189,49 @@ var b = y(), x = (e) => (t, n) => b.add(t, {
 	"bottom-center": "bottomCenter",
 	"bottom-end": "bottomEnd"
 };
-function w(e, t) {
+function E(e, t) {
 	let n = t.toLowerCase().split("+"), r = n[n.length - 1], i = new Set(n.slice(0, -1));
 	return e.key.toLowerCase() === r && e.altKey === i.has("alt") && e.ctrlKey === i.has("ctrl") && e.shiftKey === i.has("shift") && e.metaKey === i.has("meta");
 }
-function T(e) {
-	let { toast: t, store: n, fromTop: i, closeLabel: s } = e, { mounted: l, ref: u, props: p } = c({ present: t.open }), m = o("toaster");
-	if (r(() => {
-		l || n.remove(t.id);
+function D(e) {
+	let { toast: t, store: n, fromTop: r, closeLabel: i } = e, { mounted: o, ref: l, props: d } = u({ present: t.open }), f = c("toaster");
+	if (a(() => {
+		o || n.remove(t.id);
 	}, [
-		l,
+		o,
 		n,
 		t.id
-	]), !l) return null;
+	]), !o) return null;
 	let h = t.action, g = () => {
-		h?.onClick(), h?.closeOnClick === !1 ? m("action", t.message, {
+		h?.onClick(), h?.closeOnClick === !1 ? f("action", t.message, {
 			reason: "action",
 			id: t.id,
 			kind: t.kind,
 			content: ["value"]
 		}) : n.dismiss(t.id, "action");
 	};
-	return /* @__PURE__ */ f(a, {
-		ref: u,
+	return /* @__PURE__ */ m(s, {
+		ref: l,
 		component: "toaster.toast",
 		variant: {
 			[t.kind]: t.kind !== "default",
-			fromTop: i
+			fromTop: r
 		},
 		props: {
 			...t.kind === "error" ? { role: "alert" } : {},
 			"data-toast-id": t.id,
-			...p
+			...d
 		},
 		children: [
-			/* @__PURE__ */ d(a, {
+			/* @__PURE__ */ p(s, {
 				component: "toaster.message",
 				children: t.message
 			}),
-			t.description !== void 0 && /* @__PURE__ */ d(a, {
+			t.description !== void 0 && /* @__PURE__ */ p(s, {
 				component: "toaster.description",
 				children: t.description
 			}),
-			h && /* @__PURE__ */ d(a, {
+			h && /* @__PURE__ */ p(s, {
 				tag: "button",
 				component: "toaster.action",
 				props: {
@@ -239,94 +240,95 @@ function T(e) {
 				},
 				children: h.label
 			}),
-			t.dismissible && /* @__PURE__ */ d(a, {
+			t.dismissible && /* @__PURE__ */ p(s, {
 				tag: "button",
 				component: "toaster.close",
 				props: {
 					type: "button",
-					"aria-label": s,
+					"aria-label": i,
 					onClick: () => n.dismiss(t.id, "close")
 				}
 			})
 		]
 	});
 }
-function E(i) {
-	let { position: o = "bottom-end", limit: c = 3, duration: h = 5e3, label: g = "Notifications", closeLabel: _ = "Close", overflowLabel: v = (e) => `+${e} more`, hotkey: y = "F6", store: x = b, props: S, ...E } = i, D = m(x.subscribe, x.getSnapshot, x.getServerSnapshot), O = s(), k = n(!O), A = u(null), j = u(null), M = u({
+function O(e, o) {
+	let { position: c = "bottom-end", limit: u = 3, duration: _ = 5e3, label: v = "Notifications", closeLabel: y = "Close", overflowLabel: b = (e) => `+${e} more`, hotkey: x = "F6", store: C = S, props: w, ...O } = e, k = g(C.subscribe, C.getSnapshot, C.getServerSnapshot), A = l(), j = i(!A), M = f(null), N = d((e) => {
+		M.current = e, n(o, e);
+	}, [o]), P = f(null), F = f({
 		hovered: !1,
 		focused: !1,
 		hidden: !1
-	}), N = l(() => {
-		let { hovered: e, focused: t, hidden: n } = M.current;
-		e || t || n ? x.pause() : x.resume();
-	}, [x]);
-	r(() => x.setLimit(c), [x, c]), r(() => x.setDefaultDuration(h), [x, h]), r(() => {
-		let t = A.current;
-		!O || !e() || !t || !t.isConnected || t.matches(":popover-open") || t.showPopover();
-	}), r(() => {
-		let e = t();
+	}), I = d(() => {
+		let { hovered: e, focused: t, hidden: n } = F.current;
+		e || t || n ? C.pause() : C.resume();
+	}, [C]);
+	a(() => C.setLimit(u), [C, u]), a(() => C.setDefaultDuration(_), [C, _]), a(() => {
+		let e = M.current;
+		!A || !t() || !e || !e.isConnected || e.matches(":popover-open") || e.showPopover();
+	}), a(() => {
+		let e = r();
 		if (!e) return;
-		let n = new AbortController();
+		let t = new AbortController();
 		return e.addEventListener("visibilitychange", () => {
-			M.current.hidden = e.hidden, N();
-		}, { signal: n.signal }), () => n.abort();
-	}, [N]), r(() => {
-		let e = t();
-		if (!y || !e) return;
-		let n = new AbortController();
+			F.current.hidden = e.hidden, I();
+		}, { signal: t.signal }), () => t.abort();
+	}, [I]), a(() => {
+		let e = r();
+		if (!x || !e) return;
+		let t = new AbortController();
 		return e.addEventListener("keydown", (t) => {
-			!w(t, y) || !A.current || (t.preventDefault(), j.current = e.activeElement, A.current.focus());
-		}, { signal: n.signal }), () => n.abort();
-	}, [y]);
-	let P = (e) => !!e && !!A.current?.contains(e), F = () => {
-		M.current.hovered = !0, N();
-	}, I = (e) => {
-		P(e.relatedTarget) || (M.current.hovered = !1, N());
-	}, L = (e) => {
-		M.current.focused = !0, N(), P(e.relatedTarget) || (j.current = e.relatedTarget);
-	}, R = (e) => {
-		P(e.relatedTarget) || (M.current.focused = !1, N());
+			!E(t, x) || !M.current || (t.preventDefault(), P.current = e.activeElement, M.current.focus());
+		}, { signal: t.signal }), () => t.abort();
+	}, [x]);
+	let L = (e) => !!e && !!M.current?.contains(e), R = () => {
+		F.current.hovered = !0, I();
 	}, z = (e) => {
+		L(e.relatedTarget) || (F.current.hovered = !1, I());
+	}, B = (e) => {
+		F.current.focused = !0, I(), L(e.relatedTarget) || (P.current = e.relatedTarget);
+	}, V = (e) => {
+		L(e.relatedTarget) || (F.current.focused = !1, I());
+	}, H = (e) => {
 		if (e.key !== "Escape") return;
 		let t = (e.target.closest?.("[data-toast-id]"))?.getAttribute("data-toast-id");
-		t && x.dismiss(t, "close"), x.getSnapshot().toasts.some((e) => e.open) ? A.current?.focus() : j.current?.focus();
-	}, B = o.startsWith("top"), V = D.toasts.filter((e) => e.visible), H = B ? [...V].reverse() : V, U = D.overflow > 0 && /* @__PURE__ */ d(a, {
+		t && C.dismiss(t, "close"), C.getSnapshot().toasts.some((e) => e.open) ? M.current?.focus() : P.current?.focus();
+	}, U = c.startsWith("top"), W = k.toasts.filter((e) => e.visible), G = U ? [...W].reverse() : W, K = k.overflow > 0 && /* @__PURE__ */ p(s, {
 		component: "toaster.overflow",
-		children: v(D.overflow)
-	}), W = /* @__PURE__ */ f(a, {
+		children: b(k.overflow)
+	}), q = /* @__PURE__ */ m(s, {
 		tag: "section",
-		ref: A,
+		ref: N,
 		component: "toaster",
-		...E,
-		variant: [E.variant, { [C[o]]: !0 }],
+		...O,
+		variant: [O.variant, { [T[c]]: !0 }],
 		props: {
-			...O ? { popover: "manual" } : {},
+			...A ? { popover: "manual" } : {},
 			"aria-live": "polite",
 			"aria-atomic": "false",
 			"aria-relevant": "additions text",
-			"aria-label": g,
+			"aria-label": v,
 			tabIndex: -1,
-			...S,
-			onPointerOver: F,
-			onPointerOut: I,
-			onFocus: L,
-			onBlur: R,
-			onKeyDown: z
+			...w,
+			onPointerOver: R,
+			onPointerOut: z,
+			onFocus: B,
+			onBlur: V,
+			onKeyDown: H
 		},
 		children: [
-			!B && U,
-			H.map((e) => /* @__PURE__ */ d(T, {
+			!U && K,
+			G.map((e) => /* @__PURE__ */ p(D, {
 				toast: e,
-				store: x,
-				fromTop: B,
-				closeLabel: _
+				store: C,
+				fromTop: U,
+				closeLabel: y
 			}, e.id)),
-			B && U
+			U && K
 		]
 	});
-	return O ? W : k ? p(W, k) : null;
+	return A ? q : j ? h(q, j) : null;
 }
-var D = E;
-D.displayName = "Toaster";
+var k = e(O, "Toaster");
 //#endregion
-export { y as createToastStore, D as default, b as defaultToastStore, S as toast };
+export { x as createToastStore, k as default, S as defaultToastStore, w as toast };

package/components/tooltip.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../behavior.cjs"),t=require("../identity.cjs"),n=require("./overlay.cjs"),r=require("./presence.cjs");let i=require("react"),a=require("react/jsx-runtime");function o(o){let{content:s,children:c,open:l,defaultOpen:u=!1,onOpenChange:d,openDelay:f=300,closeDelay:p=150,side:m=`bottom`,align:h=`center`,offset:g=1,flip:_=!0,props:v,...y}=o,b=t.t(`tooltip`),x=y.id??b,[S,C]=e.i({value:l,defaultValue:u,onChange:d}),[w,T]=(0,i.useState)(null),E=(0,i.useRef)(null),D=(0,i.useRef)(void 0),O=(0,i.useRef)(!1),k=(0,i.useRef)(!1),A=(0,i.useRef)(!1),j=(0,i.useRef)(!1),M=(0,i.useCallback)(()=>{clearTimeout(D.current),D.current=void 0},[]),N=(0,i.useCallback)((e,t)=>{if(M(),e<=0){t();return}D.current=setTimeout(()=>{D.current=void 0,t()},e)},[M]),P=(0,i.useCallback)((e,t)=>{N(p,()=>{O.current||k.current||A.current||C(!1,{reason:e,event:t})})},[p,N,C]);e.r({enabled:S,outsidePointer:!1,inside:[E],onDismiss:(e,t)=>{M(),j.current=!0,C(!1,{reason:e,event:t})}}),(0,i.useEffect)(()=>M,[M]);let F=S&&s!=null,I=e.a(e=>{O.current=!0,!j.current&&N(f,()=>C(!0,{reason:`hover`,event:e}))}),L=e.a(e=>{O.current=!1,j.current=!1,P(`pointer-leave`,e)}),R=e.a(e=>{A.current=!0,M(),C(!0,{reason:`focus`,event:e})}),z=e.a(e=>{A.current=!1,j.current=!1,P(`blur`,e)}),B=e.a(()=>{k.current=!0,M()}),V=e.a(e=>{k.current=!1,P(`pointer-leave`,e)}),H=(0,i.useMemo)(()=>({ref:T,props:{"aria-describedby":F?x:void 0,onPointerEnter:I,onPointerLeave:L,onFocus:R,onBlur:z}}),[z,I,R,L,F,x]);return(0,a.jsxs)(a.Fragment,{children:[c(H),(0,a.jsx)(r.default,{present:F,children:e=>(0,a.jsx)(n.default,{ref:E,contentRef:e.ref,anchor:w,side:m,align:h,offset:g,flip:_,matchWidth:!1,component:`tooltip`,...y,variant:[y.variant,{closed:!e.present}],id:x,props:{role:`tooltip`,...e.props,...v,onPointerEnter:B,onPointerLeave:V},children:s})})]})}o.displayName=`Tooltip`,exports.default=o;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../behavior.cjs"),r=require("../identity.cjs"),i=require("./overlay.cjs"),a=require("./presence.cjs");let o=require("react"),s=require("react/jsx-runtime");function c(e,c){let{content:l,children:u,open:d,defaultOpen:f=!1,onOpenChange:p,openDelay:m=300,closeDelay:h=150,side:g=`bottom`,align:_=`center`,offset:v=1,flip:y=!0,props:b,...x}=e,S=r.t(`tooltip`),C=x.id??S,[w,T]=n.i({value:d,defaultValue:f,onChange:p}),[E,D]=(0,o.useState)(null),O=(0,o.useRef)(null),k=(0,o.useCallback)(e=>{O.current=e,t.l(c,e)},[c]),A=(0,o.useRef)(void 0),j=(0,o.useRef)(!1),M=(0,o.useRef)(!1),N=(0,o.useRef)(!1),P=(0,o.useRef)(!1),F=(0,o.useCallback)(()=>{clearTimeout(A.current),A.current=void 0},[]),I=(0,o.useCallback)((e,t)=>{if(F(),e<=0){t();return}A.current=setTimeout(()=>{A.current=void 0,t()},e)},[F]),L=(0,o.useCallback)((e,t)=>{I(h,()=>{j.current||M.current||N.current||T(!1,{reason:e,event:t})})},[h,I,T]);n.r({enabled:w,outsidePointer:!1,inside:[O],onDismiss:(e,t)=>{F(),P.current=!0,T(!1,{reason:e,event:t})}}),(0,o.useEffect)(()=>F,[F]);let R=w&&l!=null,z=n.a(e=>{j.current=!0,!P.current&&I(m,()=>T(!0,{reason:`hover`,event:e}))}),B=n.a(e=>{j.current=!1,P.current=!1,L(`pointer-leave`,e)}),V=n.a(e=>{N.current=!0,F(),T(!0,{reason:`focus`,event:e})}),H=n.a(e=>{N.current=!1,P.current=!1,L(`blur`,e)}),U=n.a(()=>{M.current=!0,F()}),W=n.a(e=>{M.current=!1,L(`pointer-leave`,e)}),G=(0,o.useMemo)(()=>({ref:D,props:{"aria-describedby":R?C:void 0,onPointerEnter:z,onPointerLeave:B,onFocus:V,onBlur:H}}),[H,z,V,B,R,C]);return(0,s.jsxs)(s.Fragment,{children:[u(G),(0,s.jsx)(a.default,{present:R,children:e=>(0,s.jsx)(i.default,{ref:k,contentRef:e.ref,anchor:E,side:g,align:_,offset:v,flip:y,matchWidth:!1,component:`tooltip`,...x,variant:[x.variant,{closed:!e.present}],id:C,props:{role:`tooltip`,...e.props,...b,onPointerEnter:U,onPointerLeave:W},children:l})})]})}var l=e.f(c,`Tooltip`);exports.default=l;

package/components/tooltip.d.ts

@@ -61,38 +61,5 @@ interface Props<TKey extends keyof ComponentsAndVariants> extends TooltipBoxProp
     /** Whether a side with no room may be swapped for its opposite. Default `true`. */
     flip?: boolean;
 }
-/**
- * The APG tooltip: a description that appears on hover *and* on focus and stays until the user is done
- * with it.
- *
- * ```tsx
- * <Tooltip content="Deletes the row for good">{(trigger) => <Button {...trigger}>Delete</Button>}</Tooltip>
- * ```
- *
- * The trigger is a render prop rather than a cloned child: cloning would have to guess where a child
- * wants its DOM attributes (Box takes a `props` bag, a `<button>` takes them on top), and guessing wrong
- * on `aria-describedby` costs the thing the pattern is for. The component owns `role="tooltip"`, the
- * `aria-describedby`, and WCAG 1.4.13's three obligations — dismissible with Escape without moving focus,
- * hoverable, and never closed on a timer. Focus never enters it: a focusable tooltip is a mislabelled dialog.
- *
- * @pattern https://www.w3.org/WAI/ARIA/apg/patterns/tooltip/
- * @a11y `role="tooltip"` on the bubble and `aria-describedby` on the trigger, so the description is read
- * as part of the control rather than as text that happens to be nearby.
- * @a11y WCAG 1.4.13, all three parts: Escape dismisses it without moving focus, the pointer can travel
- * onto the bubble and read it, and nothing hides it on a timer.
- * @a11y The bubble is never in the tab order — a focusable tooltip is a dialog with the wrong role — and
- * it renders nothing at all while `content` is empty.
- * @keyboard Tab — Shows it as soon as the trigger has focus, ignoring `openDelay`: a keyboard user asked
- * for it by arriving.
- * @keyboard Escape — Hides it, leaving focus on the trigger. It stays hidden until the pointer or focus
- * leaves and comes back.
- * @keyboard Tab, again — Reaches the next control, and the tooltip closes behind it.
- * @keyboard (Pointer) Resting on the trigger — Shows it after `openDelay`, 300 ms by default: sweeping
- * across a toolbar should not light every control up.
- * @keyboard (Pointer) Leaving the trigger — Hides it after `closeDelay`, 150 ms — unless the pointer
- * lands on the tooltip itself.
- * @keyboard (Pointer) Moving onto the tooltip — Keeps it open for as long as the pointer is there, so a
- * long description can be read or selected.
- */
-declare function Tooltip<TKey extends keyof ComponentsAndVariants = 'tooltip'>(props: Props<TKey>): import("react").JSX.Element;
+declare const Tooltip: <TKey extends keyof ComponentsAndVariants = "tooltip">(props: Props<TKey>) => React.ReactNode;
 export default Tooltip;