@stll/ui 0.66.0 → 0.68.0

package/dist/calendar/day-calendar.js

@@ -1,7 +1,7 @@
-import { cn } from "../lib/utils.js";
 import { Tooltip, TooltipContent as TooltipPopup, TooltipTrigger } from "../components/tooltip.js";
-import { DAY_CALENDAR_SLOT_HEIGHT_PX, boundsHeight, extendRange, getDayBounds, getHourTicks, isRepeatedWallTime, layoutOverlaps, moveRange, offsetToTime, rangeFromDrag, slotAt, timeToOffset } from "./day-calendar.logic.js";
 import { getMatterColor, resolveMatterColor } from "../lib/matter-colors.js";
+import { cn } from "../lib/utils.js";
+import { DAY_CALENDAR_SLOT_HEIGHT_PX, boundsHeight, extendRange, getDayBounds, getHourTicks, isRepeatedWallTime, layoutOverlaps, moveRange, offsetToTime, rangeFromDrag, slotAt, timeToOffset } from "./day-calendar.logic.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { panic } from "better-result";

package/dist/components/alert-dialog.js

@@ -1,7 +1,7 @@
 "use client";
-import { cn } from "../lib/utils.js";
 import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
 import { SAFE_AREA_OVERLAY_GUTTER_CLASS_NAME } from "../lib/safe-area.js";
+import { cn } from "../lib/utils.js";
 import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";

package/dist/components/animated-preview.js

@@ -1,7 +1,7 @@
 "use client";
+import { usePrefersReducedMotion } from "../hooks/use-prefers-reduced-motion.js";
 import { cn } from "../lib/utils.js";
 import { HoverCard as PreviewCard, HoverCardContent as PreviewCardPopup, HoverCardTrigger as PreviewCardTrigger } from "./preview-card.js";
-import { usePrefersReducedMotion } from "../hooks/use-prefers-reduced-motion.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React$1 from "react";
 // src/components/animated-preview.tsx

package/dist/components/application-rail.js

@@ -1,5 +1,5 @@
-import { cn } from "../lib/utils.js";
 import { TOOLBAR_ROW_HEIGHT } from "../inspector/layout-tokens.js";
+import { cn } from "../lib/utils.js";
 import { jsx } from "react/jsx-runtime";
 // src/components/application-rail.tsx
 const APPLICATION_RAIL_WIDTH = "w-12";

package/dist/components/button.js

@@ -1,11 +1,11 @@
 "use client";
-import { cn } from "../lib/utils.js";
-import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
 import { BUTTON_DISPOSITION, blockDisabledActivation, blockDisabledKeyActivation, resolveButtonDisposition } from "../lib/button-disposition.js";
 import { MENU_ROW_CLASS_NAME } from "../lib/menu-row.js";
 import { rendersNothing } from "../lib/renders-nothing.js";
+import { cn } from "../lib/utils.js";
 import { BUTTON_PLAIN_VARIANT, BUTTON_VARIANT_TOKENS } from "./button.shared.js";
 import { Loader } from "./loader.js";
+import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Fragment as Fragment$1, isValidElement } from "react";
 import { mergeProps } from "@base-ui/react/merge-props";

package/dist/components/checkbox.js

