@codefast/ui 0.3.11-canary.1 → 0.3.11

package/dist/components/textarea.js

@@ -1,10 +1,12 @@
-import { jsx } from "react/jsx-runtime";
 import { cn } from "@codefast/tailwind-variants";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/textarea.tsx
 function Textarea({ className, ...props }) {
-    return /*#__PURE__*/ jsx("textarea", {
-        className: cn("flex min-h-16 w-full grow rounded-lg border border-input px-3 py-2 text-base shadow-xs outline-hidden transition placeholder:text-muted-foreground hover:not-disabled:not-focus-visible:border-ring/60 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:opacity-50 aria-invalid:border-destructive focus-within:aria-invalid:ring-destructive/20 hover:not-disabled:not-focus-within:aria-invalid:border-destructive/60 md:text-sm dark:bg-input/30 dark:focus-within:aria-invalid:ring-destructive/40", className),
-        "data-slot": "textarea",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("textarea", {
+		className: cn("flex min-h-16 w-full grow rounded-lg border border-input px-3 py-2 text-base shadow-xs outline-hidden transition placeholder:text-muted-foreground hover:not-disabled:not-focus-visible:border-ring/60 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:opacity-50 aria-invalid:border-destructive focus-within:aria-invalid:ring-destructive/20 hover:not-disabled:not-focus-within:aria-invalid:border-destructive/60 md:text-sm dark:bg-input/30 dark:focus-within:aria-invalid:ring-destructive/40", className),
+		"data-slot": "textarea",
+		...props
+	});
 }
+//#endregion
 export { Textarea };

package/dist/components/toggle-group.d.ts

@@ -1,15 +1,30 @@
-import type { Scope } from "@radix-ui/react-context";
-import type { ComponentProps, JSX } from "react";
+import { ToggleVariants } from "./toggle.js";
+import { ComponentProps, JSX } from "react";
+import { Scope } from "@radix-ui/react-context";
 import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
-import type { ToggleVariants } from "./toggle";
+
+//#region src/components/toggle-group.d.ts
 type ScopedProps<P> = P & {
-    __scopeToggleGroup?: Scope;
+  __scopeToggleGroup?: Scope;
 };
 type ToggleGroupProps = ComponentProps<typeof ToggleGroupPrimitive.Root> & ToggleVariants & {
-    spacing?: number;
+  spacing?: number;
 };
-declare function ToggleGroup({ __scopeToggleGroup, children, className, size, spacing, variant, ...props }: ScopedProps<ToggleGroupProps>): JSX.Element;
+declare function ToggleGroup({
+  __scopeToggleGroup,
+  children,
+  className,
+  size,
+  spacing,
+  variant,
+  ...props
+}: ScopedProps<ToggleGroupProps>): JSX.Element;
 type ToggleGroupItemProps = ScopedProps<ComponentProps<typeof ToggleGroupPrimitive.Item>>;
-declare function ToggleGroupItem({ __scopeToggleGroup, children, className, ...props }: ToggleGroupItemProps): JSX.Element;
-export { ToggleGroup, ToggleGroupItem };
-export type { ToggleGroupItemProps, ToggleGroupProps };
+declare function ToggleGroupItem({
+  __scopeToggleGroup,
+  children,
+  className,
+  ...props
+}: ToggleGroupItemProps): JSX.Element;
+//#endregion
+export { ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps };

package/dist/components/toggle-group.js

@@ -1,54 +1,53 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
+import { toggleVariants } from "./toggle.js";
 import { cn } from "@codefast/tailwind-variants";
+import { jsx } from "react/jsx-runtime";
 import { createContextScope } from "@radix-ui/react-context";
-import { Item, Root, createToggleGroupScope } from "@radix-ui/react-toggle-group";
-import { toggleVariants } from "./toggle.js";
+import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
+import { createToggleGroupScope } from "@radix-ui/react-toggle-group";
+//#region src/components/toggle-group.tsx
 const TOGGLE_GROUP_NAME = "ToggleGroup";
-const [createToggleGroupContext] = createContextScope(TOGGLE_GROUP_NAME, [
-    createToggleGroupScope
-]);
+const [createToggleGroupContext] = createContextScope(TOGGLE_GROUP_NAME, [createToggleGroupScope]);
 const useToggleGroupScope = createToggleGroupScope();
 const [ToggleGroupProvider, useToggleGroupContext] = createToggleGroupContext(TOGGLE_GROUP_NAME);
 function ToggleGroup({ __scopeToggleGroup, children, className, size, spacing = 0, variant, ...props }) {
-    const toggleGroupScope = useToggleGroupScope(__scopeToggleGroup);
-    return /*#__PURE__*/ jsx(ToggleGroupProvider, {
-        scope: __scopeToggleGroup,
-        size: size,
-        spacing: spacing,
-        variant: variant,
-        children: /*#__PURE__*/ jsx(Root, {
-            className: cn("group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-lg data-[spacing=default]:data-[variant=outline]:shadow-xs", className),
-            "data-size": size,
-            "data-slot": "toggle-group",
-            "data-spacing": spacing,
-            "data-variant": variant,
-            style: {
-                "--gap": spacing
-            },
-            ...toggleGroupScope,
-            ...props,
-            children: children
-        })
-    });
+	const toggleGroupScope = useToggleGroupScope(__scopeToggleGroup);
+	return /* @__PURE__ */ jsx(ToggleGroupProvider, {
+		scope: __scopeToggleGroup,
+		size,
+		spacing,
+		variant,
+		children: /* @__PURE__ */ jsx(ToggleGroupPrimitive.Root, {
+			className: cn("group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-lg data-[spacing=default]:data-[variant=outline]:shadow-xs", className),
+			"data-size": size,
+			"data-slot": "toggle-group",
+			"data-spacing": spacing,
+			"data-variant": variant,
+			style: { "--gap": spacing },
+			...toggleGroupScope,
+			...props,
+			children
+		})
+	});
 }
 const TOGGLE_GROUP_ITEM_NAME = "ToggleGroupItem";
 function ToggleGroupItem({ __scopeToggleGroup, children, className, ...props }) {
-    const { size, spacing, variant } = useToggleGroupContext(TOGGLE_GROUP_ITEM_NAME, __scopeToggleGroup);
-    const toggleGroupScope = useToggleGroupScope(__scopeToggleGroup);
-    return /*#__PURE__*/ jsx(Item, {
-        className: cn(toggleVariants({
-            className,
-            size,
-            variant
-        }), "w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10", "data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-lg data-[spacing=0]:last:rounded-r-lg data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l"),
-        "data-size": size,
-        "data-slot": "toggle-group-item",
-        "data-spacing": spacing,
-        "data-variant": variant,
-        ...toggleGroupScope,
-        ...props,
-        children: children
-    });
+	const { size, spacing, variant } = useToggleGroupContext(TOGGLE_GROUP_ITEM_NAME, __scopeToggleGroup);
+	const toggleGroupScope = useToggleGroupScope(__scopeToggleGroup);
+	return /* @__PURE__ */ jsx(ToggleGroupPrimitive.Item, {
+		className: cn(toggleVariants({
+			className,
+			size,
+			variant
+		}), "w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10", "data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-lg data-[spacing=0]:last:rounded-r-lg data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l"),
+		"data-size": size,
+		"data-slot": "toggle-group-item",
+		"data-spacing": spacing,
+		"data-variant": variant,
+		...toggleGroupScope,
+		...props,
+		children
+	});
 }
+//#endregion
 export { ToggleGroup, ToggleGroupItem };

package/dist/components/toggle.d.ts

@@ -1,20 +1,28 @@
-import type { VariantProps } from "@codefast/tailwind-variants";
-import type { ComponentProps, JSX } from "react";
+import * as _$_codefast_tailwind_variants0 from "@codefast/tailwind-variants";
+import { VariantProps } from "@codefast/tailwind-variants";
+import { ComponentProps, JSX } from "react";
 import * as TogglePrimitive from "@radix-ui/react-toggle";
-declare const toggleVariants: import("@codefast/tailwind-variants").VariantFunctionType<{
-    size: {
-        default: string;
-        lg: string;
-        sm: string;
-    };
-    variant: {
-        default: string;
-        outline: string;
-    };
+
+//#region src/components/toggle.d.ts
+declare const toggleVariants: _$_codefast_tailwind_variants0.VariantFunctionType<{
+  size: {
+    default: string;
+    lg: string;
+    sm: string;
+  };
+  variant: {
+    default: string;
+    outline: string;
+  };
 }, Record<string, never>>;
 type ToggleVariants = VariantProps<typeof toggleVariants>;
-interface ToggleProps extends ComponentProps<typeof TogglePrimitive.Root>, ToggleVariants {
-}
-declare function Toggle({ children, className, size, variant, ...props }: ToggleProps): JSX.Element;
-export { Toggle, toggleVariants };
-export type { ToggleProps, ToggleVariants };
+interface ToggleProps extends ComponentProps<typeof TogglePrimitive.Root>, ToggleVariants {}
+declare function Toggle({
+  children,
+  className,
+  size,
+  variant,
+  ...props
+}: ToggleProps): JSX.Element;
+//#endregion
+export { Toggle, type ToggleProps, type ToggleVariants, toggleVariants };

package/dist/components/toggle.js

@@ -1,35 +1,37 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
 import { tv } from "@codefast/tailwind-variants";
-import { Root } from "@radix-ui/react-toggle";
+import { jsx } from "react/jsx-runtime";
+import * as TogglePrimitive from "@radix-ui/react-toggle";
+//#region src/components/toggle.tsx
 const toggleVariants = tv({
-    base: "inline-flex items-center justify-center gap-2 rounded-lg text-sm font-medium whitespace-nowrap transition-[color,box-shadow] outline-none hover:bg-muted hover:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-    variants: {
-        size: {
-            default: "h-9 min-w-9 px-2",
-            lg: "h-10 min-w-10 px-2.5",
-            sm: "h-8 min-w-8 px-1.5"
-        },
-        variant: {
-            default: "bg-transparent",
-            outline: "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground"
-        }
-    },
-    defaultVariants: {
-        size: "default",
-        variant: "default"
-    }
+	base: "inline-flex items-center justify-center gap-2 rounded-lg text-sm font-medium whitespace-nowrap transition-[color,box-shadow] outline-none hover:bg-muted hover:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+	variants: {
+		size: {
+			default: "h-9 min-w-9 px-2",
+			lg: "h-10 min-w-10 px-2.5",
+			sm: "h-8 min-w-8 px-1.5"
+		},
+		variant: {
+			default: "bg-transparent",
+			outline: "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground"
+		}
+	},
+	defaultVariants: {
+		size: "default",
+		variant: "default"
+	}
 });
 function Toggle({ children, className, size, variant, ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        className: toggleVariants({
-            className,
-            size,
-            variant
-        }),
-        "data-slot": "toggle",
-        ...props,
-        children: children
-    });
+	return /* @__PURE__ */ jsx(TogglePrimitive.Root, {
+		className: toggleVariants({
+			className,
+			size,
+			variant
+		}),
+		"data-slot": "toggle",
+		...props,
+		children
+	});
 }
