@pelatform/ui 1.5.2 → 1.5.3

package/css/components/image-input.css

@@ -8,7 +8,7 @@
   }
 
   .pf-image-input-remove {
-    @apply bg-background border-border end-0.25 top-0.25 absolute z-1 flex size-5 cursor-pointer items-center justify-center rounded-full border shadow-sm;
+    @apply bg-background border-border end-px top-px absolute z-1 flex size-5 cursor-pointer items-center justify-center rounded-full border shadow-sm;
 
     i {
       @apply text-muted-foreground text-[11px];

package/dist/animation.cjs

@@ -3,10 +3,13 @@
 
 
 
+var _chunkZBO5IAMAcjs = require('./chunk-ZBO5IAMA.cjs');
+
+
 var _chunkCJXIPSTGcjs = require('./chunk-CJXIPSTG.cjs');
 
 // src/ui/animation/avatar-group.tsx
-var _react = require('react'); var React = _interopRequireWildcard(_react); var React3 = _interopRequireWildcard(_react); var React4 = _interopRequireWildcard(_react); var React6 = _interopRequireWildcard(_react); var React7 = _interopRequireWildcard(_react);
+var _react = require('react'); var React = _interopRequireWildcard(_react); var React3 = _interopRequireWildcard(_react); var React5 = _interopRequireWildcard(_react); var React6 = _interopRequireWildcard(_react);
 
 
 
@@ -665,193 +668,6 @@ function GridBackground({
   );
 }
 
-// src/ui/animation/hover-background.tsx
-
-
-
-function HoverBackground({
-  className,
-  objectCount = 12,
-  children,
-  colors = {},
-  ...props
-}) {
-  const {
-    background = "bg-gradient-to-br from-slate-900 via-purple-900 to-slate-900",
-    objects = [
-      "bg-cyan-400/20",
-      "bg-purple-400/20",
-      "bg-fuchsia-400/20",
-      "bg-violet-400/20",
-      "bg-blue-400/20",
-      "bg-indigo-400/20"
-    ],
-    glow = "shadow-cyan-400/50"
-  } = colors;
-  const [isHovered, setIsHovered] = React4.useState(false);
-  const mouseX = _react2.useMotionValue.call(void 0, 0);
-  const mouseY = _react2.useMotionValue.call(void 0, 0);
-  const springX = _react2.useSpring.call(void 0, mouseX, {
-    stiffness: 300,
-    damping: 30,
-    // Slower return to center when hover ends
-    restSpeed: 0.1,
-    restDelta: 0.1
-  });
-  const springY = _react2.useSpring.call(void 0, mouseY, {
-    stiffness: 300,
-    damping: 30,
-    restSpeed: 0.1,
-    restDelta: 0.1
-  });
-  const animatedObjects = React4.useMemo(
-    () => Array.from({ length: objectCount }, (_, i) => {
-      const shape = Math.random() > 0.5 ? "circle" : "square";
-      return {
-        id: i,
-        x: Math.random() * 90 + 5,
-        // 5-95% to avoid edges
-        y: Math.random() * 90 + 5,
-        size: Math.random() * 60 + 20,
-        // 20-80px
-        color: objects[i % objects.length],
-        delay: Math.random() * 2,
-        shape,
-        floatDirection: Math.random() > 0.5 ? 1 : -1,
-        breathDuration: Math.random() * 3 + 3,
-        // 3-6 seconds
-        parallaxStrength: Math.random() * 0.5 + 0.3,
-        // 0.3-0.8 for more varied parallax depth
-        baseRotation: Math.random() * 360
-        // Random starting rotation offset
-      };
-    }),
-    [objectCount, objects]
-  );
-  const handleMouseMove = (event) => {
-    if (!isHovered) return;
-    const rect = event.currentTarget.getBoundingClientRect();
-    const centerX = rect.width / 2;
-    const centerY = rect.height / 2;
-    const x = (event.clientX - rect.left - centerX) / centerX;
-    const y = (event.clientY - rect.top - centerY) / centerY;
-    mouseX.set(x * 15);
-    mouseY.set(y * 15);
-  };
-  const handleHoverStart = () => {
-    setIsHovered(true);
-  };
-  const handleHoverEnd = () => {
-    setIsHovered(false);
-    mouseX.set(0);
-    mouseY.set(0);
-  };
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _react2.motion.div,
-    {
-      "data-slot": "hover-background",
-      className: _chunkCJXIPSTGcjs.cn.call(void 0, "relative size-full overflow-hidden", background, className),
-      onHoverStart: handleHoverStart,
-      onHoverEnd: handleHoverEnd,
-      onMouseMove: handleMouseMove,
-      whileHover: { scale: 1.02 },
-      transition: { duration: 0.3, ease: "easeOut" },
-      animate: {
-        backgroundPosition: ["0% 50%", "100% 50%", "0% 50%"]
-      },
-      style: {
-        backgroundSize: "200% 200%"
-      },
-      ...props,
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _react2.motion.div,
-          {
-            className: "absolute inset-0 bg-gradient-radial from-white/5 via-transparent to-transparent",
-            animate: {
-              opacity: [0.3, 0.6, 0.3],
-              scale: [1, 1.1, 1]
-            },
-            transition: {
-              duration: 4,
-              repeat: Infinity,
-              ease: "easeInOut"
-            }
-          }
-        ),
-        animatedObjects.map((obj) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _react2.motion.div,
-          {
-            className: _chunkCJXIPSTGcjs.cn.call(void 0, 
-              "absolute border border-white/10 backdrop-blur-sm",
-              obj.color,
-              obj.shape === "circle" ? "rounded-full" : "rotate-45 rounded-lg"
-            ),
-            style: {
-              left: `${obj.x}%`,
-              top: `${obj.y}%`,
-              width: obj.size,
-              height: obj.size,
-              // Apply parallax with individual object strength
-              x: springX.get() * obj.parallaxStrength,
-              y: springY.get() * obj.parallaxStrength
-            },
-            initial: {
-              scale: 0.6,
-              opacity: 0.4,
-              rotate: obj.baseRotation
-            },
-            animate: {
-              // Default state animations - breathing with base rotation offset
-              scale: [0.6, 0.8, 0.6],
-              opacity: [0.4, 0.6, 0.4],
-              rotate: obj.shape === "circle" ? [obj.baseRotation, obj.baseRotation + 10, obj.baseRotation] : [obj.baseRotation, obj.baseRotation + 5, obj.baseRotation],
-              y: [0, obj.floatDirection * 15, 0],
-              x: [0, obj.floatDirection * 8, 0]
-            },
-            transition: {
-              duration: obj.breathDuration,
-              delay: obj.delay,
-              ease: "easeInOut",
-              repeat: Infinity,
-              repeatType: "reverse"
-            },
-            whileHover: {
-              scale: 1.5,
-              boxShadow: `0 0 30px ${glow.replace("shadow-", "").replace("/50", "")}`
-            }
-          },
-          obj.id
-        )),
-        isHovered && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "pointer-events-none absolute inset-0", children: Array.from({ length: 20 }).map((_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _react2.motion.div,
-          {
-            className: "absolute h-1 w-1 rounded-full bg-white/60",
-            style: {
-              left: `${Math.random() * 100}%`,
-              top: `${Math.random() * 100}%`
-            },
-            initial: { opacity: 0, scale: 0 },
-            animate: {
-              opacity: [0, 1, 0],
-              scale: [0, 1, 0],
-              y: [0, -50, -100]
-            },
-            transition: {
-              duration: 3,
-              delay: Math.random() * 2,
-              repeat: Infinity,
-              ease: "easeOut"
-            }
-          },
-          `particle-${i}`
-        )) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "relative z-10 size-full", children })
-      ]
-    }
-  );
-}
-
 // src/ui/animation/marquee.tsx
 
 
