@mcp-b/react-components 0.35.0 → 0.36.0

package/dist/components/foundations/Select.js

@@ -1,7 +1,7 @@
 import { n as mergeBaseClassName } from "../../class-names-BiMDVpUo.js";
 import { a as ArrowUpIcon, d as CheckIcon, n as ArrowDownIcon } from "../../icons-B1Qw05te.js";
 import "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { Select as Select$1 } from "@base-ui/react/select";
 //#region src/components/foundations/Select.tsx
 /**
@@ -29,12 +29,6 @@ import { Select as Select$1 } from "@base-ui/react/select";
 *
 * @see {@link https://base-ui.com/react/components/select | Base UI Select}
 */
-function SelectRoot(props) {
-	return /* @__PURE__ */ jsx(Select$1.Root, {
-		"data-slot": "select",
-		...props
-	});
-}
 function SelectLabel({ className, ref, ...props }) {
 	const classes = mergeBaseClassName("select__label", className);
 	return /* @__PURE__ */ jsx(Select$1.Label, {
@@ -54,13 +48,11 @@ function SelectTrigger({ size = "sm", className, ref, ...props }) {
 		...props
 	});
 }
-function SelectValue({ placeholder, children, ref, ...props }) {
+function SelectValue({ ref, ...props }) {
 	return /* @__PURE__ */ jsx(Select$1.Value, {
 		ref,
 		"data-slot": "select-value",
-		placeholder,
-		...props,
-		children
+		...props
 	});
 }
 function SelectIcon({ className, children, ref, ...props }) {
@@ -134,18 +126,13 @@ function SelectItemIndicator({ className, children, ref, ...props }) {
 		children: children ?? /* @__PURE__ */ jsx(CheckIcon, {})
 	});
 }
-function SelectGroup({ label, className, children, ref, ...props }) {
+function SelectGroup({ className, ref, ...props }) {
 	const classes = mergeBaseClassName("select__option-group", className);
-	return /* @__PURE__ */ jsxs(Select$1.Group, {
+	return /* @__PURE__ */ jsx(Select$1.Group, {
 		ref,
 		"data-slot": "select-group",
 		className: classes,
-		...props,
-		children: [label && /* @__PURE__ */ jsx(Select$1.GroupLabel, {
-			"data-slot": "select-label",
-			className: "select__group-label",
-			children: label
-		}), children]
+		...props
 	});
 }
 function SelectGroupLabel({ className, ref, ...props }) {
@@ -187,7 +174,7 @@ function SelectScrollDownArrow({ className, children, ref, ...props }) {
 	});
 }
 const Select = {
-	Root: SelectRoot,
+	Root: Select$1.Root,
 	Label: SelectLabel,
 	Trigger: SelectTrigger,
 	Value: SelectValue,
@@ -196,7 +183,6 @@ const Select = {
 	Backdrop: SelectBackdrop,
 	Positioner: SelectPositioner,
 	Popup: SelectPopup,
-	Arrow: Select$1.Arrow,
 	List: SelectList,
 	Item: SelectItem,
 	ItemText: SelectItemText,

package/dist/components/foundations/Slider.d.ts

@@ -2,53 +2,51 @@ import * as React from "react";
 import { Slider as Slider$1 } from "@base-ui/react/slider";
 
 //#region src/components/foundations/Slider.d.ts
-interface SliderProps extends React.ComponentPropsWithRef<typeof Slider$1.Root> {}
+type SliderRootProps<Value extends number | readonly number[] = number | readonly number[]> = Slider$1.Root.Props<Value> & React.RefAttributes<HTMLDivElement>;
 interface SliderControlProps extends React.ComponentPropsWithRef<typeof Slider$1.Control> {}
 interface SliderTrackProps extends React.ComponentPropsWithRef<typeof Slider$1.Track> {}
 interface SliderIndicatorProps extends React.ComponentPropsWithRef<typeof Slider$1.Indicator> {}
 interface SliderThumbProps extends React.ComponentPropsWithRef<typeof Slider$1.Thumb> {}
-interface SliderOutputProps extends Omit<React.ComponentPropsWithRef<typeof Slider$1.Value>, "children"> {
-  children?: (value: number, values: readonly number[], formattedValues: readonly string[]) => React.ReactNode;
-}
+interface SliderValueProps extends React.ComponentPropsWithRef<typeof Slider$1.Value> {}
 interface SliderLabelProps extends React.ComponentPropsWithRef<typeof Slider$1.Label> {}
 /**
  * A slider component for selecting values from a range.
  *
  * @example
  * ```tsx
- * <Slider defaultValue={50}>
- *   <SliderControl>
- *     <SliderTrack>
- *       <SliderIndicator />
- *       <SliderThumb />
- *     </SliderTrack>
- *   </SliderControl>
- * </Slider>
+ * <Slider.Root defaultValue={50}>
+ *   <Slider.Label>Volume</Slider.Label>
+ *   <Slider.Control>
+ *     <Slider.Track>
+ *       <Slider.Indicator />
+ *       <Slider.Thumb />
+ *     </Slider.Track>
+ *   </Slider.Control>
+ * </Slider.Root>
  * ```
  *
  * @example
  * ```tsx
  * // With output value display
- * <Slider defaultValue={50}>
- *   <SliderOutput />
- *   <SliderControl>
- *     <SliderTrack>
- *       <SliderIndicator />
- *       <SliderThumb />
- *     </SliderTrack>
- *   </SliderControl>
- * </Slider>
+ * <Slider.Root defaultValue={50}>
+ *   <Slider.Label>Volume</Slider.Label>
+ *   <Slider.Value />
+ *   <Slider.Control>
+ *     <Slider.Track>
+ *       <Slider.Indicator />
+ *       <Slider.Thumb />
+ *     </Slider.Track>
+ *   </Slider.Control>
+ * </Slider.Root>
  * ```
  *
  * @see {@link https://base-ui.com/react/components/slider | Base UI Slider}
  */
-declare function SliderRoot({
+declare function SliderRoot<Value extends number | readonly number[]>({
   className,
   ref,
   ...props
-}: SliderProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
+}: SliderRootProps<Value>): React.JSX.Element;
 /**
  * The control area for the Slider (handles interactions).
  */
@@ -56,9 +54,7 @@ declare function SliderControl({
   className,
   ref,
   ...props
-}: SliderControlProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
+}: SliderControlProps): React.JSX.Element;
 /**
  * The track container for the Slider.
  */
@@ -66,9 +62,7 @@ declare function SliderTrack({
   className,
   ref,
   ...props
-}: SliderTrackProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
+}: SliderTrackProps): React.JSX.Element;
 /**
  * The filled indicator showing current value position.
  */
@@ -76,9 +70,7 @@ declare function SliderIndicator({
   className,
   ref,
   ...props
-}: SliderIndicatorProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
+}: SliderIndicatorProps): React.JSX.Element;
 /**
  * The draggable thumb for the Slider.
  */
@@ -86,21 +78,16 @@ declare function SliderThumb({
   className,
   ref,
   ...props
-}: SliderThumbProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
+}: SliderThumbProps): React.JSX.Element;
 /**
  * Displays the current value of the Slider.
  * Note: This must be used inside a Slider component to access the value context.
  */
-declare function SliderOutput({
+declare function SliderValue({
   className,
-  children,
   ref,
   ...props
-}: SliderOutputProps & {
-  ref?: React.Ref<HTMLOutputElement>;
-}): React.JSX.Element;
+}: SliderValueProps): React.JSX.Element;
 /** Visible label that participates in Base UI's slider naming relationship. */
 declare function SliderLabel({
   className,
@@ -110,11 +97,11 @@ declare function SliderLabel({
 declare const Slider: {
   Root: typeof SliderRoot;
   Label: typeof SliderLabel;
-  Value: typeof SliderOutput;
+  Value: typeof SliderValue;
   Control: typeof SliderControl;
   Track: typeof SliderTrack;
   Indicator: typeof SliderIndicator;
   Thumb: typeof SliderThumb;
 };
 //#endregion
-export { Slider, SliderControlProps, SliderIndicatorProps, SliderLabelProps, SliderOutputProps, SliderProps, SliderThumbProps, SliderTrackProps };
+export { Slider, SliderControlProps, SliderIndicatorProps, SliderLabelProps, SliderRootProps, SliderThumbProps, SliderTrackProps, SliderValueProps };

package/dist/components/foundations/Slider.js

@@ -8,28 +8,30 @@ import { Slider as Slider$1 } from "@base-ui/react/slider";
 *
 * @example
 * ```tsx
-* <Slider defaultValue={50}>
-*   <SliderControl>
-*     <SliderTrack>
-*       <SliderIndicator />
-*       <SliderThumb />
-*     </SliderTrack>
-*   </SliderControl>
-* </Slider>
+* <Slider.Root defaultValue={50}>
+*   <Slider.Label>Volume</Slider.Label>
+*   <Slider.Control>
+*     <Slider.Track>
+*       <Slider.Indicator />
+*       <Slider.Thumb />
+*     </Slider.Track>
+*   </Slider.Control>
+* </Slider.Root>
 * ```
 *
 * @example
 * ```tsx
 * // With output value display
-* <Slider defaultValue={50}>
-*   <SliderOutput />
-*   <SliderControl>
-*     <SliderTrack>
-*       <SliderIndicator />
-*       <SliderThumb />
-*     </SliderTrack>
-*   </SliderControl>
-* </Slider>
+* <Slider.Root defaultValue={50}>
+*   <Slider.Label>Volume</Slider.Label>
+*   <Slider.Value />
+*   <Slider.Control>
+*     <Slider.Track>
+*       <Slider.Indicator />
+*       <Slider.Thumb />
+*     </Slider.Track>
+*   </Slider.Control>
+* </Slider.Root>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/slider | Base UI Slider}
@@ -74,7 +76,7 @@ function SliderIndicator({ className, ref, ...props }) {
 	const classes = mergeBaseClassName("slider__indicator", className);
 	return /* @__PURE__ */ jsx(Slider$1.Indicator, {
 		ref,
-		"data-slot": "slider-range",
+		"data-slot": "slider-indicator",
 		className: classes,
 		...props
 	});
@@ -95,19 +97,18 @@ function SliderThumb({ className, ref, ...props }) {
 * Displays the current value of the Slider.
 * Note: This must be used inside a Slider component to access the value context.
 */
-function SliderOutput({ className, children, ref, ...props }) {
-	const classes = mergeBaseClassName("slider__output", className);
+function SliderValue({ className, ref, ...props }) {
+	const classes = mergeBaseClassName("slider__value", className);
 	return /* @__PURE__ */ jsx(Slider$1.Value, {
 		ref,
-		"data-slot": "slider-output",
+		"data-slot": "slider-value",
 		className: classes,
-		...props,
-		children: (formattedValues, values) => typeof children === "function" ? children(values[0] ?? 0, values, formattedValues) : formattedValues.join(" - ")
+		...props
 	});
 }
 /** Visible label that participates in Base UI's slider naming relationship. */
 function SliderLabel({ className, ref, ...props }) {
-	const classes = mergeBaseClassName("slider__label", className);
+	const classes = mergeBaseClassName("label slider__label", className);
 	return /* @__PURE__ */ jsx(Slider$1.Label, {
 		ref,
 		"data-slot": "slider-label",
@@ -118,7 +119,7 @@ function SliderLabel({ className, ref, ...props }) {
 const Slider = {
 	Root: SliderRoot,
 	Label: SliderLabel,
-	Value: SliderOutput,
+	Value: SliderValue,
 	Control: SliderControl,
 	Track: SliderTrack,
 	Indicator: SliderIndicator,

package/dist/components/foundations/Stepper.d.ts

@@ -1,9 +1,10 @@
-import { r as Tabs } from "../../Tabs-Ptrbaynh.js";
+import { o as TabsProps, r as Tabs } from "../../Tabs-Ptrbaynh.js";
 import * as React from "react";
 
 //#region src/components/foundations/Stepper.d.ts
 type StepperOrientation = "horizontal" | "vertical";
 type StepperState = "active" | "completed" | "inactive" | "loading";
+type StepperChangeEventDetails = Parameters<NonNullable<TabsProps["onValueChange"]>>[1];
 type StepIndicators = {
   active?: React.ReactNode;
   completed?: React.ReactNode;
@@ -12,7 +13,6 @@ type StepIndicators = {
 };
 interface StepperContextValue {
   activeStep: number;
-  setActiveStep: (step: number) => void;
   orientation: StepperOrientation;
   indicators: StepIndicators;
 }
@@ -37,7 +37,7 @@ interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
    * Called when a trigger requests a new active step.
    */
-  onValueChange?: (value: number) => void;
+  onValueChange?: (value: number, eventDetails: StepperChangeEventDetails) => void;
   /**
    * The layout direction of the step navigation.
    * @default "horizontal"

package/dist/components/foundations/Stepper.js

@@ -40,27 +40,26 @@ function useStepItem() {
 function Stepper({ defaultValue = 1, value, onValueChange, orientation = "horizontal", indicators = EMPTY_STEP_INDICATORS, className, children, ref, ...props }) {
 	const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue);
 	const activeStep = value ?? uncontrolledValue;
-	const setActiveStep = React.useCallback((step) => {
+	const handleValueChange = React.useCallback((step, eventDetails) => {
+		onValueChange?.(step, eventDetails);
+		if (eventDetails.isCanceled) return;
 		if (value === void 0) setUncontrolledValue(step);
-		onValueChange?.(step);
 	}, [onValueChange, value]);
 	const contextValue = React.useMemo(() => ({
 		activeStep,
-		setActiveStep,
 		orientation,
 		indicators
 	}), [
 		activeStep,
 		indicators,
-		orientation,
-		setActiveStep
+		orientation
 	]);
 	return /* @__PURE__ */ jsx(StepperContext.Provider, {
 		value: contextValue,
 		children: /* @__PURE__ */ jsx(Tabs.Root, {
 			ref,
 			value: activeStep,
-			onValueChange: setActiveStep,
+			onValueChange: handleValueChange,
 			orientation,
 			className: mergeBaseClassName("stepper", className),
 			"data-slot": "stepper",

package/dist/components/foundations/ToggleGroup.d.ts

@@ -1,2 +1,2 @@
-import { n as ToggleGroupItemProps, r as ToggleGroupProps, t as ToggleGroup } from "../../ToggleGroup-CSBWfPXo.js";
+import { n as ToggleGroupItemProps, r as ToggleGroupProps, t as ToggleGroup } from "../../ToggleGroup-BrQZOQn_.js";
 export { ToggleGroup, ToggleGroupItemProps, ToggleGroupProps };

package/dist/components/foundations/Tooltip.d.ts

@@ -2,13 +2,11 @@ import * as React from "react";
 import { Tooltip as Tooltip$1 } from "@base-ui/react/tooltip";
 
 //#region src/components/foundations/Tooltip.d.ts
-interface TooltipProps extends Tooltip$1.Root.Props {}
-interface TooltipTriggerProps extends Tooltip$1.Trigger.Props {}
+type TooltipProps<Payload = unknown> = Tooltip$1.Root.Props<Payload>;
+type TooltipTriggerProps<Payload = unknown> = Tooltip$1.Trigger.Props<Payload> & React.RefAttributes<HTMLElement>;
 interface TooltipPortalProps extends Tooltip$1.Portal.Props {}
 interface TooltipPositionerProps extends Tooltip$1.Positioner.Props {}
-interface TooltipProviderProps extends Tooltip$1.Provider.Props {
-  delayDuration?: number;
-}
+type TooltipProviderProps = Tooltip$1.Provider.Props;
 interface TooltipPopupProps extends Tooltip$1.Popup.Props {}
 interface TooltipViewportProps extends Tooltip$1.Viewport.Props {}
 interface TooltipArrowProps extends Tooltip$1.Arrow.Props {}
@@ -33,15 +31,15 @@ interface TooltipArrowProps extends Tooltip$1.Arrow.Props {}
  * @see {@link https://base-ui.com/react/components/tooltip | Base UI Tooltip}
  */
 declare function TooltipProvider({
-  delayDuration,
   delay,
   ...props
 }: TooltipProviderProps): React.JSX.Element;
-declare function TooltipTrigger({
+declare function TooltipTrigger<Payload>({
   render,
   className,
+  ref,
   ...props
-}: TooltipTriggerProps): React.JSX.Element;
+}: TooltipTriggerProps<Payload>): React.JSX.Element;
 declare function TooltipPositioner({
   className,
   ref,

package/dist/components/foundations/Tooltip.js

@@ -24,13 +24,13 @@ import { Tooltip as Tooltip$1 } from "@base-ui/react/tooltip";
 *
 * @see {@link https://base-ui.com/react/components/tooltip | Base UI Tooltip}
 */
-function TooltipProvider({ delayDuration = 0, delay, ...props }) {
+function TooltipProvider({ delay = 0, ...props }) {
 	return /* @__PURE__ */ jsx(Tooltip$1.Provider, {
-		delay: delay ?? delayDuration,
+		delay,
 		...props
 	});
 }
-function TooltipTrigger({ render, className, ...props }) {
+function TooltipTrigger({ render, className, ref, ...props }) {
 	const classes = mergeBaseClassName(render == null ? buttonVariants({
 		variant: "ghost",
 		color: "neutral",
@@ -38,6 +38,7 @@ function TooltipTrigger({ render, className, ...props }) {
 		className: "tooltip__trigger"
 	}) : "tooltip__trigger", className);
 	return /* @__PURE__ */ jsx(Tooltip$1.Trigger, {
+		ref,
 		"data-slot": "tooltip-trigger",
 		render,
 		className: classes,

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

@@ -2,8 +2,8 @@ import { t as cx } from "../../class-names-BiMDVpUo.js";
 import { C as FileIcon, m as ChevronRightIcon } from "../../icons-B1Qw05te.js";
 import { Collapsible } from "../foundations/Collapsible.js";
 import { Avatar } from "../foundations/Avatar.js";
-import { t as CopyButton } from "../../copy-button-CsNSSKYG.js";
 import { Badge } from "../foundations/Badge.js";
+import { t as CopyButton } from "../../copy-button-CsNSSKYG.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/general-purpose/Commit.tsx

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

@@ -1,7 +1,7 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
 import { S as EyeOffIcon, x as EyeIcon } from "../../icons-B1Qw05te.js";
-import { t as CopyButton } from "../../copy-button-CsNSSKYG.js";
 import { Badge } from "../foundations/Badge.js";
+import { t as CopyButton } from "../../copy-button-CsNSSKYG.js";
 import { Switch } from "../foundations/Switch.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

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

@@ -1,12 +1,11 @@
 import { PricingBillingPeriod } from "./Pricing.js";
-import * as React from "react";
 
 //#region src/components/general-purpose/PricingBillingToggle.d.ts
 interface PricingBillingToggleProps {
   value: PricingBillingPeriod;
   onValueChange: (value: PricingBillingPeriod) => void;
   yearlySavingsPercent: number;
-  /** Fixes the presentation. Omit only in component demos that expose the style switcher. */
+  /** Billing control presentation. Defaults to the compact switch. */
   variant?: "switch" | "buttons";
   /** Additional class name for placement in a consuming layout. */
   className?: string;
@@ -18,6 +17,6 @@ declare function PricingBillingToggle({
   yearlySavingsPercent,
   variant,
   className
-}: PricingBillingToggleProps): React.JSX.Element;
+}: PricingBillingToggleProps): import("react").JSX.Element;
 //#endregion
 export { PricingBillingToggle, PricingBillingToggleProps };

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

@@ -2,32 +2,14 @@ import { t as cx } from "../../class-names-BiMDVpUo.js";
 import { Badge } from "../foundations/Badge.js";
 import { ToggleGroup } from "../foundations/ToggleGroup.js";
 import { Switch } from "../foundations/Switch.js";
-import { Checkbox } from "../foundations/Checkbox.js";
-import { Label } from "../foundations/Label.js";
-import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/general-purpose/PricingBillingToggle.tsx
 /** Controlled billing-period selector composed from the shared Switch or ToggleGroup. */
-function PricingBillingToggle({ value, onValueChange, yearlySavingsPercent, variant, className }) {
-	const [demoVariant, setDemoVariant] = React.useState("switch");
-	const demoToggleId = React.useId();
-	const resolvedVariant = variant ?? demoVariant;
+function PricingBillingToggle({ value, onValueChange, yearlySavingsPercent, variant = "switch", className }) {
 	const isYearly = value === "yearly";
-	return /* @__PURE__ */ jsxs("div", {
+	return /* @__PURE__ */ jsx("div", {
 		className: cx("pricing-page__billing-toggle", className),
-		children: [!variant ? /* @__PURE__ */ jsxs("div", {
-			className: "pricing-page__toggle-options",
-			children: [/* @__PURE__ */ jsx(Checkbox.Root, {
-				checked: demoVariant === "switch",
-				onCheckedChange: (checked) => setDemoVariant(checked ? "switch" : "buttons"),
-				id: demoToggleId,
-				children: /* @__PURE__ */ jsx(Checkbox.Indicator, {})
-			}), /* @__PURE__ */ jsx(Label, {
-				htmlFor: demoToggleId,
-				className: "pricing-page__toggle-label",
-				children: "Use switch style"
-			})]
-		}) : null, resolvedVariant === "switch" ? /* @__PURE__ */ jsxs("div", {
+		children: variant === "switch" ? /* @__PURE__ */ jsxs("div", {
 			className: "pricing-page__switch-container",
 			children: [
 				/* @__PURE__ */ jsx("span", {
@@ -80,7 +62,7 @@ function PricingBillingToggle({ value, onValueChange, yearlySavingsPercent, vari
 					]
 				})]
 			})]
-		})]
+		})
 	});
 }
 //#endregion

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

@@ -1,4 +1,4 @@
-import { FAQItem, Plan, PlanFeature, UsageTier } from "./Pricing.js";
+import { FAQItem, Plan, UsageTier } from "./Pricing.js";
 import * as React from "react";
 
 //#region src/components/general-purpose/PricingPage.d.ts
@@ -53,8 +53,7 @@ interface PricingPageProps {
   className?: string;
   /**
    * Style variant for the billing period toggle.
-   * When set, hides the style switcher checkbox.
-   * @default undefined (shows style switcher for demos)
+   * @default "switch"
    */
   billingToggleVariant?: "switch" | "buttons";
   /**
@@ -170,4 +169,4 @@ declare function PricingPage({
   onPortalRedirect
 }: PricingPageProps): React.JSX.Element;
 //#endregion
-export { type FAQItem, type Plan, type PlanFeature, PricingPage, PricingPageProps, type UsageTier };
+export { PricingPage, PricingPageProps };

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

@@ -1,68 +1,2 @@
-import * as React from "react";
-
-//#region src/components/general-purpose/ResponsiveSidebarShell.d.ts
-interface ResponsiveSidebarShellControls {
-  /** Close the sidebar and move focus to the main content. */
-  closeSidebar: () => void;
-  /** Close only when the shell is currently using its compact drawer layout. */
-  closeSidebarOnCompact: () => void;
-}
-interface ResponsiveSidebarShellTopBarControls {
-  /** The shell-owned, labelled sidebar toggle to place in a top-bar slot. */
-  sidebarToggle: React.ReactNode;
-  /** Stable id for a caller-composed compact disclosure trigger. */
-  sidebarId: string;
-  /** Whether the shared sidebar surface is currently visible. */
-  sidebarOpen: boolean;
-  /** Toggle the sidebar and remember the invoking control for Escape focus restoration. */
-  toggleSidebar: (trigger?: HTMLElement) => void;
-}
-interface ResponsiveSidebarShellProps extends React.HTMLAttributes<HTMLDivElement> {
-  /** Navigation or other secondary surface shown beside the selected content. */
-  sidebar: React.ReactNode | ((controls: ResponsiveSidebarShellControls) => React.ReactNode);
-  /**
-   * Optional composable application bar. The render form receives the
-   * shell-owned sidebar toggle so callers can place it beside their own icon
-   * groups without duplicating drawer behavior.
-   */
-  topBar?: React.ReactNode | ((controls: ResponsiveSidebarShellTopBarControls) => React.ReactNode);
-  /** Short noun used by the toggle and resize control, such as “threads” or “schedules”. */
-  sidebarLabel: string;
-  /** Whether the sidebar is open. Omit for internal state. */
-  sidebarOpen?: boolean;
-  /** Initial sidebar state when `sidebarOpen` is uncontrolled. */
-  defaultSidebarOpen?: boolean;
-  /** Initial desktop sidebar width in CSS pixels. */
-  defaultSidebarWidth?: number;
-  /** Called when the sidebar is opened or closed. */
-  onSidebarOpenChange?: (open: boolean) => void;
-  /** Accessible name for the toolbar containing the sidebar toggle. */
-  toolbarLabel?: string;
-  /** Accessible name for the mobile preview target that returns to the main content. */
-  showMainLabel?: string;
-}
-/**
- * Responsive master-detail shell with a resizable desktop sidebar and a compact
- * floating sidebar that leaves the main content in place as a dismiss target.
- * The root exposes `data-sidebar-open="true" | "false"` as its public styling hook.
- */
-declare function ResponsiveSidebarShell({
-  sidebar,
-  topBar,
-  sidebarLabel,
-  sidebarOpen,
-  defaultSidebarOpen,
-  defaultSidebarWidth,
-  onSidebarOpenChange,
-  toolbarLabel,
-  showMainLabel,
-  className,
-  children,
-  ref,
-  style,
-  ...props
-}: ResponsiveSidebarShellProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
-//#endregion
+import { i as ResponsiveSidebarShellTopBarControls, n as ResponsiveSidebarShellControls, r as ResponsiveSidebarShellProps, t as ResponsiveSidebarShell } from "../../ResponsiveSidebarShell-DWjULskY.js";
 export { ResponsiveSidebarShell, ResponsiveSidebarShellControls, ResponsiveSidebarShellProps, ResponsiveSidebarShellTopBarControls };

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

@@ -1,7 +1,12 @@
 import * as React from "react";
 
 //#region src/components/general-purpose/SettingsFormDialog.d.ts
-type SettingsFormFieldType = "email" | "password" | "search" | "tel" | "text" | "url";
+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;
@@ -40,4 +45,4 @@ declare function SettingsFormDialog({
   ...contentProps
 }: SettingsFormDialogProps): React.JSX.Element;
 //#endregion
-export { SettingsFormDialog, SettingsFormDialogProps, SettingsFormField, SettingsFormFieldType, SettingsFormValues };
+export { SETTINGS_FORM_CHECKED, SettingsFormDialog, SettingsFormDialogProps, SettingsFormField, SettingsFormFieldType, SettingsFormValues };