@mcp-b/react-components 0.11.0 → 0.13.0

package/dist/components/CodexModelSelector.js

@@ -0,0 +1,170 @@
+import { t as cx } from "../class-names-9UtZwb0J.js";
+import { A as RefreshIcon, a as CheckIcon, c as ChevronRightIcon, o as ChevronDownIcon } from "../icons-Ba9THQKz.js";
+import { Menu } from "./Menu.js";
+import "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/CodexModelSelector.tsx
+const defaultServiceTierValue = "codex-default-service-tier";
+/**
+* A compact Codex-style response settings picker: model, reasoning effort,
+* response speed, and reset are kept in one cascading menu.
+*
+* The consuming app supplies every selectable value. This component only
+* renders those values and never guesses model ids or account entitlements.
+*/
+function CodexModelSelector({ models, selectedModelId = null, onSelectModel, selectedEffortId = null, onSelectEffort, selectedSpeedId = null, onSelectSpeed, onReset, disabled = false, className, open, defaultOpen, onOpenChange, "aria-label": ariaLabel = "Codex response settings" }) {
+	const visibleModels = models.filter((model) => !model.hidden);
+	const selectedModel = visibleModels.find((model) => model.id === selectedModelId);
+	const effortOptions = selectedModel?.supportedReasoningEfforts ?? [];
+	const speedOptions = getServiceTiers(selectedModel);
+	const selectedEffort = effortOptions.find((option) => option.reasoningEffort === selectedEffortId);
+	const selectedSpeed = speedOptions.find((option) => option.id === selectedSpeedId);
+	function handleSelectModel(modelId) {
+		const model = visibleModels.find((option) => option.id === modelId);
+		if (!model) return;
+		onSelectModel(model.id);
+	}
+	function handleSelectEffort(effortId) {
+		const effort = effortOptions.find((option) => option.reasoningEffort === effortId);
+		if (!effort) return;
+		onSelectEffort?.(effort.reasoningEffort);
+	}
+	function handleSelectSpeed(speedId) {
+		if (speedId === defaultServiceTierValue) {
+			onSelectSpeed?.(null);
+			return;
+		}
+		const speed = speedOptions.find((option) => option.id === speedId);
+		if (!speed) return;
+		onSelectSpeed?.(speed.id);
+	}
+	function handleReset() {
+		onReset?.();
+	}
+	return /* @__PURE__ */ jsxs(Menu.Root, {
+		open,
+		defaultOpen,
+		onOpenChange,
+		children: [/* @__PURE__ */ jsxs(Menu.Trigger, {
+			unstyled: true,
+			className: cx("codex-model-selector__trigger", className),
+			disabled,
+			"aria-label": ariaLabel,
+			children: [/* @__PURE__ */ jsxs("span", {
+				className: "codex-model-selector__summary",
+				children: [/* @__PURE__ */ jsx("span", { children: selectedModel?.displayName ?? "Select model" }), selectedEffort ? /* @__PURE__ */ jsx("span", {
+					className: cx("codex-model-selector__summary-effort", selectedEffort.reasoningEffort === "ultra" && "codex-model-selector__summary-effort--ultra"),
+					children: formatSettingLabel(selectedEffort.reasoningEffort)
+				}) : null]
+			}), /* @__PURE__ */ jsx(ChevronDownIcon, { className: "codex-model-selector__trigger-icon" })]
+		}), /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, {
+			side: "top",
+			align: "end",
+			children: /* @__PURE__ */ jsxs(Menu.Popup, {
+				className: "codex-model-selector__menu",
+				children: [
+					/* @__PURE__ */ jsx(CodexModelSelectorSubmenu, {
+						label: "Model",
+						value: selectedModel?.displayName ?? "Select",
+						disabled: visibleModels.length === 0,
+						children: /* @__PURE__ */ jsx(Menu.RadioGroup, {
+							value: selectedModelId ?? void 0,
+							onValueChange: handleSelectModel,
+							children: visibleModels.map((model) => /* @__PURE__ */ jsx(CodexModelSelectorRadioItem, {
+								value: model.id,
+								description: model.description,
+								children: model.displayName
+							}, model.id))
+						})
+					}),
+					effortOptions.length > 0 && onSelectEffort ? /* @__PURE__ */ jsx(CodexModelSelectorSubmenu, {
+						label: "Effort",
+						value: selectedEffort ? formatSettingLabel(selectedEffort.reasoningEffort) : "Select",
+						children: /* @__PURE__ */ jsx(Menu.RadioGroup, {
+							value: selectedEffortId ?? void 0,
+							onValueChange: handleSelectEffort,
+							children: effortOptions.map((option) => /* @__PURE__ */ jsx(CodexModelSelectorRadioItem, {
+								value: option.reasoningEffort,
+								description: option.description,
+								children: formatSettingLabel(option.reasoningEffort)
+							}, option.reasoningEffort))
+						})
+					}) : null,
+					speedOptions.length > 0 && onSelectSpeed ? /* @__PURE__ */ jsx(CodexModelSelectorSubmenu, {
+						label: "Speed",
+						value: selectedSpeed?.name ?? "Select",
+						children: /* @__PURE__ */ jsx(Menu.RadioGroup, {
+							value: selectedSpeedId ?? defaultServiceTierValue,
+							onValueChange: handleSelectSpeed,
+							children: speedOptions.map((option) => /* @__PURE__ */ jsx(CodexModelSelectorRadioItem, {
+								value: option.id ?? defaultServiceTierValue,
+								description: option.description,
+								children: option.name
+							}, option.id ?? defaultServiceTierValue))
+						})
+					}) : null,
+					onReset ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu.Separator, {}), /* @__PURE__ */ jsxs(Menu.Item, {
+						className: "codex-model-selector__reset",
+						onClick: handleReset,
+						children: ["Reset to default", /* @__PURE__ */ jsx(RefreshIcon, { className: "codex-model-selector__reset-icon" })]
+					})] }) : null
+				]
+			})
+		}) })]
+	});
+}
+function getServiceTiers(model) {
+	if (!model || model.serviceTiers.length === 0) return [];
+	return [{
+		id: null,
+		name: "Standard",
+		description: "Default speed"
+	}, ...model.serviceTiers];
+}
+function formatSettingLabel(value) {
+	if (value === "xhigh") return "Extra High";
+	return value.split(/[-_]/).filter(Boolean).map((word) => word[0].toUpperCase() + word.slice(1)).join(" ");
+}
+function CodexModelSelectorSubmenu({ label, value, disabled = false, children }) {
+	return /* @__PURE__ */ jsxs(Menu.SubmenuRoot, { children: [/* @__PURE__ */ jsxs(Menu.SubmenuTrigger, {
+		className: "codex-model-selector__submenu-trigger",
+		disabled,
+		children: [
+			/* @__PURE__ */ jsx("span", { children: label }),
+			/* @__PURE__ */ jsx("span", {
+				className: "codex-model-selector__submenu-value",
+				children: value
+			}),
+			/* @__PURE__ */ jsx(ChevronRightIcon, { className: "codex-model-selector__submenu-icon" })
+		]
+	}), /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, {
+		side: "right",
+		align: "start",
+		sideOffset: 4,
+		children: /* @__PURE__ */ jsx(Menu.Popup, {
+			className: cx("codex-model-selector__submenu", `codex-model-selector__submenu--${label.toLowerCase()}`),
+			children: /* @__PURE__ */ jsxs(Menu.Group, { children: [/* @__PURE__ */ jsx(Menu.GroupLabel, {
+				className: "codex-model-selector__submenu-title",
+				children: label
+			}), children] })
+		})
+	}) })] });
+}
+function CodexModelSelectorRadioItem({ children, description, ...props }) {
+	return /* @__PURE__ */ jsxs(Menu.RadioItem, {
+		className: "codex-model-selector__option",
+		...props,
+		children: [/* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("span", {
+			className: "codex-model-selector__option-label",
+			children
+		}), description ? /* @__PURE__ */ jsx("span", {
+			className: "codex-model-selector__option-description",
+			children: description
+		}) : null] }), /* @__PURE__ */ jsx(Menu.RadioItemIndicator, {
+			className: "codex-model-selector__option-indicator",
+			children: /* @__PURE__ */ jsx(CheckIcon, {})
+		})]
+	});
+}
+//#endregion
+export { CodexModelSelector };