@@ -1104,8 +920,8 @@ function SvgText({
 }) {
   const textRef = _react.useRef.call(void 0, null);
   const [textDimensions, setTextDimensions] = _react.useState.call(void 0, { width: 0, height: 0 });
-  const content = React6.Children.toArray(children).join("");
-  const maskId = React6.useId();
+  const content = React5.Children.toArray(children).join("");
+  const maskId = React5.useId();
   _react.useEffect.call(void 0, () => {
     if (!textRef.current) return;
     const updateDimensions = () => {
@@ -1681,7 +1497,7 @@ function VideoText({
     };
   }, [fontSize, fontWeight]);
   const sources = Array.isArray(src) ? src : [src];
-  const content = React7.Children.toArray(children).join("");
+  const content = React6.Children.toArray(children).join("");
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     Component,
     {
@@ -1933,4 +1749,4 @@ function WordRotate({
 
 
 
-exports.AvatarGroup = AvatarGroup; exports.AvatarGroupItem = AvatarGroupItem; exports.AvatarGroupTooltip = AvatarGroupTooltip; exports.CountingNumber = CountingNumber; exports.GithubButton = GithubButton; exports.GradientBackground = GradientBackground; exports.GridBackground = GridBackground; exports.HoverBackground = HoverBackground; exports.Marquee = Marquee; exports.ShimmeringText = ShimmeringText; exports.SlidingNumber = SlidingNumber; exports.SvgText = SvgText; exports.TextReveal = TextReveal; exports.TypingText = TypingText; exports.VideoText = VideoText; exports.WordRotate = WordRotate; exports.githubButtonVariants = githubButtonVariants;
+exports.AvatarGroup = AvatarGroup; exports.AvatarGroupItem = AvatarGroupItem; exports.AvatarGroupTooltip = AvatarGroupTooltip; exports.CountingNumber = CountingNumber; exports.GithubButton = GithubButton; exports.GradientBackground = GradientBackground; exports.GridBackground = GridBackground; exports.HoverBackground = _chunkZBO5IAMAcjs.HoverBackground; exports.Marquee = Marquee; exports.ShimmeringText = ShimmeringText; exports.SlidingNumber = SlidingNumber; exports.SvgText = SvgText; exports.TextReveal = TextReveal; exports.TypingText = TypingText; exports.VideoText = VideoText; exports.WordRotate = WordRotate; exports.githubButtonVariants = githubButtonVariants;