@@ -4,11 +4,11 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Checkbox as Checkbox$1 } from "@base-ui/react/checkbox";
 // src/components/checkbox.tsx
 const Checkbox = ({ className, ...props }) => /* @__PURE__ */ jsx(Checkbox$1.Root, {
-	className: cn("border-input bg-background ring-ring focus-visible:ring-offset-background aria-invalid:border-destructive/36 focus-visible:aria-invalid:border-destructive/64 focus-visible:aria-invalid:ring-destructive/48 dark:not-data-checked:bg-input/32 dark:aria-invalid:ring-destructive/24 relative inline-flex size-4.5 shrink-0 items-center justify-center rounded-[4px] border shadow-xs/5 outline-none not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[3px] not-data-disabled:not-data-checked:not-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] focus-visible:ring-2 focus-visible:ring-offset-1 data-disabled:opacity-64 sm:size-4 dark:not-data-disabled:not-data-checked:not-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] [[data-disabled],[data-checked],[aria-invalid]]:shadow-none", className),
+	className: cn("border-input bg-background ring-ring focus-visible:ring-offset-background aria-invalid:border-destructive/36 focus-visible:aria-invalid:border-destructive/64 focus-visible:aria-invalid:ring-destructive/48 dark:not-data-checked:bg-input/32 dark:aria-invalid:ring-destructive/24 relative inline-flex size-4.5 shrink-0 items-center justify-center rounded-sm border shadow-xs/5 outline-none not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-sm)-1px)] not-data-disabled:not-data-checked:not-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] focus-visible:ring-2 focus-visible:ring-offset-1 data-disabled:opacity-64 sm:size-4 dark:not-data-disabled:not-data-checked:not-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] [[data-disabled],[data-checked],[aria-invalid]]:shadow-none", className),
 	"data-slot": "checkbox",
 	...props,
 	children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, {
-		className: "text-primary-foreground data-checked:bg-primary data-indeterminate:text-foreground absolute -inset-px flex items-center justify-center rounded-[4px] data-unchecked:hidden",
+		className: "text-primary-foreground data-checked:bg-primary data-indeterminate:text-foreground absolute -inset-px flex items-center justify-center rounded-sm data-unchecked:hidden",
 		"data-slot": "checkbox-indicator",
 		render: (indicatorProps, state) => /* @__PURE__ */ jsx("span", {
 			...indicatorProps,

package/dist/components/color-picker.js

@@ -1,7 +1,7 @@
 "use client";
 import { CheckIcon, ChevronDownIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
 import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
+import { cn } from "../lib/utils.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Suspense, lazy, useState } from "react";
 import { Popover } from "@base-ui/react/popover";
@@ -152,7 +152,7 @@ const CustomColorControls = ({ handleInputChange, handlePickerChange, inputHex,
 		}),
 		/* @__PURE__ */ jsx("input", {
 			"aria-label": "Custom hex color",
-			className: "border-input bg-background text-foreground text-2xs h-6 flex-1 rounded border px-1.5 font-mono outline-none",
+			className: "border-input bg-background text-foreground text-2xs h-6 flex-1 rounded-sm border px-1.5 font-mono outline-none",
 			dir: "ltr",
 			maxLength: 6,
 			onChange: (event) => handleInputChange(event.target.value),
@@ -165,7 +165,7 @@ const CustomColorControls = ({ handleInputChange, handlePickerChange, inputHex,
 			value: inputHex
 		}),
 		isValidHex(inputHex) && /* @__PURE__ */ jsx("span", {
-			className: "border-border size-6 shrink-0 rounded border",
+			className: "border-border size-6 shrink-0 rounded-sm border",
 			style: { backgroundColor: `#${inputHex}` }
 		})
 	]
@@ -248,7 +248,7 @@ const ColorPickerContent = ({ value, onSelect, onClear, presets, columns, defaul
 			onClear && /* @__PURE__ */ jsxs(Popover.Close, {
 				render: /* @__PURE__ */ jsx("button", {
 					"aria-label": "No color",
-					className: "text-muted-foreground hover:bg-accent hover:text-accent-foreground text-2xs flex h-6 w-full items-center gap-1.5 rounded px-1",
+					className: "text-muted-foreground hover:bg-accent hover:text-accent-foreground text-2xs flex h-6 w-full items-center gap-1.5 rounded-sm px-1",
 					onClick: onClear,
 					type: "button"
 				}),

package/dist/components/combobox.js

@@ -1,12 +1,12 @@
 "use client";
-import { ChevronsUpDownIcon, XIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
-import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
-import { ScrollArea } from "./scroll-area.js";
 import { containedHandler } from "../hooks/use-contained-handler.js";
+import { ChevronsUpDownIcon, XIcon } from "../icons.js";
 import { CONTROL_SIZE } from "../lib/control-size.js";
 import "../lib/field-trigger.js";
+import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
+import { cn } from "../lib/utils.js";
 import { Input } from "./input.js";
+import { ScrollArea } from "./scroll-area.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React$1 from "react";
 import { Combobox as Combobox$1 } from "@base-ui/react/combobox";

package/dist/components/command.js

@@ -1,9 +1,9 @@
 "use client";
+import { useContentDir } from "../hooks/use-content-dir.js";
 import { SearchIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
-import { MENU_ROW_CLASS_NAME } from "../lib/menu-row.js";
 import { CONTROL_SIZE } from "../lib/control-size.js";
-import { useContentDir } from "../hooks/use-content-dir.js";
+import { MENU_ROW_CLASS_NAME } from "../lib/menu-row.js";
+import { cn } from "../lib/utils.js";
 import { DialogContent as DialogPopup } from "./dialog.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Dialog } from "@base-ui/react/dialog";

package/dist/components/composer.js

@@ -1,8 +1,8 @@
 "use client";
 import { ChevronDownIcon } from "../icons.js";
 import { cn } from "../lib/utils.js";
-import { DropdownMenu as Menu, DropdownMenuContent as MenuPopup, DropdownMenuRadioGroup as MenuRadioGroup, DropdownMenuRadioItem as MenuRadioItem, DropdownMenuTrigger as MenuTrigger } from "./menu.js";
 import { COMPOSER_BOX_ANONYMIZED_CLASS, COMPOSER_BOX_CLASS, COMPOSER_BOX_FOCUS_CLASS, COMPOSER_COMPACT_ROW_CLASS, COMPOSER_COMPACT_TEXT_CELL_CLASS, COMPOSER_CONTROL_BUTTON_SIZE, COMPOSER_LARGE_ACTION_ROW_CLASS, COMPOSER_LARGE_EDITOR_CLASS, COMPOSER_LARGE_TEXT_WELL_CLASS, COMPOSER_LEADING_GROUP_CLASS, COMPOSER_PICKER_TRIGGER_CLASS, COMPOSER_PLACEHOLDER_CLASS, COMPOSER_SEND_BUTTON_CLASS, COMPOSER_TEXT_CLASS } from "./composer-tokens.js";
+import { DropdownMenu as Menu, DropdownMenuContent as MenuPopup, DropdownMenuRadioGroup as MenuRadioGroup, DropdownMenuRadioItem as MenuRadioItem, DropdownMenuTrigger as MenuTrigger } from "./menu.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 // src/components/composer.tsx
 /**

package/dist/components/context-menu.d.ts

@@ -31,4 +31,13 @@ export type ContextMenuProps = {
  * Renders only the children when `actions` is empty so callers can
  * pass conditionally.
  */
-export declare const ContextMenu: ({ actions, children }: ContextMenuProps) => ReactNode;
+export declare const ContextMenu: ({ actions, children }: ContextMenuProps) => ReactNode;
+/**
+ * The items of one action list, inside a menu popup. `ContextMenu` and
+ * `EntityActions` (`@stll/ui/entity-actions`) both render their lists
+ * through it, so a right-click menu and an object's "…" menu built from
+ * the same list hold the same items.
+ */
+export declare const ContextMenuActionItems: ({ actions }: {
+  actions: readonly ContextMenuAction[];
+}) => import("react").JSX.Element;

package/dist/components/context-menu.js

@@ -23,9 +23,16 @@ const ContextMenu = ({ actions, children }) => {
 		children
 	}), /* @__PURE__ */ jsx(MenuPopup, {
 		"data-slot": "context-menu-popup",
-		children: actions.map((action) => /* @__PURE__ */ jsx(ContextMenuActionItem, { action }, action.label))
+		children: /* @__PURE__ */ jsx(ContextMenuActionItems, { actions })
 	})] });
 };
+/**
+* The items of one action list, inside a menu popup. `ContextMenu` and
+* `EntityActions` (`@stll/ui/entity-actions`) both render their lists
+* through it, so a right-click menu and an object's "…" menu built from
+* the same list hold the same items.
+*/
+const ContextMenuActionItems = ({ actions }) => /* @__PURE__ */ jsx(Fragment, { children: actions.map((action) => /* @__PURE__ */ jsx(ContextMenuActionItem, { action }, action.label)) });
 const ContextMenuActionItem = ({ action }) => {
 	const separator = action.separatorBefore ? /* @__PURE__ */ jsx(MenuSeparator, {}) : null;
 	if (action.submenu) return /* @__PURE__ */ jsxs(Fragment, { children: [separator, /* @__PURE__ */ jsxs(MenuSub, { children: [/* @__PURE__ */ jsxs(MenuSubTrigger, { children: [action.icon, action.label] }), /* @__PURE__ */ jsx(MenuSubPopup, { children: action.submenu.map((sub) => /* @__PURE__ */ jsx(ContextMenuActionItem, { action: sub }, sub.label)) })] })] });
@@ -44,4 +51,4 @@ const ContextMenuActionItem = ({ action }) => {
 		children: [action.icon, action.label]
 	})] });
 };
-export { ContextMenu };
+export { ContextMenu, ContextMenuActionItems };

package/dist/components/court-filter.js

@@ -2,10 +2,10 @@
 import { ChevronRightIcon } from "../icons.js";
 import { cn } from "../lib/utils.js";
 import { BidiText } from "./bidi-text.js";
-import { ScrollArea } from "./scroll-area.js";
-import { DirectionalIcon } from "./directional-icon.js";
 import { Checkbox } from "./checkbox.js";
+import { DirectionalIcon } from "./directional-icon.js";
 import { Field, FieldLabel } from "./field.js";
+import { ScrollArea } from "./scroll-area.js";
 import { SearchField } from "./search-field.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useId, useState } from "react";

package/dist/components/date-picker-popover.js

@@ -1,12 +1,12 @@
 "use client";
 import { CalendarIcon, ChevronLeftIcon, ChevronRightIcon } from "../icons.js";
+import { FIELD_TRIGGER_CLASS_NAME } from "../lib/field-trigger.js";
 import { cn } from "../lib/utils.js";
+import { getLocaleWeekInfo, getWeekendDays } from "../lib/week.js";
 import { Button } from "./button.js";
+import { DATE_PICKER_MODE, formatDateTimeValue, joinPickerTime, localDateFromTimestamp, millisecondsUntilNextLocalDate, parseDateTimeValue, resolveCalendarViewMonth, shiftCalendarDate } from "./date-picker-popover.logic.js";
 import { DirectionalIcon } from "./directional-icon.js";
-import { FIELD_TRIGGER_CLASS_NAME } from "../lib/field-trigger.js";
 import { Input } from "./input.js";
-import { getLocaleWeekInfo, getWeekendDays } from "../lib/week.js";
-import { DATE_PICKER_MODE, formatDateTimeValue, joinPickerTime, localDateFromTimestamp, millisecondsUntilNextLocalDate, parseDateTimeValue, resolveCalendarViewMonth, shiftCalendarDate } from "./date-picker-popover.logic.js";
 import { Popover, PopoverContent as PopoverPopup, PopoverTrigger } from "./popover.js";
 import { TimeField } from "./time-field.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/destructive-action-confirmation.js

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../lib/utils.js";
-import { Input } from "./input.js";
 import { Field, FieldDescription, FieldLabel } from "./field.js";
+import { Input } from "./input.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React$1 from "react";
 // src/components/destructive-action-confirmation.tsx

package/dist/components/details-grid.js

@@ -1,5 +1,5 @@
-import { cn } from "../lib/utils.js";
 import { rendersNothing } from "../lib/renders-nothing.js";
+import { cn } from "../lib/utils.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { createContext, useContext } from "react";
 // src/components/details-grid.tsx

package/dist/components/dialog.js

@@ -1,12 +1,12 @@
 "use client";
 import { XIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
 import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
 import { SAFE_AREA_OVERLAY_GUTTER_CLASS_NAME } from "../lib/safe-area.js";
-import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
+import { cn } from "../lib/utils.js";
 import { Button } from "./button.js";
-import { ScrollArea } from "./scroll-area.js";
 import { DialogFormContext, DialogFormState } from "./dialog-form-state.js";
+import { ScrollArea } from "./scroll-area.js";
+import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { createContext, useContext, useRef, useState } from "react";
 import { Dialog as Dialog$1 } from "@base-ui/react/dialog";

package/dist/components/document-identity-badge.js

@@ -1,8 +1,8 @@
 import { FileTextIcon } from "../icons.js";
 import { cn } from "../lib/utils.js";
-import { Tooltip, TooltipContent as TooltipPopup, TooltipTrigger } from "./tooltip.js";
 import { CourtBadge } from "./court-badge.js";
 import { COURT_TIER_WEIGHT, caseNumberIdentityLabels, statuteIdentityLabels } from "./document-identity-badge.logic.js";
+import { Tooltip, TooltipContent as TooltipPopup, TooltipTrigger } from "./tooltip.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { panic } from "better-result";
 // src/components/document-identity-badge.tsx

package/dist/components/entity-actions.d.ts

@@ -0,0 +1,34 @@
+import { ContextMenuAction } from "./context-menu.js";
+import { ReactNode, Ref } from "react";
+/** One action of an object: the same shape `ContextMenu` renders. */
+export type EntityAction = ContextMenuAction;
+export type EntityActionsProps = {
+  /** The object's actions, in menu order. An empty list still owns the
+   *  object's right-click: the native menu stays, never a parent's menu. */
+  actions: readonly EntityAction[];
+  /** The object, which becomes the right-click target. It may render an
+   *  `EntityActionsButton` anywhere inside. */
+  children: ReactNode;
+  /** A line above the actions in both menus, such as when a message was
+   *  sent. It is a label, not an action. */
+  heading?: ReactNode;
+  /** The accessible name of the "…" button, e.g. "Actions". */
+  label: string;
+};
+/**
+ * An object's actions: the right-click menu over `children`, and the list
+ * an `EntityActionsButton` inside them opens.
+ */
+export declare const EntityActions: ({ actions, children, heading, label }: EntityActionsProps) => import("react").JSX.Element;
+export type EntityActionsButtonProps = {
+  /** Popup alignment against the button. */
+  align?: "center" | "end" | "start";
+  ref?: Ref<HTMLButtonElement>;
+  /** Popup side against the button. */
+  side?: "bottom" | "left" | "right" | "top";
+};
+/**
+ * The "…" button of the `EntityActions` around it. It opens the same list
+ * right-click opens, and renders nothing when the object has no actions.
+ */
+export declare const EntityActionsButton: ({ align, ref, side }: EntityActionsButtonProps) => import("react").JSX.Element | null;

package/dist/components/entity-actions.js

@@ -0,0 +1,132 @@
+"use client";
+import { EllipsisIcon } from "../icons.js";
+import { nativeContextMenuReason } from "../lib/native-context-menu.js";
+import { Button } from "./button.js";
+import { ContextMenuActionItems } from "./context-menu.js";
+import { DropdownMenu as Menu, DropdownMenuContent as MenuPopup, DropdownMenuGroup as MenuGroup, DropdownMenuLabel as MenuGroupLabel, DropdownMenuSeparator as MenuSeparator, DropdownMenuTrigger as MenuTrigger, MenuAnchor } from "./menu.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { createContext, use, useRef, useState } from "react";
+import { panic } from "better-result";
+// src/components/entity-actions.tsx
+const EntityActionsContext = createContext(null);
+const isContextMenuKey = (event) => event.key === "ContextMenu" || event.shiftKey && event.key === "F10";
+const FOCUSABLE_SELECTOR = "a[href], button, input, select, textarea, [tabindex]:not([tabindex='-1'])";
+/** The control focus returns to when the menu closes, inside the object. */
+const focusReturnTarget = (container, target) => {
+	if (!(target instanceof Element)) return null;
+	const focusable = target.closest(FOCUSABLE_SELECTOR);
+	return focusable !== null && container.contains(focusable) ? focusable : null;
+};
+/**
+* Right-clicks (and context-menu keys) an object already answered for. The
+* innermost object owns the event even when it has no actions and leaves it
+* to the native menu, so the objects around it never open theirs. A marker
+* rather than `stopPropagation`: the native menu, and listeners further up
+* such as the desktop webview's policy, still see the event.
+*/
+const ownedEvents = /* @__PURE__ */ new WeakSet();
+/** Claims the event for this object; false when an inner object owns it. */
+const claimEvent = (event) => {
+	if (ownedEvents.has(event)) return false;
+	ownedEvents.add(event);
+	return true;
+};
+const EntityActionItems = ({ actions, heading }) => /* @__PURE__ */ jsxs(Fragment, { children: [heading !== void 0 && heading !== null && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(MenuGroup, { children: /* @__PURE__ */ jsx(MenuGroupLabel, {
+	className: "font-normal",
+	children: heading
+}) }), /* @__PURE__ */ jsx(MenuSeparator, {})] }), /* @__PURE__ */ jsx(ContextMenuActionItems, { actions })] });
+/**
+* An object's actions: the right-click menu over `children`, and the list
+* an `EntityActionsButton` inside them opens.
+*/
+const EntityActions = ({ actions, children, heading, label }) => {
+	const [open, setOpen] = useState(false);
+	const [anchor, setAnchor] = useState(null);
+	const returnFocus = useRef(null);
+	const context = {
+		actions,
+		heading,
+		label
+	};
+	const hasActions = actions.length > 0;
+	const openAt = (event, anchorRect) => {
+		event.preventDefault();
+		event.stopPropagation();
+		returnFocus.current = focusReturnTarget(event.currentTarget, event.target);
+		setAnchor(anchorRect);
+		setOpen(true);
+	};
+	const handleContextMenu = (event) => {
+		if (event.defaultPrevented || !(event.target instanceof Node) || !event.currentTarget.contains(event.target) || !claimEvent(event.nativeEvent)) return;
+		if (!hasActions || nativeContextMenuReason(event) !== null) return;
+		const { clientX: x, clientY: y } = event;
+		openAt(event, { getBoundingClientRect: () => new DOMRect(x, y, 0, 0) });
+	};
+	const handleKeyDown = (event) => {
+		const target = event.target;
+		if (event.defaultPrevented || !isContextMenuKey(event) || !(target instanceof Element) || !event.currentTarget.contains(target) || !claimEvent(event.nativeEvent)) return;
+		if (!hasActions || nativeContextMenuReason({
+			shiftKey: false,
+			target
+		}) !== null) return;
+		openAt(event, { getBoundingClientRect: () => target.getBoundingClientRect() });
+	};
+	return /* @__PURE__ */ jsxs(EntityActionsContext, {
+		value: context,
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "contents",
+			"data-context-menu-target": "",
+			"data-slot": "entity-actions",
+			onContextMenu: handleContextMenu,
+			onKeyDown: handleKeyDown,
+			role: "presentation",
+			children
+		}), hasActions && /* @__PURE__ */ jsxs(Menu, {
+			onOpenChange: (nextOpen) => {
+				setOpen(nextOpen);
+				if (!nextOpen) setAnchor(null);
+			},
+			open,
+			children: [/* @__PURE__ */ jsx(MenuAnchor, {}), /* @__PURE__ */ jsx(MenuPopup, {
+				anchor: anchor ?? void 0,
+				"data-slot": "entity-actions-context-popup",
+				finalFocus: () => returnFocus.current ?? false,
+				children: /* @__PURE__ */ jsx(EntityActionItems, {
+					actions,
+					heading
+				})
+			})]
+		})]
+	});
+};
+/**
+* The "…" button of the `EntityActions` around it. It opens the same list
+* right-click opens, and renders nothing when the object has no actions.
+*/
+const EntityActionsButton = ({ align = "end", ref, side = "bottom" }) => {
+	const context = use(EntityActionsContext);
+	if (context === null) panic("EntityActionsButton renders inside EntityActions, which owns the list it opens");
+	if (context.actions.length === 0) return null;
+	return /* @__PURE__ */ jsxs(Menu, { children: [/* @__PURE__ */ jsx(MenuTrigger, {
+		ref,
+		render: /* @__PURE__ */ jsx(Button, {
+			"aria-label": context.label,
+			className: "size-6",
+			size: "icon-xs",
+			variant: "muted",
+			children: /* @__PURE__ */ jsx(EllipsisIcon, {
+				"aria-hidden": "true",
+				className: "size-3.5"
+			})
+		})
+	}), /* @__PURE__ */ jsx(MenuPopup, {
+		align,
+		"data-slot": "entity-actions-button-popup",
+		side,
+		children: /* @__PURE__ */ jsx(EntityActionItems, {
+			actions: context.actions,
+			heading: context.heading
+		})
+	})] });
+};
+export { EntityActions, EntityActionsButton };

