@waveso/ui 0.0.10 → 0.1.0

package/dist/encrypted-text.js

@@ -1,141 +1,109 @@
-import { cn } from './chunk-76UQO56T.js';
-import * as React from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-var DEFAULT_CHARSET = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-={}[];:,.<>/?";
+"use client";
+import { cn } from "./lib/utils.js";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/encrypted-text.tsx
+const DEFAULT_CHARSET = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-={}[];:,.<>/?";
 function randomChar(charset) {
-  return charset.charAt(Math.floor(Math.random() * charset.length));
+	return charset.charAt(Math.floor(Math.random() * charset.length));
 }
 function scramblePreservingSpaces(original, charset) {
-  if (!original) return "";
-  let result = "";
-  for (let i = 0; i < original.length; i += 1) {
-    result += original[i] === " " ? " " : randomChar(charset);
-  }
-  return result;
+	if (!original) return "";
+	let result = "";
+	for (let i = 0; i < original.length; i += 1) result += original[i] === " " ? " " : randomChar(charset);
+	return result;
 }
-function EncryptedText({
-  text,
-  className,
-  revealDelayMs = 50,
-  charset = DEFAULT_CHARSET,
-  flipDelayMs = 50,
-  encryptedClassName,
-  revealedClassName,
-  scrambleOnly = false,
-  scrambleOneChar = false,
-  ...props
-}) {
-  const ref = React.useRef(null);
-  const [isInView, setIsInView] = React.useState(false);
-  const [revealCount, setRevealCount] = React.useState(0);
-  const [, setFlipTick] = React.useState(0);
-  const animationFrameRef = React.useRef(null);
-  const startTimeRef = React.useRef(0);
-  const lastFlipTimeRef = React.useRef(0);
-  const scrambleCharsRef = React.useRef(
-    text ? scramblePreservingSpaces(text, charset).split("") : []
-  );
-  React.useEffect(() => {
-    const el = ref.current;
-    if (!el) return;
-    const observer = new IntersectionObserver(
-      ([entry]) => {
-        if (entry?.isIntersecting) {
-          setIsInView(true);
-          observer.disconnect();
-        }
-      },
-      { threshold: 0 }
-    );
-    observer.observe(el);
-    return () => observer.disconnect();
-  }, []);
-  React.useEffect(() => {
-    if (!isInView) return;
-    const initial = text ? scramblePreservingSpaces(text, charset) : "";
-    scrambleCharsRef.current = initial.split("");
-    startTimeRef.current = performance.now();
-    lastFlipTimeRef.current = startTimeRef.current;
-    setRevealCount(0);
-    let isCancelled = false;
-    const update = (now) => {
-      if (isCancelled) return;
-      const totalLength = text.length;
-      if (scrambleOnly) {
-        const timeSinceLastFlip2 = now - lastFlipTimeRef.current;
-        if (timeSinceLastFlip2 >= Math.max(0, flipDelayMs)) {
-          if (scrambleOneChar) {
-            const indices = [];
-            for (let i = 0; i < totalLength; i++) {
-              if (text[i] !== " ") indices.push(i);
-            }
-            if (indices.length > 0) {
-              const idx = indices[Math.floor(Math.random() * indices.length)];
-              scrambleCharsRef.current[idx] = randomChar(charset);
-            }
-          } else {
-            for (let index = 0; index < totalLength; index += 1) {
-              scrambleCharsRef.current[index] = text[index] === " " ? " " : randomChar(charset);
-            }
-          }
-          lastFlipTimeRef.current = now;
-          setFlipTick((t) => t + 1 & 65535);
-        }
-        animationFrameRef.current = requestAnimationFrame(update);
-        return;
-      }
-      const elapsedMs = now - startTimeRef.current;
-      const currentRevealCount = Math.min(
-        totalLength,
-        Math.floor(elapsedMs / Math.max(1, revealDelayMs))
-      );
-      setRevealCount(currentRevealCount);
-      if (currentRevealCount >= totalLength) return;
-      const timeSinceLastFlip = now - lastFlipTimeRef.current;
-      if (timeSinceLastFlip >= Math.max(0, flipDelayMs)) {
-        for (let index = currentRevealCount; index < totalLength; index += 1) {
-          scrambleCharsRef.current[index] = text[index] === " " ? " " : randomChar(charset);
-        }
-        lastFlipTimeRef.current = now;
-      }
-      animationFrameRef.current = requestAnimationFrame(update);
-    };
-    animationFrameRef.current = requestAnimationFrame(update);
-    return () => {
-      isCancelled = true;
-      if (animationFrameRef.current !== null) {
-        cancelAnimationFrame(animationFrameRef.current);
-      }
-    };
-  }, [isInView, text, revealDelayMs, charset, flipDelayMs, scrambleOnly, scrambleOneChar]);
-  if (!text) return null;
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      ref,
-      "data-slot": "encrypted-text",
-      className,
-      "aria-label": text,
-      ...props,
-      children: text.split("").map((char, index) => {
-        const isRevealed = !scrambleOnly && index < revealCount;
-        const displayChar = isRevealed ? char : char === " " ? " " : scrambleCharsRef.current[index] ?? randomChar(charset);
-        return /* @__PURE__ */ jsx(
-          "span",
-          {
-            "data-slot": "encrypted-text-char",
-            "data-revealed": isRevealed || void 0,
-            className: cn(isRevealed ? revealedClassName : encryptedClassName),
-            children: displayChar
-          },
-          index
-        );
-      })
-    }
-  );
+function EncryptedText({ text, className, revealDelayMs = 50, charset = DEFAULT_CHARSET, flipDelayMs = 50, encryptedClassName, revealedClassName, scrambleOnly = false, scrambleOneChar = false, ...props }) {
+	const ref = React.useRef(null);
+	const [isInView, setIsInView] = React.useState(false);
+	const [revealCount, setRevealCount] = React.useState(0);
+	const [, setFlipTick] = React.useState(0);
+	const animationFrameRef = React.useRef(null);
+	const startTimeRef = React.useRef(0);
+	const lastFlipTimeRef = React.useRef(0);
+	const scrambleCharsRef = React.useRef(text ? scramblePreservingSpaces(text, charset).split("") : []);
+	React.useEffect(() => {
+		const el = ref.current;
+		if (!el) return;
+		const observer = new IntersectionObserver(([entry]) => {
+			if (entry?.isIntersecting) {
+				setIsInView(true);
+				observer.disconnect();
+			}
+		}, { threshold: 0 });
+		observer.observe(el);
+		return () => observer.disconnect();
+	}, []);
+	React.useEffect(() => {
+		if (!isInView) return;
+		scrambleCharsRef.current = (text ? scramblePreservingSpaces(text, charset) : "").split("");
+		startTimeRef.current = performance.now();
+		lastFlipTimeRef.current = startTimeRef.current;
+		setRevealCount(0);
+		let isCancelled = false;
+		const update = (now) => {
+			if (isCancelled) return;
+			const totalLength = text.length;
+			if (scrambleOnly) {
+				if (now - lastFlipTimeRef.current >= Math.max(0, flipDelayMs)) {
+					if (scrambleOneChar) {
+						const indices = [];
+						for (let i = 0; i < totalLength; i++) if (text[i] !== " ") indices.push(i);
+						if (indices.length > 0) {
+							const idx = indices[Math.floor(Math.random() * indices.length)];
+							scrambleCharsRef.current[idx] = randomChar(charset);
+						}
+					} else for (let index = 0; index < totalLength; index += 1) scrambleCharsRef.current[index] = text[index] === " " ? " " : randomChar(charset);
+					lastFlipTimeRef.current = now;
+					setFlipTick((t) => t + 1 & 65535);
+				}
+				animationFrameRef.current = requestAnimationFrame(update);
+				return;
+			}
+			const elapsedMs = now - startTimeRef.current;
+			const currentRevealCount = Math.min(totalLength, Math.floor(elapsedMs / Math.max(1, revealDelayMs)));
+			setRevealCount(currentRevealCount);
+			if (currentRevealCount >= totalLength) return;
+			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;
+			}
+			animationFrameRef.current = requestAnimationFrame(update);
+		};
+		animationFrameRef.current = requestAnimationFrame(update);
+		return () => {
+			isCancelled = true;
+			if (animationFrameRef.current !== null) cancelAnimationFrame(animationFrameRef.current);
+		};
+	}, [
+		isInView,
+		text,
+		revealDelayMs,
+		charset,
+		flipDelayMs,
+		scrambleOnly,
+		scrambleOneChar
+	]);
+	if (!text) return null;
+	return /* @__PURE__ */ jsx("span", {
+		ref,
+		"data-slot": "encrypted-text",
+		className,
+		"aria-label": text,
+		...props,
+		children: text.split("").map((char, index) => {
+			const isRevealed = !scrambleOnly && index < revealCount;
+			const displayChar = isRevealed ? char : char === " " ? " " : scrambleCharsRef.current[index] ?? randomChar(charset);
+			return /* @__PURE__ */ jsx("span", {
+				"data-slot": "encrypted-text-char",
+				"data-revealed": isRevealed || void 0,
+				className: cn(isRevealed ? revealedClassName : encryptedClassName),
+				children: displayChar
+			}, index);
+		})
+	});
 }
