@botiverse/raft-ui 0.94.0 → 0.95.1

package/CHANGELOG.md

@@ -1,3 +1,38 @@
+## [0.95.1](https://github.com/botiverse/raft-design/compare/v0.95.0...v0.95.1) (2026-11-12)
+
+### Added
+
+- **`SelectTrigger fit`: a select as wide as its longest option** ([Select › As wide as its longest option](https://raft-design.botiverse.build/components/select/#as-wide-as-its-longest-option)) ([#1206](https://github.com/botiverse/raft-design/pull/1206), [#1207](https://github.com/botiverse/raft-design/pull/1207)). With `fit`, the trigger is as wide as the longest label in the root's `items` or its placeholder, at least 11rem and at most 20rem; past 20rem the value ends in an ellipsis. `SelectValue` lays every label out in its own place, invisible, 0px high and hidden from screen readers, so the width needs no script and stays the same whichever value is chosen.
+  - Why: a settings row's select sits at the row's end, as wide as its longest option ([Forms › A setting's row](https://raft-design.botiverse.build/patterns/forms/#a-settings-row)); a trigger that only lays out its value would shrink to a short one and move the row's end with each choice.
+  - Affects: nothing until a trigger sets `fit`. It needs `items` on `Select` and a `SelectValue` in the trigger; without `items` it stays at 11rem. A trigger without `fit` renders as before.
+  - Docs: https://raft-design.botiverse.build/components/select/#as-wide-as-its-longest-option
+
+### Changed
+
+- **An attached row under a row that is a target keeps its hairline and top inset** ([ListRow › A row that belongs to the setting above](https://raft-design.botiverse.build/components/list-row/#a-row-that-belongs-to-the-setting-above)) ([#1201](https://github.com/botiverse/raft-design/pull/1201)). A display-only `attached` row (`interactive={false}`) right under an interactive row now draws the hairline above it and, as a `plain` row, keeps its top inset. `ListRow` decides this from the row above (it now sets `data-interactive`), so callers change nothing.
+  - Why: under a target, dropping them left the target's hover and press fill ending on an edge you couldn't see, right against the attached row's own buttons (a pinned item with Remove and Replace under it).
+  - Affects: only that pair. An attached row under a display-only setting (quiet hours' times), and attached rows that are targets themselves (a level's per-channel rows), look as before.
+  - Docs: https://raft-design.botiverse.build/components/list-row/#a-row-that-belongs-to-the-setting-above
+- **`ArtifactIcon` (`@botiverse/ricons` 0.1.1): its page is drawn 2 wider** ([#1210](https://github.com/botiverse/raft-design/pull/1210)). raft-ui 0.95.1 depends on ricons 0.1.1.
+  - Why: Lucide's portrait page is 16 wide where the icons beside it in a rail or a menu are 20, so at the same size it read one size smaller.
+  - Affects: the page spans x 3 to 21 of the 24 grid (was 4 to 20), same height; `FollowArtifactIcon` and `UnfollowArtifactIcon` use the same page. The `< >` is unchanged.
+  - Docs: https://raft-design.botiverse.build/components/icons/
+
+## [0.95.0](https://github.com/botiverse/raft-design/compare/v0.94.0...v0.95.0) (2026-11-11)
+
+### Breaking
+
+- **raft-ui no longer exports its own icons: import them from `@botiverse/ricons`** ([Icons](https://raft-design.botiverse.build/components/icons/)). `MessageIcon`, `ChatIcon`, `DirectMessageIcon`, `ThreadIcon`, `CommentIcon`, `FeedbackIcon`, `ArtifactIcon`, `FollowThreadIcon`, `UnfollowThreadIcon`, `JoinChannelIcon`, `LeaveChannelIcon`, `JoinPrivateChannelIcon`, `LeavePrivateChannelIcon`, `JoinJointChannelIcon`, `LeaveJointChannelIcon`, `FollowArtifactIcon`, `UnfollowArtifactIcon`, `AddCommentIcon`, `ReopenTaskIcon` and the types `ActionIconProps`, `ConversationIconProps` and `ObjectIconProps` moved to the new package `@botiverse/ricons` (packages/icons), with the same names, types and drawings. raft-ui depends on it for its own components and doesn't export them: the icons have one import path.
+  - Why: the icons are their own package, kept in this repository, so an app can use them without raft-ui; a second path through raft-ui would leave two ways to import the same icon (Artea, #proj-raft-ui:#236).
+  - Affects: an import of any of these names from `@botiverse/raft-ui` no longer compiles. Add `@botiverse/ricons` to the app's dependencies and import them from it: `import { FollowThreadIcon, UnfollowThreadIcon, ThreadIcon } from "@botiverse/ricons";`. The `[data-icon-sizes]` rule (`UnfollowArtifactIcon`'s minus at 16px) moved to `@botiverse/ricons/styles.css`, which raft-ui's `styles.css` imports, so an app that loads raft-ui's stylesheet needs no other CSS.
+  - Docs: https://raft-design.botiverse.build/components/icons/
+
+### Changed
+
+- **Base UI 1.9: a closed Select or Combobox popup unmounts on its own, even with `actionsRef`** ([Select](https://raft-design.botiverse.build/components/select/), [Combobox](https://raft-design.botiverse.build/components/combobox/)). raft-ui now depends on `@base-ui/react` 1.9, which decouples automatic unmounting from `actionsRef` for Select, Combobox and Autocomplete. Before, passing `actionsRef` kept the popup mounted after it closed until you called `actionsRef.current.unmount()`. Now it unmounts when closing finishes unless `onOpenChange` opts out.
+  - Why: the dependency update (#1193). raft-ui itself does not use `actionsRef` or `unmount()`.
+  - Affects: only an app that passes `actionsRef` to `Select` or `Combobox` and relied on the popup staying mounted, for example to run its own closing animation. In `onOpenChange`, call `eventDetails.preventUnmountOnClose()` when it closes, then `actionsRef.current.unmount()` as before. Nothing else changes.
+
 ## [0.94.0](https://github.com/botiverse/raft-design/compare/v0.93.0...v0.94.0) (2026-11-11)
 
 ### Added

package/codemods/button-sizes.mjs

@@ -37,17 +37,29 @@ let babelParse;
 /**
  * @babel/parser is an optional peer dependency of raft-ui: only this codemod
  * uses it. Look in the project being migrated first, then beside raft-ui.
+ * Only a parser that is not there asks to install it: one that is there but
+ * fails to load (Babel 8 is ESM only, and a Node without require(esm) can't
+ * load it) reports its own error.
  */
 function loadParser() {
   if (babelParse) return babelParse;
+  let loadError;
   for (const from of [path.join(process.cwd(), "package.json"), import.meta.url]) {
     try {
       babelParse = createRequire(from)("@babel/parser").parse;
       return babelParse;
-    } catch {
-      // Try the next place.
+    } catch (error) {
+      const missing =
+        error?.code === "MODULE_NOT_FOUND" && String(error.message).includes("'@babel/parser'");
+      if (!missing) loadError ??= error;
     }
   }
+  if (loadError) {
+    throw new Error(
+      `@babel/parser is installed but failed to load: ${loadError.message ?? loadError}`,
+      { cause: loadError },
+    );
+  }
   throw new Error(
     "install @babel/parser to run this codemod (it parses your TSX): pnpm add -D @babel/parser",
   );

package/dist/cn.d.mts

@@ -1,7 +1,5 @@
 import { ClassValue } from "cnfast";
-//#region src/lib/cn.d.ts
 /** The `--z-index-*` names of styles.css, in order (design/foundations/elevation.md#layer-order). */
 export declare const Z_INDEX_NAMES: string[];
 export declare function cn(...inputs: ClassValue[]): string;
-//#endregion
 export type { ClassValue };

package/dist/cn.mjs

@@ -1,6 +1,6 @@
 import { clsx } from "cnfast";
 import { extendTailwindMerge } from "tailwind-merge";
-//#region src/lib/cn.ts
+// src/lib/cn.ts
 /** The `--z-index-*` names of styles.css, in order (design/foundations/elevation.md#layer-order). */
 const Z_INDEX_NAMES = [
 	"below",
@@ -90,5 +90,4 @@ const twMerge = extendTailwindMerge({ extend: {
 function cn(...inputs) {
 	return twMerge(clsx(inputs));
 }
-//#endregion
 export { Z_INDEX_NAMES, cn };

package/dist/components/activity-inbox/activity-inbox-shell.d.mts

@@ -1,6 +1,5 @@
 import { Panel } from "../panel/panel.mjs";
 import { ComponentPropsWithRef } from "react";
-//#region src/components/activity-inbox/activity-inbox-shell.d.ts
 export type ActivityInboxPanelProps = ComponentPropsWithRef<typeof Panel>;
 export declare function ActivityInboxPanel({ className, ...props }: ActivityInboxPanelProps): import("react").JSX.Element;
 export type ActivityInboxViewportProps = ComponentPropsWithRef<"div">;
@@ -11,5 +10,4 @@ export type ActivityInboxViewportProps = ComponentPropsWithRef<"div">;
  *  the scrolling element's; a frame around it holds the scrollbar. */
 export declare function ActivityInboxViewport({ children, className, ref, style, ...props }: ActivityInboxViewportProps): import("react").JSX.Element;
 export type ActivityInboxLoadingMoreProps = ComponentPropsWithRef<"div">;
-export declare function ActivityInboxLoadingMore({ className, ...props }: ActivityInboxLoadingMoreProps): import("react").JSX.Element;
-//#endregion
+export declare function ActivityInboxLoadingMore({ className, ...props }: ActivityInboxLoadingMoreProps): import("react").JSX.Element;

package/dist/components/activity-inbox/activity-inbox-shell.mjs

@@ -1,11 +1,11 @@
 import { cn } from "../../cn.mjs";
+import { Panel } from "../panel/panel.mjs";
 import { ScrollAreaGutters } from "../scroll-area/scroll-area-gutters.mjs";
 import { useScrollAreaContainer } from "../scroll-area/use-scroll-area-container.mjs";
-import { Panel } from "../panel/panel.mjs";
 import { activityInboxShell } from "./activity-inbox-shell.recipe.mjs";
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/activity-inbox/activity-inbox-shell.tsx
+// src/components/activity-inbox/activity-inbox-shell.tsx
 function ActivityInboxPanel({ className, ...props }) {
 	const { panel } = activityInboxShell();
 	return /* @__PURE__ */ jsx(Panel, {
@@ -54,5 +54,4 @@ function ActivityInboxLoadingMore({ className, ...props }) {
 		...props
 	});
 }
-//#endregion
 export { ActivityInboxLoadingMore, ActivityInboxPanel, ActivityInboxViewport };

package/dist/components/activity-inbox/activity-inbox-shell.recipe.mjs

@@ -1,6 +1,6 @@
 import { listColumnMargin } from "../../lib/head-edges.mjs";
 import { tv } from "../../lib/tv.mjs";
-//#region src/components/activity-inbox/activity-inbox-shell.recipe.ts
+// src/components/activity-inbox/activity-inbox-shell.recipe.ts
 const activityInboxShell = tv({ slots: {
 	panel: [
 		"flex h-full min-h-0 flex-1 flex-col overflow-hidden",
@@ -15,5 +15,4 @@ const activityInboxShell = tv({ slots: {
 	],
 	loadingMore: ["py-3 text-center", "text-caption text-foreground-hint"]
 } });
-//#endregion
 export { activityInboxShell };

package/dist/components/activity-inbox/activity-inbox-sidebar.d.mts

@@ -1,6 +1,4 @@
 import { SidebarRoot } from "../sidebar/sidebar.mjs";
 import { ComponentPropsWithRef } from "react";
-//#region src/components/activity-inbox/activity-inbox-sidebar.d.ts
 export type ActivityInboxSidebarProps = ComponentPropsWithRef<typeof SidebarRoot>;
-export declare function ActivityInboxSidebar({ className, children, ...props }: ActivityInboxSidebarProps): import("react").JSX.Element;
-//#endregion
+export declare function ActivityInboxSidebar({ className, children, ...props }: ActivityInboxSidebarProps): import("react").JSX.Element;

package/dist/components/activity-inbox/activity-inbox-sidebar.mjs

@@ -1,7 +1,7 @@
 import { SidebarBody, SidebarContent, SidebarRoot } from "../sidebar/sidebar.mjs";
 import { activityInboxSidebar } from "./activity-inbox-sidebar.recipe.mjs";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/activity-inbox/activity-inbox-sidebar.tsx
+// src/components/activity-inbox/activity-inbox-sidebar.tsx
 function ActivityInboxSidebar({ className, children, ...props }) {
 	const { sidebar, sidebarBody, sidebarContent } = activityInboxSidebar();
 	return /* @__PURE__ */ jsx(SidebarRoot, {
@@ -18,5 +18,4 @@ function ActivityInboxSidebar({ className, children, ...props }) {
 		})
 	});
 }
-//#endregion
 export { ActivityInboxSidebar };

package/dist/components/activity-inbox/activity-inbox-sidebar.recipe.mjs

@@ -1,5 +1,5 @@
 import { tv } from "../../lib/tv.mjs";
-//#region src/components/activity-inbox/activity-inbox-sidebar.recipe.ts
+// src/components/activity-inbox/activity-inbox-sidebar.recipe.ts
 const activityInboxSidebar = tv({ slots: {
 	sidebar: [
 		"shrink-0",
@@ -18,5 +18,4 @@ const activityInboxSidebar = tv({ slots: {
 		"**:data-activity-inbox-show-all:whitespace-nowrap"
 	]
 } });
-//#endregion
 export { activityInboxSidebar };

package/dist/components/activity-inbox/activity-inbox-toolbar.d.mts

@@ -1,9 +1,7 @@
 import { ComponentPropsWithRef } from "react";
-//#region src/components/activity-inbox/activity-inbox-toolbar.d.ts
 export type ActivityInboxControlsProps = ComponentPropsWithRef<"div">;
 export declare function ActivityInboxControls({ className, ...props }: ActivityInboxControlsProps): import("react").JSX.Element;
 export type ActivityInboxSelectionToolbarProps = ComponentPropsWithRef<"div">;
 export declare function ActivityInboxSelectionToolbar({ className, ...props }: ActivityInboxSelectionToolbarProps): import("react").JSX.Element;
 export type ActivityInboxSelectionCountProps = ComponentPropsWithRef<"span">;
-export declare function ActivityInboxSelectionCount({ className, ...props }: ActivityInboxSelectionCountProps): import("react").JSX.Element;
-//#endregion
+export declare function ActivityInboxSelectionCount({ className, ...props }: ActivityInboxSelectionCountProps): import("react").JSX.Element;

package/dist/components/activity-inbox/activity-inbox-toolbar.mjs

@@ -1,6 +1,6 @@
 import { activityInboxToolbar } from "./activity-inbox-toolbar.recipe.mjs";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/activity-inbox/activity-inbox-toolbar.tsx
+// src/components/activity-inbox/activity-inbox-toolbar.tsx
 function ActivityInboxControls({ className, ...props }) {
 	const { controls } = activityInboxToolbar();
 	return /* @__PURE__ */ jsx("div", {
@@ -25,5 +25,4 @@ function ActivityInboxSelectionCount({ className, ...props }) {
 		...props
 	});
 }
-//#endregion
 export { ActivityInboxControls, ActivityInboxSelectionCount, ActivityInboxSelectionToolbar };

package/dist/components/activity-inbox/activity-inbox-toolbar.recipe.mjs

@@ -1,5 +1,5 @@
 import { tv } from "../../lib/tv.mjs";
-//#region src/components/activity-inbox/activity-inbox-toolbar.recipe.ts
+// src/components/activity-inbox/activity-inbox-toolbar.recipe.ts
 const activityInboxToolbar = tv({ slots: {
 	controls: [
 		"flex shrink-0 flex-nowrap items-center gap-2",
@@ -15,5 +15,4 @@ const activityInboxToolbar = tv({ slots: {
 	],
 	selectionCount: ["mr-1", "text-footnote font-bold text-foreground"]
 } });
-//#endregion
 export { activityInboxToolbar };

package/dist/components/alert-dialog/alert-dialog.d.mts

@@ -3,7 +3,6 @@ import { ButtonProps } from "../button/button.mjs";
 import "../button/index.mjs";
 import { Dialog } from "@base-ui/react/dialog";
 import { ComponentPropsWithRef, ReactNode } from "react";
-//#region src/components/alert-dialog/alert-dialog.d.ts
 export type AlertDialogProps = Dialog.Root.Props;
 export declare function AlertDialog({ children, ...props }: AlertDialogProps): import("react").JSX.Element;
 export type AlertDialogTriggerProps = Dialog.Trigger.Props;
@@ -37,5 +36,4 @@ export declare function AlertDialogAction(props: AlertDialogActionProps): import
 export type AlertDialogCancelProps = Omit<Dialog.Close.Props, "render"> & Pick<ButtonProps, "variant" | "size"> & {
   className?: string;
 };
-export declare function AlertDialogCancel({ className, variant, size, ...props }: AlertDialogCancelProps): import("react").JSX.Element;
-//#endregion
+export declare function AlertDialogCancel({ className, variant, size, ...props }: AlertDialogCancelProps): import("react").JSX.Element;

package/dist/components/alert-dialog/alert-dialog.mjs

@@ -10,7 +10,7 @@ import { DialogSheetReset } from "../dialog/dialog-sheet-context.mjs";
 import { Dialog } from "@base-ui/react/dialog";
 import { X } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/alert-dialog/alert-dialog.tsx
+// src/components/alert-dialog/alert-dialog.tsx
 const alertDialog = tv({
 	slots: {
 		overlay: ["fixed inset-0 z-dialog bg-layer-backdrop"],
@@ -160,5 +160,4 @@ function AlertDialogCancel({ className, variant, size, ...props }) {
 		...props
 	});
 }
-//#endregion
 export { AlertDialog, AlertDialogAction, AlertDialogBody, AlertDialogCancel, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };

package/dist/components/announcement-dialog/announcement-dialog.d.mts

@@ -1,10 +1,9 @@
 import { ButtonProps } from "../button/button.mjs";
-import "../button/index.mjs";
+import "../dialog/index.mjs";
 import { ScrollAreaProps } from "../scroll-area/types.mjs";
 import { Dialog, DialogClose, DialogContentProps, DialogTitleProps, DialogTrigger } from "../dialog/dialog.mjs";
-import "../dialog/index.mjs";
+import "../button/index.mjs";
 import { ComponentPropsWithRef } from "react";
-//#region src/components/announcement-dialog/announcement-dialog.d.ts
 export declare function AnnouncementDialogContent({ className, initialFocus, ref, ...props }: DialogContentProps): import("react").JSX.Element;
 export declare function AnnouncementDialogBody({ className, ...props }: ScrollAreaProps): import("react").JSX.Element;
 export declare function AnnouncementDialogHeader({ className, ...props }: ComponentPropsWithRef<"div">): import("react").JSX.Element;
@@ -15,5 +14,4 @@ export declare function AnnouncementDialogText({ className, ...props }: Componen
 export declare function AnnouncementDialogFooter({ className, ...props }: ComponentPropsWithRef<"div">): import("react").JSX.Element;
 export declare function AnnouncementDialogAction({ className, ...props }: Omit<ButtonProps, "variant">): import("react").JSX.Element;
 export declare function AnnouncementDialogSecondaryAction({ className, ...props }: Omit<ButtonProps, "variant">): import("react").JSX.Element;
-//#endregion
 export { Dialog as AnnouncementDialog, DialogClose as AnnouncementDialogClose, DialogTrigger as AnnouncementDialogTrigger };

package/dist/components/announcement-dialog/announcement-dialog.mjs

@@ -1,10 +1,10 @@
 import { tv } from "../../lib/tv.mjs";
+import { Dialog, DialogClose, DialogContent, DialogTitle, DialogTrigger } from "../dialog/dialog.mjs";
 import { Button } from "../button/button.mjs";
 import { ScrollArea } from "../scroll-area/scroll-area.mjs";
-import { Dialog, DialogClose, DialogContent, DialogTitle, DialogTrigger } from "../dialog/dialog.mjs";
 import { useCallback, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/announcement-dialog/announcement-dialog.tsx
+// src/components/announcement-dialog/announcement-dialog.tsx
 const announcement = tv({ slots: {
 	content: ["@container/announcement max-w-xl gap-0 overflow-clip p-0"],
 	body: [
@@ -118,5 +118,4 @@ function AnnouncementDialogSecondaryAction({ className, ...props }) {
 		...props
 	});
 }
-//#endregion
 export { Dialog as AnnouncementDialog, AnnouncementDialogAction, AnnouncementDialogBody, DialogClose as AnnouncementDialogClose, AnnouncementDialogContent, AnnouncementDialogFooter, AnnouncementDialogHeader, AnnouncementDialogLabel, AnnouncementDialogPicture, AnnouncementDialogSecondaryAction, AnnouncementDialogText, AnnouncementDialogTitle, DialogTrigger as AnnouncementDialogTrigger };

package/dist/components/app-link-card/app-link-card.d.mts

@@ -1,5 +1,4 @@
 import { ComponentPropsWithRef } from "react";
-//#region src/components/app-link-card/app-link-card.d.ts
 export type AppLinkCardProps = ComponentPropsWithRef<"div">;
 /**
  * An app link's card drawn in the message, after the link's paragraph, where
@@ -52,5 +51,4 @@ export type AppLinkCardActionsProps = ComponentPropsWithRef<"div">;
  * The app's buttons at the card's bottom end: at most two, the bordered one
  * last, with a More menu (⋯) to their left for the rest.
  */
-export declare function AppLinkCardActions({ className, ...props }: AppLinkCardActionsProps): import("react").JSX.Element;
-//#endregion
+export declare function AppLinkCardActions({ className, ...props }: AppLinkCardActionsProps): import("react").JSX.Element;

package/dist/components/app-link-card/app-link-card.mjs

@@ -2,7 +2,7 @@ import { tv } from "../../lib/tv.mjs";
 import { messageCard, messageEmbed } from "../message-embed/message-embed.recipe.mjs";
 import { Skeleton } from "../skeleton/skeleton.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/app-link-card/app-link-card.tsx
+// src/components/app-link-card/app-link-card.tsx
 const appLinkCard = tv({ slots: {
 	root: ["flex flex-col", "my-2 first:mt-0 last:mb-0"],
 	placeholderLine: ["flex h-lh items-center"],
@@ -185,5 +185,4 @@ function AppLinkCardActions({ className, ...props }) {
 		...props
 	});
 }
-//#endregion
 export { AppLinkCard, AppLinkCardActions, AppLinkCardBody, AppLinkCardEyebrow, AppLinkCardHeader, AppLinkCardHost, AppLinkCardIcon, AppLinkCardMeta, AppLinkCardName, AppLinkCardPlaceholder, AppLinkCardTitle };

package/dist/components/app-rail/app-rail.d.mts

@@ -1,6 +1,5 @@
 import { StatusProps } from "../status/status.mjs";
 import { useRender } from "@base-ui/react/use-render";
-//#region src/components/app-rail/app-rail.d.ts
 export type AppRailRootProps = useRender.ComponentProps<"div">;
 export declare function AppRailRoot({ className, render, ...props }: AppRailRootProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 export type AppRailHeaderProps = useRender.ComponentProps<"div">;
@@ -27,5 +26,4 @@ export declare function AppRailItemBadge({ className, render, ...props }: AppRai
 export type AppRailItemIndicatorProps = StatusProps;
 export declare function AppRailItemIndicator({ className, size, variant, ...props }: AppRailItemIndicatorProps): import("react").JSX.Element;
 export type AppRailFooterProps = useRender.ComponentProps<"div">;
-export declare function AppRailFooter({ className, render, ...props }: AppRailFooterProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
-//#endregion
+export declare function AppRailFooter({ className, render, ...props }: AppRailFooterProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/dist/components/app-rail/app-rail.mjs

@@ -4,7 +4,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@base-ui/react/button";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
-//#region src/components/app-rail/app-rail.tsx
+// src/components/app-rail/app-rail.tsx
 function AppRailRoot({ className, render, ...props }) {
 	const { root } = appRail();
 	const defaultProps = {
@@ -122,5 +122,4 @@ function AppRailFooter({ className, render, ...props }) {
 		props: mergeProps(defaultProps, props)
 	});
 }
-//#endregion
 export { AppRailFooter, AppRailHeader, AppRailItem, AppRailItemAttention, AppRailItemBadge, AppRailItemIcon, AppRailItemIndicator, AppRailItemLabel, AppRailNav, AppRailRoot };

package/dist/components/app-rail/app-rail.recipe.mjs

@@ -1,5 +1,5 @@
 import { tv } from "../../lib/tv.mjs";
-//#region src/components/app-rail/app-rail.recipe.ts
+// src/components/app-rail/app-rail.recipe.ts
 const appRail = tv({ slots: {
 	root: [
 		"flex size-full  flex-col items-center select-none",
@@ -48,5 +48,4 @@ const appRail = tv({ slots: {
 	],
 	itemIndicator: ["pointer-events-none absolute", "-top-1 -right-1"]
 } });
-//#endregion
 export { appRail };

package/dist/components/app-shell/app-shell.d.mts

@@ -1,6 +1,5 @@
 import { ReactNode } from "react";
 import { useRender } from "@base-ui/react/use-render";
-//#region src/components/app-shell/app-shell.d.ts
 export type AppShellRootProps = useRender.ComponentProps<"div"> & {
   defaultSidebarOpen?: boolean;
   onSidebarOpenChange?: (open: boolean) => void;
@@ -23,5 +22,4 @@ export declare function AppShellMainSlot({ className, overlay, render, ...props
 export type AppShellSidebarTriggerProps = useRender.ComponentProps<"button"> & {
   children: ReactNode;
 };
-export declare function AppShellSidebarTrigger(props: AppShellSidebarTriggerProps): import("react").JSX.Element | null;
-//#endregion
+export declare function AppShellSidebarTrigger(props: AppShellSidebarTriggerProps): import("react").JSX.Element | null;

package/dist/components/app-shell/app-shell.mjs

@@ -1,11 +1,11 @@
-import { cn } from "../../cn.mjs";
 import { tv } from "../../lib/tv.mjs";
+import { cn } from "../../cn.mjs";
 import { PanelAction } from "../panel/panel-action.mjs";
 import { createContext, useCallback, useContext, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
-//#region src/components/app-shell/app-shell.tsx
+// src/components/app-shell/app-shell.tsx
 const appShell = tv({
 	slots: {
 		root: [
@@ -213,5 +213,4 @@ function AppShellSidebarTriggerButton({ sidebar, className, children, onClick, r
 		props: mergeProps(defaultProps, props)
 	});
 }
-//#endregion
 export { AppShellMainSlot, AppShellOverlaySlot, AppShellPanelSlot, AppShellRailSlot, AppShellRoot, AppShellSidebarSlot, AppShellSidebarTrigger };

package/dist/components/avatar/avatar.d.mts

@@ -1,99 +1,12 @@
-import { StyledProps } from "../../lib/styled-props.mjs";
 import { DataAttributes } from "../../lib/data-attributes.mjs";
-import { VariantProps } from "../../lib/tv.mjs";
 import { Presence } from "../../lib/presence.mjs";
+import { VariantProps } from "../../lib/tv.mjs";
+import { StyledProps } from "../../lib/styled-props.mjs";
 import { ComponentPropsWithRef } from "react";
 import { Button } from "@base-ui/react/button";
 import { useRender } from "@base-ui/react/use-render";
 import { Avatar } from "@base-ui/react";
-//#region src/components/avatar/avatar.d.ts
-declare const avatar: import("tailwind-variants/lite").TVReturnType<{
-  type: {
-    agent: {
-      root: string[];
-    };
-    human: {
-      root: string[];
-    };
-    server: {
-      root: string[];
-    };
-  };
-  size: {
-    xl: {
-      root: string[];
-    };
-    lg: {
-      root: string[];
-    };
-    md: {
-      root: string[];
-    };
-    sm: {
-      root: string[];
-    };
-    xs: {
-      root: string[];
-    };
-    "2xs": {
-      root: string[];
-    };
-    "3xs": {
-      root: string;
-    };
-  };
-}, {
-  root: string[];
-  image: string[];
-  fallback: string[];
-  badge: string[];
-  dot: string[];
-  group: string[];
-  groupButton: string[];
-}, undefined, {
-  type: {
-    agent: {
-      root: string[];
-    };
-    human: {
-      root: string[];
-    };
-    server: {
-      root: string[];
-    };
-  };
-  size: {
-    xl: {
-      root: string[];
-    };
-    lg: {
-      root: string[];
-    };
-    md: {
-      root: string[];
-    };
-    sm: {
-      root: string[];
-    };
-    xs: {
-      root: string[];
-    };
-    "2xs": {
-      root: string[];
-    };
-    "3xs": {
-      root: string;
-    };
-  };
-}, {
-  root: string[];
-  image: string[];
-  fallback: string[];
-  badge: string[];
-  dot: string[];
-  group: string[];
-  groupButton: string[];
-}, import("tailwind-variants/lite").TVReturnTypeLike<{
+declare const avatar: import("tailwind-variants/config").TVReturnType<{
   type: {
     agent: {
       root: string[];
@@ -136,7 +49,7 @@ declare const avatar: import("tailwind-variants/lite").TVReturnType<{
   dot: string[];
   group: string[];
   groupButton: string[];
-}>>;
+}, undefined, undefined, undefined, undefined>;
 export type AvatarSize = NonNullable<VariantProps<typeof avatar>["size"]>;
 export type AvatarProps = StyledProps<Avatar.Root.Props> & Required<Pick<VariantProps<typeof avatar>, "size" | "type">>;
 declare function Avatar$1({ size, type, className, children, ...props }: AvatarProps): import("react").JSX.Element;
@@ -165,5 +78,4 @@ export type AvatarGroupCountProps = ComponentPropsWithRef<"span"> & {
   size: AvatarSize;
 };
 export declare function AvatarGroupCount({ size, className, ...props }: AvatarGroupCountProps): import("react").JSX.Element;
-//#endregion
 export { Avatar$1 as Avatar };

package/dist/components/avatar/avatar.mjs

@@ -1,13 +1,13 @@
 import { cn } from "../../cn.mjs";
-import { tv } from "../../lib/tv.mjs";
 import { defaultNativeButton } from "../../lib/default-native-button.mjs";
 import { PRESENCE_COLOR } from "../../lib/presence.mjs";
+import { tv } from "../../lib/tv.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@base-ui/react/button";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
 import { Avatar } from "@base-ui/react";
-//#region src/components/avatar/avatar.tsx
+// src/components/avatar/avatar.tsx
 const avatar = tv({
 	slots: {
 		root: [
@@ -287,5 +287,4 @@ function AvatarGroupCount({ size, className, ...props }) {
 		...props
 	});
 }
-//#endregion
 export { Avatar$1 as Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupButton, AvatarGroupCount, AvatarImage };

package/dist/components/badge/badge.d.mts

@@ -1,7 +1,6 @@
 import { VariantProps } from "../../lib/tv.mjs";
 import { useRender } from "@base-ui/react/use-render";
-//#region src/components/badge/badge.d.ts
-export declare const badge: import("tailwind-variants/lite").TVReturnType<{
+export declare const badge: import("tailwind-variants/config").TVReturnType<{
   appearance: {
     solid: {
       root: string[];
@@ -14,76 +13,24 @@ export declare const badge: import("tailwind-variants/lite").TVReturnType<{
     };
   };
   variant: {
-    default: "";
-    primary: "";
-    you: "";
-    busy: "";
-    information: "";
-    muted: "";
-    accent: "";
-    success: "";
-    warning: "";
-    danger: "";
+    default: string;
+    primary: string;
+    you: string;
+    busy: string;
+    information: string;
+    muted: string;
+    accent: string;
+    success: string;
+    warning: string;
+    danger: string;
   };
 }, {
   root: string[];
-}, undefined, {
-  appearance: {
-    solid: {
-      root: string[];
-    };
-    soft: {
-      root: string[];
-    };
-    outline: {
-      root: string[];
-    };
-  };
-  variant: {
-    default: "";
-    primary: "";
-    you: "";
-    busy: "";
-    information: "";
-    muted: "";
-    accent: "";
-    success: "";
-    warning: "";
-    danger: "";
-  };
-}, {
-  root: string[];
-}, import("tailwind-variants/lite").TVReturnTypeLike<{
-  appearance: {
-    solid: {
-      root: string[];
-    };
-    soft: {
-      root: string[];
-    };
-    outline: {
-      root: string[];
-    };
-  };
-  variant: {
-    default: "";
-    primary: "";
-    you: "";
-    busy: "";
-    information: "";
-    muted: "";
-    accent: "";
-    success: "";
-    warning: "";
-    danger: "";
-  };
-}, {
-  root: string[];
-}>>;
+}, undefined, undefined, undefined, undefined>;
 export type BadgeProps = useRender.ComponentProps<"span"> & VariantProps<typeof badge>;
 declare function BadgeRoot({ appearance, variant, className, render, ...props }: BadgeProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 declare function Experimental({ children, ...props }: Omit<BadgeProps, "appearance" | "variant">): import("react").JSX.Element;
 export declare const Badge: typeof BadgeRoot & {
   Experimental: typeof Experimental;
 };
-//#endregion
+export {};