@mcp-b/react-components 0.20.1 → 0.20.5

package/dist/components/Card.js

@@ -1,3 +1,4 @@
+import { t as cx } from "../class-names-BiMDVpUo.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { useRender } from "@base-ui/react/use-render";
@@ -22,11 +23,7 @@ function Card({ hover = false, size = "default", className = "", children, ref,
 		ref,
 		"data-slot": "card",
 		"data-size": size,
-		className: [
-			"card",
-			hover && "card--hover",
-			className
-		].filter(Boolean).join(" "),
+		className: cx("card", hover && "card--hover", className),
 		...props,
 		children
 	});
@@ -35,7 +32,7 @@ function CardHeader({ className = "", ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "card-header",
-		className: ["card__header", className].filter(Boolean).join(" "),
+		className: cx("card__header", className),
 		...props
 	});
 }
@@ -47,7 +44,7 @@ function CardTitle({ className = "", render, ref, ...props }) {
 		props: {
 			...props,
 			"data-slot": "card-title",
-			className: ["card__title", className].filter(Boolean).join(" ")
+			className: cx("card__title", className)
 		}
 	});
 }
@@ -59,7 +56,7 @@ function CardDescription({ className = "", render, ref, ...props }) {
 		props: {
 			...props,
 			"data-slot": "card-description",
-			className: ["card__description", className].filter(Boolean).join(" ")
+			className: cx("card__description", className)
 		}
 	});
 }
@@ -67,7 +64,7 @@ function CardAction({ className = "", ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "card-action",
-		className: ["card__action", className].filter(Boolean).join(" "),
+		className: cx("card__action", className),
 		...props
 	});
 }
@@ -75,7 +72,7 @@ function CardContent({ className = "", ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "card-content",
-		className: ["card__content", className].filter(Boolean).join(" "),
+		className: cx("card__content", className),
 		...props
 	});
 }
@@ -83,7 +80,7 @@ function CardFooter({ className = "", ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "card-footer",
-		className: ["card__footer", className].filter(Boolean).join(" "),
+		className: cx("card__footer", className),
 		...props
 	});
 }

