@waveso/ui 0.7.7 → 0.8.1

package/README.md

@@ -137,11 +137,11 @@ npm install @waveso/ui @base-ui/react class-variance-authority clsx tailwind-mer
 
 ## Setup
 
-Add the theme preset and Tailwind to your CSS entry point:
+Import Tailwind, then the Wave UI preset, in your CSS entry point:
 
 ```css
-@import "@waveso/ui/styles.css";
 @import "tailwindcss";
+@import "@waveso/ui/styles.css";
 ```
 
 The preset provides every CSS variable (colors, radii, motion, shadows) with light and dark support. Override any variable in your own `:root` / `.dark` blocks to customize the theme.
@@ -193,7 +193,6 @@ Some components have optional peer dependencies — install only what you use:
 - **Form** — `react-hook-form`
 - **Input OTP** — `input-otp`
 - **Animations** — `motion`
-- **Sidebar** — `usehooks-ts`
 
 ## Development
 

package/dist/accordion.d.ts

@@ -26,5 +26,4 @@ declare function AccordionContent({
   ...props
 }: AccordionContentProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
-//# sourceMappingURL=accordion.d.ts.map
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/accordion.js

@@ -25,7 +25,7 @@ function AccordionTrigger({ className, children, ...props }) {
 		className: "flex",
 		children: /* @__PURE__ */ jsxs(Accordion$1.Trigger, {
 			"data-slot": "accordion-trigger",
-			className: cn("cursor-clickable focus-visible:ring-focus/50 focus-visible:border-focus focus-visible:after:border-focus **:data-[slot=accordion-trigger-icon]:text-muted group/accordion-trigger relative flex flex-1 items-start justify-between rounded-md border border-transparent py-2.5 text-left text-sm font-medium motion-color outline-none hover:underline focus-visible:ring-3 aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4", className),
+			className: cn("cursor-clickable focus-visible:ring-focus/50 focus-visible:border-focus focus-visible:after:border-focus **:data-[slot=accordion-trigger-icon]:text-muted group/accordion-trigger relative flex flex-1 items-start justify-between rounded-md border border-transparent py-2.5 text-left text-sm font-medium motion-color outline-hidden hover:underline focus-visible:ring-3 aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4", className),
 			...props,
 			children: [
 				children,
@@ -55,5 +55,3 @@ function AccordionContent({ className, children, ...props }) {
 }
 //#endregion
 export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
-
-//# sourceMappingURL=accordion.js.map

package/dist/action-bar.d.ts

@@ -79,5 +79,4 @@ declare function useActionBar(id: string, entry: ActionBarEntry): void;
  */
 declare function useActionBarGuard(navigate: (href: string) => void): (href: string) => boolean;
 //#endregion
-export { ActionBarEntry, ActionBarProvider, ActionBarProviderProps, useActionBar, useActionBarGuard };
-//# sourceMappingURL=action-bar.d.ts.map
+export { ActionBarEntry, ActionBarProvider, ActionBarProviderProps, useActionBar, useActionBarGuard };

package/dist/action-bar.js

@@ -49,12 +49,13 @@ function ActionBarProvider({ children, message = "You have unsaved changes", plu
 	const [, forceUpdate] = React.useState(0);
 	const [jiggleTransform, setJiggleTransform] = React.useState(null);
 	const jiggleTimerRef = React.useRef(null);
-	const contentRef = React.useRef(null);
+	const blockedNoticeRafRef = React.useRef(null);
 	const isMac = useIsMac();
 	const prefersReducedMotion = useReducedMotion();
 	const reducedMotionRef = React.useRef(prefersReducedMotion);
 	reducedMotionRef.current = prefersReducedMotion;
 	const [blockedNotice, setBlockedNotice] = React.useState("");
+	const [saveError, setSaveError] = React.useState(false);
 	const register = React.useCallback((id, entry) => {
 		const prev = entriesRef.current.get(id);
 		entriesRef.current.set(id, entry);
@@ -69,7 +70,11 @@ function ActionBarProvider({ children, message = "You have unsaved changes", plu
 	}, []);
 	const jiggle = React.useCallback(() => {
 		setBlockedNotice("");
-		requestAnimationFrame(() => setBlockedNotice(blockedMessage));
+		if (blockedNoticeRafRef.current !== null) cancelAnimationFrame(blockedNoticeRafRef.current);
+		blockedNoticeRafRef.current = requestAnimationFrame(() => {
+			blockedNoticeRafRef.current = null;
+			setBlockedNotice(blockedMessage);
+		});
 		if (reducedMotionRef.current) return;
 		if (jiggleTimerRef.current) return;
 		let step = 0;
@@ -87,6 +92,12 @@ function ActionBarProvider({ children, message = "You have unsaved changes", plu
 		}
 		tick();
 	}, [blockedMessage]);
+	React.useEffect(() => {
+		return () => {
+			if (jiggleTimerRef.current !== null) clearTimeout(jiggleTimerRef.current);
+			if (blockedNoticeRafRef.current !== null) cancelAnimationFrame(blockedNoticeRafRef.current);
+		};
+	}, []);
 	const dirty = [];
 	let anySaving = false;
 	for (const entry of entriesRef.current.values()) {
@@ -97,15 +108,20 @@ function ActionBarProvider({ children, message = "You have unsaved changes", plu
 	const dirtyCount = dirty.length;
 	const displayMessage = dirtyCount > 1 ? pluralMessage(dirtyCount) : message;
 	const handleSaveAll = React.useCallback(async () => {
+		setSaveError(false);
 		const saves = [...entriesRef.current.values()].filter((e) => e.hasChanges).map((e) => e.onSave());
-		await Promise.all(saves);
+		try {
+			await Promise.all(saves);
+		} catch {
+			setSaveError(true);
+		}
 	}, []);
 	const handleResetAll = React.useCallback(() => {
 		for (const entry of entriesRef.current.values()) if (entry.hasChanges) entry.onReset();
 	}, []);
 	React.useEffect(() => {
 		function handleKeyDown(e) {
-			if ((e.metaKey || e.ctrlKey) && e.key === "s") {
+			if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "s") {
 				e.preventDefault();
 				if (hasDirty()) handleSaveAll();
 			}
@@ -136,7 +152,6 @@ function ActionBarProvider({ children, message = "You have unsaved changes", plu
 		children: [
 			/* @__PURE__ */ jsx("div", {
 				"data-slot": "action-bar-shell",
-				ref: contentRef,
 				style: jiggleTransform ? { transform: jiggleTransform } : void 0,
 				children
 			}),
@@ -150,7 +165,7 @@ function ActionBarProvider({ children, message = "You have unsaved changes", plu
 				"data-slot": "action-bar-blocked-status",
 				"aria-live": "assertive",
 				className: "sr-only",
-				children: blockedNotice
+				children: saveError ? "Couldn't save your changes" : blockedNotice
 			}),
 			/* @__PURE__ */ jsx(AnimatePresence, { children: showBar && /* @__PURE__ */ jsx(motion.div, {
 				"data-slot": "action-bar",
@@ -182,11 +197,11 @@ function ActionBarProvider({ children, message = "You have unsaved changes", plu
 				className: "fixed bottom-6 left-1/2 z-50",
 				children: /* @__PURE__ */ jsxs("div", {
 					"data-slot": "action-bar-content",
-					className: cn("flex items-center gap-6 rounded-lg border border-line/60 bg-surface px-5 py-2.5 shadow-lg ring-1 ring-line backdrop-blur-sm", className),
+					className: cn("flex items-center gap-6 rounded-lg border border-line/60 bg-surface px-5 py-2.5 shadow-lg ring-1 ring-line", className),
 					children: [/* @__PURE__ */ jsx("span", {
 						"data-slot": "action-bar-message",
-						className: "whitespace-nowrap text-sm font-medium text-contrast",
-						children: displayMessage
+						className: cn("whitespace-nowrap text-sm font-medium", saveError ? "text-destructive" : "text-contrast"),
+						children: saveError ? "Couldn't save your changes" : displayMessage
 					}), /* @__PURE__ */ jsxs("div", {
 						"data-slot": "action-bar-actions",
 						className: "flex items-center gap-1.5",
@@ -260,5 +275,3 @@ function useActionBarGuard(navigate) {
 }
 //#endregion
 export { ActionBarProvider, useActionBar, useActionBarGuard };
-
-//# sourceMappingURL=action-bar.js.map

package/dist/alert-dialog.d.ts

@@ -67,5 +67,4 @@ declare function AlertDialogCancel({
   ...props
 }: AlertDialogCancelProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };
-//# sourceMappingURL=alert-dialog.d.ts.map
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };

package/dist/alert-dialog.js

@@ -34,7 +34,7 @@ function AlertDialogContent({ className, size = "default", ...props }) {
 	return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [/* @__PURE__ */ jsx(AlertDialogOverlay, {}), /* @__PURE__ */ jsx(AlertDialog$1.Popup, {
 		"data-slot": "alert-dialog-content",
 		"data-size": size,
-		className: cn("motion-scale-lg bg-foundation ring-contrast/10 group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-lg p-4 ring-1 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=lg]:max-w-lg data-[size=xl]:max-w-xl data-[size=default]:sm:max-w-sm data-[size=lg]:sm:max-w-lg data-[size=xl]:sm:max-w-xl", className),
+		className: cn("motion-scale-lg bg-foundation ring-contrast/10 group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-lg p-4 ring-1 outline-hidden data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=lg]:max-w-lg data-[size=xl]:max-w-xl data-[size=default]:sm:max-w-sm data-[size=lg]:sm:max-w-lg data-[size=xl]:sm:max-w-xl", className),
 		...props
 	})] });
 }
@@ -76,7 +76,7 @@ function AlertDialogDescription({ className, ...props }) {
 function AlertDialogAction({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Button, {
 		"data-slot": "alert-dialog-action",
-		className: cn(className),
+		className,
 		...props
 	});
 }
@@ -93,5 +93,3 @@ function AlertDialogCancel({ className, variant = "outline", size = "default", .
 }
 //#endregion
 export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };
-
-//# sourceMappingURL=alert-dialog.js.map

package/dist/alert.d.ts

@@ -29,5 +29,4 @@ declare function AlertAction({
   ...props
 }: AlertActionProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Alert, AlertAction, AlertDescription, AlertTitle };
-//# sourceMappingURL=alert.d.ts.map
+export { Alert, AlertAction, AlertDescription, AlertTitle };

package/dist/alert.js

@@ -3,7 +3,7 @@ import "react";
 import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 //#region src/alert.tsx
-const alertVariants = cva("grid gap-0.5 rounded-md border border-edge px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-data-[icon]:grid-cols-[auto_1fr] has-data-[icon]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4 w-full relative group/alert", {
+const alertVariants = cva("grid gap-0.5 rounded-md border border-edge px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-data-[icon]:grid-cols-[auto_1fr] has-data-[icon]:gap-x-2 *:data-[icon]:col-start-1 *:data-[icon]:row-span-2 *:data-[icon]:translate-y-0.5 *:data-[icon]:text-current *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4 w-full relative group/alert", {
 	variants: { variant: {
 		default: "bg-surface text-contrast",
 		destructive: "text-destructive bg-surface *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current"
@@ -28,7 +28,7 @@ function AlertTitle({ className, ...props }) {
 function AlertDescription({ className, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		"data-slot": "alert-description",
-		className: cn("text-muted [&_a]:hover:text-contrast text-sm text-balance md:text-pretty [&_a]:underline [&_a]:underline-offset-3 [&_p:not(:last-child)]:mb-4", className),
+		className: cn("text-muted [&_a]:hover:text-contrast group-has-data-[icon]/alert:col-start-2 text-sm text-balance md:text-pretty [&_a]:underline [&_a]:underline-offset-3 [&_p:not(:last-child)]:mb-4", className),
 		...props
 	});
 }
@@ -41,5 +41,3 @@ function AlertAction({ className, ...props }) {
 }
 //#endregion
 export { Alert, AlertAction, AlertDescription, AlertTitle };
-
-//# sourceMappingURL=alert.js.map

package/dist/animate.d.ts

@@ -189,5 +189,4 @@ declare function Float({
   paused
 }: FloatProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { AnimateIn, type AnimateInProps, AnimateOnView, type AnimateOnViewProps, type Direction, Float, type FloatProps, Pulse, type PulseProps, Stagger, type StaggerProps };
-//# sourceMappingURL=animate.d.ts.map
+export { AnimateIn, type AnimateInProps, AnimateOnView, type AnimateOnViewProps, type Direction, Float, type FloatProps, Pulse, type PulseProps, Stagger, type StaggerProps };

package/dist/animate.js

@@ -1,9 +1,15 @@
 "use client";
-import { Children, cloneElement, isValidElement, useEffect, useId, useRef, useState } from "react";
+import { Children, cloneElement, isValidElement, useCallback, useEffect, useId, useLayoutEffect, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useInView, useReducedMotion } from "motion/react";
 //#region src/animate.tsx
 /**
+* `useLayoutEffect` warns when run during SSR. Fall back to `useEffect` on the
+* server so entrance components (which render on the server to avoid hydration
+* mismatch) stay warning-free while still committing pre-paint in the browser.
+*/
+const useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
+/**
 * Direction map: `from` means where the element COMES FROM.
 * `from="left"` = starts to the left, slides right into place.
 */
@@ -108,14 +114,23 @@ function buildTransitionStr(duration, ease, delay, hasFilter) {
 function AnimateOnView({ children, delay = 0, from = "down", distance = 16, scale = false, blur = false, rotate = 0, flip = false, spring = false, once = true, transition }) {
 	const ref = useRef(null);
 	const [hydrated, setHydrated] = useState(false);
+	const [settled, setSettled] = useState(false);
 	const isInView = useInView(ref, {
 		once,
 		margin: "-50px"
 	});
 	const prefersReducedMotion = useReducedMotion();
-	useEffect(() => {
+	useIsomorphicLayoutEffect(() => {
 		setHydrated(true);
 	}, []);
+	useEffect(() => {
+		if (!isInView) setSettled(false);
+	}, [isInView]);
+	const existingOnTransitionEnd = children.props?.onTransitionEnd;
+	const handleTransitionEnd = useCallback((event) => {
+		if (event.target === ref.current) setSettled(true);
+		existingOnTransitionEnd?.(event);
+	}, [existingOnTransitionEnd]);
 	if (!isValidElement(children)) return children;
 	const childProps = children.props;
 	const existingStyle = childProps.style ?? {};
@@ -141,11 +156,12 @@ function AnimateOnView({ children, delay = 0, from = "down", distance = 16, scal
 	const transitionStr = buildTransitionStr(duration, ease, delay, styles.hasFilter);
 	return cloneElement(children, {
 		ref: mergeRefs(ref, existingRef),
+		onTransitionEnd: handleTransitionEnd,
 		style: {
 			...existingStyle,
 			...currentStyle,
 			...isInView ? { transition: transitionStr } : {},
-			willChange: "opacity, transform"
+			...isInView && !settled ? { willChange: "opacity, transform" } : {}
 		}
 	});
 }
@@ -165,12 +181,23 @@ function AnimateOnView({ children, delay = 0, from = "down", distance = 16, scal
 function AnimateIn({ children, delay = 0, from = "down", distance = 4, scale = false, blur = false, rotate = 0, flip = false, spring = false, transition }) {
 	const ref = useRef(null);
 	const [visible, setVisible] = useState(false);
+	const [settled, setSettled] = useState(false);
 	const prefersReducedMotion = useReducedMotion();
 	useEffect(() => {
-		requestAnimationFrame(() => {
-			requestAnimationFrame(() => setVisible(true));
+		let inner = 0;
+		const outer = requestAnimationFrame(() => {
+			inner = requestAnimationFrame(() => setVisible(true));
 		});
+		return () => {
+			cancelAnimationFrame(outer);
+			cancelAnimationFrame(inner);
+		};
 	}, []);
+	const existingOnTransitionEnd = children.props?.onTransitionEnd;
+	const handleTransitionEnd = useCallback((event) => {
+		if (event.target === ref.current) setSettled(true);
+		existingOnTransitionEnd?.(event);
+	}, [existingOnTransitionEnd]);
 	if (!isValidElement(children)) return children;
 	const childProps = children.props;
 	const existingStyle = childProps.style ?? {};
@@ -195,11 +222,12 @@ function AnimateIn({ children, delay = 0, from = "down", distance = 4, scale = f
 	const transitionStr = buildTransitionStr(duration, ease, delay, styles.hasFilter);
 	return cloneElement(children, {
 		ref: mergeRefs(ref, existingRef),
+		onTransitionEnd: handleTransitionEnd,
 		style: {
 			...existingStyle,
 			...currentStyle,
 			...visible ? { transition: transitionStr } : {},
-			willChange: "opacity, transform"
+			...visible && !settled ? { willChange: "opacity, transform" } : {}
 		}
 	});
 }
@@ -305,5 +333,3 @@ function Float({ children, distance = 6, duration = 3, rotate = 0, paused = fals
 }
 //#endregion
 export { AnimateIn, AnimateOnView, Float, Pulse, Stagger };
-
-//# sourceMappingURL=animate.js.map

package/dist/aspect-ratio.d.ts

@@ -11,5 +11,4 @@ declare function AspectRatio({
   ...props
 }: AspectRatioProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { AspectRatio, type AspectRatioProps };
-//# sourceMappingURL=aspect-ratio.d.ts.map
+export { AspectRatio, type AspectRatioProps };

package/dist/aspect-ratio.js

@@ -12,5 +12,3 @@ function AspectRatio({ ratio, className, ...props }) {
 }
 //#endregion
 export { AspectRatio };
-
-//# sourceMappingURL=aspect-ratio.js.map

package/dist/autocomplete.d.ts

@@ -110,5 +110,4 @@ declare function AutocompleteContent({
   ...props
 }: AutocompleteContentProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Autocomplete, AutocompleteArrow, AutocompleteBackdrop, AutocompleteClear, AutocompleteCollection, AutocompleteContent, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteIcon, AutocompleteInput, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompletePortal, AutocompletePositioner, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue };
-//# sourceMappingURL=autocomplete.d.ts.map
+export { Autocomplete, AutocompleteArrow, AutocompleteBackdrop, AutocompleteClear, AutocompleteCollection, AutocompleteContent, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteIcon, AutocompleteInput, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompletePortal, AutocompletePositioner, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue };

package/dist/autocomplete.js

@@ -13,7 +13,7 @@ function Autocomplete({ ...props }) {
 function AutocompleteInput({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Autocomplete$1.Input, {
 		"data-slot": "autocomplete-input",
-		className: cn("dark:bg-edge/30 border-edge focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 disabled:bg-edge/50 dark:disabled:bg-edge/80 placeholder:text-soft h-8 w-full min-w-0 rounded-md border bg-transparent px-2.5 py-1 text-base transition-colors outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm", className),
+		className: cn("dark:bg-edge/30 border-edge focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 disabled:bg-edge/50 dark:disabled:bg-edge/80 placeholder:text-soft h-8 w-full min-w-0 rounded-md border bg-transparent px-2.5 py-1 text-base transition-colors outline-hidden focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm", className),
 		...props
 	});
 }
@@ -47,7 +47,7 @@ function AutocompleteValue({ ...props }) {
 function AutocompletePortal({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Autocomplete$1.Portal, {
 		"data-slot": "autocomplete-portal",
-		className: cn(className),
+		className,
 		...props
 	});
 }
@@ -61,7 +61,7 @@ function AutocompleteBackdrop({ className, ...props }) {
 function AutocompletePositioner({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Autocomplete$1.Positioner, {
 		"data-slot": "autocomplete-positioner",
-		className: cn(className),
+		className,
 		...props
 	});
 }
@@ -103,7 +103,7 @@ function AutocompleteList({ className, ...props }) {
 function AutocompleteRow({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Autocomplete$1.Row, {
 		"data-slot": "autocomplete-row",
-		className: cn(className),
+		className,
 		...props
 	});
 }
@@ -156,5 +156,3 @@ function AutocompleteContent({ className, align = "start", alignOffset = 0, side
 }
 //#endregion
 export { Autocomplete, AutocompleteArrow, AutocompleteBackdrop, AutocompleteClear, AutocompleteCollection, AutocompleteContent, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteIcon, AutocompleteInput, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompletePortal, AutocompletePositioner, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue };
-
-//# sourceMappingURL=autocomplete.js.map

package/dist/avatar.d.ts

@@ -37,5 +37,4 @@ declare function AvatarGroupCount({
   ...props
 }: AvatarGroupCountProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage };
-//# sourceMappingURL=avatar.d.ts.map
+export { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage };

package/dist/avatar.js

@@ -29,7 +29,7 @@ function AvatarFallback({ className, ...props }) {
 function AvatarBadge({ className, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		"data-slot": "avatar-badge",
-		className: cn("bg-primary text-white ring-foundation absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none", "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden", "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2", "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2", className),
+		className: cn("bg-primary text-white ring-foundation absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full ring-2 select-none", "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden", "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2", "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2", className),
 		...props
 	});
 }
@@ -49,5 +49,3 @@ function AvatarGroupCount({ className, ...props }) {
 }
 //#endregion
 export { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage };
-
-//# sourceMappingURL=avatar.js.map

package/dist/badge.d.ts

@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/badge.d.ts
 declare const badgeVariants: (props?: ({
-  variant?: "default" | "link" | "success" | "destructive" | "warning" | "secondary" | "outline" | "ghost" | null | undefined;
+  variant?: "default" | "success" | "destructive" | "warning" | "secondary" | "outline" | "ghost" | "link" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 type BadgeProps = useRender.ComponentProps<"span"> & VariantProps<typeof badgeVariants>;
 declare function Badge({
@@ -15,5 +15,4 @@ declare function Badge({
   ...props
 }: BadgeProps): _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>>;
 //#endregion
-export { Badge, badgeVariants };
-//# sourceMappingURL=badge.d.ts.map
+export { Badge, badgeVariants };

package/dist/badge.js

@@ -33,5 +33,3 @@ function Badge({ className, variant = "default", render, ...props }) {
 }
 //#endregion
 export { Badge, badgeVariants };
-
-//# sourceMappingURL=badge.js.map

package/dist/breadcrumb.d.ts

@@ -40,5 +40,4 @@ declare function BreadcrumbEllipsis({
   ...props
 }: BreadcrumbEllipsisProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };
-//# sourceMappingURL=breadcrumb.d.ts.map
+export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };

package/dist/breadcrumb.js

@@ -70,5 +70,3 @@ function BreadcrumbEllipsis({ className, ...props }) {
 }
 //#endregion
 export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };
-
-//# sourceMappingURL=breadcrumb.js.map

package/dist/button-group.d.ts

@@ -1,5 +1,5 @@
 import { Separator } from "./separator.js";
-import * as _$react from "react";
+import * as React from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
 import { useRender } from "@base-ui/react/use-render";
@@ -21,12 +21,11 @@ declare function ButtonGroupText({
   className,
   render,
   ...props
-}: ButtonGroupTextProps): _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>>;
+}: ButtonGroupTextProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 declare function ButtonGroupSeparator({
   className,
   orientation,
   ...props
 }: ButtonGroupSeparatorProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants };
-//# sourceMappingURL=button-group.d.ts.map
+export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants };

package/dist/button-group.js

@@ -1,6 +1,7 @@
 "use client";
 import { cn } from "./lib/utils.js";
 import { Separator } from "./separator.js";
+import "react";
 import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { mergeProps } from "@base-ui/react/merge-props";
@@ -40,5 +41,3 @@ function ButtonGroupSeparator({ className, orientation = "vertical", ...props })
 }
 //#endregion
 export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants };
-
-//# sourceMappingURL=button-group.js.map

package/dist/button.d.ts

@@ -6,8 +6,8 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/button.d.ts
 declare const buttonVariants: (props?: ({
-  variant?: "default" | "link" | "success" | "destructive" | "secondary" | "outline" | "ghost" | null | undefined;
-  size?: "default" | "icon" | "xs" | "sm" | "lg" | "xl" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+  variant?: "default" | "success" | "destructive" | "secondary" | "outline" | "ghost" | "link" | null | undefined;
+  size?: "default" | "xs" | "sm" | "lg" | "xl" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 type ButtonProps = React.ComponentProps<typeof Button$1> & VariantProps<typeof buttonVariants>;
 declare function Button({
@@ -17,5 +17,4 @@ declare function Button({
   ...props
 }: ButtonProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Button, buttonVariants };
-//# sourceMappingURL=button.d.ts.map
+export { Button, buttonVariants };

package/dist/button.js

@@ -5,7 +5,7 @@ import { jsx } from "react/jsx-runtime";
 import { Button as Button$1 } from "@base-ui/react/button";
 import { cva } from "class-variance-authority";
 //#region src/button.tsx
-const buttonVariants = cva("cursor-clickable focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-md border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 aria-invalid:ring-3 [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap motion-color disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none", {
+const buttonVariants = cva("cursor-clickable focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-md border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 aria-invalid:ring-3 [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap motion-color disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-hidden group/button select-none", {
 	variants: {
 		variant: {
 			default: "bg-primary text-white hover:bg-primary/80",
@@ -46,5 +46,3 @@ function Button({ className, variant = "default", size = "default", ...props })
 }
 //#endregion
 export { Button, buttonVariants };
-
-//# sourceMappingURL=button.js.map

package/dist/card.d.ts

@@ -41,5 +41,4 @@ declare function CardFooter({
   ...props
 }: CardFooterProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
-//# sourceMappingURL=card.d.ts.map
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/card.js

@@ -54,5 +54,3 @@ function CardFooter({ className, ...props }) {
 }
 //#endregion
 export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
-
-//# sourceMappingURL=card.js.map

package/dist/checkbox.d.ts

@@ -9,5 +9,4 @@ declare function Checkbox({
   ...props
 }: CheckboxProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Checkbox };
-//# sourceMappingURL=checkbox.d.ts.map
+export { Checkbox };

package/dist/checkbox.js

@@ -1,23 +1,21 @@
 "use client";
 import { cn } from "./lib/utils.js";
-import { CheckIcon } from "./lib/internal-icons.js";
+import { CheckIcon, MinusIcon } from "./lib/internal-icons.js";
 import "react";
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Checkbox as Checkbox$1 } from "@base-ui/react/checkbox";
 //#region src/checkbox.tsx
 function Checkbox({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Checkbox$1.Root, {
 		"data-slot": "checkbox",
-		className: cn("cursor-clickable border-edge dark:bg-edge/30 data-checked:bg-primary data-checked:text-white dark:data-checked:bg-primary data-checked:border-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border transition-colors outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3", className),
+		className: cn("cursor-clickable border-edge dark:bg-edge/30 data-checked:bg-primary data-indeterminate:bg-primary data-checked:text-white data-indeterminate:text-white dark:data-checked:bg-primary dark:data-indeterminate:bg-primary data-checked:border-primary data-indeterminate:border-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border transition-colors outline-hidden group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3", className),
 		...props,
-		children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, {
+		children: /* @__PURE__ */ jsxs(Checkbox$1.Indicator, {
 			"data-slot": "checkbox-indicator",
-			className: "grid place-content-center text-current transition-none [&>svg]:size-3.5",
-			children: /* @__PURE__ */ jsx(CheckIcon, {})
+			className: "group/indicator grid place-content-center text-current transition-none [&>svg]:size-3.5",
+			children: [/* @__PURE__ */ jsx(CheckIcon, { className: "col-start-1 row-start-1 group-data-indeterminate/indicator:hidden" }), /* @__PURE__ */ jsx(MinusIcon, { className: "col-start-1 row-start-1 hidden group-data-indeterminate/indicator:block" })]
 		})
 	});
 }
 //#endregion
 export { Checkbox };
-
-//# sourceMappingURL=checkbox.js.map

package/dist/collapsible.d.ts

@@ -17,5 +17,4 @@ declare function CollapsibleContent({
   ...props
 }: CollapsibleContentProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Collapsible, CollapsibleContent, CollapsibleTrigger };
-//# sourceMappingURL=collapsible.d.ts.map
+export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/collapsible.js

@@ -25,5 +25,3 @@ function CollapsibleContent({ ...props }) {
 }
 //#endregion
 export { Collapsible, CollapsibleContent, CollapsibleTrigger };
-
-//# sourceMappingURL=collapsible.js.map

package/dist/combobox.d.ts

@@ -104,5 +104,4 @@ declare function ComboboxChipsInput({
 }: ComboboxChipsInputProps): _$react_jsx_runtime0.JSX.Element;
 declare function useComboboxAnchor(): React.RefObject<HTMLDivElement | null>;
 //#endregion
-export { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, useComboboxAnchor };
-//# sourceMappingURL=combobox.d.ts.map
+export { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, useComboboxAnchor };