+//#endregion
 export { Toggle, toggleVariants };

package/dist/components/tooltip.d.ts

@@ -1,14 +1,30 @@
-import type { ComponentProps, JSX } from "react";
+import { ComponentProps, JSX } from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+
+//#region src/components/tooltip.d.ts
 type TooltipProviderProps = ComponentProps<typeof TooltipPrimitive.Provider>;
-declare function TooltipProvider({ ...props }: TooltipProviderProps): JSX.Element;
+declare function TooltipProvider({
+  ...props
+}: TooltipProviderProps): JSX.Element;
 type TooltipProps = ComponentProps<typeof TooltipPrimitive.Root>;
-declare function Tooltip({ ...props }: TooltipProps): JSX.Element;
+declare function Tooltip({
+  ...props
+}: TooltipProps): JSX.Element;
 type TooltipTriggerProps = ComponentProps<typeof TooltipPrimitive.Trigger>;
-declare function TooltipTrigger({ ...props }: TooltipTriggerProps): JSX.Element;
+declare function TooltipTrigger({
+  ...props
+}: TooltipTriggerProps): JSX.Element;
 type TooltipContentProps = ComponentProps<typeof TooltipPrimitive.Content>;
-declare function TooltipContent({ children, className, sideOffset, ...props }: TooltipContentProps): JSX.Element;
+declare function TooltipContent({
+  children,
+  className,
+  sideOffset,
+  ...props
+}: TooltipContentProps): JSX.Element;
 type TooltipArrowProps = ComponentProps<typeof TooltipPrimitive.Arrow>;