package/dist/components/file-input.js

@@ -1,8 +1,8 @@
 "use client";
 import { UploadIcon } from "../icons.js";
+import { openFilePicker } from "../lib/file-picker.js";
 import { cn } from "../lib/utils.js";
 import { Button } from "./button.js";
-import { openFilePicker } from "../lib/file-picker.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useId } from "react";
 // src/components/file-input.tsx

package/dist/components/hex-color-picker.js

@@ -1,7 +1,7 @@
 "use client";
-import { cn } from "../lib/utils.js";
 import { containedHandler } from "../hooks/use-contained-handler.js";
 import { useLatest } from "../hooks/use-latest.js";
+import { cn } from "../lib/utils.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useRef, useState } from "react";
 // src/components/hex-color-picker.tsx

package/dist/components/horizontal-scroller.js

@@ -1,8 +1,8 @@
 "use client";
-import { ChevronLeftIcon, ChevronRightIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
 import { containedEventHandler } from "../hooks/use-contained-handler.js";
+import { ChevronLeftIcon, ChevronRightIcon } from "../icons.js";
 import { SCROLL_EDGE_FADE_CLASS, writeScrollEdgeFade } from "../lib/scroll-edge-fade.js";
+import { cn } from "../lib/utils.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useState } from "react";
 // src/components/horizontal-scroller.tsx

package/dist/components/identity-text.js

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../lib/utils.js";
-import { Tooltip, TooltipContent as TooltipPopup, TooltipTrigger } from "./tooltip.js";
 import { withoutDirectionalControls } from "./bidi-text.js";
+import { Tooltip, TooltipContent as TooltipPopup, TooltipTrigger } from "./tooltip.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useId, useState } from "react";
 // src/components/identity-text.tsx

package/dist/components/inline-rename.js

@@ -1,5 +1,5 @@
-import { cn } from "../lib/utils.js";
 import { contentDir, isStructuredInputType } from "../hooks/use-content-dir.js";
+import { cn } from "../lib/utils.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useImperativeHandle, useRef } from "react";
 import { panic } from "better-result";

package/dist/components/input-group.js

@@ -11,7 +11,7 @@ const InputGroup = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
 	role: "group",
 	...props
 });