package/dist/components/Collapsible.d.ts

@@ -73,7 +73,6 @@ declare function CollapsiblePanel({
 }: CollapsiblePanelProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-declare const CollapsibleContent: typeof CollapsiblePanel;
 /**
  * A collapsible panel controlled by a button.
  * Useful for progressive disclosure of content.
@@ -117,11 +116,10 @@ declare const CollapsibleContent: typeof CollapsiblePanel;
  *
  * @see {@link https://base-ui.com/react/components/collapsible | Base UI Collapsible}
  */
-declare const Collapsible: typeof CollapsibleRoot & {
+declare const Collapsible: {
   Root: typeof CollapsibleRoot;
   Trigger: typeof CollapsibleTrigger;
   Panel: typeof CollapsiblePanel;
-  Content: typeof CollapsiblePanel;
 };
 //#endregion
-export { Collapsible, CollapsibleContent, CollapsiblePanel, CollapsiblePanelProps, CollapsibleRoot, CollapsibleRootProps, CollapsibleTrigger, CollapsibleTriggerProps };
+export { Collapsible, CollapsiblePanelProps, CollapsibleRootProps, CollapsibleTriggerProps };

package/dist/components/Collapsible.js

@@ -41,7 +41,11 @@ function CollapsibleTrigger({ className = "", unstyled = false, ref, ...props })
 * Supports CSS animations via `--collapsible-panel-height` variable.
 */
 function CollapsiblePanel({ className = "", unstyled = false, ref, ...props }) {
-	const classes = unstyled ? className : ["collapsible__panel", className].filter(Boolean).join(" ");
+	const classes = [
+		"base-ui-collapsible-panel",
+		!unstyled && "collapsible__panel",
+		className
+	].filter(Boolean).join(" ");
 	return /* @__PURE__ */ jsx(Collapsible$1.Panel, {
 		ref,
 		"data-slot": "collapsible-content",
@@ -49,7 +53,6 @@ function CollapsiblePanel({ className = "", unstyled = false, ref, ...props }) {
 		...props
 	});
 }
-const CollapsibleContent = CollapsiblePanel;
 /**
 * A collapsible panel controlled by a button.
 * Useful for progressive disclosure of content.
@@ -93,11 +96,10 @@ const CollapsibleContent = CollapsiblePanel;
 *
 * @see {@link https://base-ui.com/react/components/collapsible | Base UI Collapsible}
 */
-const Collapsible = Object.assign(CollapsibleRoot, {
+const Collapsible = {
 	Root: CollapsibleRoot,
 	Trigger: CollapsibleTrigger,
-	Panel: CollapsiblePanel,
-	Content: CollapsibleContent
-});
+	Panel: CollapsiblePanel
+};
 //#endregion
-export { Collapsible, CollapsibleContent, CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger };
+export { Collapsible };

package/dist/components/Combobox.d.ts

@@ -1,2 +1,2 @@
-import { _ as ComboboxValue, a as ComboboxCollection, c as ComboboxGroup, d as ComboboxLabel, f as ComboboxList, g as ComboboxTrigger, h as ComboboxSeparator, i as ComboboxChipsInput, l as ComboboxInput, m as ComboboxPositioner, n as ComboboxChip, o as ComboboxContent, p as ComboboxPopup, r as ComboboxChips, s as ComboboxEmpty, t as Combobox, u as ComboboxItem, v as useComboboxAnchor } from "../Combobox-D9anamNr.js";
-export { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxPopup, ComboboxPositioner, ComboboxSeparator, ComboboxTrigger, ComboboxValue, useComboboxAnchor };
+import { n as useComboboxAnchor, t as Combobox } from "../Combobox-B9Fcd6q-.js";
+export { Combobox, useComboboxAnchor };

package/dist/components/Combobox.js

@@ -30,7 +30,11 @@ function Clear({ className = "", ref, ...props }) {
 	});
 }
 function ComboboxPositioner({ className = "", ref, ...props }) {
-	const classes = ["combobox__positioner", className].filter(Boolean).join(" ");
+	const classes = [
+		"combobox__positioner",
+		"base-ui-positioner",
+		className
+	].filter(Boolean).join(" ");
 	return /* @__PURE__ */ jsx(Combobox$1.Positioner, {
 		ref,
 		"data-slot": "combobox-positioner",
@@ -39,7 +43,11 @@ function ComboboxPositioner({ className = "", ref, ...props }) {
 	});
 }
 function ComboboxPopup({ className = "", tabIndex = 0, ref, ...props }) {
-	const classes = ["combobox__popup", className].filter(Boolean).join(" ");
+	const classes = [
+		"combobox__popup",
+		"base-ui-popup",
+		className
+	].filter(Boolean).join(" ");
 	return /* @__PURE__ */ jsx(Combobox$1.Popup, {
 		ref,
 		"data-slot": "combobox-content",
@@ -93,7 +101,7 @@ function ComboboxGroup({ className = "", ref, ...props }) {
 		...props
 	});
 }
-function ComboboxLabel({ className = "", ref, ...props }) {
+function ComboboxGroupLabel({ className = "", ref, ...props }) {
 	const classes = ["combobox__group-label", className].filter(Boolean).join(" ");
 	return /* @__PURE__ */ jsx(Combobox$1.GroupLabel, {
 		ref,
@@ -142,17 +150,10 @@ function ComboboxLabel({ className = "", ref, ...props }) {
 *
 * @see {@link https://base-ui.com/react/components/combobox | Base UI Combobox}
 */
-const ComboboxContent = ComboboxPopup;
-const ComboboxValue = Combobox$1.Value;
-const ComboboxChips = Combobox$1.Chips;
-const ComboboxChip = Combobox$1.Chip;
-const ComboboxChipsInput = ComboboxInput;
-const ComboboxCollection = Combobox$1.Collection;
-const ComboboxSeparator = Combobox$1.Separator;
 function useComboboxAnchor() {
 	return React.useRef(null);
 }
-const Combobox = Object.assign(Combobox$1.Root, {
+const Combobox = {
 	Root: Combobox$1.Root,
 	Input: ComboboxInput,
 	Trigger: ComboboxTrigger,
@@ -160,20 +161,17 @@ const Combobox = Object.assign(Combobox$1.Root, {
 	Portal: Combobox$1.Portal,
 	Positioner: ComboboxPositioner,
 	Popup: ComboboxPopup,
-	Content: ComboboxContent,
 	List: ComboboxList,
 	Item: ComboboxItem,
 	ItemIndicator,
 	Empty: ComboboxEmpty,
 	Group: ComboboxGroup,
-	GroupLabel: ComboboxLabel,
-	Label: ComboboxLabel,
-	Value: ComboboxValue,
-	Chips: ComboboxChips,
-	Chip: ComboboxChip,
-	ChipsInput: ComboboxChipsInput,
-	Collection: ComboboxCollection,
-	Separator: ComboboxSeparator
-});
+	GroupLabel: ComboboxGroupLabel,
+	Value: Combobox$1.Value,
+	Chips: Combobox$1.Chips,
+	Chip: Combobox$1.Chip,
+	Collection: Combobox$1.Collection,
+	Separator: Combobox$1.Separator
+};
 //#endregion
-export { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxPopup, ComboboxPositioner, ComboboxSeparator, ComboboxTrigger, ComboboxValue, useComboboxAnchor };
+export { Combobox, useComboboxAnchor };

package/dist/components/Commit.d.ts

@@ -1,10 +1,10 @@
-import { CollapsiblePanelProps, CollapsibleRootProps, CollapsibleTriggerProps } from "./Collapsible.js";
-import { r as ButtonProps } from "../Button-Ct5I6aTu.js";
+import { Collapsible } from "./Collapsible.js";
+import { t as CopyButtonProps } from "../copy-button-DtPMgN7e.js";
 import * as React from "react";
 
 //#region src/components/Commit.d.ts
 type CommitFileStatusValue = "added" | "modified" | "deleted" | "renamed";
-interface CommitProps extends Omit<CollapsibleRootProps, "className" | "unstyled"> {
+interface CommitProps extends Omit<React.ComponentProps<typeof Collapsible.Root>, "className" | "unstyled"> {
   className?: string;
 }
 /**
@@ -50,7 +50,7 @@ declare function Commit({
 }: CommitProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface CommitHeaderProps extends Omit<CollapsibleTriggerProps, "className" | "unstyled"> {
+interface CommitHeaderProps extends Omit<React.ComponentProps<typeof Collapsible.Trigger>, "className" | "unstyled"> {
   className?: string;
 }
 declare function CommitHeader({
@@ -133,7 +133,7 @@ declare function CommitHash({
 }: CommitHashProps & {
   ref?: React.Ref<HTMLSpanElement>;
 }): React.JSX.Element;
-interface CommitCopyButtonProps extends Omit<ButtonProps, "children" | "variant" | "size" | "color" | "className" | "onClick"> {
+interface CommitCopyButtonProps extends Omit<CopyButtonProps, "label" | "stopPropagation" | "text"> {
   hash: string;
   label?: string;
   className?: string;
@@ -167,7 +167,7 @@ declare function CommitActions({
 }: CommitActionsProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface CommitContentProps extends Omit<CollapsiblePanelProps, "className" | "unstyled"> {
+interface CommitContentProps extends Omit<React.ComponentProps<typeof Collapsible.Panel>, "className" | "unstyled"> {
   className?: string;
 }
 declare function CommitContent({

package/dist/components/Commit.js

@@ -1,11 +1,10 @@
-import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
+import { Collapsible } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { a as CheckIcon, c as ChevronRightIcon, h as FileIcon, l as CopyIcon } from "../icons-D2Q5n5C1.js";
-import { Button } from "./Button.js";
-import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
+import { c as ChevronRightIcon, h as FileIcon } from "../icons-Ba9THQKz.js";
+import { t as CopyButton } from "../copy-button-DUMLYdsk.js";
 import { Avatar } from "./Avatar.js";
 import { Badge } from "./Badge.js";
-import * as React from "react";
+import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Commit.tsx
 const FILE_STATUS_COLOR = {
@@ -57,7 +56,7 @@ const FILE_STATUS_LABEL = {
 * ```
 */
 function Commit({ className, ref, ...props }) {
-	return /* @__PURE__ */ jsx(CollapsibleRoot, {
+	return /* @__PURE__ */ jsx(Collapsible.Root, {
 		ref,
 		className: cx("commit", className),
 		...props,
@@ -65,7 +64,7 @@ function Commit({ className, ref, ...props }) {
 	});
 }
 function CommitHeader({ className, children, ref, ...props }) {
-	return /* @__PURE__ */ jsxs(CollapsibleTrigger, {
+	return /* @__PURE__ */ jsxs(Collapsible.Trigger, {
 		ref,
 		className: cx("commit__header", className),
 		...props,
@@ -141,25 +140,14 @@ function CommitHash({ className, children, hash, ref, ...props }) {
 	});
 }
 function CommitCopyButton({ className, hash, label = "Copy hash", onClick, ...props }) {
-	const [copied, setCopied] = React.useState(false);
-	const handleClick = React.useCallback(async (e) => {
-		e.stopPropagation();
-		try {
-			await navigator.clipboard.writeText(hash);
-			setCopied(true);
-			window.setTimeout(() => setCopied(false), 1500);
-		} catch {}
-		onClick?.(e);
-	}, [hash, onClick]);
-	return /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, { render: /* @__PURE__ */ jsx(Button, {
-		variant: "ghost",
-		size: "icon",
-		"aria-label": label,
-		className: cx("commit__copy", className),
+	return /* @__PURE__ */ jsx(CopyButton, {
 		...props,
-		onClick: handleClick,
-		children: copied ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {})
-	}) }), /* @__PURE__ */ jsx(TooltipPortal, { children: /* @__PURE__ */ jsx(TooltipPositioner, { children: /* @__PURE__ */ jsx(TooltipPopup, { children: copied ? "Copied" : label }) }) })] });
+		text: hash,
+		label,
+		stopPropagation: true,
+		className: cx("commit__copy", className),
+		onClick
+	});
 }
 function CommitTimestamp({ className, children, date, ref, ...props }) {
 	return /* @__PURE__ */ jsx("time", {
@@ -180,7 +168,7 @@ function CommitActions({ className, children, ref, ...props }) {
 	});
 }
 function CommitContent({ className, children, ref, ...props }) {
-	return /* @__PURE__ */ jsx(CollapsiblePanel, {
+	return /* @__PURE__ */ jsx(Collapsible.Panel, {
 		ref,
 		className: cx("commit__content", className),
 		...props,

package/dist/components/Context.js

@@ -67,7 +67,11 @@ function Context({ className, usedTokens, maxTokens, usage, modelId, totalCostUs
 function ContextTrigger({ className, children, ...props }) {
 	const { usedTokens, maxTokens } = useContextContext();
 	const percent = maxTokens > 0 ? usedTokens / maxTokens * 100 : 0;
-	if (React.isValidElement(children)) return /* @__PURE__ */ jsx(Popover.Trigger, { render: children });
+	if (React.isValidElement(children)) return /* @__PURE__ */ jsx(Popover.Trigger, {
+		className: cx("context__trigger", className),
+		...props,
+		render: children
+	});
 	if (children) return /* @__PURE__ */ jsx(Popover.Trigger, { children });
 	return /* @__PURE__ */ jsx(Popover.Trigger, {
 		className: cx("context__trigger", className),

package/dist/components/ContextMenu.d.ts

@@ -50,7 +50,7 @@ interface ContextMenuSeparatorProps extends Omit<React.ComponentPropsWithoutRef<
 interface ContextMenuGroupProps extends Omit<React.ComponentPropsWithoutRef<typeof ContextMenu$1.Group>, "className"> {
   className?: string;
 }
-interface ContextMenuLabelProps extends Omit<React.ComponentPropsWithoutRef<typeof ContextMenu$1.GroupLabel>, "className"> {
+interface ContextMenuGroupLabelProps extends Omit<React.ComponentPropsWithoutRef<typeof ContextMenu$1.GroupLabel>, "className"> {
   className?: string;
   inset?: boolean;
 }
@@ -64,36 +64,11 @@ interface ContextMenuRadioItemProps extends Omit<React.ComponentPropsWithoutRef<
   className?: string;
 }
 interface ContextMenuShortcutProps extends React.HTMLAttributes<HTMLSpanElement> {}
-interface ContextMenuSubProps extends React.ComponentPropsWithoutRef<typeof ContextMenu$1.SubmenuRoot> {}
-interface ContextMenuSubTriggerProps extends Omit<React.ComponentPropsWithoutRef<typeof ContextMenu$1.SubmenuTrigger>, "className"> {
+interface ContextMenuSubmenuRootProps extends React.ComponentPropsWithoutRef<typeof ContextMenu$1.SubmenuRoot> {}
+interface ContextMenuSubmenuTriggerProps extends Omit<React.ComponentPropsWithoutRef<typeof ContextMenu$1.SubmenuTrigger>, "className"> {
   className?: string;
   inset?: boolean;
 }
-type ContextMenuPlacementProps = Pick<ContextMenuPositionerProps, "anchor" | "positionMethod" | "side" | "sideOffset" | "align" | "alignOffset" | "collisionBoundary" | "collisionPadding" | "sticky" | "arrowPadding" | "disableAnchorTracking" | "collisionAvoidance">;
-type ContextMenuContentProps = ContextMenuPopupProps & ContextMenuPlacementProps;
-type ContextMenuSubContentProps = ContextMenuContentProps;
-/**
- * Root component that manages context menu state.
- *
- * @example
- * ```tsx
- * <ContextMenu.Root>
- *   <ContextMenu.Trigger>Right click here</ContextMenu.Trigger>
- *   <ContextMenu.Portal>
- *     <ContextMenu.Positioner>
- *       <ContextMenu.Popup>
- *         <ContextMenu.Item>Cut</ContextMenu.Item>
- *         <ContextMenu.Item>Copy</ContextMenu.Item>
- *         <ContextMenu.Item>Paste</ContextMenu.Item>
- *       </ContextMenu.Popup>
- *     </ContextMenu.Positioner>
- *   </ContextMenu.Portal>
- * </ContextMenu.Root>
- * ```
- *
- * @see {@link https://base-ui.com/react/components/context-menu | Base UI ContextMenu}
- */
-declare const ContextMenuRoot: (props: ContextMenuProps) => React.JSX.Element;
 /**
  * Interactive area that activates the menu on right-click or long-press.
  */
@@ -104,10 +79,6 @@ declare function ContextMenuTrigger({
 }: ContextMenuTriggerProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-/**
- * Renders menu content in a portal.
- */
-declare const ContextMenuPortal: (props: ContextMenuPortalProps) => React.JSX.Element;
 /**
  * Positions the menu at the pointer location.
  */
@@ -128,23 +99,6 @@ declare function ContextMenuPopup({
 }: ContextMenuPopupProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-declare function ContextMenuContent({
-  anchor,
-  positionMethod,
-  side,
-  sideOffset,
-  align,
-  alignOffset,
-  collisionBoundary,
-  collisionPadding,
-  sticky,
-  arrowPadding,
-  disableAnchorTracking,
-  collisionAvoidance,
-  ...props
-}: ContextMenuContentProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
 /**
  * Interactive menu item.
  */
@@ -174,22 +128,22 @@ declare function ContextMenuGroup({
 }: ContextMenuGroupProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-declare function ContextMenuLabel({
+declare function ContextMenuGroupLabel({
   className,
   inset,
   ref,
   ...props
-}: ContextMenuLabelProps & {
+}: ContextMenuGroupLabelProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
 declare function ContextMenuCheckboxItem({
   className,
-  children,
   ref,
   ...props
 }: ContextMenuCheckboxItemProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
+declare function ContextMenuCheckboxItemIndicator(props: ContextMenu$1.CheckboxItemIndicator.Props): React.JSX.Element;
 declare function ContextMenuRadioGroup({
   className,
   ref,
@@ -199,12 +153,12 @@ declare function ContextMenuRadioGroup({
 }): React.JSX.Element;
 declare function ContextMenuRadioItem({
   className,
-  children,
   ref,
   ...props
 }: ContextMenuRadioItemProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
+declare function ContextMenuRadioItemIndicator(props: ContextMenu$1.RadioItemIndicator.Props): React.JSX.Element;
 declare function ContextMenuShortcut({
   className,
   ref,
@@ -212,22 +166,13 @@ declare function ContextMenuShortcut({
 }: ContextMenuShortcutProps & {
   ref?: React.Ref<HTMLSpanElement>;
 }): React.JSX.Element;
-declare function ContextMenuSub(props: ContextMenuSubProps): React.JSX.Element;
-declare function ContextMenuSubContent({
-  side,
-  align,
-  sideOffset,
-  ...props
-}: ContextMenuSubContentProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
-declare function ContextMenuSubTrigger({
+declare function ContextMenuSubmenuRoot(props: ContextMenuSubmenuRootProps): React.JSX.Element;
+declare function ContextMenuSubmenuTrigger({
   className,
   inset,
-  children,
   ref,
   ...props
-}: ContextMenuSubTriggerProps & {
+}: ContextMenuSubmenuTriggerProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
 /**
@@ -259,24 +204,27 @@ declare function ContextMenuSubTrigger({
  *
  * @see {@link https://base-ui.com/react/components/context-menu | Base UI ContextMenu}
  */
-declare const ContextMenu: ((props: ContextMenuProps) => React.JSX.Element) & {
+declare const ContextMenu: {
   Root: (props: ContextMenuProps) => React.JSX.Element;
   Trigger: typeof ContextMenuTrigger;
   Portal: (props: ContextMenuPortalProps) => React.JSX.Element;
   Positioner: typeof ContextMenuPositioner;
   Popup: typeof ContextMenuPopup;
-  Content: typeof ContextMenuContent;
+  Backdrop: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+  Arrow: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuArrowProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
   Item: typeof ContextMenuItem;
   Separator: typeof ContextMenuSeparator;
   Group: typeof ContextMenuGroup;
-  Label: typeof ContextMenuLabel;
+  GroupLabel: typeof ContextMenuGroupLabel;
+  LinkItem: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuLinkItemProps, "ref"> & React.RefAttributes<Element>>;
   CheckboxItem: typeof ContextMenuCheckboxItem;
+  CheckboxItemIndicator: typeof ContextMenuCheckboxItemIndicator;
   RadioGroup: typeof ContextMenuRadioGroup;
   RadioItem: typeof ContextMenuRadioItem;
+  RadioItemIndicator: typeof ContextMenuRadioItemIndicator;
   Shortcut: typeof ContextMenuShortcut;
-  Sub: typeof ContextMenuSub;
-  SubContent: typeof ContextMenuSubContent;
-  SubTrigger: typeof ContextMenuSubTrigger;
+  SubmenuRoot: typeof ContextMenuSubmenuRoot;
+  SubmenuTrigger: typeof ContextMenuSubmenuTrigger;
 };
 //#endregion
-export { ContextMenu, ContextMenuCheckboxItem, ContextMenuCheckboxItemProps, ContextMenuContent, ContextMenuContentProps, ContextMenuGroup, ContextMenuGroupProps, ContextMenuItem, ContextMenuItemProps, ContextMenuLabel, ContextMenuLabelProps, ContextMenuPopup, ContextMenuPopupProps, ContextMenuPortal, ContextMenuPortalProps, ContextMenuPositioner, ContextMenuPositionerProps, ContextMenuProps, ContextMenuRadioGroup, ContextMenuRadioGroupProps, ContextMenuRadioItem, ContextMenuRadioItemProps, ContextMenuRoot, ContextMenuSeparator, ContextMenuSeparatorProps, ContextMenuShortcut, ContextMenuShortcutProps, ContextMenuSub, ContextMenuSubContent, ContextMenuSubContentProps, ContextMenuSubProps, ContextMenuSubTrigger, ContextMenuSubTriggerProps, ContextMenuTrigger, ContextMenuTriggerProps };
+export { ContextMenu, ContextMenuCheckboxItemProps, ContextMenuGroupLabelProps, ContextMenuGroupProps, ContextMenuItemProps, ContextMenuPopupProps, ContextMenuPortalProps, ContextMenuPositionerProps, ContextMenuProps, ContextMenuRadioGroupProps, ContextMenuRadioItemProps, ContextMenuSeparatorProps, ContextMenuShortcutProps, ContextMenuSubmenuRootProps, ContextMenuSubmenuTriggerProps, ContextMenuTriggerProps };