-declare function TooltipArrow({ className, ...props }: TooltipArrowProps): JSX.Element;
-export { Tooltip, TooltipArrow, TooltipContent, TooltipProvider, TooltipTrigger };
-export type { TooltipArrowProps, TooltipContentProps, TooltipProps, TooltipProviderProps, TooltipTriggerProps, };
+declare function TooltipArrow({
+  className,
+  ...props
+}: TooltipArrowProps): JSX.Element;
+//#endregion
+export { Tooltip, TooltipArrow, type TooltipArrowProps, TooltipContent, type TooltipContentProps, type TooltipProps, TooltipProvider, type TooltipProviderProps, TooltipTrigger, type TooltipTriggerProps };

package/dist/components/tooltip.js

@@ -1,45 +1,42 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "@codefast/tailwind-variants";
-import { Arrow, Content, Portal, Provider, Root, Trigger } from "@radix-ui/react-tooltip";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+//#region src/components/tooltip.tsx
 function TooltipProvider({ ...props }) {
-    return /*#__PURE__*/ jsx(Provider, {
-        "data-slot": "tooltip-provider",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(TooltipPrimitive.Provider, {
+		"data-slot": "tooltip-provider",
+		...props
+	});
 }
 function Tooltip({ ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        "data-slot": "tooltip",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(TooltipPrimitive.Root, {
+		"data-slot": "tooltip",
+		...props
+	});
 }
 function TooltipTrigger({ ...props }) {
-    return /*#__PURE__*/ jsx(Trigger, {
-        "data-slot": "tooltip-trigger",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, {
+		"data-slot": "tooltip-trigger",
+		...props
+	});
 }
 function TooltipContent({ children, className, sideOffset = 4, ...props }) {
-    return /*#__PURE__*/ jsx(Portal, {
-        children: /*#__PURE__*/ jsxs(Content, {
-            className: cn("z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md bg-primary px-3 py-1.5 text-xs text-balance text-primary-foreground ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-[state=delayed-open]:data-[side=bottom]:slide-in-from-top-2 data-[state=delayed-open]:data-[side=left]:slide-in-from-right-2 data-[state=delayed-open]:data-[side=right]:slide-in-from-left-2 data-[state=delayed-open]:data-[side=top]:slide-in-from-bottom-2", "max-w-(--radix-tooltip-content-available-width)", className),
-            collisionPadding: 8,
-            "data-slot": "tooltip-content",
-            sideOffset: sideOffset,
-            ...props,
-            children: [
-                children,
-                /*#__PURE__*/ jsx(TooltipArrow, {})
-            ]
-        })
-    });
+	return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(TooltipPrimitive.Content, {
+		className: cn("z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md bg-primary px-3 py-1.5 text-xs text-balance text-primary-foreground ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-[state=delayed-open]:data-[side=bottom]:slide-in-from-top-2 data-[state=delayed-open]:data-[side=left]:slide-in-from-right-2 data-[state=delayed-open]:data-[side=right]:slide-in-from-left-2 data-[state=delayed-open]:data-[side=top]:slide-in-from-bottom-2", "max-w-(--radix-tooltip-content-available-width)", className),
+		collisionPadding: 8,
+		"data-slot": "tooltip-content",
+		sideOffset,
+		...props,
+		children: [children, /* @__PURE__ */ jsx(TooltipArrow, {})]
+	}) });
 }
 function TooltipArrow({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Arrow, {
-        className: cn("fill-primary", className),
-        "data-slot": "tooltip-arrow",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, {
+		className: cn("fill-primary", className),
+		"data-slot": "tooltip-arrow",
+		...props
+	});
 }
+//#endregion
 export { Tooltip, TooltipArrow, TooltipContent, TooltipProvider, TooltipTrigger };

package/dist/hooks/use-animated-value.d.ts

@@ -1,3 +1,4 @@
+//#region src/hooks/use-animated-value.d.ts
 /**
  * Produce a smoothly animated numeric value in response to changes.
  *
@@ -15,4 +16,6 @@
  * return <div>{value}%</div>;
  * ```
  */
-export declare function useAnimatedValue(targetValue: null | number, duration: number, animate?: boolean): number;
+declare function useAnimatedValue(targetValue: null | number, duration: number, animate?: boolean): number;
+//#endregion
+export { useAnimatedValue };

package/dist/hooks/use-animated-value.js

@@ -1,41 +1,62 @@
 "use client";
 import { useEffect, useRef, useState } from "react";
+//#region src/hooks/use-animated-value.ts
+/**
+* Produce a smoothly animated numeric value in response to changes.
+*
+* Applies a time-based easing (easeOutQuad) between the current and target values
+* over the specified duration. When disabled, the value updates immediately.
+*
+* @param targetValue - Target number to animate toward; null resolves to 0.
+* @param duration - Animation duration in milliseconds.
+* @param animate - When false, bypasses animation and sets the value directly.
+* @returns The current (rounded) animated value.
+*
+* @example
+* ```tsx
+* const value = useAnimatedValue(75, 1000, true);
+* return <div>{value}%</div>;
+* ```
+*/
 function useAnimatedValue(targetValue, duration, animate) {
-    const actualTargetValue = targetValue ?? 0;
-    const [animatedValue, setAnimatedValue] = useState(actualTargetValue);
-    const animatedValueRef = useRef(actualTargetValue);
-    useEffect(()=>{
-        animatedValueRef.current = animatedValue;
-    }, [
-        animatedValue
-    ]);
-    useEffect(()=>{
-        if (!animate) return void setAnimatedValue(actualTargetValue);
-        const currentValue = animatedValueRef.current;
-        const valueRange = actualTargetValue - currentValue;
-        const startTime = performance.now();
-        if (duration <= 0 || 0 === valueRange) return void setAnimatedValue(actualTargetValue);
-        let animationFrame;
-        const animateValue = (currentTime)=>{
-            const elapsedTime = currentTime - startTime;
-            if (elapsedTime >= duration) setAnimatedValue(actualTargetValue);
-            else {
-                const progress = elapsedTime / duration;
-                const easeProgress = 1 - (1 - progress) * (1 - progress);
-                const nextValue = currentValue + valueRange * easeProgress;
-                setAnimatedValue(nextValue);
-                animationFrame = requestAnimationFrame(animateValue);
-            }
-        };
-        animationFrame = requestAnimationFrame(animateValue);
-        return ()=>{
-            cancelAnimationFrame(animationFrame);
-        };
-    }, [
-        actualTargetValue,
-        duration,
-        animate
-    ]);
-    return Math.round(animatedValue);
+	const actualTargetValue = targetValue ?? 0;
+	const [animatedValue, setAnimatedValue] = useState(actualTargetValue);
+	const animatedValueRef = useRef(actualTargetValue);
+	useEffect(() => {
+		animatedValueRef.current = animatedValue;
+	}, [animatedValue]);
+	useEffect(() => {
+		if (!animate) {
+			setAnimatedValue(actualTargetValue);
+			return;
+		}
+		const currentValue = animatedValueRef.current;
+		const valueRange = actualTargetValue - currentValue;
+		const startTime = performance.now();
+		if (duration <= 0 || valueRange === 0) {
+			setAnimatedValue(actualTargetValue);
+			return;
+		}
+		let animationFrame;
+		const animateValue = (currentTime) => {
+			const elapsedTime = currentTime - startTime;
+			if (elapsedTime >= duration) setAnimatedValue(actualTargetValue);
+			else {
+				const progress = elapsedTime / duration;
+				setAnimatedValue(currentValue + valueRange * (1 - (1 - progress) * (1 - progress)));
+				animationFrame = requestAnimationFrame(animateValue);
+			}
+		};
+		animationFrame = requestAnimationFrame(animateValue);
+		return () => {
+			cancelAnimationFrame(animationFrame);
+		};
+	}, [
+		actualTargetValue,
+		duration,
+		animate
+	]);
+	return Math.round(animatedValue);
 }
+//#endregion
 export { useAnimatedValue };

package/dist/hooks/use-copy-to-clipboard.d.ts

@@ -1,3 +1,4 @@
+//#region src/hooks/use-copy-to-clipboard.d.ts
 /**
  * Provide clipboard copy capability with a transient copied state.
  *
@@ -15,10 +16,15 @@
  * <button onClick={() => copyToClipboard("Hello")}>{isCopied ? "Copied" : "Copy"}</button>
  * ```
  */
-export declare function useCopyToClipboard({ onCopy, timeout, }?: {
-    onCopy?: () => void;
-    timeout?: number;
+declare function useCopyToClipboard({
+  onCopy,
+  timeout
+}?: {
+  onCopy?: () => void;
+  timeout?: number;
 }): {
-    copyToClipboard: (value: string) => Promise<void>;
-    isCopied: boolean;
+  copyToClipboard: (value: string) => Promise<void>;
+  isCopied: boolean;
 };
+//#endregion
+export { useCopyToClipboard };

package/dist/hooks/use-copy-to-clipboard.js

@@ -1,24 +1,43 @@
 "use client";
 import { useState } from "react";
-function useCopyToClipboard({ onCopy, timeout = 2000 } = {}) {
-    const [isCopied, setIsCopied] = useState(false);
-    const copyToClipboard = async (value)=>{
-        if ("u" < typeof window || !("clipboard" in navigator) || "function" != typeof navigator.clipboard.writeText) return;
-        if (!value) return;
-        try {
-            await navigator.clipboard.writeText(value);
-            setIsCopied(true);
-            if (onCopy) onCopy();
-            setTimeout(()=>{
-                setIsCopied(false);
-            }, timeout);
-        } catch (error) {
-            console.error(error);
-        }
-    };
-    return {
-        copyToClipboard,
-        isCopied
-    };
+//#region src/hooks/use-copy-to-clipboard.ts
+/**
+* Provide clipboard copy capability with a transient copied state.
+*
+* Internally uses the Clipboard API when available and sets a temporary
+* `isCopied` flag for UI feedback. A custom callback may be invoked upon copy.
+*
+* @param options - Configuration options.
+*   - onCopy: Callback invoked after a successful copy.
+*   - timeout: Duration in milliseconds to keep `isCopied` true. Defaults to 2000.
+* @returns An object with a `copyToClipboard` function and an `isCopied` flag.
+*
+* @example
+* ```tsx
+* const { copyToClipboard, isCopied } = useCopyToClipboard({ timeout: 1500 });
+* <button onClick={() => copyToClipboard("Hello")}>{isCopied ? "Copied" : "Copy"}</button>
+* ```
+*/
+function useCopyToClipboard({ onCopy, timeout = 2e3 } = {}) {
+	const [isCopied, setIsCopied] = useState(false);
+	const copyToClipboard = async (value) => {
+		if (typeof window === "undefined" || !("clipboard" in navigator) || typeof navigator.clipboard.writeText !== "function") return;
+		if (!value) return;
+		try {
+			await navigator.clipboard.writeText(value);
+			setIsCopied(true);
+			if (onCopy) onCopy();
+			setTimeout(() => {
+				setIsCopied(false);
+			}, timeout);
+		} catch (error) {
+			console.error(error);
+		}
+	};
+	return {
+		copyToClipboard,
+		isCopied
+	};
 }
+//#endregion
 export { useCopyToClipboard };

package/dist/hooks/use-is-mobile.d.ts

@@ -1,3 +1,4 @@
+//#region src/hooks/use-is-mobile.d.ts
 /**
  * Determine whether the current viewport should be treated as mobile.
  *
@@ -16,4 +17,6 @@
  * }
  * ```
  */
-export declare function useIsMobile(mobileBreakpoint?: number): boolean;
+declare function useIsMobile(mobileBreakpoint?: number): boolean;
+//#endregion
+export { useIsMobile };

package/dist/hooks/use-is-mobile.js

@@ -1,6 +1,26 @@
 "use client";
 import { useMediaQuery } from "./use-media-query.js";
+//#region src/hooks/use-is-mobile.ts
+/**
+* Determine whether the current viewport should be treated as mobile.
+*
+* Uses {@link useMediaQuery} to evaluate a max-width media query derived from the
+* provided breakpoint. By default, widths below 768px are considered mobile.
+*
+* @param mobileBreakpoint - Pixel width used as the mobile breakpoint. Values strictly
+* less than this breakpoint are treated as mobile. Defaults to 768.
+* @returns true when the viewport width is less than the given breakpoint; otherwise false.
+*
+* @example
+* ```tsx
+* const isMobile = useIsMobile();
+* if (isMobile) {
+*   // Render compact layout
+* }
+* ```
+*/
 function useIsMobile(mobileBreakpoint = 768) {
-    return useMediaQuery(`(max-width: ${(mobileBreakpoint - 1).toString()}px)`);
+	return useMediaQuery(`(max-width: ${(mobileBreakpoint - 1).toString()}px)`);
 }
+//#endregion
 export { useIsMobile };