@mcp-b/react-components 0.47.0 → 0.49.0

package/dist/components/general-purpose/ResponsiveSidebarShell.js

@@ -15,6 +15,13 @@ const sidebarMaxWidth = 384;
 const sidebarKeyboardStep = 24;
 /** Matches --sigvelo-layout-break-compact. */
 const compactSidebarWidthRem = 56;
+const SidebarShellContext = React.createContext(null);
+/** Reuse the shell's measured layout and drawer controls instead of observing it again. */
+function useResponsiveSidebarShell() {
+	const controls = React.useContext(SidebarShellContext);
+	if (!controls) throw new Error("useResponsiveSidebarShell must be inside ResponsiveSidebarShell.");
+	return controls;
+}
 function useControllableSidebar({ sidebarOpen, defaultSidebarOpen, onSidebarOpenChange }) {
 	const [innerOpen, setInnerOpen] = React.useState(defaultSidebarOpen ?? true);
 	return [
@@ -44,6 +51,7 @@ function ResponsiveSidebarShell({ sidebar, sidebarLabel = "sidebar", sidebarOpen
 	const mainRef = React.useRef(null);
 	const openerRef = React.useRef(null);
 	const compactRef = React.useRef(null);
+	const [compact, setCompact] = React.useState(true);
 	const restoreSidebarOnWideRef = React.useRef(true);
 	const [isSidebarOpen, setSidebarOpen, primeSidebarOpen] = useControllableSidebar({
 		sidebarOpen,
@@ -59,6 +67,7 @@ function ResponsiveSidebarShell({ sidebar, sidebarLabel = "sidebar", sidebarOpen
 			const compact = isCompactSidebar(root);
 			const wasCompact = compactRef.current;
 			compactRef.current = compact;
+			setCompact(compact);
 			if (wasCompact === null) {
 				if (wantsBuiltInDefault && compact) primeSidebarOpen(false);
 				return;
@@ -103,10 +112,16 @@ function ResponsiveSidebarShell({ sidebar, sidebarLabel = "sidebar", sidebarOpen
 	const dismissSidebar = React.useCallback(() => {
 		updateSidebar(() => setSidebarOpen(false), () => openerRef.current?.focus({ preventScroll: true }));
 	}, [setSidebarOpen, updateSidebar]);
-	const sidebarContent = typeof sidebar === "function" ? sidebar({
+	const controls = React.useMemo(() => ({
+		compact,
+		closeSidebar,
+		closeSidebarOnCompact
+	}), [
+		compact,
 		closeSidebar,
 		closeSidebarOnCompact
-	}) : sidebar;
+	]);
+	const sidebarContent = typeof sidebar === "function" ? sidebar(controls) : sidebar;
 	const hasCustomLeading = bar?.leading != null;
 	const hasAppLeading = bar?.back != null || hasCustomLeading;
 	const hasTitleTrigger = hasSidebar && bar?.compactTitleTrigger != null && bar?.compactLeading == null;
@@ -138,107 +153,110 @@ function ResponsiveSidebarShell({ sidebar, sidebarLabel = "sidebar", sidebarOpen
 	const mainSidebarToggle = sidebarTogglePlacement === "sidebar" || sidebarTogglePlacement === "main" && !hasCustomLeading ? renderSidebarToggle(sidebarTogglePlacement === "sidebar" ? "responsive-sidebar-shell__toggle--sidebar-fallback" : hasTitleTrigger ? "responsive-sidebar-shell__toggle--replaced-by-title" : bar?.compactLeading != null ? "responsive-sidebar-shell__toggle--replaced-by-compact-leading" : void 0) : null;
 	const hasTopBar = !bar?.hidden && (hasSidebar || bar?.back != null || bar?.leading != null || bar?.compactLeading != null || bar?.title != null || bar?.actions != null || bar?.primary != null);
 	const compactLeadingMode = hasTitleTrigger ? "trigger" : !hasAppLeading && bar?.compactLeading != null ? "custom" : void 0;
-	return /* @__PURE__ */ jsx("div", {
-		ref: mergeRefs(rootRef, ref),
-		className: cx("responsive-sidebar-shell", className),
-		"data-recipe": "fill-host",
-		style,
-		...props,
-		"data-sidebar-open": hasSidebar && isSidebarOpen ? "true" : "false",
-		"data-sidebar-toggle-placement": sidebarTogglePlacement,
-		onKeyDown: (event) => {
-			props.onKeyDown?.(event);
-			if (!event.defaultPrevented && event.key === "Escape" && hasSidebar && isSidebarOpen && rootRef.current && isCompactSidebar(rootRef.current)) {
-				event.preventDefault();
-				dismissSidebar();
-			}
-		},
-		children: /* @__PURE__ */ jsxs(ResizableSidePanel.Root, {
-			className: "responsive-sidebar-shell__frame",
-			label: sidebarLabel,
-			side: "start",
-			sizeVariable: "--responsive-sidebar-shell-sidebar-size",
-			defaultSize: defaultSidebarWidth,
-			minSize: sidebarMinWidth,
-			maxSize: sidebarMaxWidth,
-			keyboardStep: sidebarKeyboardStep,
-			children: [
-				hasSidebar && isSidebarOpen ? /* @__PURE__ */ jsx(ResizableSidePanel.Handle, { className: "responsive-sidebar-shell__resizer" }) : null,
-				hasSidebar ? /* @__PURE__ */ jsxs("div", {
-					id: sidebarId,
-					className: "responsive-sidebar-shell__sidebar",
-					"aria-hidden": isSidebarOpen ? void 0 : true,
-					inert: isSidebarOpen ? void 0 : true,
-					children: [sidebarToggle ? /* @__PURE__ */ jsx("div", {
-						className: "responsive-sidebar-shell__sidebar-leading",
-						children: sidebarToggle
-					}) : null, /* @__PURE__ */ jsx("div", {
-						className: "responsive-sidebar-shell__sidebar-content",
-						children: sidebarContent
-					})]
-				}) : null,
-				/* @__PURE__ */ jsxs("div", {
-					ref: mainRef,
-					className: "responsive-sidebar-shell__main",
-					tabIndex: -1,
-					children: [
-						hasTopBar ? /* @__PURE__ */ jsxs(AppTopBar.Root, {
-							"aria-label": bar?.label ?? "Application controls",
-							className: bar?.className,
-							"data-compact-leading": compactLeadingMode,
-							children: [
-								hasSidebar || hasAppLeading || bar?.compactLeading != null ? /* @__PURE__ */ jsxs(AppTopBar.Leading, { children: [
-									bar?.back ? /* @__PURE__ */ jsx(AppTopBar.Link, {
-										label: bar.back.label,
-										render: bar.back.link,
-										children: /* @__PURE__ */ jsx(ArrowLeftIcon, {})
+	return /* @__PURE__ */ jsx(SidebarShellContext.Provider, {
+		value: controls,
+		children: /* @__PURE__ */ jsx("div", {
+			ref: mergeRefs(rootRef, ref),
+			className: cx("responsive-sidebar-shell", className),
+			"data-recipe": "fill-host",
+			style,
+			...props,
+			"data-sidebar-open": hasSidebar && isSidebarOpen ? "true" : "false",
+			"data-sidebar-toggle-placement": sidebarTogglePlacement,
+			onKeyDown: (event) => {
+				props.onKeyDown?.(event);
+				if (!event.defaultPrevented && event.key === "Escape" && hasSidebar && isSidebarOpen && rootRef.current && isCompactSidebar(rootRef.current)) {
+					event.preventDefault();
+					dismissSidebar();
+				}
+			},
+			children: /* @__PURE__ */ jsxs(ResizableSidePanel.Root, {
+				className: "responsive-sidebar-shell__frame",
+				label: sidebarLabel,
+				side: "start",
+				sizeVariable: "--responsive-sidebar-shell-sidebar-size",
+				defaultSize: defaultSidebarWidth,
+				minSize: sidebarMinWidth,
+				maxSize: sidebarMaxWidth,
+				keyboardStep: sidebarKeyboardStep,
+				children: [
+					hasSidebar && isSidebarOpen ? /* @__PURE__ */ jsx(ResizableSidePanel.Handle, { className: "responsive-sidebar-shell__resizer" }) : null,
+					hasSidebar ? /* @__PURE__ */ jsxs("div", {
+						id: sidebarId,
+						className: "responsive-sidebar-shell__sidebar",
+						"aria-hidden": isSidebarOpen ? void 0 : true,
+						inert: isSidebarOpen ? void 0 : true,
+						children: [sidebarToggle ? /* @__PURE__ */ jsx("div", {
+							className: "responsive-sidebar-shell__sidebar-leading",
+							children: sidebarToggle
+						}) : null, /* @__PURE__ */ jsx("div", {
+							className: "responsive-sidebar-shell__sidebar-content",
+							children: sidebarContent
+						})]
+					}) : null,
+					/* @__PURE__ */ jsxs("div", {
+						ref: mainRef,
+						className: "responsive-sidebar-shell__main",
+						tabIndex: -1,
+						children: [
+							hasTopBar ? /* @__PURE__ */ jsxs(AppTopBar.Root, {
+								"aria-label": bar?.label ?? "Application controls",
+								className: bar?.className,
+								"data-compact-leading": compactLeadingMode,
+								children: [
+									hasSidebar || hasAppLeading || bar?.compactLeading != null ? /* @__PURE__ */ jsxs(AppTopBar.Leading, { children: [
+										bar?.back ? /* @__PURE__ */ jsx(AppTopBar.Link, {
+											label: bar.back.label,
+											render: bar.back.link,
+											children: /* @__PURE__ */ jsx(ArrowLeftIcon, {})
+										}) : null,
+										bar?.leading,
+										!hasCustomLeading ? mainSidebarToggle : null,
+										compactLeadingMode === "custom" ? /* @__PURE__ */ jsx("span", {
+											className: "responsive-sidebar-shell__compact-leading",
+											children: bar?.compactLeading
+										}) : null
+									] }) : null,
+									bar?.title != null || hasTitleTrigger ? /* @__PURE__ */ jsxs(AppTopBar.Title, {
+										render: bar?.titleRender,
+										children: [bar?.title != null ? /* @__PURE__ */ jsx("span", {
+											className: "responsive-sidebar-shell__title-text",
+											children: bar.title
+										}) : null, hasTitleTrigger ? /* @__PURE__ */ jsxs(Button, {
+											type: "button",
+											variant: "ghost",
+											color: "neutral",
+											size: "sm",
+											className: "responsive-sidebar-shell__title-trigger",
+											"aria-controls": sidebarId,
+											"aria-expanded": isSidebarOpen,
+											onClick: (event) => toggleSidebar(event.currentTarget),
+											children: [bar?.compactTitleTrigger, /* @__PURE__ */ jsx(ChevronDownIcon, { "aria-hidden": "true" })]
+										}) : null]
 									}) : null,
-									bar?.leading,
-									!hasCustomLeading ? mainSidebarToggle : null,
-									compactLeadingMode === "custom" ? /* @__PURE__ */ jsx("span", {
-										className: "responsive-sidebar-shell__compact-leading",
-										children: bar?.compactLeading
-									}) : null
-								] }) : null,
-								bar?.title != null || hasTitleTrigger ? /* @__PURE__ */ jsxs(AppTopBar.Title, {
-									render: bar?.titleRender,
-									children: [bar?.title != null ? /* @__PURE__ */ jsx("span", {
-										className: "responsive-sidebar-shell__title-text",
-										children: bar.title
-									}) : null, hasTitleTrigger ? /* @__PURE__ */ jsxs(Button, {
-										type: "button",
-										variant: "ghost",
-										color: "neutral",
-										size: "sm",
-										className: "responsive-sidebar-shell__title-trigger",
-										"aria-controls": sidebarId,
-										"aria-expanded": isSidebarOpen,
-										onClick: (event) => toggleSidebar(event.currentTarget),
-										children: [bar?.compactTitleTrigger, /* @__PURE__ */ jsx(ChevronDownIcon, { "aria-hidden": "true" })]
-									}) : null]
-								}) : null,
-								bar?.actions != null || bar?.primary != null ? /* @__PURE__ */ jsxs(AppTopBar.Trailing, { children: [bar.actions, bar.primary] }) : null
-							]
-						}) : null,
-						error != null ? /* @__PURE__ */ jsxs("div", {
-							className: "responsive-sidebar-shell__error",
-							role: "alert",
-							children: [/* @__PURE__ */ jsx(WarningIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", { children: error })]
-						}) : null,
-						children
-					]
-				}),
-				hasSidebar && isSidebarOpen ? /* @__PURE__ */ jsx(Button, {
-					type: "button",
-					variant: "ghost",
-					color: "neutral",
-					className: "responsive-sidebar-shell__peek",
-					"aria-label": showMainLabel,
-					onClick: closeSidebar
-				}) : null
-			]
+									bar?.actions != null || bar?.primary != null ? /* @__PURE__ */ jsxs(AppTopBar.Trailing, { children: [bar.actions, bar.primary] }) : null
+								]
+							}) : null,
+							error != null ? /* @__PURE__ */ jsxs("div", {
+								className: "responsive-sidebar-shell__error",
+								role: "alert",
+								children: [/* @__PURE__ */ jsx(WarningIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", { children: error })]
+							}) : null,
+							children
+						]
+					}),
+					hasSidebar && isSidebarOpen ? /* @__PURE__ */ jsx(Button, {
+						type: "button",
+						variant: "ghost",
+						color: "neutral",
+						className: "responsive-sidebar-shell__peek",
+						"aria-label": showMainLabel,
+						onClick: closeSidebar
+					}) : null
+				]
+			})
 		})
 	});
 }
 //#endregion
-export { ResponsiveSidebarShell };
+export { ResponsiveSidebarShell, useResponsiveSidebarShell };

package/dist/components/general-purpose/SettingsFormDialog.d.ts

@@ -1,48 +1,35 @@
+import { Dialog } from "../foundations/Dialog.js";
+import { FormProps } from "../foundations/Form.js";
 import * as React from "react";
 
 //#region src/components/general-purpose/SettingsFormDialog.d.ts
-type SettingsFormFieldType = "checkbox" | "email" | "password" | "search" | "tel" | "text" | "url";
-/**
- * A checked box submits this, an unchecked one submits the empty string, so
- * `SettingsFormValues` stays all-strings for every field type.
- */
-declare const SETTINGS_FORM_CHECKED = "true";
-interface SettingsFormField {
-  name: string;
-  label: string;
-  description?: React.ReactNode;
-  type?: SettingsFormFieldType;
-  placeholder?: string;
-  autoComplete?: string;
-  required?: boolean;
-  readOnly?: boolean;
-}
-type SettingsFormValues<Fields extends readonly SettingsFormField[]> = Readonly<Record<Fields[number]["name"], string>>;
-interface SettingsFormDialogProps<Fields extends readonly SettingsFormField[]> {
+interface SettingsFormDialogProps<Values extends Record<string, unknown> = Record<string, unknown>> {
   open: boolean;
-  onOpenChange: (open: boolean) => void;
+  /** Base UI owns dismissal reasons and cancellation, including successful submission. */
+  onOpenChange: NonNullable<React.ComponentProps<typeof Dialog.Root>["onOpenChange"]>;
   title: React.ReactNode;
   description: React.ReactNode;
-  fields: Fields;
-  initialValues?: Readonly<Partial<Record<Fields[number]["name"], string | undefined>>>;
+  /** Compose labeled Field/control children with their own defaults and validation. */
+  children: React.ReactNode;
   submitLabel: string;
   submittingLabel?: string;
   removeLabel?: string;
   removingLabel?: string;
   externalError?: string;
-  onSubmit: (values: SettingsFormValues<Fields>) => void | Promise<void>;
+  /** Receives Base UI values and event details unchanged; the host owns parsing and normalization. */
+  onFormSubmit: NonNullable<FormProps<Values>["onFormSubmit"]>;
   onRemove?: () => void | Promise<void>;
 }
 /**
- * Uncontrolled, metadata-driven settings dialog with native validation and
- * shared async submit/remove feedback. Product schemas remain in the host.
+ * Settings dialog with caller-composed controls and shared async submit/remove
+ * feedback. Base UI owns validation and values; product schemas stay in the host.
  */
-declare function SettingsFormDialog<const Fields extends readonly SettingsFormField[]>({
+declare function SettingsFormDialog<Values extends Record<string, unknown> = Record<string, unknown>>({
   open,
   onOpenChange,
   title,
   description,
   ...contentProps
-}: SettingsFormDialogProps<Fields>): React.JSX.Element;
+}: SettingsFormDialogProps<Values>): React.JSX.Element;
 //#endregion
-export { SETTINGS_FORM_CHECKED, SettingsFormDialog, SettingsFormDialogProps, SettingsFormField, SettingsFormFieldType, SettingsFormValues };
+export { SettingsFormDialog, SettingsFormDialogProps };

package/dist/components/general-purpose/SettingsFormDialog.js

@@ -3,125 +3,95 @@ import { Dialog } from "../foundations/Dialog.js";
 import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
 import { Field } from "../foundations/Field.js";
 import { Form } from "../foundations/Form.js";
-import { Checkbox } from "../foundations/Checkbox.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/general-purpose/SettingsFormDialog.tsx
-/**
-* A checked box submits this, an unchecked one submits the empty string, so
-* `SettingsFormValues` stays all-strings for every field type.
-*/
-const SETTINGS_FORM_CHECKED = "true";
-function readSettingsValues(data, fields) {
-	return Object.fromEntries(fields.map((field) => {
-		const value = data[field.name];
-		if (field.type === "checkbox") return [field.name, value === true ? SETTINGS_FORM_CHECKED : ""];
-		return [field.name, typeof value === "string" ? value.trim() : ""];
-	}));
-}
-function SettingsFormDialogContent({ fields, initialValues, submitLabel, submittingLabel = "Saving…", removeLabel, removingLabel = "Removing…", externalError, onSubmit, onRemove, onOpenChange }) {
+function SettingsFormDialogContent({ children, submitLabel, submittingLabel = "Saving…", removeLabel, removingLabel = "Removing…", externalError, onFormSubmit, onRemove, close }) {
 	const [submission, setSubmission] = React.useState(null);
 	const active = React.useRef(true);
+	const inFlight = React.useRef(false);
 	const pending = submission === "submit" || submission === "remove";
 	const error = submission && typeof submission === "object" ? submission.error : null;
-	const initialValueByName = initialValues ?? {};
 	React.useEffect(() => {
 		active.current = true;
 		return () => {
 			active.current = false;
 		};
 	}, []);
-	async function submit(values) {
+	async function submit(...args) {
+		if (inFlight.current) return;
+		inFlight.current = true;
 		setSubmission("submit");
 		try {
-			await onSubmit(readSettingsValues(values, fields));
+			await Promise.resolve(onFormSubmit(...args));
 			if (!active.current) return;
 			setSubmission(null);
-			onOpenChange(false);
+			close();
 		} catch (cause) {
 			if (!active.current) return;
 			setSubmission({ error: formatErrorMessage(cause) });
+		} finally {
+			inFlight.current = false;
 		}
 	}
 	async function remove() {
-		if (!onRemove) return;
+		if (!onRemove || inFlight.current) return;
+		inFlight.current = true;
 		setSubmission("remove");
 		try {
 			await onRemove();
 			if (!active.current) return;
 			setSubmission(null);
-			onOpenChange(false);
+			close();
 		} catch (cause) {
 			if (!active.current) return;
 			setSubmission({ error: formatErrorMessage(cause) });
+		} finally {
+			inFlight.current = false;
 		}
 	}
 	return /* @__PURE__ */ jsxs(Form, {
 		onFormSubmit: submit,
 		children: [
-			fields.map((field) => field.type === "checkbox" ? /* @__PURE__ */ jsxs(Field.Root, {
-				name: field.name,
-				orientation: "horizontal",
-				children: [/* @__PURE__ */ jsx(Checkbox.Root, {
-					defaultChecked: initialValueByName[field.name] === SETTINGS_FORM_CHECKED,
-					disabled: field.readOnly,
-					children: /* @__PURE__ */ jsx(Checkbox.Indicator, {})
-				}), /* @__PURE__ */ jsxs(Field.Content, { children: [/* @__PURE__ */ jsx(Field.Label, { children: field.label }), field.description ? /* @__PURE__ */ jsx(Field.Description, { children: field.description }) : null] })]
-			}, field.name) : /* @__PURE__ */ jsxs(Field.Root, {
-				name: field.name,
-				children: [
-					/* @__PURE__ */ jsx(Field.Label, { children: field.label }),
-					/* @__PURE__ */ jsx(Field.Control, {
-						autoComplete: field.autoComplete,
-						defaultValue: initialValueByName[field.name],
-						placeholder: field.placeholder,
-						readOnly: field.readOnly,
-						required: field.required,
-						type: field.type
-					}),
-					field.description ? /* @__PURE__ */ jsx(Field.Description, { children: field.description }) : null,
-					field.required ? /* @__PURE__ */ jsxs(Field.Error, {
-						match: "valueMissing",
-						children: [field.label, " is required."]
-					}) : null,
-					field.type === "url" ? /* @__PURE__ */ jsx(Field.Error, {
-						match: "typeMismatch",
-						children: "Enter a valid URL."
-					}) : null
-				]
-			}, field.name)),
+			children,
 			error ? /* @__PURE__ */ jsx(Field.Errors, { errors: [error] }) : externalError ? /* @__PURE__ */ jsx(Field.Errors, { errors: [externalError] }) : null,
-			/* @__PURE__ */ jsxs(Dialog.Footer, { children: [onRemove && removeLabel ? /* @__PURE__ */ jsx(Button, {
-				type: "button",
-				variant: "ghost",
-				color: "destructive",
-				disabled: pending,
-				focusableWhenDisabled: pending,
-				onClick: () => void remove(),
-				children: submission === "remove" ? removingLabel : removeLabel
-			}) : null, /* @__PURE__ */ jsx(Button, {
-				type: "submit",
-				color: "primary",
-				disabled: pending,
-				focusableWhenDisabled: pending,
-				children: submission === "submit" ? submittingLabel : submitLabel
-			})] })
+			/* @__PURE__ */ jsxs(Dialog.Footer, { children: [
+				onRemove && removeLabel ? /* @__PURE__ */ jsx(Button, {
+					type: "button",
+					variant: "ghost",
+					color: "destructive",
+					disabled: pending,
+					focusableWhenDisabled: pending,
+					onClick: () => void remove(),
+					children: submission === "remove" ? removingLabel : removeLabel
+				}) : null,
+				/* @__PURE__ */ jsx(Dialog.Close, { children: "Cancel" }),
+				/* @__PURE__ */ jsx(Button, {
+					type: "submit",
+					color: "primary",
+					disabled: pending,
+					focusableWhenDisabled: pending,
+					children: submission === "submit" ? submittingLabel : submitLabel
+				})
+			] })
 		]
 	});
 }
 /**
-* Uncontrolled, metadata-driven settings dialog with native validation and
-* shared async submit/remove feedback. Product schemas remain in the host.
+* Settings dialog with caller-composed controls and shared async submit/remove
+* feedback. Base UI owns validation and values; product schemas stay in the host.
 */
 function SettingsFormDialog({ open, onOpenChange, title, description, ...contentProps }) {
+	const actionsRef = React.useRef(null);
 	return /* @__PURE__ */ jsx(Dialog.Root, {
 		open,
 		onOpenChange,
+		actionsRef,
 		children: /* @__PURE__ */ jsxs(Dialog.Portal, { children: [/* @__PURE__ */ jsx(Dialog.Backdrop, {}), /* @__PURE__ */ jsx(Dialog.Viewport, { children: /* @__PURE__ */ jsxs(Dialog.Popup, { children: [/* @__PURE__ */ jsxs(Dialog.Header, { children: [/* @__PURE__ */ jsx(Dialog.Title, { children: title }), /* @__PURE__ */ jsx(Dialog.Description, { children: description })] }), /* @__PURE__ */ jsx(SettingsFormDialogContent, {
 			...contentProps,
-			onOpenChange
+			close: () => actionsRef.current?.close()
 		}, open ? "open" : "closed")] }) })] })
 	});
 }
 //#endregion
-export { SETTINGS_FORM_CHECKED, SettingsFormDialog };
+export { SettingsFormDialog };

package/dist/components/general-purpose/SetupChecklist.d.ts

@@ -14,6 +14,7 @@ interface SetupChecklistEntry<Id extends string = string> {
 interface SetupChecklistGroupProps<Id extends string = string> {
   /** Quiet visible heading above the checklist rows. */
   label: React.ReactNode;
+  /** Host-owned setup tasks and their current completion state. */
   entries: readonly SetupChecklistEntry<Id>[];
   /** Whether rows are visible when the containing menu first opens. */
   defaultOpen?: boolean;

package/dist/components/general-purpose/SetupChecklist.js

@@ -1,2 +1,77 @@
-import { n as SetupChecklistGroup, t as SetupChecklistAction } from "../../SetupChecklist-CwRjIDH4.js";
+import { n as mergeBaseClassName } from "../../class-names-BiMDVpUo.js";
+import { B as PlusIcon, d as CheckIcon, et as WarningIcon, f as ChevronDownIcon } from "../../icons-cuEtsgj9.js";
+import { Button } from "../foundations/Button.js";
+import { Menu } from "../foundations/Menu.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/_internal/menu-disclosure-group.tsx
+/**
+* A menu-native disclosure: its trigger stays in the menu roving-focus model,
+* while its rows mount only after the user expands the section.
+*/
+function MenuDisclosureGroup({ children, className, defaultOpen = false, label, triggerClassName, ...props }) {
+	const [open, setOpen] = React.useState(defaultOpen);
+	return /* @__PURE__ */ jsxs(Menu.Group, {
+		className: mergeBaseClassName("menu-disclosure-group", className),
+		...props,
+		children: [/* @__PURE__ */ jsxs(Menu.Item, {
+			"aria-expanded": open,
+			className: mergeBaseClassName("menu-disclosure-group__trigger", triggerClassName),
+			closeOnClick: false,
+			onClick: () => setOpen((current) => !current),
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "sigvelo-truncate-grow",
+				children: label
+			}), /* @__PURE__ */ jsx(ChevronDownIcon, { "aria-hidden": "true" })]
+		}), open ? /* @__PURE__ */ jsx("div", {
+			className: "menu-disclosure-group__items",
+			children
+		}) : null]
+	});
+}
+//#endregion
+//#region src/components/general-purpose/SetupChecklist.tsx
+/** Checklist rows for any Menu surface (composer plus menu, tray menu). */
+function SetupChecklistGroup({ label, entries, defaultOpen = false, onSelect }) {
+	return /* @__PURE__ */ jsx(MenuDisclosureGroup, {
+		label,
+		defaultOpen,
+		children: entries.map((entry) => /* @__PURE__ */ jsxs(Menu.Item, {
+			"aria-label": `${entry.name}, ${entry.complete ? "complete" : "not set up"}`,
+			onClick: () => onSelect(entry.id),
+			children: [
+				entry.icon,
+				/* @__PURE__ */ jsx("span", {
+					className: "sigvelo-truncate-grow",
+					children: entry.description
+				}),
+				entry.complete ? /* @__PURE__ */ jsx(CheckIcon, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(PlusIcon, { "aria-hidden": "true" })
+			]
+		}, entry.id))
+	});
+}
+/** Progress-aware tray trigger opening the checklist in its own menu. */
+function SetupChecklistAction({ actionLabel, label, entries, onSelect }) {
+	const completed = entries.filter((entry) => entry.complete).length;
+	return /* @__PURE__ */ jsxs(Menu.Root, { children: [/* @__PURE__ */ jsxs(Button, {
+		type: "button",
+		variant: "ghost",
+		color: "neutral",
+		size: "sm",
+		"aria-label": `${actionLabel} — ${completed} of ${entries.length} set up`,
+		render: /* @__PURE__ */ jsx(Menu.Trigger, { unstyled: true }),
+		children: [completed === entries.length ? /* @__PURE__ */ jsx(CheckIcon, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(WarningIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", { children: actionLabel })]
+	}), /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, {
+		side: "bottom",
+		align: "start",
+		sideOffset: 4,
+		children: /* @__PURE__ */ jsx(Menu.Popup, { children: /* @__PURE__ */ jsx(SetupChecklistGroup, {
+			defaultOpen: true,
+			label,
+			entries,
+			onSelect
+		}) })
+	}) })] });
+}
+//#endregion
 export { SetupChecklistAction, SetupChecklistGroup };

package/dist/components/general-purpose/Terminal.d.ts

@@ -1,5 +1,5 @@
-import { n as IconButtonProps } from "../../IconButton-BAUFhUk8.js";
-import { t as CopyButtonProps } from "../../copy-button-C0JyjClr.js";
+import { n as IconButtonProps } from "../../IconButton-ByiyjkYE.js";
+import { t as CopyButtonProps } from "../../copy-button-OUwOdgEm.js";
 import * as React from "react";
 
 //#region src/components/general-purpose/Terminal.d.ts
@@ -42,7 +42,7 @@ declare function Terminal({
   ref,
   ...props
 }: TerminalProps & {
-  ref?: React.Ref<HTMLDivElement>;
+  /** Ref forwarded to the component's rendered root element. */ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
 interface TerminalHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}
 declare function TerminalHeader({

package/dist/components/general-purpose/Terminal.js

@@ -1,8 +1,8 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
 import { Z as TerminalIcon, nt as XIcon } from "../../icons-cuEtsgj9.js";
 import { IconButton } from "../foundations/IconButton.js";
-import { ScrollArea } from "../foundations/ScrollArea.js";
 import { t as CopyButton } from "../../copy-button-CSDuDfdP.js";
+import { ScrollArea } from "../foundations/ScrollArea.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import Anser from "anser";
@@ -56,6 +56,15 @@ function parseAnsi(input) {
 		dim: c.decorations?.includes("dim") ?? false
 	}));
 }
+const ANSI_ESCAPE_SEQUENCE = /\u001b\[[0-9;?]*[a-zA-Z]/g;
+/**
+* The same text with every escape sequence removed, for surfaces that need the
+* plain characters instead of {@link parseAnsi}'s formatted segments — copying
+* terminal output, measuring it, or searching it.
+*/
+function stripAnsi(input) {
+	return input.replace(ANSI_ESCAPE_SEQUENCE, "");
+}
 //#endregion
 //#region src/components/general-purpose/Terminal.tsx
 const TerminalContext = React.createContext(null);
@@ -219,9 +228,5 @@ function TerminalClearButton({ className, label = "Clear terminal", onClick, ...
 		children: /* @__PURE__ */ jsx(XIcon, {})
 	});
 }
-const ANSI_REGEX = /\u001b\[[0-9;?]*[a-zA-Z]/g;
-function stripAnsi(input) {
-	return input.replace(ANSI_REGEX, "");
-}
 //#endregion
 export { Terminal, TerminalActions, TerminalClearButton, TerminalContent, TerminalCopyButton, TerminalHeader, TerminalStatus, TerminalTitle };