package/dist/components/ChainOfThought.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Collapsible } from "./Collapsible.js";
-import { K as SpinnerIcon, _ as DotIcon, p as ChevronRightIcon, u as CheckIcon } from "../icons-DKXiSepE.js";
+import { K as SpinnerIcon, _ as DotIcon, p as ChevronRightIcon, u as CheckIcon } from "../icons-DyOM0EJs.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ChainOfThought.tsx
@@ -128,7 +128,7 @@ function ChainOfThoughtSearchResult({ className, children, title, href, ref, ...
 		children: /* @__PURE__ */ jsx("a", {
 			ref,
 			href,
-			className: cx("chain-of-thought__search-result", className),
+			className: cx("chain-of-thought__search-result", "sigvelo-truncate", className),
 			target: "_blank",
 			rel: "noreferrer",
 			...props,

package/dist/components/ChatGptSignInScreen.js

@@ -1,7 +1,7 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { K as SpinnerIcon } from "../icons-DKXiSepE.js";
+import { K as SpinnerIcon } from "../icons-DyOM0EJs.js";
 import { Button } from "./Button.js";
-import { u as ModelSelectorLogo } from "../ModelSelector-4GsCWcZV.js";
+import { u as ModelSelectorLogo } from "../ModelSelector-pecWyOFI.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ChatGptSignInScreen.tsx

package/dist/components/Checkbox.js

@@ -1,5 +1,5 @@
 import { n as mergeBaseClassName } from "../class-names-BiMDVpUo.js";
-import { u as CheckIcon } from "../icons-DKXiSepE.js";
+import { u as CheckIcon } from "../icons-DyOM0EJs.js";
 import { jsx } from "react/jsx-runtime";
 import { Checkbox as Checkbox$1 } from "@base-ui/react/checkbox";
 //#region src/components/Checkbox.tsx
@@ -19,7 +19,7 @@ import { Checkbox as Checkbox$1 } from "@base-ui/react/checkbox";
 * @see {@link https://base-ui.com/react/components/checkbox | Base UI Checkbox}
 */
 function CheckboxRoot({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["checkbox"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("checkbox", className);
 	return /* @__PURE__ */ jsx(Checkbox$1.Root, {
 		ref,
 		"data-slot": "checkbox",

package/dist/components/CheckboxGroup.js

@@ -63,7 +63,7 @@ function CheckboxGroupRoot({ className, layout = "stack", ref, ...props }) {
 	return /* @__PURE__ */ jsx(CheckboxGroup$1, {
 		ref,
 		"data-layout": layout,
-		className: mergeBaseClassName(["checkbox-group"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("checkbox-group", className),
 		...props
 	});
 }
@@ -71,7 +71,7 @@ function CheckboxGroupItem({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("label", {
 		ref,
 		"data-slot": "checkbox-group-item",
-		className: mergeBaseClassName(["checkbox-group__item"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("checkbox-group__item", className),
 		...props
 	});
 }
@@ -79,7 +79,7 @@ function CheckboxGroupIcon({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
 		"data-slot": "checkbox-group-icon",
-		className: mergeBaseClassName(["checkbox-group__icon"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("checkbox-group__icon", className),
 		...props
 	});
 }
@@ -87,7 +87,7 @@ function CheckboxGroupContent({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
 		"data-slot": "checkbox-group-content",
-		className: mergeBaseClassName(["checkbox-group__content"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("checkbox-group__content", className),
 		...props
 	});
 }
@@ -95,7 +95,7 @@ function CheckboxGroupTitle({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
 		"data-slot": "checkbox-group-title",
-		className: mergeBaseClassName(["checkbox-group__title"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("checkbox-group__title", className),
 		...props
 	});
 }
@@ -103,7 +103,7 @@ function CheckboxGroupDescription({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
 		"data-slot": "checkbox-group-description",
-		className: mergeBaseClassName(["checkbox-group__description"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("checkbox-group__description sigvelo-truncate", className),
 		...props
 	});
 }
@@ -111,7 +111,7 @@ function CheckboxGroupTrailing({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
 		"data-slot": "checkbox-group-trailing",
-		className: mergeBaseClassName(["checkbox-group__trailing"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("checkbox-group__trailing", className),
 		...props
 	});
 }

package/dist/components/Checkpoint.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { o as BookmarkIcon } from "../icons-DKXiSepE.js";
+import { o as BookmarkIcon } from "../icons-DyOM0EJs.js";
 import { Marker, MarkerIcon } from "./Marker.js";
 import "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/CodeBlock.js

@@ -1,2 +1,2 @@
-import { a as CodeBlockCopyButton, c as CodeBlockLanguageSelector, d as CodeBlockLanguageSelectorTrigger, f as CodeBlockLanguageSelectorValue, h as CODE_BLOCK_LANGUAGES, i as CodeBlockContent, l as CodeBlockLanguageSelectorContent, m as highlightCode, n as CodeBlockActions, o as CodeBlockFilename, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock, u as CodeBlockLanguageSelectorItem } from "../CodeBlock-Bb-IPBc_.js";
+import { a as CodeBlockCopyButton, c as CodeBlockLanguageSelector, d as CodeBlockLanguageSelectorTrigger, f as CodeBlockLanguageSelectorValue, h as CODE_BLOCK_LANGUAGES, i as CodeBlockContent, l as CodeBlockLanguageSelectorContent, m as highlightCode, n as CodeBlockActions, o as CodeBlockFilename, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock, u as CodeBlockLanguageSelectorItem } from "../CodeBlock-ygtuzqJd.js";
 export { CODE_BLOCK_LANGUAGES, CodeBlock, CodeBlockActions, CodeBlockContainer, CodeBlockContent, CodeBlockCopyButton, CodeBlockFilename, CodeBlockHeader, CodeBlockLanguageSelector, CodeBlockLanguageSelectorContent, CodeBlockLanguageSelectorItem, CodeBlockLanguageSelectorTrigger, CodeBlockLanguageSelectorValue, CodeBlockTitle, highlightCode };

package/dist/components/CodexModelSelector.js

@@ -1,6 +1,7 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { U as RefreshIcon, c as BrainIcon, d as ChevronDownIcon, p as ChevronRightIcon, u as CheckIcon } from "../icons-DKXiSepE.js";
+import { U as RefreshIcon, c as BrainIcon, d as ChevronDownIcon, p as ChevronRightIcon, u as CheckIcon } from "../icons-DyOM0EJs.js";
 import { Tooltip } from "./Tooltip.js";
+import { i as titleCase } from "../format-S6uWyoSb.js";
 import { Menu } from "./Menu.js";
 import "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -60,7 +61,7 @@ function CodexModelSelector({ models, selectedModelId = null, onSelectModel, sel
 				})]
 			}),
 			/* @__PURE__ */ jsxs("span", {
-				className: "codex-model-selector__summary",
+				className: "codex-model-selector__summary sigvelo-truncate",
 				children: [/* @__PURE__ */ jsx("span", { children: selectedModelLabel }), selectedEffort ? /* @__PURE__ */ jsx("span", {
 					className: cx("codex-model-selector__summary-effort", selectedEffort.reasoningEffort === "ultra" && "codex-model-selector__summary-effort--ultra"),
 					children: selectedEffortLabel
@@ -143,7 +144,7 @@ function getServiceTiers(model) {
 }
 function formatSettingLabel(value) {
 	if (value === "xhigh") return "Extra High";
-	return value.split(/[-_]/).filter(Boolean).map((word) => word[0].toUpperCase() + word.slice(1)).join(" ");
+	return titleCase(value);
 }
 function CodexModelSelectorSubmenu({ label, value, disabled = false, children }) {
 	return /* @__PURE__ */ jsxs(Menu.SubmenuRoot, { children: [/* @__PURE__ */ jsxs(Menu.SubmenuTrigger, {
@@ -152,7 +153,7 @@ function CodexModelSelectorSubmenu({ label, value, disabled = false, children })
 		children: [
 			/* @__PURE__ */ jsx("span", { children: label }),
 			/* @__PURE__ */ jsx("span", {
-				className: "codex-model-selector__submenu-value",
+				className: "codex-model-selector__submenu-value sigvelo-truncate",
 				children: value
 			}),
 			/* @__PURE__ */ jsx(ChevronRightIcon, { className: "codex-model-selector__submenu-icon" })

package/dist/components/Collapsible.js

@@ -1,4 +1,4 @@
-import { n as mergeBaseClassName } from "../class-names-BiMDVpUo.js";
+import { n as mergeBaseClassName, t as cx } from "../class-names-BiMDVpUo.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { Collapsible as Collapsible$1 } from "@base-ui/react/collapsible";
@@ -42,7 +42,7 @@ function CollapsibleTrigger({ className, unstyled = false, ref, ...props }) {
 * Supports CSS animations via `--collapsible-panel-height` variable.
 */
 function CollapsiblePanel({ className, unstyled = false, ref, ...props }) {
-	const classes = mergeBaseClassName(["base-ui-disclosure-panel", !unstyled && "collapsible__panel"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName(cx("base-ui-disclosure-panel", !unstyled && "collapsible__panel"), className);
 	return /* @__PURE__ */ jsx(Collapsible$1.Panel, {
 		ref,
 		"data-slot": "collapsible-content",

package/dist/components/Combobox.js

@@ -4,7 +4,7 @@ import { jsx } from "react/jsx-runtime";
 import { Combobox as Combobox$1 } from "@base-ui/react/combobox";
 //#region src/components/Combobox.tsx
 function ComboboxInput({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__input"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__input", className);
 	return /* @__PURE__ */ jsx(Combobox$1.Input, {
 		ref,
 		"data-slot": "combobox-input",
@@ -13,7 +13,7 @@ function ComboboxInput({ className, ref, ...props }) {
 	});
 }
 function ComboboxTrigger({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__trigger"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__trigger", className);
 	return /* @__PURE__ */ jsx(Combobox$1.Trigger, {
 		ref,
 		"data-slot": "combobox-trigger",
@@ -22,7 +22,7 @@ function ComboboxTrigger({ className, ref, ...props }) {
 	});
 }
 function Clear({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__clear"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__clear", className);
 	return /* @__PURE__ */ jsx(Combobox$1.Clear, {
 		ref,
 		"data-slot": "combobox-clear",
@@ -31,7 +31,7 @@ function Clear({ className, ref, ...props }) {
 	});
 }
 function ComboboxPositioner({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__positioner", "base-ui-positioner"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__positioner base-ui-positioner", className);
 	return /* @__PURE__ */ jsx(Combobox$1.Positioner, {
 		ref,
 		"data-slot": "combobox-positioner",
@@ -40,7 +40,7 @@ function ComboboxPositioner({ className, ref, ...props }) {
 	});
 }
 function ComboboxPopup({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__popup", "base-ui-popup"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__popup base-ui-popup", className);
 	return /* @__PURE__ */ jsx(Combobox$1.Popup, {
 		ref,
 		"data-slot": "combobox-content",
@@ -49,7 +49,7 @@ function ComboboxPopup({ className, ref, ...props }) {
 	});
 }
 function ComboboxList({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__list"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__list", className);
 	return /* @__PURE__ */ jsx(Combobox$1.List, {
 		ref,
 		"data-slot": "combobox-list",
@@ -58,7 +58,7 @@ function ComboboxList({ className, ref, ...props }) {
 	});
 }
 function ComboboxItem({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__item"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__item", className);
 	return /* @__PURE__ */ jsx(Combobox$1.Item, {
 		ref,
 		"data-slot": "combobox-item",
@@ -67,7 +67,7 @@ function ComboboxItem({ className, ref, ...props }) {
 	});
 }
 function ItemIndicator({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__item-indicator"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__item-indicator", className);
 	return /* @__PURE__ */ jsx(Combobox$1.ItemIndicator, {
 		ref,
 		"data-slot": "combobox-item-indicator",
@@ -76,7 +76,7 @@ function ItemIndicator({ className, ref, ...props }) {
 	});
 }
 function ComboboxEmpty({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__empty"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__empty", className);
 	return /* @__PURE__ */ jsx(Combobox$1.Empty, {
 		ref,
 		"data-slot": "combobox-empty",
@@ -85,7 +85,7 @@ function ComboboxEmpty({ className, ref, ...props }) {
 	});
 }
 function ComboboxGroup({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__group"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__group", className);
 	return /* @__PURE__ */ jsx(Combobox$1.Group, {
 		ref,
 		"data-slot": "combobox-group",
@@ -94,7 +94,7 @@ function ComboboxGroup({ className, ref, ...props }) {
 	});
 }
 function ComboboxGroupLabel({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["combobox__group-label"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("combobox__group-label", className);
 	return /* @__PURE__ */ jsx(Combobox$1.GroupLabel, {
 		ref,
 		"data-slot": "combobox-group-label",

package/dist/components/Commit.js

@@ -1,7 +1,7 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Collapsible } from "./Collapsible.js";
-import { S as FileIcon, p as ChevronRightIcon } from "../icons-DKXiSepE.js";
-import { t as CopyButton } from "../copy-button-BtRwhRks.js";
+import { S as FileIcon, p as ChevronRightIcon } from "../icons-DyOM0EJs.js";
+import { t as CopyButton } from "../copy-button-vo1paUSi.js";
 import { Badge } from "./Badge.js";
 import { Avatar } from "./Avatar.js";
 import "react";
@@ -110,7 +110,7 @@ function CommitInfo({ className, children, ref, ...props }) {
 function CommitMessage({ className, children, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
-		className: cx("commit__message", className),
+		className: cx("commit__message", "sigvelo-truncate", className),
 		...props,
 		children
 	});
@@ -219,7 +219,7 @@ function CommitFileIcon({ className, ref, ...props }) {
 function CommitFilePath({ className, children, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
-		className: cx("commit__file-path", className),
+		className: cx("commit__file-path", "sigvelo-truncate", className),
 		...props,
 		children
 	});

package/dist/components/Context.js

@@ -1,4 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
+import { n as clamp } from "../format-S6uWyoSb.js";
 import { Popover } from "./Popover.js";
 import { Separator } from "./Separator.js";
 import * as React from "react";
@@ -95,6 +96,7 @@ function ContextContent({ className, side = "top", children, ...props }) {
 	return /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsx(Popover.Positioner, {
 		side,
 		children: /* @__PURE__ */ jsx(Popover.Popup, {
+			"aria-label": "Context usage",
 			className: cx("context__content", className),
 			...props,
 			children
@@ -291,7 +293,7 @@ function getContextUsedTokens(usage) {
 function ProgressRing({ percent, size, stroke }) {
 	const radius = (size - stroke) / 2;
 	const circumference = 2 * Math.PI * radius;
-	const offset = circumference - Math.max(0, Math.min(100, percent)) / 100 * circumference;
+	const offset = circumference - clamp(percent, 0, 100) / 100 * circumference;
 	return /* @__PURE__ */ jsxs("svg", {
 		width: size,
 		height: size,

package/dist/components/ContextMenu.js

@@ -1,5 +1,5 @@
-import { n as mergeBaseClassName } from "../class-names-BiMDVpUo.js";
-import { _ as DotIcon, u as CheckIcon } from "../icons-DKXiSepE.js";
+import { n as mergeBaseClassName, t as cx } from "../class-names-BiMDVpUo.js";
+import { _ as DotIcon, u as CheckIcon } from "../icons-DyOM0EJs.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { ContextMenu as ContextMenu$1 } from "@base-ui/react/context-menu";
@@ -35,7 +35,7 @@ const ContextMenuRoot = (props) => {
 * Interactive area that activates the menu on right-click or long-press.
 */
 function ContextMenuTrigger({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__trigger"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("context-menu__trigger", className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.Trigger, {
 		ref,
 		"data-slot": "context-menu-trigger",
@@ -56,7 +56,7 @@ const ContextMenuPortal = (props) => {
 * Positions the menu at the pointer location.
 */
 function ContextMenuPositioner({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__positioner", "base-ui-positioner"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("context-menu__positioner base-ui-positioner", className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.Positioner, {
 		ref,
 		"data-slot": "context-menu-positioner",
@@ -68,7 +68,7 @@ function ContextMenuPositioner({ className, ref, ...props }) {
 * Container for menu items.
 */
 function ContextMenuPopup({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__popup", "base-ui-popup"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("context-menu__popup base-ui-popup", className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.Popup, {
 		ref,
 		"data-slot": "context-menu-content",
@@ -80,7 +80,7 @@ function ContextMenuPopup({ className, ref, ...props }) {
 * Interactive menu item.
 */
 function ContextMenuItem({ className, inset, variant = "default", ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__item", inset && "context-menu__item--inset"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName(cx("context-menu__item", inset && "context-menu__item--inset"), className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.Item, {
 		ref,
 		"data-slot": "context-menu-item",
@@ -94,7 +94,7 @@ function ContextMenuItem({ className, inset, variant = "default", ref, ...props
 * Visual separator between menu sections.
 */
 function ContextMenuSeparator({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__separator"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("context-menu__separator", className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.Separator, {
 		ref,
 		"data-slot": "context-menu-separator",
@@ -103,7 +103,7 @@ function ContextMenuSeparator({ className, ref, ...props }) {
 	});
 }
 function ContextMenuGroup({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__group"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("context-menu__group", className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.Group, {
 		ref,
 		"data-slot": "context-menu-group",
@@ -112,7 +112,7 @@ function ContextMenuGroup({ className, ref, ...props }) {
 	});
 }
 function ContextMenuGroupLabel({ className, inset, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__label", inset && "context-menu__label--inset"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName(cx("context-menu__label", inset && "context-menu__label--inset"), className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.GroupLabel, {
 		ref,
 		"data-slot": "context-menu-label",
@@ -122,7 +122,7 @@ function ContextMenuGroupLabel({ className, inset, ref, ...props }) {
 	});
 }
 function ContextMenuCheckboxItem({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__checkbox-item"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("context-menu__checkbox-item", className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.CheckboxItem, {
 		ref,
 		"data-slot": "context-menu-checkbox-item",
@@ -139,7 +139,7 @@ function ContextMenuCheckboxItemIndicator({ children, className, ...props }) {
 	});
 }
 function ContextMenuRadioGroup({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__radio-group"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("context-menu__radio-group", className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.RadioGroup, {
 		ref,
 		"data-slot": "context-menu-radio-group",
@@ -148,7 +148,7 @@ function ContextMenuRadioGroup({ className, ref, ...props }) {
 	});
 }
 function ContextMenuRadioItem({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["context-menu__radio-item"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("context-menu__radio-item", className);
 	return /* @__PURE__ */ jsx(ContextMenu$1.RadioItem, {
 		ref,
 		"data-slot": "context-menu-radio-item",
@@ -168,7 +168,7 @@ function ContextMenuShortcut({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
 		"data-slot": "context-menu-shortcut",
-		className: mergeBaseClassName(["context-menu__shortcut"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("context-menu__shortcut", className),
 		...props
 	});
 }

package/dist/components/Conversation.js

@@ -1,6 +1,7 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { n as ArrowDownIcon, v as DownloadIcon } from "../icons-DKXiSepE.js";
+import { n as ArrowDownIcon, v as DownloadIcon } from "../icons-DyOM0EJs.js";
 import { Button } from "./Button.js";
+import { t as assignRef } from "../merge-refs-DF_7w2x_.js";
 import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport } from "./MessageScroller.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -44,13 +45,7 @@ import { isReasoningUIPart, isTextUIPart } from "ai";
 * @see {@link https://elements.ai-sdk.dev/components/conversation | AI Elements Conversation}
 */
 function Conversation({ className, children, ref, ...props }) {
-	const handleViewportRef = React.useCallback((element) => {
-		if (typeof ref === "function") {
-			ref(element);
-			return;
-		}
-		if (ref) ref.current = element;
-	}, [ref]);
+	const handleViewportRef = React.useCallback((element) => assignRef(ref, element), [ref]);
 	return /* @__PURE__ */ jsx(MessageScrollerProvider, {
 		autoScroll: true,
 		defaultScrollPosition: "end",

package/dist/components/Dialog.js

@@ -33,7 +33,7 @@ function DialogTrigger(props) {
 	});
 }
 function DialogBackdrop({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["dialog__backdrop", "base-ui-backdrop"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("dialog__backdrop base-ui-backdrop", className);
 	return /* @__PURE__ */ jsx(Dialog$1.Backdrop, {
 		ref,
 		"data-slot": "dialog-overlay",
@@ -42,7 +42,7 @@ function DialogBackdrop({ className, ref, ...props }) {
 	});
 }
 function DialogViewport({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["dialog__viewport"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("dialog__viewport", className);
 	return /* @__PURE__ */ jsx(Dialog$1.Viewport, {
 		ref,
 		"data-slot": "dialog-viewport",
@@ -67,7 +67,7 @@ function DialogHeader({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "dialog-header",
-		className: mergeBaseClassName(["dialog__header"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("dialog__header", className),
 		...props
 	});
 }
@@ -75,12 +75,12 @@ function DialogFooter({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "dialog-footer",
-		className: mergeBaseClassName(["dialog__footer"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("dialog__footer", className),
 		...props
 	});
 }
 function DialogTitle({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["dialog__title"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("dialog__title", className);
 	return /* @__PURE__ */ jsx(Dialog$1.Title, {
 		ref,
 		"data-slot": "dialog-title",
@@ -89,7 +89,7 @@ function DialogTitle({ className, ref, ...props }) {
 	});
 }
 function DialogDescription({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["dialog__description"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("dialog__description", className);
 	return /* @__PURE__ */ jsx(Dialog$1.Description, {
 		ref,
 		"data-slot": "dialog-description",

package/dist/components/EnvironmentVariables.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { b as EyeIcon, x as EyeOffIcon } from "../icons-DKXiSepE.js";
-import { t as CopyButton } from "../copy-button-BtRwhRks.js";
+import { b as EyeIcon, x as EyeOffIcon } from "../icons-DyOM0EJs.js";
+import { t as CopyButton } from "../copy-button-vo1paUSi.js";
 import { Badge } from "./Badge.js";
 import { Switch } from "./Switch.js";
 import * as React from "react";
@@ -164,7 +164,7 @@ function EnvironmentVariableValue({ className, children, ref, ...props }) {
 	const masked = "•".repeat(Math.min(value.length, 12));
 	return /* @__PURE__ */ jsx("span", {
 		ref,
-		className: cx("environment-variables__value", className),
+		className: cx("environment-variables__value", "sigvelo-truncate", className),
 		...props,
 		children: children ?? (showValues ? value : masked)
 	});

package/dist/components/Field.js

@@ -19,7 +19,7 @@ import { Field as Field$1 } from "@base-ui/react/field";
 * @see {@link https://base-ui.com/react/components/field | Base UI Field}
 */
 function FieldRoot({ className, orientation = "vertical", ref, ...props }) {
-	const classes = mergeBaseClassName(["field", orientation !== "vertical" && `field--${orientation}`].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName(cx("field", orientation !== "vertical" && `field--${orientation}`), className);
 	return /* @__PURE__ */ jsx(Field$1.Root, {
 		ref,
 		role: "group",
@@ -169,7 +169,7 @@ function FieldSet({ className = "", ref, ...props }) {
 	return /* @__PURE__ */ jsx("fieldset", {
 		ref,
 		"data-slot": "field-set",
-		className: ["field-set", className].filter(Boolean).join(" "),
+		className: cx("field-set", className),
 		...props
 	});
 }
@@ -178,7 +178,7 @@ function FieldLegend({ className = "", variant = "legend", ref, ...props }) {
 		ref,
 		"data-slot": "field-legend",
 		"data-variant": variant,
-		className: ["field-legend", className].filter(Boolean).join(" "),
+		className: cx("field-legend", className),
 		...props
 	});
 }
@@ -186,7 +186,7 @@ function FieldContent({ className = "", ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "field-content",
-		className: ["field-content", className].filter(Boolean).join(" "),
+		className: cx("field-content", className),
 		...props
 	});
 }
@@ -194,7 +194,7 @@ function FieldTitle({ className = "", ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "field-title",
-		className: ["field-title", className].filter(Boolean).join(" "),
+		className: cx("field-title", className),
 		...props
 	});
 }
@@ -202,7 +202,7 @@ function FieldGroup({ className = "", ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "field-group",
-		className: ["field-group", className].filter(Boolean).join(" "),
+		className: cx("field-group", className),
 		...props
 	});
 }
@@ -211,7 +211,7 @@ function FieldSeparator({ className = "", children, ref, ...props }) {
 		ref,
 		"data-slot": "field-separator",
 		"data-content": Boolean(children),
-		className: ["field-separator", className].filter(Boolean).join(" "),
+		className: cx("field-separator", className),
 		...props,
 		children: [/* @__PURE__ */ jsx("span", {
 			"aria-hidden": "true",