-const inputGroupAddonVariants = cva("flex h-auto cursor-text items-center justify-center gap-2 leading-none select-none [&_svg]:-mx-0.5 in-[[data-slot=input-group]:has([data-slot=input-control],[data-slot=textarea-control])]:[&_svg:not([class*='size-'])]:size-4.5 sm:in-[[data-slot=input-group]:has([data-slot=input-control],[data-slot=textarea-control])]:[&_svg:not([class*='size-'])]:size-4 not-has-[button]:**:[svg:not([class*='opacity-'])]:opacity-80 [&>kbd]:rounded-[calc(var(--radius)-5px)]", {
+const inputGroupAddonVariants = cva("flex h-auto cursor-text items-center justify-center gap-2 leading-none select-none [&_svg]:-mx-0.5 in-[[data-slot=input-group]:has([data-slot=input-control],[data-slot=textarea-control])]:[&_svg:not([class*='size-'])]:size-4.5 sm:in-[[data-slot=input-group]:has([data-slot=input-control],[data-slot=textarea-control])]:[&_svg:not([class*='size-'])]:size-4 not-has-[button]:**:[svg:not([class*='opacity-'])]:opacity-80 [&>kbd]:rounded-sm", {
 	defaultVariants: { align: "inline-start" },
 	variants: { align: {
 		"block-end": "order-last w-full justify-start px-[calc(--spacing(3)-1px)] pb-[calc(--spacing(3)-1px)] [.border-t]:pt-[calc(--spacing(3)-1px)] [[data-size=sm]+&]:px-[calc(--spacing(2.5)-1px)]",
@@ -25,8 +25,8 @@ const InputGroupAddon = ({ className, align = "inline-start", ...props }) => /*
 	"data-align": align,
 	"data-slot": "input-group-addon",
 	onMouseDown: (e) => {
-		const { target } = e;
-		if (!(target instanceof Element)) return;
+		const { currentTarget, target } = e;
+		if (!(target instanceof Element) || !currentTarget.contains(target)) return;
 		if (target.closest("button, a, input, select, textarea, [role='button'], [role='combobox'], [role='listbox'], [data-slot='select-trigger']")) return;
 		e.preventDefault();
 		const parent = e.currentTarget.parentElement;

package/dist/components/input.js

@@ -1,8 +1,8 @@
 "use client";
+import { isStructuredInputType, useContentDir } from "../hooks/use-content-dir.js";
 import { SearchIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
 import { CONTROL_SIZE } from "../lib/control-size.js";
-import { isStructuredInputType, useContentDir } from "../hooks/use-content-dir.js";
+import { cn } from "../lib/utils.js";
 import { INLINE_FIELD_CLASS_NAME, INPUT_ELEMENT_CLASS_NAME, INPUT_SIZE_CLASS_NAMES } from "./input-control.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Input as Input$1 } from "@base-ui/react/input";

package/dist/components/kbd.js

@@ -26,7 +26,7 @@ const Kbd = ({ className, children, keys, variant = "cap", ...props }) => {
 	});
 };
 const KBD_VARIANT_CLASS_NAME = {
-	cap: "border-border bg-muted text-muted-foreground text-2xs h-5 min-w-5 rounded border px-1",
+	cap: "border-border bg-muted text-muted-foreground text-2xs h-5 min-w-5 rounded-sm border px-1",
 	plain: "text-foreground-label text-xs tracking-widest"
 };
 const KEY_LABELS = {

package/dist/components/matter-icon.js

@@ -1,6 +1,6 @@
 import { LayersIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
 import { resolveMatterColor } from "../lib/matter-colors.js";
+import { cn } from "../lib/utils.js";
 import { ALL_MATTERS_STACK } from "./matter-icon.shared.js";
 import { jsx } from "react/jsx-runtime";
 // src/components/matter-icon.tsx

package/dist/components/menu.js

@@ -1,10 +1,10 @@
 "use client";
 import { ChevronRightIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
 import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
+import { cn } from "../lib/utils.js";
+import { DirectionalIcon } from "./directional-icon.js";
 import { Kbd } from "./kbd.js";
 import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
-import { DirectionalIcon } from "./directional-icon.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Menu as Menu$1 } from "@base-ui/react/menu";
 // src/components/menu.tsx

package/dist/components/number-input.js

@@ -1,6 +1,6 @@
 "use client";
-import { cn } from "../lib/utils.js";
 import { CONTROL_SIZE } from "../lib/control-size.js";
+import { cn } from "../lib/utils.js";
 import { INPUT_CONTROL_CLASS_NAME, INPUT_ELEMENT_CLASS_NAME, INPUT_SIZE_CLASS_NAMES } from "./input-control.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { NumberField } from "@base-ui/react/number-field";

package/dist/components/outline-rail.js

@@ -1,12 +1,12 @@
 "use client";
 import { ChevronRightIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
-import { Tooltip, TooltipContent as TooltipPopup, TooltipTrigger } from "./tooltip.js";
-import { ScrollArea } from "./scroll-area.js";
-import { DirectionalIcon } from "./directional-icon.js";
 import "../lib/panel-inset.js";
+import { cn } from "../lib/utils.js";
 import { ReviewAuthorAvatar } from "../review/review-author-avatar.js";
+import { DirectionalIcon } from "./directional-icon.js";
 import { reconcileOutlineItems, retainOutlineIdSet } from "./outline-rail.logic.js";
+import { ScrollArea } from "./scroll-area.js";
+import { Tooltip, TooltipContent as TooltipPopup, TooltipTrigger } from "./tooltip.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { memo, useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Temporal } from "temporal-polyfill/full";

package/dist/components/popover.js

@@ -1,7 +1,7 @@
 "use client";
-import { cn } from "../lib/utils.js";
 import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
 import { CONTENT_SIZED_POSITIONER_CLASS_NAME, IN_FLOW_POPUP_CLASS_NAME } from "../lib/positioner-sizing.js";
+import { cn } from "../lib/utils.js";
 import { renderTooltipTrigger } from "./tooltip-trigger-helper.js";
 import { jsx } from "react/jsx-runtime";
 import { Popover as Popover$1 } from "@base-ui/react/popover";

package/dist/components/segmented-icon-toggle.js

@@ -19,7 +19,7 @@ const SegmentedIconToggle = ({ value, options, onChange, size = "compact" }) =>
 		const Icon = option.icon;
 		return /* @__PURE__ */ jsx(ToggleGroupItem, {
 			"aria-label": option.label,
-			className: cn("h-6 w-7 rounded-[4px] sm:h-6", size === "touch" && "[@media(any-pointer:coarse)]:h-11 [@media(any-pointer:coarse)]:w-11"),
+			className: cn("h-6 w-7 rounded-sm sm:h-6", size === "touch" && "[@media(any-pointer:coarse)]:h-11 [@media(any-pointer:coarse)]:w-11"),
 			"data-control-value": option.value,
 			size: "icon-xs",
 			value: option.value,

package/dist/components/select.js

@@ -1,10 +1,10 @@
 "use client";
+import { useLatest } from "../hooks/use-latest.js";
 import { ChevronDownIcon, ChevronUpIcon, ChevronsUpDownIcon } from "../icons.js";
-import { cn } from "../lib/utils.js";
-import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
 import { CONTROL_SIZE } from "../lib/control-size.js";
 import { FIELD_TRIGGER_CLASS_NAME } from "../lib/field-trigger.js";
-import { useLatest } from "../hooks/use-latest.js";
+import { OVERLAY_LAYER_CLASS_NAMES } from "../lib/overlay-layer.js";
+import { cn } from "../lib/utils.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React$1 from "react";
 import { Select as Select$1 } from "@base-ui/react/select";