@xiping/react-components 1.0.24 → 1.0.25

package/dist/es/components/blur-fade/BlurFade.d.ts

@@ -0,0 +1,23 @@
+import { UseInViewOptions, MotionProps } from 'motion/react';
+type MarginType = UseInViewOptions["margin"];
+interface BlurFadeProps extends MotionProps {
+    children: React.ReactNode;
+    className?: string;
+    variant?: {
+        hidden: {
+            y: number;
+        };
+        visible: {
+            y: number;
+        };
+    };
+    duration?: number;
+    delay?: number;
+    offset?: number;
+    direction?: "up" | "down" | "left" | "right";
+    inView?: boolean;
+    inViewMargin?: MarginType;
+    blur?: string;
+}
+export declare function BlurFade({ children, className, variant, duration, delay, offset, direction, inView, inViewMargin, blur, ...props }: BlurFadeProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/es/components/blur-fade/BlurFade.js

@@ -0,0 +1,51 @@
+"use client";
+import { jsx as n } from "react/jsx-runtime";
+import { useInView as b, AnimatePresence as w, motion as y } from "motion/react";
+import { useRef as V } from "react";
+function R({
+  children: r,
+  className: a,
+  variant: s,
+  duration: l = 0.4,
+  delay: o = 0,
+  offset: i = 6,
+  direction: e = "down",
+  inView: u = !1,
+  inViewMargin: d = "-50px",
+  blur: m = "6px",
+  ...f
+}) {
+  const t = V(null), p = b(t, { once: !0, margin: d }), c = !u || p, h = {
+    hidden: {
+      [e === "left" || e === "right" ? "x" : "y"]: e === "right" || e === "down" ? -i : i,
+      opacity: 0,
+      filter: `blur(${m})`
+    },
+    visible: {
+      [e === "left" || e === "right" ? "x" : "y"]: 0,
+      opacity: 1,
+      filter: "blur(0px)"
+    }
+  }, x = s || h;
+  return /* @__PURE__ */ n(w, { children: /* @__PURE__ */ n(
+    y.div,
+    {
+      ref: t,
+      initial: "hidden",
+      animate: c ? "visible" : "hidden",
+      exit: "hidden",
+      variants: x,
+      transition: {
+        delay: 0.04 + o,
+        duration: l,
+        ease: "easeOut"
+      },
+      className: a,
+      ...f,
+      children: r
+    }
+  ) });
+}
+export {
+  R as BlurFade
+};

package/dist/es/components/blur-fade/index.d.ts

@@ -0,0 +1,2 @@
+import { BlurFade } from './BlurFade.tsx';
+export { BlurFade };

package/dist/es/components/button/Button.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode, ButtonHTMLAttributes } from 'react';
-export type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost';
-export type ButtonSize = 'small' | 'medium' | 'large';
-export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'disabled'> {
+export type ButtonVariant = "primary" | "secondary" | "outline" | "ghost";
+export type ButtonSize = "small" | "medium" | "large";
+export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "disabled"> {
     /** Button variant that changes the visual style */
     variant?: ButtonVariant;
     /** Size of the button */

package/dist/es/components/button/Button.js

@@ -1,5 +1,5 @@
 import { jsxs as a, jsx as r } from "react/jsx-runtime";
-import x from "clsx";
+import { cn as h } from "../../utils/utils.js";
 const w = ({
   variant: l = "primary",
   size: n = "medium",
@@ -22,7 +22,7 @@ const w = ({
     small: "px-3 py-1.5 text-sm",
     medium: "px-4 py-2 text-base",
     large: "px-6 py-3 text-lg"
-  }, b = x(
+  }, b = h(
     y,
     p[l],
     f[n],

package/dist/es/components/hyper-text/index.d.ts

@@ -19,4 +19,4 @@ interface HyperTextProps extends MotionProps {
     characterSet?: CharacterSet;
 }
 export declare function HyperText({ children, className, duration, delay, as: Component, startOnView, animateOnHover, characterSet, ...props }: HyperTextProps): import("react/jsx-runtime").JSX.Element;
-export default HyperText;
+export {};

package/dist/es/components/hyper-text/index.js

@@ -1,74 +1,76 @@
 "use client";
 import { jsx as u } from "react/jsx-runtime";
 import { cn as g } from "../../utils/utils.js";
-import { motion as v, AnimatePresence as H } from "motion/react";
-import { useState as x, useRef as I, useEffect as d } from "react";
-const N = Object.freeze(
+import { motion as x, AnimatePresence as U } from "motion/react";
+import { useState as M, useRef as h, useEffect as I } from "react";
+const j = Object.freeze(
   "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split("")
-), P = (e) => Math.floor(Math.random() * e);
-function L({
-  children: e,
-  className: A,
-  duration: l = 800,
-  delay: s = 0,
-  as: M = "div",
-  startOnView: m = !1,
-  animateOnHover: h = !0,
-  characterSet: i = N,
-  ...C
+), q = (n) => Math.floor(Math.random() * n);
+function z({
+  children: n,
+  className: C,
+  duration: f = 800,
+  delay: r = 0,
+  as: E = "div",
+  startOnView: p = !1,
+  animateOnHover: F = !0,
+  characterSet: s = j,
+  ...R
 }) {
-  const E = v.create(M, {
+  const b = x.create(E, {
     forwardMotionProps: !0
-  }), [R, b] = x(
-    () => e.split("")
-  ), [a, o] = x(!1), r = I(0), c = I(null), D = () => {
-    h && !a && (r.current = 0, o(!0));
+  }), [v, w] = M(
+    () => n.split("")
+  ), [i, o] = M(!1), a = h(0), m = h(null), D = () => {
+    F && !i && (a.current = 0, o(!0));
   };
-  return d(() => {
-    if (!m) {
-      const n = setTimeout(() => {
+  return I(() => {
+    if (!p) {
+      const t = setTimeout(() => {
         o(!0);
-      }, s);
-      return () => clearTimeout(n);
+      }, r);
+      return () => clearTimeout(t);
     }
-    const t = new IntersectionObserver(
-      ([n]) => {
-        n.isIntersecting && (setTimeout(() => {
+    const e = new IntersectionObserver(
+      ([t]) => {
+        t.isIntersecting && (setTimeout(() => {
           o(!0);
-        }, s), t.disconnect());
+        }, r), e.disconnect());
       },
       { threshold: 0.1, rootMargin: "-30% 0px -30% 0px" }
     );
-    return c.current && t.observe(c.current), () => t.disconnect();
-  }, [s, m]), d(() => {
-    if (!a) return;
-    const t = l / (e.length * 10), n = e.length, f = setInterval(() => {
-      r.current < n ? (b(
-        (w) => w.map(
-          (p, T) => p === " " ? p : T <= r.current ? e[T] : i[P(i.length)]
+    return m.current && e.observe(m.current), () => e.disconnect();
+  }, [r, p]), I(() => {
+    if (!i) return;
+    const e = n.length, t = performance.now();
+    let c;
+    const l = (H) => {
+      const N = H - t, T = Math.min(N / f, 1);
+      a.current = T * e, w(
+        (P) => P.map(
+          (A, d) => A === " " ? A : d <= a.current ? n[d] : s[q(s.length)]
         )
-      ), r.current = r.current + 0.1) : (o(!1), clearInterval(f));
-    }, t);
-    return () => clearInterval(f);
-  }, [e, l, a, i]), /* @__PURE__ */ u(
-    E,
+      ), T < 1 ? c = requestAnimationFrame(l) : o(!1);
+    };
+    return c = requestAnimationFrame(l), () => cancelAnimationFrame(c);
+  }, [n, f, i, s]), /* @__PURE__ */ u(
+    b,
     {
-      ref: c,
-      className: g("overflow-hidden py-2 text-4xl font-bold", A),
+      ref: m,
+      className: g("overflow-hidden py-2 text-4xl font-bold", C),
       onMouseEnter: D,
-      ...C,
-      children: /* @__PURE__ */ u(H, { children: R.map((t, n) => /* @__PURE__ */ u(
-        v.span,
+      ...R,
+      children: /* @__PURE__ */ u(U, { children: v.map((e, t) => /* @__PURE__ */ u(
+        x.span,
         {
-          className: g("font-mono", t === " " ? "w-3" : ""),
-          children: t.toUpperCase()
+          className: g("font-mono", e === " " ? "w-3" : ""),
+          children: e.toUpperCase()
         },
-        n
+        t
       )) })
     }
   );
 }
 export {
-  L as HyperText,
-  L as default
+  z as HyperText
 };

package/dist/es/components/morphing-text/index.d.ts

@@ -3,4 +3,4 @@ interface MorphingTextProps {
     texts: string[];
 }
 export declare const MorphingText: React.FC<MorphingTextProps>;
-export default MorphingText;
+export {};

package/dist/es/components/scratch-to-reveal/ScratchToReveal.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+interface ScratchToRevealProps {
+    children: React.ReactNode;
+    width: number;
+    height: number;
+    minScratchPercentage?: number;
+    className?: string;
+    onComplete?: () => void;
+    gradientColors?: [string, string, string];
+}
+export declare const ScratchToReveal: React.FC<ScratchToRevealProps>;
+export {};

package/dist/es/components/scratch-to-reveal/index.d.ts

@@ -0,0 +1,2 @@
+import { ScratchToReveal } from './ScratchToReveal';
+export { ScratchToReveal };

package/dist/es/index.d.ts

@@ -16,3 +16,4 @@ export * from './components/confetti-button';
 export * from './hooks/useStayTimeReport';
 export * from './components/pointer';
 export * from './components/sparkles-text';
+export * from './components/blur-fade';

package/dist/es/index.js

@@ -1,44 +1,46 @@
 /* empty css          */
-import { Button as e } from "./components/button/Button.js";
+import { Button as t } from "./components/button/Button.js";
 import { TxtReader as f } from "./components/txt-reader/TxtReader.js";
 import { HyperText as x } from "./components/hyper-text/index.js";
 import { TypingAnimation as n } from "./components/typing-animation/index.js";
-import { QRCode as s } from "./components/qr-code/index.js";
+import { QRCode as d } from "./components/qr-code/index.js";
 import { Confetti as u, ConfettiButton as c } from "./components/confetti-button/index.js";
-import { useStayTimeReport as l } from "./hooks/useStayTimeReport.js";
+import { useStayTimeReport as T } from "./hooks/useStayTimeReport.js";
 import { default as g } from "./components/pinch-content/PinchContent.js";
-import { default as h } from "./components/image-viewer/ImageViewer.js";
-import { ShimmerButton as B } from "./components/shimmer-button/ShimmerButton.js";
+import { default as B } from "./components/image-viewer/ImageViewer.js";
+import { ShimmerButton as y } from "./components/shimmer-button/ShimmerButton.js";
 import { default as I } from "./components/image-compare/ImageCompare.js";
 import { TextAnimate as S } from "./components/text-animate/TextAnimate.js";
-import { Dock as P, DockIcon as V, dockVariants as w } from "./components/dock/Duck.js";
-import { TxtEditor as F } from "./components/txt-editor/TxtEditor.js";
+import { Dock as F, DockIcon as P, dockVariants as V } from "./components/dock/Duck.js";
+import { TxtEditor as E } from "./components/txt-editor/TxtEditor.js";
 import { Message as H } from "./components/message/Message.js";
 import { default as Q } from "./node_modules/.pnpm/react-force-graph-3d@1.28.0_react@19.1.0/node_modules/react-force-graph-3d/dist/react-force-graph-3d.js";
 import { default as j } from "./node_modules/.pnpm/canvas-confetti@1.9.3/node_modules/canvas-confetti/dist/confetti.module.js";
 import { Pointer as v } from "./components/pointer/Pointer.js";
 import { SparklesText as J } from "./components/sparkles-text/SparklesText.js";
+import { BlurFade as L } from "./components/blur-fade/BlurFade.js";
 export {
-  e as Button,
+  L as BlurFade,
+  t as Button,
   u as Confetti,
   c as ConfettiButton,
-  P as Dock,
-  V as DockIcon,
+  F as Dock,
+  P as DockIcon,
   Q as ForceGraph3D,
   x as HyperText,
   I as ImageCompare,
-  h as ImageViewer,
+  B as ImageViewer,
   H as Message,
   g as PinchContent,
   v as Pointer,
-  s as QRCode,
-  B as ShimmerButton,
+  d as QRCode,
+  y as ShimmerButton,
   J as SparklesText,
   S as TextAnimate,
-  F as TxtEditor,
+  E as TxtEditor,
   f as TxtReader,
   n as TypingAnimation,
   j as confetti,
-  w as dockVariants,
-  l as useStayTimeReport
+  V as dockVariants,
+  T as useStayTimeReport
 };

package/dist/es/node_modules/.pnpm/react-force-graph-3d@1.28.0_react@19.1.0/node_modules/react-force-graph-3d/dist/react-force-graph-3d.js

@@ -1,5 +1,5 @@
 import t from "../../../../react-kapsule@2.5.7_react@19.1.0/node_modules/react-kapsule/dist/react-kapsule.js";
-import c from "../../../../3d-force-graph@1.78.2/node_modules/3d-force-graph/dist/3d-force-graph.js";
+import c from "../../../../3d-force-graph@1.78.3/node_modules/3d-force-graph/dist/3d-force-graph.js";
 import n from "../../../../../../_virtual/index.js";
 const e = {
   width: n.number,

package/dist/es/node_modules/.pnpm/three-forcegraph@1.43.0_three@0.178.0/node_modules/three-forcegraph/dist/three-forcegraph.js

@@ -644,7 +644,7 @@ var l = window.THREE ? window.THREE : {
                     p.geometry.getAttribute("position").array.length !== L.length * 3 && p.geometry[ce]("position", new l.BufferAttribute(new Float32Array(L.length * 3), 3)), p.geometry.setFromPoints(L);
                   } else {
                     var D = p.geometry.getAttribute("position");
-                    (!D || !D.array || D.array.length !== 6) && p.geometry[ce]("position", D = new l.BufferAttribute(new Float32Array(2 * 3), 3)), D.array[0] = h.x, D.array[1] = h.y || 0, D.array[2] = h.z || 0, D.array[3] = O.x, D.array[4] = O.y || 0, D.array[5] = O.z || 0, D.needsUpdate = !0;
+                    (!D || !D.array || D.array.length !== 6) && p.geometry[ce]("position", D = new l.BufferAttribute(new Float32Array(6), 3)), D.array[0] = h.x, D.array[1] = h.y || 0, D.array[2] = h.z || 0, D.array[3] = O.x, D.array[4] = O.y || 0, D.array[5] = O.z || 0, D.needsUpdate = !0;
                   }
                   p.geometry.computeBoundingSphere();
                 } else if (p.type === "Mesh")
@@ -870,7 +870,7 @@ var l = window.THREE ? window.THREE : {
             M = new l.Mesh();
           else {
             var T = new l.BufferGeometry();
-            T[ce]("position", new l.BufferAttribute(new Float32Array(2 * 3), 3)), M = new l.Line(T);
+            T[ce]("position", new l.BufferAttribute(new Float32Array(6), 3)), M = new l.Line(T);
           }
         }
         var A;