@botiverse/raft-ui 0.19.0 → 0.21.0

package/dist/{touch-drag-CbWqiMlZ.mjs → touch-drag-B7uLTWXe.mjs}

@@ -12,9 +12,18 @@ import { Checkbox } from "@base-ui/react/checkbox";
 import { ScrollArea } from "@base-ui/react/scroll-area";
 import { Avatar } from "@base-ui/react";
 import { Menu } from "@base-ui/react/menu";
+import { flushSync } from "react-dom";
 import { Toggle } from "@base-ui/react/toggle";
 import { Toolbar } from "@base-ui/react/toolbar";
 import { PointerSensor, TouchSensor, useSensor } from "@dnd-kit/core";
+//#region src/lib/decision-width.ts
+/**
+* The width of every decision dialog (dialog.md#variants): AlertDialog and a
+* `size="sm"` Dialog are both 400px, so every confirmation in a product is one
+* width whichever of the two it is built on.
+*/
+const decisionWidth = "max-w-100";
+//#endregion
 //#region src/lib/head-edges.ts
 /**
 * The ends of a header (design/foundations/alignment.md#the-ends-of-a-header).
@@ -247,8 +256,8 @@ function Spinner({ size = "sm", variant = "default", className, render, ...props
 }
 //#endregion
 //#region src/components/button/button.tsx
-const sticker = (fill) => [`border-sticker-ink ${fill} text-sticker-ink ring-[1.5px] ring-sticker-edge`, "hover:press-overlay-sticker active:press-overlay-sticker"];
-const outline = (ink) => [`border-line-strong bg-layer-card ${ink}`, "hover:press-overlay active:press-overlay"];
+const sticker = (fill) => [`border-sticker-ink ${fill} text-sticker-ink ring-[1.5px] ring-sticker-edge`, "hover:overlay-sticker-medium active:overlay-sticker-medium"];
+const outline = (ink) => [`border-line-strong bg-layer-card ${ink}`, "hover:overlay-medium active:overlay-medium"];
 const textMd = [
 	"h-8 gap-2 rounded-control px-3 py-0 text-control",
 	"has-data-[icon=inline-start]:pl-2.5 has-data-[icon=inline-end]:pr-2.5",
@@ -291,11 +300,11 @@ const buttonVariants = tv$1({
 			success: { root: outline("text-foreground") },
 			"danger-secondary": { root: outline("text-danger-strong") },
 			"danger-outline": { root: outline("text-danger-strong") },
-			ghost: { root: ["border-transparent bg-transparent text-foreground", "hover:bg-fill-pressed active:bg-fill-pressed"] },
+			ghost: { root: ["border-transparent bg-transparent text-foreground", "hover:bg-fill-medium active:bg-fill-medium"] },
 			"on-frame": { root: [
 				"border-transparent bg-transparent text-foreground-on-frame",
-				"hover:bg-fill-frame-pressed active:bg-fill-frame-pressed",
-				"aria-expanded:bg-fill-frame-pressed data-popup-open:bg-fill-frame-pressed",
+				"hover:bg-fill-frame-medium active:bg-fill-frame-medium",
+				"aria-expanded:bg-fill-frame-medium data-popup-open:bg-fill-frame-medium",
 				"disabled:border-transparent disabled:bg-transparent",
 				"aria-disabled:border-transparent aria-disabled:bg-transparent"
 			] }
@@ -427,9 +436,9 @@ const dialog = tv$1({
 	},
 	variants: {
 		size: {
-			sm: { content: ["max-w-sm"] },
+			sm: { content: [decisionWidth] },
 			md: { content: ["max-w-md"] },
-			lg: { content: ["max-w-lg"] },
+			lg: { content: ["max-w-160"] },
 			wide: { content: ["max-w-4xl h-[min(760px,calc(100dvh-2rem))]"] }
 		},
 		bar: {
@@ -616,6 +625,7 @@ const badge = tv$1({
 		"font-sans text-caption font-semibold normal-case tracking-normal",
 		"transition-[filter,opacity] duration-100",
 		"[&_svg]:size-3.5 [&_svg]:shrink-0 [&_[data-slot='spinner']]:size-3 [&_[data-slot='spinner']]:text-xs",
+		"*:data-[slot=status]:lead-dot",
 		"disabled:cursor-not-allowed disabled:bg-fill-muted disabled:text-foreground-disabled disabled:opacity-100 disabled:inset-ring-0"
 	] },
 	variants: {
@@ -625,13 +635,13 @@ const badge = tv$1({
 				"font-bold tabular-nums",
 				"text-sticker-ink inset-ring-[1.5px] inset-ring-sticker-ink ring-[1.5px] ring-sticker-edge",
 				"[&_svg]:size-[13px]",
-				"enabled:hover:press-overlay-sticker"
+				"enabled:hover:overlay-sticker-medium enabled:active:overlay-sticker-medium"
 			] },
-			soft: { root: ["text-foreground", "enabled:hover:press-overlay"] },
+			soft: { root: ["text-foreground", "enabled:hover:overlay-medium enabled:active:overlay-medium"] },
 			outline: { root: [
 				"font-mono text-mono-meta font-normal",
 				"bg-transparent text-foreground-muted inset-ring inset-ring-line-hairline",
-				"enabled:hover:bg-fill-pressed"
+				"enabled:hover:bg-fill-medium enabled:active:bg-fill-medium"
 			] }
 		},
 		variant: {
@@ -789,6 +799,36 @@ function Experimental(props) {
 }
 const Badge = Object.assign(BadgeRoot, { Experimental });
 //#endregion
+//#region src/components/text-link/text-link.tsx
+const textLinkVariants = tv$1({
+	base: [
+		"rounded-[2px]",
+		"decoration-[1.5px] underline-offset-[3px] not-disabled:hover:underline",
+		"outline-none focus-visible:shadow-focus",
+		"disabled:cursor-not-allowed disabled:text-foreground-disabled"
+	],
+	variants: { variant: {
+		muted: ["font-medium text-foreground-muted", "hover:text-foreground"],
+		strong: ["font-semibold text-foreground"]
+	} },
+	defaultVariants: { variant: "muted" }
+});
+function TextLink({ variant, className, render, ...props }) {
+	const defaultProps = {
+		className: textLinkVariants({
+			variant,
+			className
+		}),
+		...render ? {} : { type: "button" }
+	};
+	return useRender({
+		defaultTagName: "button",
+		render,
+		props: mergeProps(defaultProps, props),
+		state: { slot: "text-link" }
+	});
+}
+//#endregion
 //#region src/components/tooltip/tooltip.tsx
 const tooltip = tv$1({
 	slots: {
@@ -934,7 +974,7 @@ const CONTENT_COLLISION_AVOIDANCE = {
 	align: "shift",
 	fallbackAxisSide: "none"
 };
-function TooltipContent({ align = "center", alignOffset = 0, anchor, arrowPadding, collisionAvoidance = CONTENT_COLLISION_AVOIDANCE, collisionBoundary, collisionPadding, disableAnchorTracking = false, positionMethod = "fixed", side = "top", sideOffset, sticky, container, portalProps, className, children, ...props }) {
+function TooltipContent({ align = "center", alignOffset = 0, anchor, arrowPadding, collisionAvoidance = CONTENT_COLLISION_AVOIDANCE, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "top", sideOffset, sticky, container, portalProps, className, children, ...props }) {
 	const { positioner, content } = tooltip();
 	const portalContainer = container !== void 0 ? container : portalProps?.container;
 	return /* @__PURE__ */ jsx(TooltipPortal, {
@@ -1042,7 +1082,9 @@ const checkbox = tv$1({ slots: {
 		"relative inline-flex size-5 shrink-0 touch-manipulation items-center justify-center outline-none",
 		"rounded-sticker focus-visible:shadow-focus",
 		"data-disabled:cursor-not-allowed",
-		"after:absolute after:-inset-x-3 after:-inset-y-2 after:content-['']"
+		"after:absolute after:-inset-x-3 after:-inset-y-2 after:content-[''] pointer-coarse:after:-inset-y-3",
+		"[label>&]:my-[max(0px,calc((1lh-1.25rem)/2))]",
+		"[label>&]:after:-inset-y-[calc(max(0px,(1lh-1.25rem)/2)+4px)]"
 	],
 	indicator: "pointer-events-none"
 } });
@@ -1307,13 +1349,13 @@ const dropdownMenu = tv$1({ slots: {
 	content: [
 		"max-h-(--available-height) overflow-hidden",
 		"outline-none",
-		"flex min-w-60 flex-col gap-0 rounded-container bg-layer-popover p-1.5 text-foreground",
+		"flex min-w-60 flex-col gap-0 rounded-container bg-layer-popover p-1 text-foreground",
 		"shadow-float ring-1 ring-line-seam"
 	],
 	item: [
 		"flex w-full cursor-default select-none items-center",
 		"text-left outline-none transition-colors",
-		"min-h-option gap-2.5 rounded-control px-2.5 py-option-inset",
+		"min-h-option gap-2.5 rounded-chip px-2.5 py-option-inset",
 		"font-sans text-callout font-medium text-foreground",
 		"hover:bg-brand-soft data-highlighted:bg-brand-soft",
 		"data-checked:font-bold data-[selected]:font-bold data-[emphasis=strong]:font-bold",
@@ -1324,7 +1366,7 @@ const dropdownMenu = tv$1({ slots: {
 	radioItem: [
 		"flex w-full cursor-default select-none items-center",
 		"text-left outline-none transition-colors",
-		"min-h-option gap-2.5 rounded-control px-2.5 py-option-inset",
+		"min-h-option gap-2.5 rounded-chip px-2.5 py-option-inset",
 		"font-sans text-callout font-medium text-foreground",
 		"hover:bg-brand-soft data-highlighted:bg-brand-soft",
 		"data-checked:font-bold",
@@ -1335,7 +1377,7 @@ const dropdownMenu = tv$1({ slots: {
 	submenuTrigger: [
 		"flex w-full cursor-default select-none items-center",
 		"text-left outline-none transition-colors",
-		"min-h-option gap-2.5 rounded-control px-2.5 py-option-inset",
+		"min-h-option gap-2.5 rounded-chip px-2.5 py-option-inset",
 		"font-sans text-callout font-medium text-foreground",
 		"hover:bg-brand-soft data-highlighted:bg-brand-soft data-popup-open:bg-brand-soft",
 		"data-disabled:pointer-events-none data-disabled:text-foreground-disabled",
@@ -1351,7 +1393,7 @@ const dropdownMenu = tv$1({ slots: {
 		"font-mono text-mono-meta font-normal text-foreground-hint"
 	],
 	itemCount: ["ml-auto inline-flex min-w-5 justify-center gap-0 px-1 tabular-nums"],
-	separator: ["-mx-1.5 my-1.5 h-px border-0 bg-line-hairline"],
+	separator: ["-mx-1 my-1 h-px border-0 bg-line-hairline"],
 	indicator: ["pointer-events-none ml-auto flex shrink-0 items-center justify-center", "size-4 text-foreground [&_svg]:size-4"],
 	radioLabel: ["min-w-0 flex-1 truncate"]
 } });
@@ -1393,7 +1435,7 @@ function DropdownMenuPopup({ className, ...props }) {
 		...props
 	});
 }
-function DropdownMenuContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking = false, positionMethod = "fixed", side = "bottom", sideOffset, sticky, portalProps, className, ...props }) {
+function DropdownMenuContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset, sticky, portalProps, className, ...props }) {
 	const resolvedSideOffset = sideOffset ?? 6;
 	const { positioner, content } = dropdownMenu();
 	return /* @__PURE__ */ jsx(DropdownMenuPortal, {
@@ -1581,10 +1623,157 @@ function DropdownMenuCheckboxItemIndicator({ className, ...props }) {
 		...props
 	});
 }
+function contentBox(element) {
+	const rect = element.getBoundingClientRect();
+	if (rect.width === 0 && rect.height === 0) return void 0;
+	const style = element.ownerDocument.defaultView?.getComputedStyle(element);
+	const px = (value) => Number.parseFloat(value ?? "") || 0;
+	return {
+		left: rect.left + px(style?.borderLeftWidth) + px(style?.paddingLeft),
+		right: rect.right - px(style?.borderRightWidth) - px(style?.paddingRight),
+		top: rect.top + px(style?.borderTopWidth) + px(style?.paddingTop),
+		bottom: rect.bottom - px(style?.borderBottomWidth) - px(style?.paddingBottom)
+	};
+}
+/**
+* Whether laid-out text `rects` overflow `box`: past either inline edge, or
+* on a line whose middle is below the bottom edge (a clamped line is still
+* laid out, below the box; the middle, not the top, so a glyph box taller
+* than a tight line-height does not count as a cut).
+*/
+function overflows(rects, box) {
+	for (const rect of Array.from(rects)) {
+		if (rect.width === 0 && rect.height === 0) continue;
+		if (rect.right > box.right + .5 || rect.left < box.left - .5) return true;
+		if (rect.top + rect.height / 2 > box.bottom + .5) return true;
+	}
+	return false;
+}
+/** Whether the text inside `element` overflows its content box. */
+function measureElement(element) {
+	if (!element.isConnected) return void 0;
+	const box = contentBox(element);
+	if (!box) return void 0;
+	const range = element.ownerDocument.createRange();
+	range.selectNodeContents(element);
+	return overflows(range.getClientRects(), box);
+}
+/**
+* Whether the inline `content` overflows `text`, the box that clips it.
+* Used where `text` holds more than the content (an Ellipsis's floats).
+*/
+function measureContent(text, content) {
+	if (!text.isConnected) return void 0;
+	const box = contentBox(text);
+	if (!box) return void 0;
+	return overflows(content.getClientRects(), box);
+}
+/** Isolates, reads and restores one target now, outside the batch. */
+function readNow(target) {
+	const restore = target.isolate?.();
+	try {
+		return target.read();
+	} finally {
+		restore?.();
+	}
+}
+const targets = /* @__PURE__ */ new Set();
+const byElement = /* @__PURE__ */ new WeakMap();
+const pending = /* @__PURE__ */ new Set();
+let frame = 0;
+let resizeObserver;
+let mutationObserver;
+let fontsListening = false;
+function flush() {
+	frame = 0;
+	const batch = Array.from(pending).filter((target) => targets.has(target));
+	pending.clear();
+	const restores = batch.map((target) => target.isolate?.());
+	const results = batch.map((target) => target.read());
+	for (const restore of restores) restore?.();
+	flushSync(() => {
+		batch.forEach((target, index) => {
+			if (targets.has(target)) target.commit(results[index]);
+		});
+	});
+}
+/** Asks for `target` to be measured in the next frame, before it paints. */
+function scheduleMeasure(target) {
+	if (!targets.has(target)) return;
+	pending.add(target);
+	if (frame === 0 && typeof requestAnimationFrame === "function") frame = requestAnimationFrame(flush);
+}
+function scheduleAll() {
+	for (const target of targets) scheduleMeasure(target);
+}
+function ownerOf(node) {
+	for (let current = node; current; current = current.parentNode) {
+		const target = byElement.get(current);
+		if (target) return target;
+	}
+}
+function observers(view) {
+	if (!resizeObserver && "ResizeObserver" in view) resizeObserver = new view.ResizeObserver((entries) => {
+		for (const entry of entries) {
+			const target = byElement.get(entry.target);
+			if (target) scheduleMeasure(target);
+		}
+	});
+	if (!mutationObserver && "MutationObserver" in view) mutationObserver = new view.MutationObserver((records) => {
+		for (const record of records) {
+			const target = ownerOf(record.target);
+			if (target) scheduleMeasure(target);
+		}
+	});
+	const fonts = view.document.fonts;
+	if (!fontsListening && fonts && typeof fonts.addEventListener === "function") {
+		fonts.addEventListener("loadingdone", scheduleAll);
+		fontsListening = true;
+	}
+}
+/**
+* Starts watching `target`: the elements it names, the text under `watch`
+* and the page's fonts. Measures it in the next frame. Returns the cleanup.
+*/
+function observeTruncation(target) {
+	const observed = target.observe().filter((element) => element != null);
+	const first = observed[0];
+	const view = first?.ownerDocument.defaultView;
+	if (!first || !view) return () => void 0;
+	observers(view);
+	targets.add(target);
+	for (const element of observed) {
+		byElement.set(element, target);
+		resizeObserver?.observe(element);
+	}
+	const watched = target.watch();
+	if (watched) {
+		byElement.set(watched, target);
+		mutationObserver?.observe(watched, {
+			childList: true,
+			characterData: true,
+			subtree: true
+		});
+	}
+	scheduleMeasure(target);
+	return () => {
+		targets.delete(target);
+		pending.delete(target);
+		for (const element of observed) {
+			if (byElement.get(element) === target) byElement.delete(element);
+			resizeObserver?.unobserve(element);
+		}
+		if (watched && byElement.get(watched) === target) byElement.delete(watched);
+		if (targets.size === 0) {
+			mutationObserver?.disconnect();
+			mutationObserver = void 0;
+		}
+	};
+}
 //#endregion
 //#region src/lib/use-overflow-title.ts
 function cut(element) {
-	return element.scrollWidth > element.clientWidth + 1 || element.scrollHeight > element.clientHeight + 1;
+	return measureElement(element) === true;
 }
 function assign(ref, node) {
 	if (typeof ref === "function") ref(node);
@@ -1613,25 +1802,18 @@ function useOverflowTitle(ref, title) {
 		cleanup.current = void 0;
 		assign(ref, node);
 		const view = node?.ownerDocument.defaultView;
-		if (!node || own || !view || !("ResizeObserver" in view)) return;
-		const update = () => {
-			const text = node.textContent?.trim() ?? "";
-			if (text && (cut(node) || Array.from(node.children).some(cut))) node.title = text;
-			else node.removeAttribute("title");
-		};
-		const resize = new view.ResizeObserver(update);
-		resize.observe(node);
-		for (const child of Array.from(node.children)) resize.observe(child);
-		const mutation = new view.MutationObserver(update);
-		mutation.observe(node, {
-			childList: true,
-			characterData: true,
-			subtree: true
+		if (!node || own || !view) return;
+		const children = Array.from(node.children);
+		cleanup.current = observeTruncation({
+			observe: () => [node, ...children],
+			watch: () => node,
+			read: () => cut(node) || children.some(cut),
+			commit: (truncated) => {
+				const text = node.textContent?.trim() ?? "";
+				if (text && truncated) node.title = text;
+				else node.removeAttribute("title");
+			}
 		});
-		cleanup.current = () => {
-			resize.disconnect();
-			mutation.disconnect();
-		};
 	}, [own, ref]);
 }
 //#endregion
@@ -1928,11 +2110,11 @@ const messageItem = tv$1({
 			"group/message relative flex h-fit gap-3",
 			"hover:[--mi-toolbar-opacity:1] hover:[--mi-toolbar-pe:auto] focus-within:[--mi-toolbar-opacity:1] focus-within:[--mi-toolbar-pe:auto]",
 			"has-data-popup-open:[--mi-toolbar-opacity:1] has-data-popup-open:[--mi-toolbar-pe:auto]",
-			"min-h-0 px-2 py-1 border-t-8 border-transparent bg-clip-padding",
+			"min-h-0 px-2 py-timeline-row border-t-(length:--spacing-timeline-turn) border-transparent bg-clip-padding",
 			"hover:[--mi-ct-color:var(--foreground-hint)] has-data-popup-open:[--mi-ct-color:var(--foreground-hint)]",
 			"bg-(--mi-row-fill) [--mi-row-fill:initial]",
-			"hover:[--mi-row-fill:var(--fill-message-hover)]",
-			"data-popup-open:[--mi-row-fill:var(--fill-row-open)] has-data-popup-open:[--mi-row-fill:var(--fill-row-open)]",
+			"hover:[--mi-row-fill:var(--fill-subtle)]",
+			"data-popup-open:[--mi-row-fill:var(--fill-subtle)] has-data-popup-open:[--mi-row-fill:var(--fill-subtle)]",
 			"has-data-[slot=message-item-search-match]:[--mi-row-fill:var(--info-soft)] has-data-[slot=message-item-search-match]:hover:[--mi-row-fill:var(--info-soft)]",
 			"has-[[data-slot=message-multi-select-checkbox][data-checked]]:[--mi-row-fill:var(--info-soft)]",
 			"has-[[data-slot=message-multi-select-checkbox][data-checked]]:hover:[--mi-row-fill:var(--info-soft)]"
@@ -1952,7 +2134,7 @@ const messageItem = tv$1({
 		content: ["min-w-0 flex-1", "text-body text-foreground"],
 		header: [
 			"mb-px flex min-w-0 items-baseline gap-1.5 overflow-hidden",
-			"pointer-fine:pe-(--mi-toolbar-reserve,6.5rem)",
+			"pointer-fine:pe-(--mi-toolbar-reserve,7rem)",
 			"has-data-[slot=message-item-delegated-by]:[--mi-owner-basis:3rem] has-data-[slot=message-item-delegated-by]:[--mi-owner-flex:1_0]"
 		],
 		senderGroup: [
@@ -2007,15 +2189,15 @@ const messageItem = tv$1({
 			"absolute z-20 flex items-center",
 			"opacity-(--mi-toolbar-opacity,0)",
 			"[pointer-events:var(--mi-toolbar-pe,none)]",
-			"top-[-16px] right-3 gap-0.5 overflow-visible rounded-container p-0.5",
+			"top-[-18px] right-3 gap-1 overflow-visible rounded-container p-1",
 			"bg-layer-popover ring-1 ring-line-seam ring-inset shadow-float"
 		],
 		toolbarButton: [
 			"inline-flex shrink-0 items-center justify-center",
 			"[&_svg]:shrink-0",
-			"size-7 rounded-control border-0 bg-transparent p-0",
-			"text-foreground-muted hover:bg-fill-pressed active:bg-fill-pressed",
-			"data-popup-open:bg-fill-pressed data-active:text-foreground",
+			"size-7 rounded-chip border-0 bg-transparent p-0",
+			"text-foreground-muted hover:bg-fill-medium active:bg-fill-medium",
+			"data-popup-open:bg-fill-medium data-active:text-foreground",
 			"outline-none focus-visible:shadow-focus",
 			"[&_svg]:size-4"
 		]
@@ -2344,7 +2526,7 @@ const messageFooter = tv$1({
 			"[&_svg]:shrink-0",
 			"h-[22px] rounded-chip px-1.5",
 			"text-caption font-semibold text-foreground-muted",
-			"bg-fill-muted hover:press-overlay active:press-overlay",
+			"bg-fill-muted hover:overlay-medium active:overlay-medium",
 			"outline-none focus-visible:shadow-focus",
 			"[&_svg]:size-3.5 [&_svg]:text-foreground"
 		],
@@ -2358,7 +2540,7 @@ const messageFooter = tv$1({
 			"transition-colors [&_svg]:shrink-0",
 			"h-6 gap-1 rounded-chip border-0 px-2 shadow-none",
 			"text-footnote font-bold text-foreground-muted",
-			"bg-fill-muted hover:press-overlay active:press-overlay",
+			"bg-fill-muted hover:overlay-medium active:overlay-medium",
 			"[&_svg]:size-3.5"
 		],
 		badgeSeparator: ["text-foreground/45"]
@@ -2455,7 +2637,7 @@ const messageReaction = tv$1({ slots: {
 		"inline-flex min-w-0 max-w-full items-center overflow-hidden whitespace-nowrap",
 		"transition-colors",
 		"h-6 gap-1 rounded-chip pr-2 pl-1.5 text-callout text-foreground",
-		"bg-fill-muted hover:press-overlay active:press-overlay",
+		"bg-fill-muted hover:overlay-medium active:overlay-medium",
 		"data-pressed:bg-attention-soft",
 		"has-data-[slot=message-reaction-error-indicator]:bg-warning-soft",
 		"outline-none focus-visible:shadow-focus",
@@ -2469,18 +2651,18 @@ const messageReaction = tv$1({ slots: {
 		"transition-colors",
 		"[&_svg]:shrink-0",
 		"h-6 rounded-chip px-1.5 [&_svg]:size-4",
-		"bg-fill-muted text-foreground-muted hover:press-overlay active:press-overlay",
+		"bg-fill-muted text-foreground-muted hover:overlay-medium active:overlay-medium",
 		"outline-none focus-visible:shadow-focus"
 	],
 	quickRow: [
 		"flex shrink-0 items-center",
-		"justify-between gap-0.5 bg-layer-popover px-0.5 py-0.5",
+		"justify-between gap-0.5 bg-layer-popover p-0",
 		"[&>[role=menuitem]]:size-9 [&>[role=menuitem]]:p-0 *:[[role=menuitem]]:justify-center"
 	],
 	quickButton: [
 		"flex items-center justify-center",
 		"bg-transparent transition-colors",
-		"size-9 rounded-control p-0 text-xl leading-none text-foreground-muted",
+		"size-9 rounded-chip p-0 text-xl leading-none text-foreground-muted",
 		"hover:bg-brand-soft data-highlighted:bg-brand-soft active:bg-brand-soft",
 		"outline-none focus-visible:shadow-focus"
 	],
@@ -2688,7 +2870,7 @@ const chip = (fill) => [
 	"[&_svg]:size-3.5 [&_svg]:text-foreground-muted",
 	fill
 ];
-const linkChip = (fill) => [...chip(fill), "text-foreground cursor-pointer hover:press-overlay active:press-overlay"];
+const linkChip = (fill) => [...chip(fill), "text-foreground cursor-pointer hover:overlay-medium active:overlay-medium"];
 const messageReference = tv$1({
 	slots: {
 		root: [
@@ -2710,7 +2892,7 @@ const messageReference = tv$1({
 			"inline-flex cursor-pointer rounded-sticker px-[3px]",
 			"font-semibold text-sticker-ink no-underline",
 			"bg-brand inset-ring-[1.5px] inset-ring-sticker-ink ring-[1.5px] ring-sticker-edge",
-			"hover:press-overlay-sticker"
+			"hover:overlay-sticker-medium active:overlay-sticker-medium"
 		] },
 		secondary: { root: ["inline cursor-pointer font-bold text-foreground", "decoration-foreground decoration-[1.5px] underline-offset-[3px] hover:underline"] },
 		accent: { root: linkChip("bg-attention-soft") },
@@ -2780,9 +2962,14 @@ const messageMultiSelect = tv$1({ slots: {
 	],
 	toolbar: [
 		"flex items-center",
-		"gap-2 rounded-container px-2.5 py-2",
+		"gap-2 rounded-container py-1 pr-1 pl-2.5",
+		"**:data-[slot=button]:h-7 **:data-[slot=button]:w-auto **:data-[slot=button]:min-w-7",
+		"**:data-[slot=button]:rounded-chip",
+		"**:data-[slot=button]:after:inset-x-[-3px] **:data-[slot=button]:first:after:left-[-9.5px] **:data-[slot=button]:last:after:right-[-9.5px]",
+		"pointer-coarse:**:data-[slot=button]:after:inset-y-[-9.5px]",
 		"bg-layer-popover ring-1 ring-line-seam shadow-float"
-	]
+	],
+	toolbarActions: ["flex min-w-0 flex-1 flex-wrap items-center justify-end", "gap-1"]
 } });
 //#endregion
 //#region src/components/message-item/message-multi-select.tsx
@@ -2807,6 +2994,17 @@ function MessageMultiSelectToolbar({ className, render, ...props }) {
 		state: { slot: "message-multi-select-toolbar" }
 	});
 }
+/** The toolbar's actions, at its end, 4px apart like every floating toolbar's buttons. */
+function MessageMultiSelectToolbarActions({ className, render, ...props }) {
+	const { toolbarActions } = messageMultiSelect();
+	const defaultProps = { className: toolbarActions({ className }) };
+	return useRender({
+		defaultTagName: "div",
+		render,
+		props: mergeProps(defaultProps, props),
+		state: { slot: "message-multi-select-toolbar-actions" }
+	});
+}
 function MessageMultiSelectCheckbox({ className, ...props }) {
 	const { checkbox } = messageMultiSelect();
 	return /* @__PURE__ */ jsx(Checkbox$1, {
@@ -2821,17 +3019,17 @@ function MessageMultiSelectCheckbox({ className, ...props }) {
 const messageTextSelectionToolbar = tv$1({ slots: {
 	toolbar: [
 		"flex min-w-0 items-center select-none",
-		"gap-0.5 overflow-visible rounded-container p-0.5 text-control font-bold",
+		"gap-1 overflow-visible rounded-container p-1 text-control font-bold",
 		"bg-layer-popover ring-1 ring-line-seam ring-inset shadow-float"
 	],
 	button: [
 		"flex shrink-0 items-center gap-1.5 outline-none transition-colors",
-		"h-7 rounded-control px-2.5 whitespace-nowrap text-foreground",
-		"hover:bg-fill-pressed active:bg-fill-pressed",
+		"h-7 rounded-chip px-2.5 whitespace-nowrap text-foreground",
+		"hover:bg-fill-medium active:bg-fill-medium",
 		"focus-visible:shadow-focus",
 		"[&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-foreground-muted"
 	],
-	separator: ["w-px shrink-0", "mx-0.5 h-5 bg-line-hairline"]
+	separator: ["w-px shrink-0", "h-5 bg-line-hairline"]
 } });
 //#endregion
 //#region src/components/message-item/message-text-selection-toolbar.tsx
@@ -3091,10 +3289,15 @@ const messageList = tv$1({
 		root: ["relative h-full min-h-0"],
 		viewport: ["min-w-0 overscroll-none"],
 		content: ["flex min-h-full w-full min-w-0 flex-col"],
-		dateDividerRoot: ["flex select-none items-center", "gap-2 px-4 py-3"],
+		dateDividerRoot: [
+			"flex select-none items-center",
+			"gap-2 px-4",
+			"pt-[calc(var(--spacing-timeline-section)-var(--spacing-timeline-row)-var(--text-mono-meta--line-height)/2)]",
+			"pb-[calc(var(--spacing-timeline-section)-var(--spacing-timeline-lead)-var(--text-mono-meta--line-height)/2)]"
+		],
 		dateDividerRule: ["flex-1", "min-w-3 border-t border-line-hairline"],
 		dateDividerChip: ["inline-flex items-center", "font-mono text-mono-meta whitespace-nowrap text-foreground-hint"],
-		notice: ["text-center", "pb-2 font-mono text-mono-meta"],
+		notice: ["text-center", "pt-timeline-lead pb-timeline-row font-mono text-mono-meta"],
 		historyLimited: [
 			"inline-flex items-center",
 			"h-[22px] gap-1 rounded-chip px-1.5",
@@ -3383,4 +3586,4 @@ function useMouseOnlyPointerSensor(distance) {
 	return useSensor(MouseOnlyPointerSensor, options);
 }
 //#endregion
-export { MessageReactionTooltipMeta as $, ThemeStateContext as $n, DropdownMenuRadioItem as $t, messageEmbed as A, Badge as An, MessageItemContinuationTime as At, MessageReferencePending as B, DialogPortal as Bn, useOverflowTitle as Bt, MessageQuotedPreviewThread as C, CheckboxIndicator as Cn, MessageItemBody as Ct, MessageEmbedContent as D, TooltipPortal as Dn, MessageItemFooter as Dt, MessageEmbed as E, TooltipContent as En, MessageItemEmbedded as Et, MessageMultiSelectCheckbox as F, DialogDescription as Fn, AvatarBadge as Ft, MessageReactionCount as G, buttonVariants as Gn, DropdownMenuFooter as Gt, MessageReferenceUnavailable as H, DialogTitle as Hn, DropdownMenuCheckboxItem as Ht, MessageMultiSelectToolbar as I, DialogFooter as In, AvatarFallback as It, MessageReactionPickerContent as J, useParentOverlayKind as Jn, DropdownMenuItemLabel as Jt, MessageReactionErrorIndicator as K, Spinner as Kn, DropdownMenuItem as Kt, MessageReferenceChip as L, DialogHeader as Ln, AvatarGroup as Lt, MessageTextSelectionToolbarButton as M, DialogBody as Mn, MessageItem as Mt, MessageTextSelectionToolbarSeparator as N, DialogClose as Nn, searchHit as Nt, MessageEmbedFooter as O, TooltipProvider as On, MessageItemSearchMatch as Ot, MessageMultiSelect as P, DialogContent as Pn, Avatar$1 as Pt, MessageReactionTooltipContent as Q, useTheme as Qn, DropdownMenuRadioGroup as Qt, MessageReferenceIndicator as R, DialogNav as Rn, AvatarGroupCount as Rt, MessageQuotedPreviewText as S, Checkbox$1 as Sn, MessageItemAttachments as St, MessageQuotedPreviewUnavailable as T, Tooltip$1 as Tn, MessageItemEdited as Tt, MessageReactionAddButton as U, DialogTrigger as Un, DropdownMenuCheckboxItemIndicator as Ut, MessageReferenceText as V, DialogSurface as Vn, DropdownMenu as Vt, MessageReactionChip as W, Button$1 as Wn, DropdownMenuContent as Wt, MessageReactionQuickButton as X, resolveThemeScopeProps as Xn, DropdownMenuPopup as Xt, MessageReactionPickerStatic as Y, withOverlayLayer as Yn, DropdownMenuLabel as Yt, MessageReactionQuickRow as Z, useThemeScopeProps as Zn, DropdownMenuPortal as Zt, MessageQuotedPreviewAuthorName as _, ScrollAreaCorner as _n, MessageItemSender as _t, MessageListJumpPillDismiss as a, DropdownMenuTrigger as an, MessageItemBadgeSeparator as at, MessageQuotedPreviewHeader as b, ScrollAreaViewport as bn, MessageItemSenderGroup as bt, MessageListHistoryLimited as c, Panel as cn, MessageItemToolbar as ct, MessageQuotedPreview as d, PanelHeaderRoot as dn, MessageItemDelegatedBy as dt, DropdownMenuRadioItemIndicator as en, tv$1 as er, MessageReactionTooltipName as et, MessageQuotedPreviewAttachment as f, PanelScrollContent as fn, MessageItemDelegatedByButton as ft, MessageQuotedPreviewAuthorMeta as g, ScrollAreaContent as gn, MessageItemMeta as gt, MessageQuotedPreviewAuthorDelegatedBy as h, ScrollArea$1 as hn, MessageItemInlineStatus as ht, MessageListJumpPill as i, DropdownMenuSubmenuTrigger as in, MessageItemBadge as it, MessageTextSelectionToolbar as j, Dialog$1 as jn, MessageItemGutter as jt, MessageEmbedHeader as k, TooltipTrigger as kn, MessageItemAvatarSlot as kt, MessageListNotice as l, PanelBody as ln, MessageItemToolbarButton as lt, MessageQuotedPreviewAuthor as m, PanelSection as mn, MessageItemHeader as mt, useMouseOnlyPointerSensor as n, DropdownMenuShortcut as nn, headEdgePull as nr, MessageReactionTooltipNames as nt, MessageListJumpPillGroup as o, Kbd as on, MessageItemReadReceipt as ot, MessageQuotedPreviewAttachments as p, PanelScrollViewport as pn, MessageItemDelegatedByName as pt, MessageReactionGlyph as q, defaultNativeButton as qn, DropdownMenuItemCount as qt, MessageListJumpControls as r, DropdownMenuSubmenu as rn, headEdges as rr, MessageReactionTooltipSeparator as rt, MessageListDateDivider as s, KbdGroup as sn, MessageItemSavedIndicator as st, useHoldThenMoveTouchSensor as t, DropdownMenuSeparator as tn, controlIconInset as tr, MessageReactionTooltipNameText as tt, MessageList as u, PanelFooter as un, MessageItemDelegatedAvatar as ut, MessageQuotedPreviewChannel as v, ScrollAreaScrollbar as vn, MessageItemSenderBadges as vt, MessageQuotedPreviewTimestamp as w, PRESENCE_COLOR as wn, MessageItemContent as wt, MessageQuotedPreviewLoading as x, useMobileViewport as xn, MessageItemTime as xt, MessageQuotedPreviewContent as y, ScrollAreaThumb as yn, MessageItemSenderButton as yt, MessageReferenceLabel as z, DialogOverlay as zn, AvatarImage as zt };
+export { MessageReactionTooltipContent as $, Spinner as $n, DropdownMenuItemLabel as $t, messageEmbed as A, Tooltip$1 as An, MessageItemAvatarSlot as At, MessageReferenceLabel as B, DialogClose as Bn, AvatarImage as Bt, MessageQuotedPreviewThread as C, ScrollAreaScrollbar as Cn, MessageItemAttachments as Ct, MessageEmbedContent as D, Checkbox$1 as Dn, MessageItemEmbedded as Dt, MessageEmbed as E, useMobileViewport as En, MessageItemEdited as Et, MessageMultiSelectCheckbox as F, TextLink as Fn, Avatar$1 as Ft, MessageReactionChip as G, DialogNav as Gn, readNow as Gt, MessageReferenceText as H, DialogDescription as Hn, measureContent as Ht, MessageMultiSelectToolbar as I, textLinkVariants as In, AvatarBadge as It, MessageReactionGlyph as J, DialogSurface as Jn, DropdownMenuCheckboxItemIndicator as Jt, MessageReactionCount as K, DialogOverlay as Kn, DropdownMenu as Kt, MessageMultiSelectToolbarActions as L, Badge as Ln, AvatarFallback as Lt, MessageTextSelectionToolbarButton as M, TooltipPortal as Mn, MessageItemGutter as Mt, MessageTextSelectionToolbarSeparator as N, TooltipProvider as Nn, MessageItem as Nt, MessageEmbedFooter as O, CheckboxIndicator as On, MessageItemFooter as Ot, MessageMultiSelect as P, TooltipTrigger as Pn, searchHit as Pt, MessageReactionQuickRow as Q, buttonVariants as Qn, DropdownMenuItemCount as Qt, MessageReferenceChip as R, Dialog$1 as Rn, AvatarGroup as Rt, MessageQuotedPreviewText as S, ScrollAreaCorner as Sn, MessageItemTime as St, MessageQuotedPreviewUnavailable as T, ScrollAreaViewport as Tn, MessageItemContent as Tt, MessageReferenceUnavailable as U, DialogFooter as Un, measureElement as Ut, MessageReferencePending as V, DialogContent as Vn, useOverflowTitle as Vt, MessageReactionAddButton as W, DialogHeader as Wn, observeTruncation as Wt, MessageReactionPickerStatic as X, DialogTrigger as Xn, DropdownMenuFooter as Xt, MessageReactionPickerContent as Y, DialogTitle as Yn, DropdownMenuContent as Yt, MessageReactionQuickButton as Z, Button$1 as Zn, DropdownMenuItem as Zt, MessageQuotedPreviewAuthorName as _, PanelScrollContent as _n, MessageItemMeta as _t, MessageListJumpPillDismiss as a, DropdownMenuRadioItemIndicator as an, useTheme as ar, MessageItemBadge as at, MessageQuotedPreviewHeader as b, ScrollArea$1 as bn, MessageItemSenderButton as bt, MessageListHistoryLimited as c, DropdownMenuSubmenu as cn, controlIconInset as cr, MessageItemSavedIndicator as ct, MessageQuotedPreview as d, Kbd as dn, decisionWidth as dr, MessageItemDelegatedAvatar as dt, DropdownMenuLabel as en, defaultNativeButton as er, MessageReactionTooltipMeta as et, MessageQuotedPreviewAttachment as f, KbdGroup as fn, MessageItemDelegatedBy as ft, MessageQuotedPreviewAuthorMeta as g, PanelHeaderRoot as gn, MessageItemInlineStatus as gt, MessageQuotedPreviewAuthorDelegatedBy as h, PanelFooter as hn, MessageItemHeader as ht, MessageListJumpPill as i, DropdownMenuRadioItem as in, useThemeScopeProps as ir, MessageReactionTooltipSeparator as it, MessageTextSelectionToolbar as j, TooltipContent as jn, MessageItemContinuationTime as jt, MessageEmbedHeader as k, PRESENCE_COLOR as kn, MessageItemSearchMatch as kt, MessageListNotice as l, DropdownMenuSubmenuTrigger as ln, headEdgePull as lr, MessageItemToolbar as lt, MessageQuotedPreviewAuthor as m, PanelBody as mn, MessageItemDelegatedByName as mt, useMouseOnlyPointerSensor as n, DropdownMenuPortal as nn, withOverlayLayer as nr, MessageReactionTooltipNameText as nt, MessageListJumpPillGroup as o, DropdownMenuSeparator as on, ThemeStateContext as or, MessageItemBadgeSeparator as ot, MessageQuotedPreviewAttachments as p, Panel as pn, MessageItemDelegatedByButton as pt, MessageReactionErrorIndicator as q, DialogPortal as qn, DropdownMenuCheckboxItem as qt, MessageListJumpControls as r, DropdownMenuRadioGroup as rn, resolveThemeScopeProps as rr, MessageReactionTooltipNames as rt, MessageListDateDivider as s, DropdownMenuShortcut as sn, tv$1 as sr, MessageItemReadReceipt as st, useHoldThenMoveTouchSensor as t, DropdownMenuPopup as tn, useParentOverlayKind as tr, MessageReactionTooltipName as tt, MessageList as u, DropdownMenuTrigger as un, headEdges as ur, MessageItemToolbarButton as ut, MessageQuotedPreviewChannel as v, PanelScrollViewport as vn, MessageItemSender as vt, MessageQuotedPreviewTimestamp as w, ScrollAreaThumb as wn, MessageItemBody as wt, MessageQuotedPreviewLoading as x, ScrollAreaContent as xn, MessageItemSenderGroup as xt, MessageQuotedPreviewContent as y, PanelSection as yn, MessageItemSenderBadges as yt, MessageReferenceIndicator as z, DialogBody as zn, AvatarGroupCount as zt };