-
+//#endregion
 export { EncryptedText };
-//# sourceMappingURL=encrypted-text.js.map
+
 //# sourceMappingURL=encrypted-text.js.map

package/dist/encrypted-text.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/encrypted-text.tsx"],"names":["timeSinceLastFlip"],"mappings":"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","file":"encrypted-text.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"./lib/utils\"\n\ntype EncryptedTextProps = React.ComponentProps<\"span\"> & {\n  text: string\n  revealDelayMs?: number\n  charset?: string\n  flipDelayMs?: number\n  encryptedClassName?: string\n  revealedClassName?: string\n  scrambleOnly?: boolean\n  scrambleOneChar?: boolean\n}\n\nconst DEFAULT_CHARSET =\n  \"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-={}[];:,.<>/?\"\n\nfunction randomChar(charset: string): string {\n  return charset.charAt(Math.floor(Math.random() * charset.length))\n}\n\nfunction scramblePreservingSpaces(original: string, charset: string): string {\n  if (!original) return \"\"\n  let result = \"\"\n  for (let i = 0; i < original.length; i += 1) {\n    result += original[i] === \" \" ? \" \" : randomChar(charset)\n  }\n  return result\n}\n\nfunction EncryptedText({\n  text,\n  className,\n  revealDelayMs = 50,\n  charset = DEFAULT_CHARSET,\n  flipDelayMs = 50,\n  encryptedClassName,\n  revealedClassName,\n  scrambleOnly = false,\n  scrambleOneChar = false,\n  ...props\n}: EncryptedTextProps) {\n  const ref = React.useRef<HTMLSpanElement>(null)\n  const [isInView, setIsInView] = React.useState(false)\n  const [revealCount, setRevealCount] = React.useState(0)\n  const [, setFlipTick] = React.useState(0)\n\n  const animationFrameRef = React.useRef<number | null>(null)\n  const startTimeRef = React.useRef(0)\n  const lastFlipTimeRef = React.useRef(0)\n  const scrambleCharsRef = React.useRef<string[]>(\n    text ? scramblePreservingSpaces(text, charset).split(\"\") : []\n  )\n\n  React.useEffect(() => {\n    const el = ref.current\n    if (!el) return\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry?.isIntersecting) {\n          setIsInView(true)\n          observer.disconnect()\n        }\n      },\n      { threshold: 0 }\n    )\n\n    observer.observe(el)\n    return () => observer.disconnect()\n  }, [])\n\n  React.useEffect(() => {\n    if (!isInView) return\n\n    const initial = text\n      ? scramblePreservingSpaces(text, charset)\n      : \"\"\n    scrambleCharsRef.current = initial.split(\"\")\n    startTimeRef.current = performance.now()\n    lastFlipTimeRef.current = startTimeRef.current\n    setRevealCount(0)\n\n    let isCancelled = false\n\n    const update = (now: number) => {\n      if (isCancelled) return\n\n      const totalLength = text.length\n\n      if (scrambleOnly) {\n        const timeSinceLastFlip = now - lastFlipTimeRef.current\n        if (timeSinceLastFlip >= Math.max(0, flipDelayMs)) {\n          if (scrambleOneChar) {\n            const indices: number[] = []\n            for (let i = 0; i < totalLength; i++) {\n              if (text[i] !== \" \") indices.push(i)\n            }\n            if (indices.length > 0) {\n              const idx = indices[Math.floor(Math.random() * indices.length)]!\n              scrambleCharsRef.current[idx] = randomChar(charset)\n            }\n          } else {\n            for (let index = 0; index < totalLength; index += 1) {\n              scrambleCharsRef.current[index] =\n                text[index] === \" \" ? \" \" : randomChar(charset)\n            }\n          }\n          lastFlipTimeRef.current = now\n          setFlipTick((t) => (t + 1) & 0xffff)\n        }\n        animationFrameRef.current = requestAnimationFrame(update)\n        return\n      }\n\n      const elapsedMs = now - startTimeRef.current\n      const currentRevealCount = Math.min(\n        totalLength,\n        Math.floor(elapsedMs / Math.max(1, revealDelayMs))\n      )\n\n      setRevealCount(currentRevealCount)\n\n      if (currentRevealCount >= totalLength) return\n\n      const timeSinceLastFlip = now - lastFlipTimeRef.current\n      if (timeSinceLastFlip >= Math.max(0, flipDelayMs)) {\n        for (let index = currentRevealCount; index < totalLength; index += 1) {\n          scrambleCharsRef.current[index] =\n            text[index] === \" \" ? \" \" : randomChar(charset)\n        }\n        lastFlipTimeRef.current = now\n      }\n\n      animationFrameRef.current = requestAnimationFrame(update)\n    }\n\n    animationFrameRef.current = requestAnimationFrame(update)\n\n    return () => {\n      isCancelled = true\n      if (animationFrameRef.current !== null) {\n        cancelAnimationFrame(animationFrameRef.current)\n      }\n    }\n  }, [isInView, text, revealDelayMs, charset, flipDelayMs, scrambleOnly, scrambleOneChar])\n\n  if (!text) return null\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"encrypted-text\"\n      className={className}\n      aria-label={text}\n      {...props}\n    >\n      {text.split(\"\").map((char, index) => {\n        const isRevealed = !scrambleOnly && index < revealCount\n        const displayChar = isRevealed\n          ? char\n          : char === \" \"\n            ? \" \"\n            : (scrambleCharsRef.current[index] ?? randomChar(charset))\n\n        return (\n          <span\n            key={index}\n            data-slot=\"encrypted-text-char\"\n            data-revealed={isRevealed || undefined}\n            className={cn(isRevealed ? revealedClassName : encryptedClassName)}\n          >\n            {displayChar}\n          </span>\n        )\n      })}\n    </span>\n  )\n}\n\nexport { EncryptedText }\n"]}
+{"version":3,"file":"encrypted-text.js","names":[],"sources":["../src/encrypted-text.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"./lib/utils\"\n\ntype EncryptedTextProps = React.ComponentProps<\"span\"> & {\n  text: string\n  revealDelayMs?: number\n  charset?: string\n  flipDelayMs?: number\n  encryptedClassName?: string\n  revealedClassName?: string\n  scrambleOnly?: boolean\n  scrambleOneChar?: boolean\n}\n\nconst DEFAULT_CHARSET =\n  \"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-={}[];:,.<>/?\"\n\nfunction randomChar(charset: string): string {\n  return charset.charAt(Math.floor(Math.random() * charset.length))\n}\n\nfunction scramblePreservingSpaces(original: string, charset: string): string {\n  if (!original) return \"\"\n  let result = \"\"\n  for (let i = 0; i < original.length; i += 1) {\n    result += original[i] === \" \" ? \" \" : randomChar(charset)\n  }\n  return result\n}\n\nfunction EncryptedText({\n  text,\n  className,\n  revealDelayMs = 50,\n  charset = DEFAULT_CHARSET,\n  flipDelayMs = 50,\n  encryptedClassName,\n  revealedClassName,\n  scrambleOnly = false,\n  scrambleOneChar = false,\n  ...props\n}: EncryptedTextProps) {\n  const ref = React.useRef<HTMLSpanElement>(null)\n  const [isInView, setIsInView] = React.useState(false)\n  const [revealCount, setRevealCount] = React.useState(0)\n  const [, setFlipTick] = React.useState(0)\n\n  const animationFrameRef = React.useRef<number | null>(null)\n  const startTimeRef = React.useRef(0)\n  const lastFlipTimeRef = React.useRef(0)\n  const scrambleCharsRef = React.useRef<string[]>(\n    text ? scramblePreservingSpaces(text, charset).split(\"\") : []\n  )\n\n  React.useEffect(() => {\n    const el = ref.current\n    if (!el) return\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry?.isIntersecting) {\n          setIsInView(true)\n          observer.disconnect()\n        }\n      },\n      { threshold: 0 }\n    )\n\n    observer.observe(el)\n    return () => observer.disconnect()\n  }, [])\n\n  React.useEffect(() => {\n    if (!isInView) return\n\n    const initial = text\n      ? scramblePreservingSpaces(text, charset)\n      : \"\"\n    scrambleCharsRef.current = initial.split(\"\")\n    startTimeRef.current = performance.now()\n    lastFlipTimeRef.current = startTimeRef.current\n    setRevealCount(0)\n\n    let isCancelled = false\n\n    const update = (now: number) => {\n      if (isCancelled) return\n\n      const totalLength = text.length\n\n      if (scrambleOnly) {\n        const timeSinceLastFlip = now - lastFlipTimeRef.current\n        if (timeSinceLastFlip >= Math.max(0, flipDelayMs)) {\n          if (scrambleOneChar) {\n            const indices: number[] = []\n            for (let i = 0; i < totalLength; i++) {\n              if (text[i] !== \" \") indices.push(i)\n            }\n            if (indices.length > 0) {\n              const idx = indices[Math.floor(Math.random() * indices.length)]!\n              scrambleCharsRef.current[idx] = randomChar(charset)\n            }\n          } else {\n            for (let index = 0; index < totalLength; index += 1) {\n              scrambleCharsRef.current[index] =\n                text[index] === \" \" ? \" \" : randomChar(charset)\n            }\n          }\n          lastFlipTimeRef.current = now\n          setFlipTick((t) => (t + 1) & 0xffff)\n        }\n        animationFrameRef.current = requestAnimationFrame(update)\n        return\n      }\n\n      const elapsedMs = now - startTimeRef.current\n      const currentRevealCount = Math.min(\n        totalLength,\n        Math.floor(elapsedMs / Math.max(1, revealDelayMs))\n      )\n\n      setRevealCount(currentRevealCount)\n\n      if (currentRevealCount >= totalLength) return\n\n      const timeSinceLastFlip = now - lastFlipTimeRef.current\n      if (timeSinceLastFlip >= Math.max(0, flipDelayMs)) {\n        for (let index = currentRevealCount; index < totalLength; index += 1) {\n          scrambleCharsRef.current[index] =\n            text[index] === \" \" ? \" \" : randomChar(charset)\n        }\n        lastFlipTimeRef.current = now\n      }\n\n      animationFrameRef.current = requestAnimationFrame(update)\n    }\n\n    animationFrameRef.current = requestAnimationFrame(update)\n\n    return () => {\n      isCancelled = true\n      if (animationFrameRef.current !== null) {\n        cancelAnimationFrame(animationFrameRef.current)\n      }\n    }\n  }, [isInView, text, revealDelayMs, charset, flipDelayMs, scrambleOnly, scrambleOneChar])\n\n  if (!text) return null\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"encrypted-text\"\n      className={className}\n      aria-label={text}\n      {...props}\n    >\n      {text.split(\"\").map((char, index) => {\n        const isRevealed = !scrambleOnly && index < revealCount\n        const displayChar = isRevealed\n          ? char\n          : char === \" \"\n            ? \" \"\n            : (scrambleCharsRef.current[index] ?? randomChar(charset))\n\n        return (\n          <span\n            key={index}\n            data-slot=\"encrypted-text-char\"\n            data-revealed={isRevealed || undefined}\n            className={cn(isRevealed ? revealedClassName : encryptedClassName)}\n          >\n            {displayChar}\n          </span>\n        )\n      })}\n    </span>\n  )\n}\n\nexport { EncryptedText }\n"],"mappings":"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"}

package/dist/field.d.ts

@@ -1,22 +1,38 @@
-import * as _base_ui_react from '@base-ui/react';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-import { Field as Field$1 } from '@base-ui/react/field';
-export { Field as FieldPrimitive } from '@base-ui/react/field';
+import * as React from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { Field as FieldPrimitive } from "@base-ui/react/field";
+import * as _$_base_ui_react0 from "@base-ui/react";
 
-type FieldProps = React.ComponentProps<typeof Field$1.Root>;
-type FieldLabelProps = React.ComponentProps<typeof Field$1.Label>;
-type FieldDescriptionProps = React.ComponentProps<typeof Field$1.Description>;
-type FieldItemProps = React.ComponentProps<typeof Field$1.Item>;
-type FieldErrorProps = React.ComponentProps<typeof Field$1.Error>;
-type FieldValidityProps = React.ComponentProps<typeof Field$1.Validity>;
-type FieldControlProps = React.ComponentPropsWithoutRef<typeof Field$1.Control>;
-declare function Field({ className, ...props }: FieldProps): react_jsx_runtime.JSX.Element;
-declare function FieldLabel({ className, ...props }: FieldLabelProps): react_jsx_runtime.JSX.Element;
-declare const FieldControl: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.FieldControlProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
-declare function FieldDescription({ className, ...props }: FieldDescriptionProps): react_jsx_runtime.JSX.Element;
-declare function FieldItem({ className, ...props }: FieldItemProps): react_jsx_runtime.JSX.Element;
-declare function FieldError({ className, ...props }: FieldErrorProps): react_jsx_runtime.JSX.Element;
-declare const FieldValidity: React.FC<_base_ui_react.FieldValidityProps>;
-
-export { Field, FieldControl, type FieldControlProps, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, FieldItem, type FieldItemProps, FieldLabel, type FieldLabelProps, type FieldProps, FieldValidity, type FieldValidityProps };
+//#region src/field.d.ts
+type FieldProps = React.ComponentProps<typeof FieldPrimitive.Root>;
+type FieldLabelProps = React.ComponentProps<typeof FieldPrimitive.Label>;
+type FieldDescriptionProps = React.ComponentProps<typeof FieldPrimitive.Description>;
+type FieldItemProps = React.ComponentProps<typeof FieldPrimitive.Item>;
+type FieldErrorProps = React.ComponentProps<typeof FieldPrimitive.Error>;
+type FieldValidityProps = React.ComponentProps<typeof FieldPrimitive.Validity>;
+type FieldControlProps = React.ComponentPropsWithoutRef<typeof FieldPrimitive.Control>;
+declare function Field({
+  className,
+  ...props
+}: FieldProps): _$react_jsx_runtime0.JSX.Element;
+declare function FieldLabel({
+  className,
+  ...props
+}: FieldLabelProps): _$react_jsx_runtime0.JSX.Element;
+declare const FieldControl: React.ForwardRefExoticComponent<Omit<Omit<_$_base_ui_react0.FieldControlProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+declare function FieldDescription({
+  className,
+  ...props
+}: FieldDescriptionProps): _$react_jsx_runtime0.JSX.Element;
+declare function FieldItem({
+  className,
+  ...props
+}: FieldItemProps): _$react_jsx_runtime0.JSX.Element;
+declare function FieldError({
+  className,
+  ...props
+}: 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

package/dist/field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field.d.ts","names":[],"sources":["../src/field.tsx"],"mappings":";;;;;;KAOY,UAAA,GAAa,KAAA,CAAM,cAAA,QAAsB,cAAA,CAAe,IAAA;AAAA,KACxD,eAAA,GAAkB,KAAA,CAAM,cAAA,QAAsB,cAAA,CAAe,KAAA;AAAA,KAC7D,qBAAA,GAAwB,KAAA,CAAM,cAAA,QAAsB,cAAA,CAAe,WAAA;AAAA,KACnE,cAAA,GAAiB,KAAA,CAAM,cAAA,QAAsB,cAAA,CAAe,IAAA;AAAA,KAC5D,eAAA,GAAkB,KAAA,CAAM,cAAA,QAAsB,cAAA,CAAe,KAAA;AAAA,KAC7D,kBAAA,GAAqB,KAAA,CAAM,cAAA,QAAsB,cAAA,CAAe,QAAA;AAAA,KAGhE,iBAAA,GAAoB,KAAA,CAAM,wBAAA,QAAgC,cAAA,CAAe,OAAA;AAAA,iBAErE,KAAA,CAAA;EAAQ,SAAA;EAAA,GAAc;AAAA,GAAS,UAAA,GAAU,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAazC,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,eAAA,GAAe,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAatD,YAAA,EAAY,KAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,IAAA,CAavB,iBAAA,CAbuB,iBAAA,WAAA,KAAA,CAAA,aAAA,CAAA,WAAA,YAAA,KAAA,CAAA,aAAA,CAAA,WAAA;AAAA,iBAgBT,gBAAA,CAAA;EAAmB,SAAA;EAAA,GAAc;AAAA,GAAS,qBAAA,GAAqB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAe/D,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAUjD,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,eAAA,GAAe,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAWtD,aAAA,EAAa,KAAA,CAAA,EAAA,CAA0B,iBAAA,CAA1B,kBAAA"}

package/dist/field.js

@@ -1,4 +1,53 @@
-export { Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldPrimitive, FieldValidity } from './chunk-NCHHHWTB.js';
-import './chunk-76UQO56T.js';
-//# sourceMappingURL=field.js.map
+"use client";
+import { cn } from "./lib/utils.js";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { Field as FieldPrimitive } from "@base-ui/react/field";
+//#region src/field.tsx
+function Field({ className, ...props }) {
+	return /* @__PURE__ */ jsx(FieldPrimitive.Root, {
+		"data-slot": "field",
+		className: cn("grid w-full gap-2 data-[invalid]:text-destructive", className),
+		...props
+	});
+}
+function FieldLabel({ className, ...props }) {
+	return /* @__PURE__ */ jsx(FieldPrimitive.Label, {
+		"data-slot": "field-label",
+		className: cn("text-sm font-medium leading-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-70", className),
+		...props
+	});
+}
+const FieldControl = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(FieldPrimitive.Control, {
+	ref,
+	"data-slot": "field-control",
+	className: cn("rounded-md outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50", className),
+	...props
+}));
+FieldControl.displayName = "FieldControl";
+function FieldDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(FieldPrimitive.Description, {
+		"data-slot": "field-description",
+		className: cn("text-muted-foreground 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),
+		...props
+	});
+}
+function FieldItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(FieldPrimitive.Item, {
+		"data-slot": "field-item",
+		className: cn("flex items-center gap-2", className),
+		...props
+	});
+}
+function FieldError({ className, ...props }) {
+	return /* @__PURE__ */ jsx(FieldPrimitive.Error, {
+		"data-slot": "field-error",
+		className: cn("text-destructive text-sm font-normal", className),
+		...props
+	});
+}
+const FieldValidity = FieldPrimitive.Validity;
+//#endregion
+export { Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldPrimitive, FieldValidity };
+
 //# sourceMappingURL=field.js.map

package/dist/field.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"field.js"}
+{"version":3,"file":"field.js","names":[],"sources":["../src/field.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Field as FieldPrimitive } from \"@base-ui/react/field\"\n\nimport { cn } from \"./lib/utils\"\n\nexport type FieldProps = React.ComponentProps<typeof FieldPrimitive.Root>\nexport type FieldLabelProps = React.ComponentProps<typeof FieldPrimitive.Label>\nexport type FieldDescriptionProps = React.ComponentProps<typeof FieldPrimitive.Description>\nexport type FieldItemProps = React.ComponentProps<typeof FieldPrimitive.Item>\nexport type FieldErrorProps = React.ComponentProps<typeof FieldPrimitive.Error>\nexport type FieldValidityProps = React.ComponentProps<typeof FieldPrimitive.Validity>\n\n// `ref` is important for React Hook Form / focus management, so we forward it only on the control.\nexport type FieldControlProps = React.ComponentPropsWithoutRef<typeof FieldPrimitive.Control>\n\nexport function Field({ className, ...props }: FieldProps) {\n  return (\n    <FieldPrimitive.Root\n      data-slot=\"field\"\n      className={cn(\n        \"grid w-full gap-2 data-[invalid]:text-destructive\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function FieldLabel({ className, ...props }: FieldLabelProps) {\n  return (\n    <FieldPrimitive.Label\n      data-slot=\"field-label\"\n      className={cn(\n        \"text-sm font-medium leading-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-70\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nexport const FieldControl = React.forwardRef<\n  React.ComponentRef<typeof FieldPrimitive.Control>,\n  FieldControlProps\n>(({ className, ...props }, ref) => (\n  <FieldPrimitive.Control\n    ref={ref}\n    data-slot=\"field-control\"\n    className={cn(\n      \"rounded-md outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n      className,\n    )}\n    {...props}\n  />\n))\nFieldControl.displayName = \"FieldControl\"\n\nexport function FieldDescription({ className, ...props }: FieldDescriptionProps) {\n  return (\n    <FieldPrimitive.Description\n      data-slot=\"field-description\"\n      className={cn(\n        \"text-muted-foreground text-left text-sm leading-normal font-normal group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5\",\n        \"last:mt-0 nth-last-2:-mt-1\",\n        \"[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function FieldItem({ className, ...props }: FieldItemProps) {\n  return (\n    <FieldPrimitive.Item\n      data-slot=\"field-item\"\n      className={cn(\"flex items-center gap-2\", className)}\n      {...props}\n    />\n  )\n}\n\nexport function FieldError({ className, ...props }: FieldErrorProps) {\n  return (\n    <FieldPrimitive.Error\n      data-slot=\"field-error\"\n      className={cn(\"text-destructive text-sm font-normal\", className)}\n      {...props}\n    />\n  )\n}\n\n// Base UI's Validity does not accept `className`/`ref` (and we don't need to style it yet), so we export it as-is.\nexport const FieldValidity = FieldPrimitive.Validity\n\nexport { FieldPrimitive }"],"mappings":";;;;;;AAiBA,SAAgB,MAAM,EAAE,WAAW,GAAG,SAAqB;AACzD,QACE,oBAAC,eAAe,MAAhB;EACE,aAAU;EACV,WAAW,GACT,qDACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAgB,WAAW,EAAE,WAAW,GAAG,SAA0B;AACnE,QACE,oBAAC,eAAe,OAAhB;EACE,aAAU;EACV,WAAW,GACT,kGACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,MAAa,eAAe,MAAM,YAG/B,EAAE,WAAW,GAAG,SAAS,QAC1B,oBAAC,eAAe,SAAhB;CACO;CACL,aAAU;CACV,WAAW,GACT,kKACA,UACD;CACD,GAAI;CACJ,CAAA,CACF;AACF,aAAa,cAAc;AAE3B,SAAgB,iBAAiB,EAAE,WAAW,GAAG,SAAgC;AAC/E,QACE,oBAAC,eAAe,aAAhB;EACE,aAAU;EACV,WAAW,GACT,qJACA,8BACA,qEACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAgB,UAAU,EAAE,WAAW,GAAG,SAAyB;AACjE,QACE,oBAAC,eAAe,MAAhB;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,UAAU;EACnD,GAAI;EACJ,CAAA;;AAIN,SAAgB,WAAW,EAAE,WAAW,GAAG,SAA0B;AACnE,QACE,oBAAC,eAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,wCAAwC,UAAU;EAChE,GAAI;EACJ,CAAA;;AAKN,MAAa,gBAAgB,eAAe"}

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

