@waveso/ui 0.7.7 → 0.8.1

package/dist/combobox.js

@@ -119,7 +119,7 @@ function ComboboxItem({ className, children, ...props }) {
 function ComboboxGroup({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Combobox$1.Group, {
 		"data-slot": "combobox-group",
-		className: cn(className),
+		className,
 		...props
 	});
 }
@@ -177,7 +177,7 @@ function ComboboxChip({ className, children, showRemove = true, ...props }) {
 function ComboboxChipsInput({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Combobox$1.Input, {
 		"data-slot": "combobox-chip-input",
-		className: cn("min-w-16 flex-1 outline-none", className),
+		className: cn("min-w-16 flex-1 outline-hidden", className),
 		...props
 	});
 }
@@ -186,5 +186,3 @@ function useComboboxAnchor() {
 }
 //#endregion
 export { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxClear, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, useComboboxAnchor };
-
-//# sourceMappingURL=combobox.js.map

package/dist/context-menu.d.ts

@@ -104,5 +104,4 @@ declare function ContextMenuShortcut({
   ...props
 }: ContextMenuShortcutProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger };
-//# sourceMappingURL=context-menu.d.ts.map
+export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger };

package/dist/context-menu.js

@@ -28,14 +28,14 @@ function ContextMenuTrigger({ className, ...props }) {
 function ContextMenuContent({ className, align = "start", alignOffset = 4, side = "right", sideOffset = 0, restoreFocusOnClose, finalFocus, ...props }) {
 	return /* @__PURE__ */ jsx(ContextMenu$1.Portal, { children: /* @__PURE__ */ jsx(ContextMenu$1.Positioner, {
 		"data-slot": "context-menu-positioner",
-		className: "isolate z-50 outline-none",
+		className: "isolate z-50 outline-hidden",
 		align,
 		alignOffset,
 		side,
 		sideOffset,
 		children: /* @__PURE__ */ jsx(ContextMenu$1.Popup, {
 			"data-slot": "context-menu-content",
-			className: cn("motion-pop-md ring-contrast/10 bg-elevated text-contrast z-50 max-h-(--available-height) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md p-1 shadow-md ring-1 outline-none", className),
+			className: cn("motion-pop-md ring-contrast/10 bg-elevated text-contrast z-50 max-h-(--available-height) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md p-1 shadow-md ring-1 outline-hidden", className),
 			finalFocus: resolveFinalFocus(restoreFocusOnClose, finalFocus),
 			...props
 		})
@@ -74,7 +74,7 @@ function ContextMenuSubTrigger({ className, inset, children, ...props }) {
 	return /* @__PURE__ */ jsxs(ContextMenu$1.SubmenuTrigger, {
 		"data-slot": "context-menu-sub-trigger",
 		"data-inset": inset,
-		className: cn("focus:bg-primary focus:text-white data-open:bg-primary data-open:text-white flex cursor-clickable items-center gap-1.5 rounded-sm px-1.5 py-1 text-sm outline-hidden select-none data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+		className: cn("focus:bg-primary focus:text-white data-popup-open:bg-primary data-popup-open:text-white flex cursor-clickable items-center gap-1.5 rounded-sm px-1.5 py-1 text-sm outline-hidden select-none data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
 		...props,
 		children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ml-auto" })]
 	});
@@ -139,5 +139,3 @@ function ContextMenuShortcut({ className, ...props }) {
 }
 //#endregion
 export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger };
-
-//# sourceMappingURL=context-menu.js.map

package/dist/count.d.ts

@@ -83,5 +83,4 @@ declare function Count({
 /** @deprecated Use `Count` instead */
 declare const CountUp: typeof Count;
 //#endregion
-export { Count, type CountProps, CountUp, type CountUpProps, easeOut };
-//# sourceMappingURL=count.d.ts.map
+export { Count, type CountProps, CountUp, type CountUpProps, easeOut };

package/dist/count.js

@@ -160,16 +160,21 @@ function DateCount({ to, delay, format, prefix, suffix, children, once, onComple
 	]);
 	useEffect(() => {
 		if (!started) return;
+		let interval;
 		const tick = () => {
 			const ms = Math.max(0, to.getTime() - Date.now());
 			setRemaining(ms);
-			if (ms <= 0 && !completedRef.current) {
-				completedRef.current = true;
-				onComplete?.();
+			if (ms <= 0) {
+				clearInterval(interval);
+				if (!completedRef.current) {
+					completedRef.current = true;
+					onComplete?.();
+				}
+				return true;
 			}
+			return false;
 		};
-		tick();
-		const interval = setInterval(tick, 1e3);
+		if (!tick()) interval = setInterval(tick, 1e3);
 		return () => clearInterval(interval);
 	}, [
 		started,
@@ -187,5 +192,3 @@ function DateCount({ to, delay, format, prefix, suffix, children, once, onComple
 const CountUp = Count;
 //#endregion
 export { Count, CountUp, easeOut };
-
-//# sourceMappingURL=count.js.map

package/dist/dialog.d.ts

@@ -71,5 +71,4 @@ declare function DialogDescription({
   ...props
 }: DialogDescriptionProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };
-//# sourceMappingURL=dialog.d.ts.map
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };

package/dist/dialog.js

@@ -41,7 +41,7 @@ function DialogOverlay({ className, ...props }) {
 function DialogContent({ className, children, showCloseButton = true, ...props }) {
 	return /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogOverlay, {}), /* @__PURE__ */ jsxs(Dialog$1.Popup, {
 		"data-slot": "dialog-content",
-		className: cn("motion-scale-lg bg-foundation ring-contrast/10 fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-lg p-4 text-sm ring-1 outline-none sm:max-w-sm", className),
+		className: cn("motion-scale-lg bg-foundation ring-contrast/10 fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-lg p-4 text-sm ring-1 outline-hidden sm:max-w-sm", className),
 		...props,
 		children: [children, showCloseButton && /* @__PURE__ */ jsxs(Dialog$1.Close, {
 			"data-slot": "dialog-close",
@@ -91,5 +91,3 @@ function DialogDescription({ className, ...props }) {
 }
 //#endregion
 export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };
-
-//# sourceMappingURL=dialog.js.map

package/dist/drawer.d.ts

@@ -55,5 +55,4 @@ declare function DrawerDescription({
   ...props
 }: DrawerDescriptionProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };
-//# sourceMappingURL=drawer.d.ts.map
+export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };

package/dist/drawer.js

@@ -40,10 +40,10 @@ function DrawerOverlay({ className, ...props }) {
 function DrawerContent({ className, children, showCloseButton = false, ...props }) {
 	return /* @__PURE__ */ jsxs(DrawerPortal, { children: [/* @__PURE__ */ jsx(DrawerOverlay, {}), /* @__PURE__ */ jsx(Drawer$1.Viewport, {
 		"data-slot": "drawer-viewport",
-		className: "fixed inset-0 z-50 outline-none",
+		className: "fixed inset-0 z-50 outline-hidden",
 		children: /* @__PURE__ */ jsxs(Drawer$1.Popup, {
 			"data-slot": "drawer-content",
-			className: cn("group/drawer-content bg-foundation fixed z-50 flex flex-col overflow-y-auto border-edge text-sm shadow-lg outline-none", "transition-[translate] duration-(--duration-lg) ease-(--ease) data-[swiping]:duration-0", "data-[swipe-direction=down]:inset-x-0 data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:mt-24 data-[swipe-direction=down]:max-h-[80vh] data-[swipe-direction=down]:rounded-t-lg data-[swipe-direction=down]:border-t", "data-[swipe-direction=up]:inset-x-0 data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:mb-24 data-[swipe-direction=up]:max-h-[80vh] data-[swipe-direction=up]:rounded-b-lg data-[swipe-direction=up]:border-b", "data-[swipe-direction=left]:inset-y-0 data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:w-3/4 data-[swipe-direction=left]:rounded-r-lg data-[swipe-direction=left]:border-r data-[swipe-direction=left]:sm:max-w-sm", "data-[swipe-direction=right]:inset-y-0 data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:w-3/4 data-[swipe-direction=right]:rounded-l-lg data-[swipe-direction=right]:border-l data-[swipe-direction=right]:sm:max-w-sm", "data-[swipe-direction=down]:data-[starting-style]:translate-y-full data-[swipe-direction=down]:data-[ending-style]:translate-y-full", "data-[swipe-direction=up]:data-[starting-style]:-translate-y-full data-[swipe-direction=up]:data-[ending-style]:-translate-y-full", "data-[swipe-direction=left]:data-[starting-style]:-translate-x-full data-[swipe-direction=left]:data-[ending-style]:-translate-x-full", "data-[swipe-direction=right]:data-[starting-style]:translate-x-full data-[swipe-direction=right]:data-[ending-style]:translate-x-full", className),
+			className: cn("group/drawer-content bg-foundation fixed z-50 flex flex-col overflow-y-auto border-edge text-sm shadow-lg outline-hidden", "transition-[translate] duration-(--duration-lg) ease-(--ease) data-[swiping]:duration-0", "data-[swipe-direction=down]:inset-x-0 data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:mt-24 data-[swipe-direction=down]:max-h-[80vh] data-[swipe-direction=down]:rounded-t-lg data-[swipe-direction=down]:border-t", "data-[swipe-direction=up]:inset-x-0 data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:mb-24 data-[swipe-direction=up]:max-h-[80vh] data-[swipe-direction=up]:rounded-b-lg data-[swipe-direction=up]:border-b", "data-[swipe-direction=left]:inset-y-0 data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:w-3/4 data-[swipe-direction=left]:rounded-r-lg data-[swipe-direction=left]:border-r data-[swipe-direction=left]:sm:max-w-sm", "data-[swipe-direction=right]:inset-y-0 data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:w-3/4 data-[swipe-direction=right]:rounded-l-lg data-[swipe-direction=right]:border-l data-[swipe-direction=right]:sm:max-w-sm", "data-[swipe-direction=down]:data-[starting-style]:translate-y-full data-[swipe-direction=down]:data-[ending-style]:translate-y-full", "data-[swipe-direction=up]:data-[starting-style]:-translate-y-full data-[swipe-direction=up]:data-[ending-style]:-translate-y-full", "data-[swipe-direction=left]:data-[starting-style]:-translate-x-full data-[swipe-direction=left]:data-[ending-style]:-translate-x-full", "data-[swipe-direction=right]:data-[starting-style]:translate-x-full data-[swipe-direction=right]:data-[ending-style]:translate-x-full", className),
 			...props,
 			children: [
 				/* @__PURE__ */ jsx("div", {
@@ -97,5 +97,3 @@ function DrawerDescription({ className, ...props }) {
 }
 //#endregion
 export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };
-
-//# sourceMappingURL=drawer.js.map

package/dist/encrypted-text.d.ts

@@ -25,5 +25,4 @@ declare function EncryptedText({
   ...props
 }: EncryptedTextProps): _$react_jsx_runtime0.JSX.Element | null;
 //#endregion
-export { EncryptedText };
-//# sourceMappingURL=encrypted-text.d.ts.map
+export { EncryptedText };

package/dist/encrypted-text.js

@@ -23,7 +23,7 @@ function EncryptedText({ text, className, revealDelayMs = 50, charset = DEFAULT_
 	const animationFrameRef = React.useRef(null);
 	const startTimeRef = React.useRef(0);
 	const lastFlipTimeRef = React.useRef(0);
-	const scrambleCharsRef = React.useRef(text ? scramblePreservingSpaces(text, charset).split("") : []);
+	const scrambleCharsRef = React.useRef([]);
 	React.useEffect(() => {
 		if (prefersReducedMotion) return;
 		const el = ref.current;
@@ -71,6 +71,7 @@ function EncryptedText({ text, className, revealDelayMs = 50, charset = DEFAULT_
 			if (now - lastFlipTimeRef.current >= Math.max(0, flipDelayMs)) {
 				for (let index = currentRevealCount; index < totalLength; index += 1) scrambleCharsRef.current[index] = text[index] === " " ? " " : randomChar(charset);
 				lastFlipTimeRef.current = now;
+				setFlipTick((t) => t + 1 & 65535);
 			}
 			animationFrameRef.current = requestAnimationFrame(update);
 		};
@@ -99,8 +100,8 @@ function EncryptedText({ text, className, revealDelayMs = 50, charset = DEFAULT_
 			className: "sr-only",
 			children: text
 		}), text.split("").map((char, index) => {
-			const isRevealed = prefersReducedMotion || !scrambleOnly && index < revealCount;
-			const displayChar = isRevealed ? char : char === " " ? " " : scrambleCharsRef.current[index] ?? randomChar(charset);
+			const isRevealed = prefersReducedMotion || !isInView || !scrambleOnly && index < revealCount;
+			const displayChar = isRevealed ? char : char === " " ? " " : scrambleCharsRef.current[index] ?? char;
 			return /* @__PURE__ */ jsx("span", {
 				"aria-hidden": "true",
 				"data-slot": "encrypted-text-char",
@@ -113,5 +114,3 @@ function EncryptedText({ text, className, revealDelayMs = 50, charset = DEFAULT_
 }
 //#endregion
 export { EncryptedText };
-
-//# sourceMappingURL=encrypted-text.js.map

package/dist/field.d.ts

@@ -37,5 +37,4 @@ declare function FieldError({
 }: FieldErrorProps): _$react_jsx_runtime0.JSX.Element;
 declare const FieldValidity: React.FC<_$_base_ui_react0.FieldValidityProps>;
 //#endregion
-export { Field, FieldControl, FieldControlProps, FieldDescription, FieldDescriptionProps, FieldError, FieldErrorProps, FieldItem, FieldItemProps, FieldLabel, FieldLabelProps, FieldPrimitive, FieldProps, FieldValidity, FieldValidityProps };
-//# sourceMappingURL=field.d.ts.map
+export { Field, FieldControl, FieldControlProps, FieldDescription, FieldDescriptionProps, FieldError, FieldErrorProps, FieldItem, FieldItemProps, FieldLabel, FieldLabelProps, FieldPrimitive, FieldProps, FieldValidity, FieldValidityProps };

package/dist/field.js

@@ -21,14 +21,14 @@ function FieldLabel({ className, ...props }) {
 function FieldControl({ className, ...props }) {
 	return /* @__PURE__ */ jsx(FieldPrimitive.Control, {
 		"data-slot": "field-control",
-		className: cn("rounded-md outline-none focus-visible:ring-3 focus-visible:ring-focus/50 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50", className),
+		className: cn("data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50", className),
 		...props
 	});
 }
 function FieldDescription({ className, ...props }) {
 	return /* @__PURE__ */ jsx(FieldPrimitive.Description, {
 		"data-slot": "field-description",
-		className: cn("text-muted text-left text-sm leading-normal font-normal group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5", "last:mt-0 nth-last-2:-mt-1", "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4", className),
+		className: cn("text-muted text-left text-sm leading-normal font-normal", "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4", className),
 		...props
 	});
 }
@@ -49,5 +49,3 @@ function FieldError({ className, ...props }) {
 const FieldValidity = FieldPrimitive.Validity;
 //#endregion
 export { Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldPrimitive, FieldValidity };
-
-//# sourceMappingURL=field.js.map

package/dist/film-grain-shader.d.ts

@@ -2,5 +2,4 @@
 declare const vertexShader = "\nattribute vec2 position;\nvarying vec2 vUv;\n\nvoid main() {\n  vUv = position * 0.5 + 0.5;\n  gl_Position = vec4(position, 0.0, 1.0);\n}\n";
 declare const fragmentShader = "\nprecision highp float;\n\nuniform float uTime;\nuniform vec2 uResolution;\nuniform float uDensity;\nuniform float uOpacity;\nuniform float uFps;\nuniform vec3 uColor;\n\nvarying vec2 vUv;\n\n// Stable hash\nfloat hash(vec2 p, float seed) {\n  return fract(sin(dot(p + seed, vec2(127.1, 311.7))) * 43758.5453123);\n}\n\n// Film response curve (soft toe + shoulder rolloff)\nfloat filmCurve(float x) {\n  return smoothstep(0.0, 0.2, x) * (1.0 - smoothstep(0.8, 1.0, x));\n}\n\nvoid main() {\n  vec2 uv = gl_FragCoord.xy;\n  vec2 p = floor(uv);\n\n  // Temporal coherence: blend between current and next frame seed\n  float frame = floor(uTime * uFps);\n  float t = fract(uTime * uFps);\n  float seed = frame * 0.1731;\n\n  // Multi-scale grain with inter-frame blending on fine layer\n  float fineA = hash(p, seed);\n  float fineB = hash(p, seed + 0.1731);\n  float fine = mix(fineA, fineB, t);\n\n  float medium = hash(floor(uv * 0.5), seed + 3.1);\n  float coarse = hash(floor(uv * 0.25), seed + 7.93);\n\n  float grain = fine * 0.65 + medium * 0.25 + coarse * 0.10;\n\n  // Emulsion clumping (organic structure)\n  float cluster = hash(floor(uv * 0.18), seed + 9.2);\n  grain *= mix(0.75, 1.35, cluster);\n\n  // Density threshold\n  grain = smoothstep(1.0 - uDensity, 1.0, grain);\n\n  // Film response curve (replaces raw pow gamma)\n  grain = filmCurve(grain);\n\n  // Micro-blur: sample neighbors for optical diffusion\n  float n1 = hash(p + vec2(1.0, 0.0), seed);\n  float n2 = hash(p - vec2(1.0, 0.0), seed);\n  float n3 = hash(p + vec2(0.0, 1.0), seed);\n  float n4 = hash(p - vec2(0.0, 1.0), seed);\n  float neighbors = (n1 + n2 + n3 + n4) * 0.25;\n  grain = mix(grain, neighbors, 0.15);\n\n  // Chromatic aberration (reuse neighbor hashes)\n  float rShift = n1 * 0.015;\n  float bShift = n2 * 0.015;\n\n  vec3 color = uColor * vec3(\n    grain + rShift,\n    grain,\n    grain + bShift\n  );\n\n  color = clamp(color, 0.0, 1.0);\n\n  gl_FragColor = vec4(color, grain * uOpacity);\n}\n";
 //#endregion
-export { fragmentShader, vertexShader };
-//# sourceMappingURL=film-grain-shader.d.ts.map
+export { fragmentShader, vertexShader };

package/dist/film-grain-shader.js

@@ -84,5 +84,3 @@ void main() {
 `;
 //#endregion
 export { fragmentShader, vertexShader };
-
-//# sourceMappingURL=film-grain-shader.js.map

package/dist/film-grain-webgl.d.ts

@@ -3,7 +3,6 @@ import * as _$react from "react";
 //#region src/film-grain-webgl.d.ts
 interface UseFilmGrainOptions {
   density: number;
-  opacity: number;
   /** Target FPS for both WebGL and canvas fallback. Default 18 */
   fps?: number;
   /** Hex color for canvas fallback grain. Default '#ffffff' */
@@ -11,10 +10,8 @@ interface UseFilmGrainOptions {
 }
 declare function useFilmGrain({
   density,
-  opacity,
   fps,
   color
 }: UseFilmGrainOptions): _$react.RefObject<HTMLCanvasElement | null>;
 //#endregion
-export { useFilmGrain };
-//# sourceMappingURL=film-grain-webgl.d.ts.map
+export { useFilmGrain };

package/dist/film-grain-webgl.js

@@ -96,7 +96,7 @@ function generateGrainTexture(width, height, density, color) {
 	ctx.putImageData(imageData, 0, 0);
 	return offscreen;
 }
-function useFilmGrain({ density, opacity, fps = 18, color = "#ffffff" }) {
+function useFilmGrain({ density, fps = 18, color = "#ffffff" }) {
 	const canvasRef = useRef(null);
 	const rafRef = useRef(0);
 	const visibleRef = useRef(true);
@@ -122,14 +122,18 @@ function useFilmGrain({ density, opacity, fps = 18, color = "#ffffff" }) {
 				dpr
 			};
 		};
-		const gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
+		const canGetWebGL = (c) => (c.getContext("webgl") || c.getContext("experimental-webgl")) ?? null;
+		const probeGl = canGetWebGL(document.createElement("canvas"));
+		const webglSupported = probeGl ? initWebGL(probeGl) !== null : false;
+		probeGl?.getExtension("WEBGL_lose_context")?.loseContext();
+		const gl = webglSupported ? canGetWebGL(canvas) : null;
 		const uniforms = gl ? initWebGL(gl) : null;
 		if (gl && uniforms) {
 			let contextLost = false;
 			const [cr, cg, cb] = parseHex(color);
 			const setUniforms = () => {
 				setUniform1f(gl, uniforms.uDensity, density);
-				setUniform1f(gl, uniforms.uOpacity, opacity);
+				setUniform1f(gl, uniforms.uOpacity, 1);
 				setUniform1f(gl, uniforms.uFps, fps);
 				setUniform3f(gl, uniforms.uColor, cr / 255, cg / 255, cb / 255);
 			};
@@ -293,7 +297,6 @@ function useFilmGrain({ density, opacity, fps = 18, color = "#ffffff" }) {
 		};
 	}, [
 		density,
-		opacity,
 		fps,
 		interval,
 		color
@@ -302,5 +305,3 @@ function useFilmGrain({ density, opacity, fps = 18, color = "#ffffff" }) {
 }
 //#endregion
 export { useFilmGrain };
-
-//# sourceMappingURL=film-grain-webgl.js.map

package/dist/film-grain.d.ts

@@ -21,5 +21,4 @@ declare function FilmGrain({
   style
 }: FilmGrainProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { FilmGrain, type FilmGrainProps };
-//# sourceMappingURL=film-grain.d.ts.map
+export { FilmGrain, type FilmGrainProps };

package/dist/film-grain.js

@@ -7,7 +7,6 @@ import { jsx } from "react/jsx-runtime";
 function FilmGrain({ density = .6, opacity = .08, blendMode = "overlay", fps = 18, color = "#ffffff", className, style }) {
 	const canvasRef = useFilmGrain({
 		density,
-		opacity,
 		fps,
 		color
 	});
@@ -29,5 +28,3 @@ function FilmGrain({ density = .6, opacity = .08, blendMode = "overlay", fps = 1
 }
 //#endregion
 export { FilmGrain };
-
-//# sourceMappingURL=film-grain.js.map

package/dist/form.d.ts

@@ -94,5 +94,4 @@ declare function fieldControlProps<TFieldValues extends FieldValues, TName exten
   onChange: (...event: any[]) => void;
 };
 //#endregion
-export { Form, FormActions, FormError, FormField, type FormFieldProps, type FormFieldRenderArgs, FormMessage, FormRoot, fieldControlProps, useForm, useWatch };
-//# sourceMappingURL=form.d.ts.map
+export { Form, FormActions, FormError, FormField, type FormFieldProps, type FormFieldRenderArgs, FormMessage, FormRoot, fieldControlProps, useForm, useWatch };

package/dist/form.js

@@ -125,5 +125,3 @@ function fieldControlProps(field, opts) {
 }
 //#endregion
 export { Form, FormActions, FormError, FormField, FormMessage, FormRoot, fieldControlProps, useForm, useWatch };
-
-//# sourceMappingURL=form.js.map

package/dist/gradient-reveal-text.d.ts

@@ -48,5 +48,4 @@ declare function GradientRevealText({
   className
 }: GradientRevealTextProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { GradientRevealText, type GradientRevealTextProps };
-//# sourceMappingURL=gradient-reveal-text.d.ts.map
+export { GradientRevealText, type GradientRevealTextProps };

package/dist/gradient-reveal-text.js

@@ -45,6 +45,7 @@ function GradientRevealText({ text, duration = 0, colors = DEFAULT_COLORS, baseO
 		cy: .5
 	});
 	const rafId = useRef(0);
+	const requestFollow = useRef(() => {});
 	const measure = useCallback(() => {
 		const el = textRef.current;
 		if (!el) return;
@@ -61,7 +62,11 @@ function GradientRevealText({ text, duration = 0, colors = DEFAULT_COLORS, baseO
 	useEffect(() => {
 		measure();
 		document.fonts?.ready?.then(measure);
-	}, [text, measure]);
+	}, [
+		text,
+		fontFamily,
+		measure
+	]);
 	const applyGradientPos = useCallback((cx, cy) => {
 		const el = gradientRef.current;
 		if (!el) return;
@@ -71,18 +76,37 @@ function GradientRevealText({ text, duration = 0, colors = DEFAULT_COLORS, baseO
 		el.setAttribute("cy", String(svgCy));
 	}, [vb]);
 	useEffect(() => {
-		if (duration <= 0) return;
+		if (duration <= 0) {
+			requestFollow.current = () => {};
+			return;
+		}
 		const speed = 1 - Math.pow(.001, 1 / (duration * 60));
+		const EPSILON = 5e-4;
 		const tick = () => {
 			const cur = currentPos.current;
 			const tgt = targetPos.current;
 			cur.cx += (tgt.cx - cur.cx) * speed;
 			cur.cy += (tgt.cy - cur.cy) * speed;
 			applyGradientPos(cur.cx, cur.cy);
+			if (Math.abs(tgt.cx - cur.cx) < EPSILON && Math.abs(tgt.cy - cur.cy) < EPSILON) {
+				cur.cx = tgt.cx;
+				cur.cy = tgt.cy;
+				applyGradientPos(cur.cx, cur.cy);
+				rafId.current = 0;
+				return;
+			}
 			rafId.current = requestAnimationFrame(tick);
 		};
-		rafId.current = requestAnimationFrame(tick);
-		return () => cancelAnimationFrame(rafId.current);
+		requestFollow.current = () => {
+			if (rafId.current === 0) rafId.current = requestAnimationFrame(tick);
+		};
+		return () => {
+			requestFollow.current = () => {};
+			if (rafId.current !== 0) {
+				cancelAnimationFrame(rafId.current);
+				rafId.current = 0;
+			}
+		};
 	}, [duration, applyGradientPos]);
 	const updatePos = (e) => {
 		const svg = svgRef.current;
@@ -100,7 +124,7 @@ function GradientRevealText({ text, duration = 0, colors = DEFAULT_COLORS, baseO
 				cy
 			};
 			applyGradientPos(cx, cy);
-		}
+		} else requestFollow.current();
 	};
 	const handleMouseEnter = (e) => {
 		const svg = svgRef.current;
@@ -239,5 +263,3 @@ function GradientRevealText({ text, duration = 0, colors = DEFAULT_COLORS, baseO
 }
 //#endregion
 export { GradientRevealText };
-
-//# sourceMappingURL=gradient-reveal-text.js.map

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

@@ -6,5 +6,4 @@
  */
 declare function useIsMobile(breakpoint?: number): boolean;
 //#endregion
-export { useIsMobile };
-//# sourceMappingURL=use-mobile.d.ts.map
+export { useIsMobile };

package/dist/hooks/use-mobile.js

@@ -25,5 +25,3 @@ function useIsMobile(breakpoint = DEFAULT_MOBILE_BREAKPOINT) {
 }
 //#endregion
 export { useIsMobile };
-
-//# sourceMappingURL=use-mobile.js.map

package/dist/infinite-scroll.d.ts

@@ -29,5 +29,4 @@ declare function InfiniteScroll({
   children
 }: InfiniteScrollProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { InfiniteScroll, type InfiniteScrollProps };
-//# sourceMappingURL=infinite-scroll.d.ts.map
+export { InfiniteScroll, type InfiniteScrollProps };

package/dist/infinite-scroll.js

@@ -53,14 +53,19 @@ function InfiniteScroll({ onLoadMore, hasMore, isLoading = false, direction = "d
 		"aria-busy": isLoading,
 		className: cn("flex flex-col", className),
 		children: [
-			direction === "up" && /* @__PURE__ */ jsxs(Fragment, { children: [sentinel, loaderContent] }),
+			direction === "up" && /* @__PURE__ */ jsxs(Fragment, { children: [
+				sentinel,
+				loaderContent,
+				endContent
+			] }),
 			children,
-			direction === "down" && /* @__PURE__ */ jsxs(Fragment, { children: [sentinel, loaderContent] }),
-			endContent
+			direction === "down" && /* @__PURE__ */ jsxs(Fragment, { children: [
+				sentinel,
+				loaderContent,
+				endContent
+			] })
 		]
 	});
 }
 //#endregion
 export { InfiniteScroll };
-
-//# sourceMappingURL=infinite-scroll.js.map

package/dist/input-group.d.ts

@@ -18,7 +18,7 @@ declare function InputGroup({
   ...props
 }: InputGroupProps): _$react_jsx_runtime0.JSX.Element;
 declare const inputGroupAddonVariants: (props?: ({
-  align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
+  align?: "inline-start" | "inline-end" | "block-start" | "block-end" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare function InputGroupAddon({
   className,
@@ -48,5 +48,4 @@ declare function InputGroupTextarea({
   ...props
 }: InputGroupTextareaProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
-//# sourceMappingURL=input-group.d.ts.map
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };

package/dist/input-group.js

@@ -11,7 +11,7 @@ function InputGroup({ className, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		"data-slot": "input-group",
 		role: "group",
-		className: cn("border-edge dark:bg-edge/30 has-[[data-slot=input-group-control]:focus-visible]:border-focus has-[[data-slot=input-group-control]:focus-visible]:ring-focus/50 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-disabled:bg-edge/50 dark:has-disabled:bg-edge/80 group/input-group relative flex h-8 w-full min-w-0 items-center rounded-md border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 not-has-disabled:has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", className),
+		className: cn("border-edge dark:bg-edge/30 has-[[data-slot=input-group-control]:focus-visible]:border-focus has-[[data-slot=input-group-control]:focus-visible]:ring-focus/50 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-disabled:bg-edge/50 dark:has-disabled:bg-edge/80 group/input-group relative flex h-8 w-full min-w-0 items-center rounded-md border transition-colors outline-hidden in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 not-has-disabled:has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", className),
 		...props
 	});
 }
@@ -32,7 +32,7 @@ function InputGroupAddon({ className, align = "inline-start", ...props }) {
 		className: cn(inputGroupAddonVariants({ align }), className),
 		onClick: (e) => {
 			if (e.target.closest("button")) return;
-			e.currentTarget.parentElement?.querySelector("input")?.focus();
+			e.currentTarget.parentElement?.querySelector("input, textarea")?.focus();
 		},
 		...props
 	});
@@ -40,7 +40,7 @@ function InputGroupAddon({ className, align = "inline-start", ...props }) {
 const inputGroupButtonVariants = cva("gap-2 text-sm shadow-none flex items-center", {
 	variants: { size: {
 		xs: "h-6 gap-1 rounded-sm px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
-		sm: "",
+		sm: "h-7 gap-1.5 rounded-sm px-2 [&>svg:not([class*='size-'])]:size-4",
 		"icon-xs": "size-6 rounded-sm p-0",
 		"icon-sm": "size-8 p-0"
 	} },
@@ -78,5 +78,3 @@ function InputGroupTextarea({ className, ...props }) {
 }
 //#endregion
 export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
-
-//# sourceMappingURL=input-group.js.map

package/dist/input-otp.d.ts

@@ -30,5 +30,4 @@ declare function InputOTPSeparator({
   ...props
 }: InputOTPSeparatorProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
-//# sourceMappingURL=input-otp.d.ts.map
+export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };

package/dist/input-otp.js

@@ -8,7 +8,7 @@ import { OTPInput, OTPInputContext } from "input-otp";
 function InputOTP({ className, containerClassName, ...props }) {
 	return /* @__PURE__ */ jsx(OTPInput, {
 		"data-slot": "input-otp",
-		containerClassName: cn("flex items-center has-disabled:opacity-50", containerClassName),
+		containerClassName: cn("group/input-otp flex items-center has-disabled:opacity-50", containerClassName),
 		spellCheck: false,
 		className: cn("disabled:cursor-not-allowed", className),
 		...props
@@ -17,7 +17,7 @@ function InputOTP({ className, containerClassName, ...props }) {
 function InputOTPGroup({ className, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		"data-slot": "input-otp-group",
-		className: cn("flex items-center rounded-md has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40", className),
+		className: cn("flex items-center rounded-md", className),
 		...props
 	});
 }
@@ -26,7 +26,7 @@ function InputOTPSlot({ index, className, ...props }) {
 	return /* @__PURE__ */ jsxs("div", {
 		"data-slot": "input-otp-slot",
 		"data-active": isActive || void 0,
-		className: cn("border-edge dark:bg-edge/30 relative flex size-9 items-center justify-center border-y border-r text-sm motion-color outline-none first:rounded-l-md first:border-l last:rounded-r-md", "data-active:border-focus data-active:ring-3 data-active:ring-focus/50 data-active:z-10", "aria-invalid:border-destructive data-active:aria-invalid:border-destructive data-active:aria-invalid:ring-destructive/20 dark:data-active:aria-invalid:ring-destructive/40", className),
+		className: cn("border-edge dark:bg-edge/30 relative flex size-9 items-center justify-center border-y border-r text-sm motion-color outline-hidden first:rounded-l-md first:border-l last:rounded-r-md", "data-active:border-focus data-active:ring-3 data-active:ring-focus/50 data-active:z-10", "group-has-aria-invalid/input-otp:border-destructive group-has-aria-invalid/input-otp:data-active:ring-3 group-has-aria-invalid/input-otp:data-active:ring-destructive/20 dark:group-has-aria-invalid/input-otp:data-active:ring-destructive/40", className),
 		...props,
 		children: [char, hasFakeCaret && /* @__PURE__ */ jsx("div", {
 			className: "pointer-events-none absolute inset-0 flex items-center justify-center",
@@ -45,5 +45,3 @@ function InputOTPSeparator({ className, ...props }) {
 }
 //#endregion
 export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
-
-//# sourceMappingURL=input-otp.js.map

package/dist/input.d.ts

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

package/dist/input.js

@@ -7,11 +7,9 @@ function Input({ className, type, ...props }) {
 	return /* @__PURE__ */ jsx(Input$1, {
 		type,
 		"data-slot": "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 file:text-contrast 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 file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium 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 file:text-contrast 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 file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm", className),
 		...props
 	});
 }
 //#endregion
 export { Input };
-
-//# sourceMappingURL=input.js.map

package/dist/item.d.ts

@@ -11,7 +11,7 @@ declare const itemVariants: (props?: ({
   size?: "default" | "xs" | "sm" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare const itemMediaVariants: (props?: ({
-  variant?: "default" | "icon" | "image" | null | undefined;
+  variant?: "default" | "image" | "icon" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 type ItemGroupProps = React.ComponentProps<"div">;
 type ItemSeparatorProps = React.ComponentProps<typeof Separator>;
@@ -68,5 +68,4 @@ declare function ItemFooter({
   ...props
 }: ItemFooterProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle };
-//# sourceMappingURL=item.d.ts.map
+export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle };