@mcp-b/react-components 0.19.0 → 0.20.0

package/dist/components/EnvironmentVariables.d.ts

@@ -1,4 +1,4 @@
-import { t as CopyButtonProps } from "../copy-button-D7aAYA-2.js";
+import { t as CopyButtonProps } from "../copy-button-BrvQ7z4W.js";
 import * as React from "react";
 
 //#region src/components/EnvironmentVariables.d.ts

package/dist/components/IconButton.d.ts

@@ -1,4 +1,4 @@
-import { i as ButtonSize, r as ButtonProps } from "../Button-DLGzHsjc.js";
+import { i as ButtonSize, r as ButtonProps } from "../Button-yRInko9u.js";
 import * as React from "react";
 
 //#region src/components/IconButton.d.ts

package/dist/components/InlineCitation.js

@@ -84,6 +84,7 @@ function InlineCitationSource({ source, index, className, ref, ...props }) {
 		"data-source-id": source.sourceId,
 		"data-source-type": source.type,
 		children: /* @__PURE__ */ jsxs(Popover.Root, { children: [/* @__PURE__ */ jsx(Popover.Trigger, {
+			unstyled: true,
 			className: "inline-citation__trigger",
 			"aria-label": accessibleName,
 			children: visibleLabel

package/dist/components/Marker.d.ts

@@ -1,20 +1,14 @@
 import * as React from "react";
+import { useRender } from "@base-ui/react/use-render";
 
 //#region src/components/Marker.d.ts
 type MarkerVariant = "default" | "separator" | "border";
-type MarkerRenderProps = React.HTMLAttributes<HTMLElement> & {
-  ref?: React.Ref<HTMLElement>;
-};
 type MarkerRenderState = {
   variant: MarkerVariant;
 };
-type MarkerRenderFunction = (props: MarkerRenderProps, state: MarkerRenderState) => React.ReactElement | null;
-type MarkerRender = React.ReactElement<React.HTMLAttributes<HTMLElement>> | MarkerRenderFunction;
-interface MarkerProps extends React.HTMLAttributes<HTMLDivElement> {
+interface MarkerProps extends useRender.ComponentProps<"div", MarkerRenderState> {
   /** Visual treatment for status, separator, or bordered marker rows. */
   variant?: MarkerVariant;
-  /** Replace the root element while keeping marker classes, refs, and handlers merged. */
-  render?: MarkerRender;
 }
 interface MarkerVariantsOptions {
   variant?: MarkerVariant | null;
@@ -34,9 +28,7 @@ declare function Marker({
   render,
   ref,
   ...props
-}: MarkerProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element | null;
+}: MarkerProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 interface MarkerIconProps extends React.HTMLAttributes<HTMLSpanElement> {}
 declare function MarkerIcon({
   className,

package/dist/components/Marker.js

@@ -1,58 +1,30 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { n as mergeRefs } from "../merge-refs-DF_7w2x_.js";
-import * as React from "react";
+import "react";
 import { jsx } from "react/jsx-runtime";
+import { useRender } from "@base-ui/react/use-render";
 //#region src/components/Marker.tsx
 function markerVariants({ variant = "default", className } = {}) {
 	return cx("marker", `marker--${variant ?? "default"}`, className);
 }
-function isEventHandler(propName, value) {
-	return /^on[A-Z]/.test(propName) && typeof value === "function";
-}
-function mergeRenderedMarkerProps(renderProps, markerProps) {
-	const mergedProps = {
-		...renderProps,
-		...markerProps
-	};
-	const markerPropsRecord = markerProps;
-	for (const propName of Object.keys(renderProps)) {
-		const renderValue = renderProps[propName];
-		const markerValue = markerPropsRecord[propName];
-		if (isEventHandler(propName, renderValue) && isEventHandler(propName, markerValue)) mergedProps[propName] = (...args) => {
-			renderValue(...args);
-			markerValue(...args);
-		};
-	}
-	mergedProps.className = cx(renderProps.className, markerProps.className);
-	mergedProps.style = renderProps.style || markerProps.style ? {
-		...renderProps.style,
-		...markerProps.style
-	} : void 0;
-	mergedProps.ref = mergeRefs(renderProps.ref, markerProps.ref);
-	return mergedProps;
-}
 /**
 * Compact status or separator row for transcript events like compaction,
 * checkpoints, and progress markers.
 */
 function Marker({ className, variant = "default", render, ref, ...props }) {
-	const rootProps = {
+	return useRender({
+		defaultTagName: "div",
+		render,
 		ref,
-		"data-slot": "marker",
-		"data-variant": variant,
-		className: markerVariants({
-			variant,
-			className
-		}),
-		...props
-	};
-	const markerProps = {
-		...rootProps,
-		ref
-	};
-	if (typeof render === "function") return render(markerProps, { variant });
-	if (React.isValidElement(render)) return React.cloneElement(render, mergeRenderedMarkerProps(render.props, markerProps));
-	return /* @__PURE__ */ jsx("div", { ...rootProps });
+		props: {
+			"data-slot": "marker",
+			...props,
+			className: markerVariants({
+				variant,
+				className
+			})
+		},
+		state: { variant }
+	});
 }
 function MarkerIcon({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {

package/dist/components/MediaPreviewCard.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { B as PlayIcon } from "../icons-DKXiSepE.js";
-import { n as mergeRefs } from "../merge-refs-DF_7w2x_.js";
+import { t as mergeRefs } from "../merge-refs-KlanQB7A.js";
 import { Card } from "./Card.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/Menubar.d.ts

@@ -14,7 +14,10 @@ interface MenubarMenuProps extends React.ComponentPropsWithoutRef<typeof Menu.Ro
 /**
  * Props for the Menubar.Trigger component.
  */
-interface MenubarTriggerProps extends React.ComponentPropsWithoutRef<typeof Menu.Trigger> {}
+interface MenubarTriggerProps extends React.ComponentPropsWithoutRef<typeof Menu.Trigger> {
+  /** Skip the default Button chrome when a composed control owns its visuals. */
+  unstyled?: boolean;
+}
 /**
  * Props for the Menubar.Portal component.
  */
@@ -90,6 +93,7 @@ declare function MenubarRoot({
  * Button that opens the menu.
  */
 declare function MenubarTrigger({
+  unstyled,
   className,
   ref,
   ...props

package/dist/components/Menubar.js

@@ -1,5 +1,6 @@
 import { n as mergeBaseClassName } from "../class-names-BiMDVpUo.js";
 import { _ as DotIcon, u as CheckIcon } from "../icons-DKXiSepE.js";
+import { buttonVariants } from "./Button.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { Menu } from "@base-ui/react/menu";
@@ -45,11 +46,17 @@ const MenubarMenu = (props) => {
 /**
 * Button that opens the menu.
 */
-function MenubarTrigger({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["menubar__trigger"].filter(Boolean).join(" "), className);
+function MenubarTrigger({ unstyled = false, className, ref, ...props }) {
+	const classes = mergeBaseClassName(unstyled ? "menubar__trigger" : buttonVariants({
+		variant: "ghost",
+		color: "neutral",
+		size: "sm",
+		className: "menubar__trigger"
+	}), className);
 	return /* @__PURE__ */ jsx(Menu.Trigger, {
 		ref,
 		"data-slot": "menubar-trigger",
+		"data-unstyled": unstyled ? "" : void 0,
 		className: classes,
 		...props
 	});

package/dist/components/Message.d.ts

@@ -1,4 +1,4 @@
-import { r as ButtonProps } from "../Button-DLGzHsjc.js";
+import { r as ButtonProps } from "../Button-yRInko9u.js";
 import * as React from "react";
 import { FileUIPart, UIMessage } from "ai";
 import { StreamdownProps } from "streamdown";

package/dist/components/MessageScroller.d.ts

@@ -1,4 +1,4 @@
-import { r as ButtonProps } from "../Button-DLGzHsjc.js";
+import { r as ButtonProps } from "../Button-yRInko9u.js";
 import * as React from "react";
 import { MessageScroller as MessageScroller$1, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from "@shadcn/react/message-scroller";
 

package/dist/components/ModelSelector.d.ts

@@ -1,4 +1,4 @@
-import { r as ButtonProps } from "../Button-DLGzHsjc.js";
+import { r as ButtonProps } from "../Button-yRInko9u.js";
 import { DialogProps } from "./Dialog.js";
 import { SeparatorProps } from "./Separator.js";
 import * as React from "react";

package/dist/components/NavigationMenu.d.ts

@@ -117,9 +117,7 @@ declare function NavigationMenuIcon({
   className,
   ref,
   ...props
-}: NavigationMenuIconProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
+}: NavigationMenuIconProps): React.JSX.Element;
 declare function NavigationMenuContent({
   className,
   ref,
@@ -146,9 +144,7 @@ declare function NavigationMenuPopup({
   className,
   ref,
   ...props
-}: NavigationMenuPopupProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
+}: NavigationMenuPopupProps): React.JSX.Element;
 declare function NavigationMenuViewport({
   className,
   ref,

package/dist/components/Popover.d.ts

@@ -9,7 +9,10 @@ interface PopoverProps extends React.ComponentPropsWithoutRef<typeof Popover$1.R
 /**
  * Props for the Popover.Trigger component.
  */
-interface PopoverTriggerProps extends React.ComponentPropsWithoutRef<typeof Popover$1.Trigger> {}
+interface PopoverTriggerProps extends React.ComponentPropsWithoutRef<typeof Popover$1.Trigger> {
+  /** Keep Base UI trigger behavior without the default popover trigger chrome. */
+  unstyled?: boolean;
+}
 interface PopoverAnchorProps extends React.HTMLAttributes<HTMLDivElement> {}
 /**
  * Props for the Popover.Portal component.
@@ -62,6 +65,7 @@ declare function PopoverAnchor({
  */
 declare function PopoverTrigger({
   className,
+  unstyled,
   ref,
   ...props
 }: PopoverTriggerProps & {
@@ -161,6 +165,7 @@ declare function PopoverDescription({
  * Button that closes the popover.
  */
 declare function PopoverClose({
+  render,
   className,
   ref,
   ...props

package/dist/components/Popover.js

@@ -1,4 +1,5 @@
 import { n as mergeBaseClassName } from "../class-names-BiMDVpUo.js";
+import { buttonVariants } from "./Button.js";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 import { Popover as Popover$1 } from "@base-ui/react/popover";
@@ -51,11 +52,12 @@ function PopoverAnchor({ className, ref, ...props }) {
 * Button that toggles the popover visibility.
 * Renders a `<button>` element.
 */
-function PopoverTrigger({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["popover__trigger"].filter(Boolean).join(" "), className);
+function PopoverTrigger({ className, unstyled = false, ref, ...props }) {
+	const classes = mergeBaseClassName(unstyled ? "" : "popover__trigger", className);
 	return /* @__PURE__ */ jsx(Popover$1.Trigger, {
 		ref,
 		"data-slot": "popover-trigger",
+		"data-unstyled": unstyled ? "" : void 0,
 		className: classes,
 		...props
 	});
@@ -174,11 +176,17 @@ function PopoverDescription({ className, ref, ...props }) {
 /**
 * Button that closes the popover.
 */
-function PopoverClose({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["popover__close"].filter(Boolean).join(" "), className);
+function PopoverClose({ render, className, ref, ...props }) {
+	const classes = mergeBaseClassName(render == null ? buttonVariants({
+		variant: "outline",
+		color: "neutral",
+		size: "xs",
+		className: "popover__close popover__close--default"
+	}) : "popover__close", className);
 	return /* @__PURE__ */ jsx(Popover$1.Close, {
 		ref,
 		"data-slot": "popover-close",
+		render,
 		className: classes,
 		...props
 	});

package/dist/components/PromptInput.d.ts

@@ -1,2 +1,2 @@
-import { $ as PromptInputDictationProps, A as PromptInputCommandDefinition, At as PromptInputTabProps, B as PromptInputCommandItemProps, Bt as getApprovalRequestId, C as PromptInputBodyProps, Ct as PromptInputTab, D as PromptInputCommand, Dt as PromptInputTabItemProps, E as PromptInputButtonTooltip, Et as PromptInputTabItem, F as PromptInputCommandGroupLabelProps, Ft as PromptInputTools, G as PromptInputCommandSeparatorProps, Gt as useProviderAttachments, H as PromptInputCommandListProps, Ht as getPendingToolApprovals, I as PromptInputCommandGroupProps, It as PromptInputToolsProps, J as PromptInputContextItem, K as PromptInputCommandTrigger, L as PromptInputCommandInput, Lt as PromptInputTooltipConfig, M as PromptInputCommandEmptyProps, Mt as PromptInputTabsListProps, N as PromptInputCommandGroup, Nt as PromptInputTextarea, O as PromptInputCommandComposer, Ot as PromptInputTabLabel, P as PromptInputCommandGroupLabel, Pt as PromptInputTextareaProps, Q as PromptInputDictation, R as PromptInputCommandInputProps, Rt as TextInputContext, S as PromptInputBody, St as PromptInputSubmitProps, T as PromptInputButtonProps, Tt as PromptInputTabBodyProps, U as PromptInputCommandProps, Ut as usePromptInputAttachments, V as PromptInputCommandList, Vt as getApprovalStateKey, W as PromptInputCommandSeparator, Wt as usePromptInputController, X as PromptInputContextSelectorProps, Y as PromptInputContextSelector, Z as PromptInputControllerProps, _ as PromptInputApprovalProps, _t as PromptInputReferences, a as PromptInputActionAddAttachmentsProps, at as PromptInputHoverCardContent, b as PromptInputAttachments, bt as PromptInputSelectProps, c as PromptInputActionMenu, ct as PromptInputHoverCardTrigger, d as PromptInputActionMenuItem, dt as PromptInputPermissionSelector, et as PromptInputFooter, f as PromptInputActionMenuItemProps, ft as PromptInputPermissionSelectorProps, g as PromptInputApproval, gt as PromptInputReference, h as PromptInputActionMenuTriggerProps, ht as PromptInputProviderProps, i as PromptInputActionAddAttachments, it as PromptInputHoverCard, j as PromptInputCommandEmpty, jt as PromptInputTabsList, k as PromptInputCommandComposerProps, kt as PromptInputTabLabelProps, l as PromptInputActionMenuContent, lt as PromptInputHoverCardTriggerProps, m as PromptInputActionMenuTrigger, mt as PromptInputProvider, n as PermissionMode, nt as PromptInputHeader, o as PromptInputActionAddScreenshot, ot as PromptInputHoverCardContentProps, p as PromptInputActionMenuProps, pt as PromptInputProps, q as PromptInputContextAction, r as PromptInput, rt as PromptInputHeaderProps, s as PromptInputActionAddScreenshotProps, st as PromptInputHoverCardProps, t as AttachmentsContext, tt as PromptInputFooterProps, u as PromptInputActionMenuContentProps, ut as PromptInputMessage, v as PromptInputAttachment, vt as PromptInputReferencesProps, w as PromptInputButton, wt as PromptInputTabBody, x as PromptInputAttachmentsProps, xt as PromptInputSubmit, y as PromptInputAttachmentProps, yt as PromptInputSelect, z as PromptInputCommandItem, zt as TooltipSide } from "../PromptInput-Bdh9pqlo.js";
+import { $ as PromptInputDictationProps, A as PromptInputCommandDefinition, At as PromptInputTabProps, B as PromptInputCommandItemProps, Bt as getApprovalRequestId, C as PromptInputBodyProps, Ct as PromptInputTab, D as PromptInputCommand, Dt as PromptInputTabItemProps, E as PromptInputButtonTooltip, Et as PromptInputTabItem, F as PromptInputCommandGroupLabelProps, Ft as PromptInputTools, G as PromptInputCommandSeparatorProps, Gt as useProviderAttachments, H as PromptInputCommandListProps, Ht as getPendingToolApprovals, I as PromptInputCommandGroupProps, It as PromptInputToolsProps, J as PromptInputContextItem, K as PromptInputCommandTrigger, L as PromptInputCommandInput, Lt as PromptInputTooltipConfig, M as PromptInputCommandEmptyProps, Mt as PromptInputTabsListProps, N as PromptInputCommandGroup, Nt as PromptInputTextarea, O as PromptInputCommandComposer, Ot as PromptInputTabLabel, P as PromptInputCommandGroupLabel, Pt as PromptInputTextareaProps, Q as PromptInputDictation, R as PromptInputCommandInputProps, Rt as TextInputContext, S as PromptInputBody, St as PromptInputSubmitProps, T as PromptInputButtonProps, Tt as PromptInputTabBodyProps, U as PromptInputCommandProps, Ut as usePromptInputAttachments, V as PromptInputCommandList, Vt as getApprovalStateKey, W as PromptInputCommandSeparator, Wt as usePromptInputController, X as PromptInputContextSelectorProps, Y as PromptInputContextSelector, Z as PromptInputControllerProps, _ as PromptInputApprovalProps, _t as PromptInputReferences, a as PromptInputActionAddAttachmentsProps, at as PromptInputHoverCardContent, b as PromptInputAttachments, bt as PromptInputSelectProps, c as PromptInputActionMenu, ct as PromptInputHoverCardTrigger, d as PromptInputActionMenuItem, dt as PromptInputPermissionSelector, et as PromptInputFooter, f as PromptInputActionMenuItemProps, ft as PromptInputPermissionSelectorProps, g as PromptInputApproval, gt as PromptInputReference, h as PromptInputActionMenuTriggerProps, ht as PromptInputProviderProps, i as PromptInputActionAddAttachments, it as PromptInputHoverCard, j as PromptInputCommandEmpty, jt as PromptInputTabsList, k as PromptInputCommandComposerProps, kt as PromptInputTabLabelProps, l as PromptInputActionMenuContent, lt as PromptInputHoverCardTriggerProps, m as PromptInputActionMenuTrigger, mt as PromptInputProvider, n as PermissionMode, nt as PromptInputHeader, o as PromptInputActionAddScreenshot, ot as PromptInputHoverCardContentProps, p as PromptInputActionMenuProps, pt as PromptInputProps, q as PromptInputContextAction, r as PromptInput, rt as PromptInputHeaderProps, s as PromptInputActionAddScreenshotProps, st as PromptInputHoverCardProps, t as AttachmentsContext, tt as PromptInputFooterProps, u as PromptInputActionMenuContentProps, ut as PromptInputMessage, v as PromptInputAttachment, vt as PromptInputReferencesProps, w as PromptInputButton, wt as PromptInputTabBody, x as PromptInputAttachmentsProps, xt as PromptInputSubmit, y as PromptInputAttachmentProps, yt as PromptInputSelect, z as PromptInputCommandItem, zt as TooltipSide } from "../PromptInput-Cq-8RoXD.js";
 export { AttachmentsContext, PermissionMode, PromptInput, PromptInputActionAddAttachments, PromptInputActionAddAttachmentsProps, PromptInputActionAddScreenshot, PromptInputActionAddScreenshotProps, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuContentProps, PromptInputActionMenuItem, PromptInputActionMenuItemProps, PromptInputActionMenuProps, PromptInputActionMenuTrigger, PromptInputActionMenuTriggerProps, PromptInputApproval, PromptInputApprovalProps, PromptInputAttachment, PromptInputAttachmentProps, PromptInputAttachments, PromptInputAttachmentsProps, PromptInputBody, PromptInputBodyProps, PromptInputButton, PromptInputButtonProps, PromptInputButtonTooltip, PromptInputCommand, PromptInputCommandComposer, PromptInputCommandComposerProps, PromptInputCommandDefinition, PromptInputCommandEmpty, PromptInputCommandEmptyProps, PromptInputCommandGroup, PromptInputCommandGroupLabel, PromptInputCommandGroupLabelProps, PromptInputCommandGroupProps, PromptInputCommandInput, PromptInputCommandInputProps, PromptInputCommandItem, PromptInputCommandItemProps, PromptInputCommandList, PromptInputCommandListProps, PromptInputCommandProps, PromptInputCommandSeparator, PromptInputCommandSeparatorProps, PromptInputCommandTrigger, PromptInputContextAction, PromptInputContextItem, PromptInputContextSelector, PromptInputContextSelectorProps, PromptInputControllerProps, PromptInputDictation, PromptInputDictationProps, PromptInputFooter, PromptInputFooterProps, PromptInputHeader, PromptInputHeaderProps, PromptInputHoverCard, PromptInputHoverCardContent, PromptInputHoverCardContentProps, PromptInputHoverCardProps, PromptInputHoverCardTrigger, PromptInputHoverCardTriggerProps, PromptInputMessage, PromptInputPermissionSelector, PromptInputPermissionSelectorProps, PromptInputProps, PromptInputProvider, PromptInputProviderProps, PromptInputReference, PromptInputReferences, PromptInputReferencesProps, PromptInputSelect, PromptInputSelectProps, PromptInputSubmit, PromptInputSubmitProps, PromptInputTab, PromptInputTabBody, PromptInputTabBodyProps, PromptInputTabItem, PromptInputTabItemProps, PromptInputTabLabel, PromptInputTabLabelProps, PromptInputTabProps, PromptInputTabsList, PromptInputTabsListProps, PromptInputTextarea, PromptInputTextareaProps, PromptInputTools, PromptInputToolsProps, PromptInputTooltipConfig, TextInputContext, TooltipSide, getApprovalRequestId, getApprovalStateKey, getPendingToolApprovals, usePromptInputAttachments, usePromptInputController, useProviderAttachments };

package/dist/components/Queue.d.ts

@@ -1,5 +1,5 @@
 import { t as Collapsible } from "../Collapsible-N64ASIQr.js";
-import { r as ButtonProps } from "../Button-DLGzHsjc.js";
+import { r as ButtonProps } from "../Button-yRInko9u.js";
 import { ScrollArea } from "./ScrollArea.js";
 import * as React from "react";
 

package/dist/components/RadioGroup.d.ts

@@ -50,9 +50,7 @@ declare function RadioRoot({
   className,
   ref,
   ...props
-}: RadioProps & {
-  ref?: React.Ref<HTMLButtonElement>;
-}): React.JSX.Element;
+}: RadioProps): React.JSX.Element;
 /**
  * The visual indicator for a Radio button.
  */

package/dist/components/ResponsiveSidebarShell.js

@@ -1,8 +1,8 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { G as SidebarIcon } from "../icons-DKXiSepE.js";
 import { Button } from "./Button.js";
-import { n as mergeRefs } from "../merge-refs-DF_7w2x_.js";
 import { AppTopBar } from "./AppTopBar.js";
+import { t as mergeRefs } from "../merge-refs-KlanQB7A.js";
 import { ResizableSidePanel } from "./ResizableSidePanel.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/ScrollArea.d.ts

@@ -10,6 +10,10 @@ interface ScrollAreaRootProps extends React.ComponentPropsWithoutRef<typeof Scro
  * Props for the ScrollArea.Viewport component.
  */
 interface ScrollAreaViewportProps extends React.ComponentPropsWithoutRef<typeof ScrollArea$1.Viewport> {}
+/**
+ * Props for the ScrollArea.Content component.
+ */
+interface ScrollAreaContentProps extends React.ComponentPropsWithoutRef<typeof ScrollArea$1.Content> {}
 /**
  * Props for the ScrollArea.Scrollbar component.
  */
@@ -29,7 +33,7 @@ interface ScrollAreaCornerProps extends React.ComponentPropsWithoutRef<typeof Sc
  * ```tsx
  * <ScrollArea.Root>
  *   <ScrollArea.Viewport>
- *     <div>Scrollable content...</div>
+ *     <ScrollArea.Content>Scrollable content...</ScrollArea.Content>
  *   </ScrollArea.Viewport>
  *   <ScrollArea.Scrollbar>
  *     <ScrollArea.Thumb />
@@ -51,15 +55,21 @@ declare function ScrollAreaRoot({
  */
 declare function ScrollAreaViewport({
   className,
-  tabIndex,
-  role,
-  "aria-label": ariaLabel,
-  "aria-labelledby": ariaLabelledBy,
   ref,
   ...props
 }: ScrollAreaViewportProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
+/**
+ * Content wrapper that keeps Base UI's overflow measurements in sync.
+ */
+declare function ScrollAreaContent({
+  className,
+  ref,
+  ...props
+}: ScrollAreaContentProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
 /**
  * The scrollbar track, either vertical or horizontal.
  */
@@ -100,7 +110,7 @@ declare function ScrollAreaCorner({
  * // Vertical scroll
  * <ScrollArea.Root style={{ height: 200 }}>
  *   <ScrollArea.Viewport>
- *     <div>Long content...</div>
+ *     <ScrollArea.Content>Long content...</ScrollArea.Content>
  *   </ScrollArea.Viewport>
  *   <ScrollArea.Scrollbar>
  *     <ScrollArea.Thumb />
@@ -113,7 +123,7 @@ declare function ScrollAreaCorner({
  * // Both scrollbars
  * <ScrollArea.Root style={{ height: 200, width: 300 }}>
  *   <ScrollArea.Viewport>
- *     <div style={{ width: 600 }}>Wide and tall content...</div>
+ *     <ScrollArea.Content style={{ width: 600 }}>Wide and tall content...</ScrollArea.Content>
  *   </ScrollArea.Viewport>
  *   <ScrollArea.Scrollbar orientation="vertical">
  *     <ScrollArea.Thumb />
@@ -130,9 +140,10 @@ declare function ScrollAreaCorner({
 declare const ScrollArea: {
   Root: typeof ScrollAreaRoot;
   Viewport: typeof ScrollAreaViewport;
+  Content: typeof ScrollAreaContent;
   Scrollbar: typeof ScrollAreaScrollbar;
   Thumb: typeof ScrollAreaThumb;
   Corner: typeof ScrollAreaCorner;
 };
 //#endregion
-export { ScrollArea, ScrollAreaCornerProps, ScrollAreaRootProps, ScrollAreaScrollbarProps, ScrollAreaThumbProps, ScrollAreaViewportProps };
+export { ScrollArea, ScrollAreaContentProps, ScrollAreaCornerProps, ScrollAreaRootProps, ScrollAreaScrollbarProps, ScrollAreaThumbProps, ScrollAreaViewportProps };

package/dist/components/ScrollArea.js

@@ -10,7 +10,7 @@ import { ScrollArea as ScrollArea$1 } from "@base-ui/react/scroll-area";
 * ```tsx
 * <ScrollArea.Root>
 *   <ScrollArea.Viewport>
-*     <div>Scrollable content...</div>
+*     <ScrollArea.Content>Scrollable content...</ScrollArea.Content>
 *   </ScrollArea.Viewport>
 *   <ScrollArea.Scrollbar>
 *     <ScrollArea.Thumb />
@@ -32,15 +32,23 @@ function ScrollAreaRoot({ className, ref, ...props }) {
 /**
 * The scrollable viewport container.
 */
-function ScrollAreaViewport({ className, tabIndex = 0, role = "group", "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ref, ...props }) {
+function ScrollAreaViewport({ className, ref, ...props }) {
 	const classes = mergeBaseClassName(["scroll-area__viewport"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(ScrollArea$1.Viewport, {
 		ref,
 		"data-slot": "scroll-area-viewport",
-		role,
-		"aria-label": ariaLabel ?? (ariaLabelledBy ? void 0 : "Scrollable content"),
-		"aria-labelledby": ariaLabelledBy,
-		tabIndex,
+		className: classes,
+		...props
+	});
+}
+/**
+* Content wrapper that keeps Base UI's overflow measurements in sync.
+*/
+function ScrollAreaContent({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["scroll-area__content"].filter(Boolean).join(" "), className);
+	return /* @__PURE__ */ jsx(ScrollArea$1.Content, {
+		ref,
+		"data-slot": "scroll-area-content",
 		className: classes,
 		...props
 	});
@@ -91,7 +99,7 @@ function ScrollAreaCorner({ className, ref, ...props }) {
 * // Vertical scroll
 * <ScrollArea.Root style={{ height: 200 }}>
 *   <ScrollArea.Viewport>
-*     <div>Long content...</div>
+*     <ScrollArea.Content>Long content...</ScrollArea.Content>
 *   </ScrollArea.Viewport>
 *   <ScrollArea.Scrollbar>
 *     <ScrollArea.Thumb />
@@ -104,7 +112,7 @@ function ScrollAreaCorner({ className, ref, ...props }) {
 * // Both scrollbars
 * <ScrollArea.Root style={{ height: 200, width: 300 }}>
 *   <ScrollArea.Viewport>
-*     <div style={{ width: 600 }}>Wide and tall content...</div>
+*     <ScrollArea.Content style={{ width: 600 }}>Wide and tall content...</ScrollArea.Content>
 *   </ScrollArea.Viewport>
 *   <ScrollArea.Scrollbar orientation="vertical">
 *     <ScrollArea.Thumb />
@@ -121,6 +129,7 @@ function ScrollAreaCorner({ className, ref, ...props }) {
 const ScrollArea = {
 	Root: ScrollAreaRoot,
 	Viewport: ScrollAreaViewport,
+	Content: ScrollAreaContent,
 	Scrollbar: ScrollAreaScrollbar,
 	Thumb: ScrollAreaThumb,
 	Corner: ScrollAreaCorner

package/dist/components/Select.js

@@ -39,13 +39,13 @@ function SelectLabel({ className, ref, ...props }) {
 	const classes = mergeBaseClassName(["select__label"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(Select$1.Label, {
 		ref,
-		"data-slot": "select-label",
+		"data-slot": "select-field-label",
 		className: classes,
 		...props
 	});
 }
 function SelectTrigger({ size = "sm", className, ref, ...props }) {
-	const classes = mergeBaseClassName(["select__trigger", size === "sm" && "select__trigger--sm"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("select__trigger", className);
 	return /* @__PURE__ */ jsx(Select$1.Trigger, {
 		ref,
 		"data-slot": "select-trigger",

package/dist/components/Slider.d.ts

@@ -106,9 +106,7 @@ declare function SliderLabel({
   className,
   ref,
   ...props
-}: SliderLabelProps & {
-  ref?: React.Ref<HTMLSpanElement>;
-}): React.JSX.Element;
+}: SliderLabelProps): React.JSX.Element;
 declare const Slider: {
   Root: typeof SliderRoot;
   Label: typeof SliderLabel;

package/dist/components/Stepper.d.ts

@@ -1,3 +1,4 @@
+import { r as Tabs } from "../Tabs-C49J5m0Q.js";
 import * as React from "react";
 
 //#region src/components/Stepper.d.ts
@@ -12,15 +13,8 @@ type StepIndicators = {
 interface StepperContextValue {
   activeStep: number;
   setActiveStep: (step: number) => void;
-  stepsCount: number;
   orientation: StepperOrientation;
   indicators: StepIndicators;
-  idPrefix: string;
-  registerTrigger: (step: number, node: HTMLButtonElement | null) => void;
-  focusNext: (step: number) => void;
-  focusPrev: (step: number) => void;
-  focusFirst: () => void;
-  focusLast: () => void;
 }
 interface StepItemContextValue {
   step: number;
@@ -87,14 +81,13 @@ declare function Stepper({
 }: StepperProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface StepperNavProps extends React.ComponentPropsWithoutRef<"nav"> {}
+interface StepperNavProps extends Omit<React.ComponentPropsWithoutRef<typeof Tabs.List>, "unstyled"> {}
 declare function StepperNav({
   className,
   ref,
-  role,
   ...props
 }: StepperNavProps & {
-  ref?: React.Ref<HTMLElement>;
+  ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
 interface StepperItemProps extends React.HTMLAttributes<HTMLDivElement> {
   step: number;
@@ -113,17 +106,12 @@ declare function StepperItem({
 }: StepperItemProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface StepperTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {}
+interface StepperTriggerProps extends Omit<React.ComponentPropsWithoutRef<typeof Tabs.Tab>, "unstyled" | "value"> {}
 declare function StepperTrigger({
   className,
   children,
   disabled,
-  id,
   type,
-  "aria-controls": ariaControls,
-  tabIndex,
-  onClick,
-  onKeyDown,
   ref,
   ...props
 }: StepperTriggerProps & {
@@ -171,7 +159,7 @@ declare function StepperPanel({
 }: StepperPanelProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface StepperContentProps extends React.ComponentPropsWithoutRef<"div"> {
+interface StepperContentProps extends Omit<React.ComponentPropsWithoutRef<typeof Tabs.Panel>, "keepMounted" | "unstyled" | "value"> {
   value: number;
   forceMount?: boolean;
   /** Optional vertical rhythm for direct content children. */
@@ -183,12 +171,10 @@ declare function StepperContent({
   spacing,
   className,
   children,
-  id,
-  "aria-labelledby": ariaLabelledBy,
   ref,
   ...props
 }: StepperContentProps & {
   ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element | null;
+}): React.JSX.Element;
 //#endregion
 export { StepIndicators, StepItemContextValue, Stepper, StepperContent, StepperContentProps, StepperContextValue, StepperDescription, StepperDescriptionProps, StepperIndicator, StepperIndicatorProps, StepperItem, StepperItemProps, StepperNav, StepperNavProps, StepperOrientation, StepperPanel, StepperPanelProps, StepperProps, StepperSeparator, StepperSeparatorProps, StepperState, StepperTitle, StepperTitleProps, StepperTrigger, StepperTriggerProps, useStepItem, useStepper };