@@ -0,0 +1,6 @@
+//#region src/film-grain-shader.d.ts
+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

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

@@ -0,0 +1 @@
+{"version":3,"file":"film-grain-shader.d.ts","names":[],"sources":["../src/film-grain-shader.ts"],"mappings":";cAAa,YAAA;AAAA,cAUA,cAAA"}

package/dist/film-grain-shader.js

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

package/dist/film-grain-shader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"film-grain-shader.js","names":[],"sources":["../src/film-grain-shader.ts"],"sourcesContent":["export 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`\n\nexport 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`\n"],"mappings":";AAAA,MAAa,eAAe;;;;;;;;;AAU5B,MAAa,iBAAiB"}

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

@@ -0,0 +1,20 @@
+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' */
+  color?: string;
+}
+declare function useFilmGrain({
+  density,
+  opacity,
+  fps,
+  color
+}: UseFilmGrainOptions): _$react.RefObject<HTMLCanvasElement | null>;
+//#endregion
+export { useFilmGrain };
+//# sourceMappingURL=film-grain-webgl.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"film-grain-webgl.d.ts","names":[],"sources":["../src/film-grain-webgl.ts"],"mappings":";;;UAGU,mBAAA;EACR,OAAA;EACA,OAAA;EAFQ;EAIR,GAAA;;EAEA,KAAA;AAAA;AAAA,iBAgJc,YAAA,CAAA;EACd,OAAA;EACA,OAAA;EACA,GAAA;EACA;AAAA,GACC,mBAAA,GAAmB,OAAA,CAAA,SAAA,CAAA,iBAAA"}