@arolariu/components 0.1.2 → 0.3.0

package/dist/components/ui/hole-background.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\hole-background.js","sources":["webpack://@arolariu/components/./src/components/ui/hole-background.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { motion } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface HoleBackgroundProps extends React.HTMLAttributes<HTMLCanvasElement> {\n  strokeColor?: string;\n  numberOfLines?: number;\n  numberOfDiscs?: number;\n  particleRGBColor?: [number, number, number];\n}\n\nconst HoleBackground = React.forwardRef<HTMLCanvasElement, HoleBackgroundProps>(\n  (\n    {\n      strokeColor = \"#737373\",\n      numberOfLines = 50,\n      numberOfDiscs = 50,\n      particleRGBColor = [255, 255, 255],\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const canvasRef = React.useRef<HTMLCanvasElement>(null);\n    React.useImperativeHandle(\n      ref,\n      () => canvasRef.current as HTMLCanvasElement,\n    );\n\n    const animationFrameIdRef = React.useRef<number>(0);\n    const stateRef = React.useRef<any>({\n      discs: [] as any[],\n      lines: [] as any[],\n      particles: [] as any[],\n      clip: {},\n      startDisc: {},\n      endDisc: {},\n      rect: { width: 0, height: 0 },\n      render: { width: 0, height: 0, dpi: 1 },\n      particleArea: {},\n      linesCanvas: null,\n    });\n\n    const linear = (p: number) => p;\n    const easeInExpo = (p: number) => (p === 0 ? 0 : Math.pow(2, 10 * (p - 1)));\n\n    const tweenValue = React.useCallback(\n      (start: number, end: number, p: number, ease: \"inExpo\" | null = null) => {\n        const delta = end - start;\n        const easeFn = ease === \"inExpo\" ? easeInExpo : linear;\n        return start + delta * easeFn(p);\n      },\n      [],\n    );\n\n    const tweenDisc = React.useCallback(\n      (disc: any) => {\n        const { startDisc, endDisc } = stateRef.current;\n        disc.x = tweenValue(startDisc.x, endDisc.x, disc.p);\n        disc.y = tweenValue(startDisc.y, endDisc.y, disc.p, \"inExpo\");\n        disc.w = tweenValue(startDisc.w, endDisc.w, disc.p);\n        disc.h = tweenValue(startDisc.h, endDisc.h, disc.p);\n      },\n      [tweenValue],\n    );\n\n    const setSize = React.useCallback(() => {\n      const canvas = canvasRef.current;\n      if (!canvas) return;\n      const rect = canvas.getBoundingClientRect();\n      stateRef.current.rect = { width: rect.width, height: rect.height };\n      stateRef.current.render = {\n        width: rect.width,\n        height: rect.height,\n        dpi: window.devicePixelRatio || 1,\n      };\n      canvas.width =\n        stateRef.current.render.width * stateRef.current.render.dpi;\n      canvas.height =\n        stateRef.current.render.height * stateRef.current.render.dpi;\n    }, []);\n\n    const setDiscs = React.useCallback(() => {\n      const { width, height } = stateRef.current.rect;\n      stateRef.current.discs = [];\n      stateRef.current.startDisc = {\n        x: width * 0.5,\n        y: height * 0.45,\n        w: width * 0.75,\n        h: height * 0.7,\n      };\n      stateRef.current.endDisc = {\n        x: width * 0.5,\n        y: height * 0.95,\n        w: 0,\n        h: 0,\n      };\n      let prevBottom = height;\n      stateRef.current.clip = {};\n      for (let i = 0; i < numberOfDiscs; i++) {\n        const p = i / numberOfDiscs;\n        const disc = { p, x: 0, y: 0, w: 0, h: 0 };\n        tweenDisc(disc);\n        const bottom = disc.y + disc.h;\n        if (bottom <= prevBottom) {\n          stateRef.current.clip = { disc: { ...disc }, i };\n        }\n        prevBottom = bottom;\n        stateRef.current.discs.push(disc);\n      }\n      const clipPath = new Path2D();\n      const disc = stateRef.current.clip.disc;\n      clipPath.ellipse(disc.x, disc.y, disc.w, disc.h, 0, 0, Math.PI * 2);\n      clipPath.rect(disc.x - disc.w, 0, disc.w * 2, disc.y);\n      stateRef.current.clip.path = clipPath;\n    }, [tweenDisc]);\n\n    const setLines = React.useCallback(() => {\n      const { width, height } = stateRef.current.rect;\n      stateRef.current.lines = [];\n      const linesAngle = (Math.PI * 2) / numberOfLines;\n      for (let i = 0; i < numberOfLines; i++) {\n        stateRef.current.lines.push([]);\n      }\n      stateRef.current.discs.forEach((disc: any) => {\n        for (let i = 0; i < numberOfLines; i++) {\n          const angle = i * linesAngle;\n          const p = {\n            x: disc.x + Math.cos(angle) * disc.w,\n            y: disc.y + Math.sin(angle) * disc.h,\n          };\n          stateRef.current.lines[i].push(p);\n        }\n      });\n      const offCanvas = document.createElement(\"canvas\");\n      offCanvas.width = width;\n      offCanvas.height = height;\n      const ctx = offCanvas.getContext(\"2d\");\n      if (!ctx) return;\n      stateRef.current.lines.forEach((line: any) => {\n        ctx.save();\n        let lineIsIn = false;\n        line.forEach((p1: any, j: number) => {\n          if (j === 0) return;\n          const p0 = line[j - 1];\n          if (\n            !lineIsIn &&\n            (ctx.isPointInPath(stateRef.current.clip.path, p1.x, p1.y) ||\n              ctx.isPointInStroke(stateRef.current.clip.path, p1.x, p1.y))\n          ) {\n            lineIsIn = true;\n          } else if (lineIsIn) {\n            ctx.clip(stateRef.current.clip.path);\n          }\n          ctx.beginPath();\n          ctx.moveTo(p0.x, p0.y);\n          ctx.lineTo(p1.x, p1.y);\n          ctx.strokeStyle = strokeColor;\n          ctx.lineWidth = 2;\n          ctx.stroke();\n          ctx.closePath();\n        });\n        ctx.restore();\n      });\n      stateRef.current.linesCanvas = offCanvas;\n    }, [strokeColor]);\n\n    const initParticle = React.useCallback((start: boolean = false) => {\n      const sx =\n        stateRef.current.particleArea.sx +\n        stateRef.current.particleArea.sw * Math.random();\n      const ex =\n        stateRef.current.particleArea.ex +\n        stateRef.current.particleArea.ew * Math.random();\n      const dx = ex - sx;\n      const y = start\n        ? stateRef.current.particleArea.h * Math.random()\n        : stateRef.current.particleArea.h;\n      const r = 0.5 + Math.random() * 4;\n      const vy = 0.5 + Math.random();\n      return {\n        x: sx,\n        sx,\n        dx,\n        y,\n        vy,\n        p: 0,\n        r,\n        c: `rgba(${particleRGBColor[0]}, ${particleRGBColor[1]}, ${\n          particleRGBColor[2]\n        }, ${Math.random()})`,\n      };\n    }, []);\n\n    const setParticles = React.useCallback(() => {\n      const { width, height } = stateRef.current.rect;\n      stateRef.current.particles = [];\n      const disc = stateRef.current.clip.disc;\n      stateRef.current.particleArea = {\n        sw: disc.w * 0.5,\n        ew: disc.w * 2,\n        h: height * 0.85,\n      };\n      stateRef.current.particleArea.sx =\n        (width - stateRef.current.particleArea.sw) / 2;\n      stateRef.current.particleArea.ex =\n        (width - stateRef.current.particleArea.ew) / 2;\n      const totalParticles = 100;\n      for (let i = 0; i < totalParticles; i++) {\n        stateRef.current.particles.push(initParticle(true));\n      }\n    }, [initParticle]);\n\n    const drawDiscs = React.useCallback(\n      (ctx: CanvasRenderingContext2D) => {\n        ctx.strokeStyle = strokeColor;\n        ctx.lineWidth = 2;\n        const outerDisc = stateRef.current.startDisc;\n        ctx.beginPath();\n        ctx.ellipse(\n          outerDisc.x,\n          outerDisc.y,\n          outerDisc.w,\n          outerDisc.h,\n          0,\n          0,\n          Math.PI * 2,\n        );\n        ctx.stroke();\n        ctx.closePath();\n        stateRef.current.discs.forEach((disc: any, i: number) => {\n          if (i % 5 !== 0) return;\n          if (disc.w < stateRef.current.clip.disc.w - 5) {\n            ctx.save();\n            ctx.clip(stateRef.current.clip.path);\n          }\n          ctx.beginPath();\n          ctx.ellipse(disc.x, disc.y, disc.w, disc.h, 0, 0, Math.PI * 2);\n          ctx.stroke();\n          ctx.closePath();\n          if (disc.w < stateRef.current.clip.disc.w - 5) {\n            ctx.restore();\n          }\n        });\n      },\n      [strokeColor],\n    );\n\n    const drawLines = React.useCallback((ctx: CanvasRenderingContext2D) => {\n      if (stateRef.current.linesCanvas) {\n        ctx.drawImage(stateRef.current.linesCanvas, 0, 0);\n      }\n    }, []);\n\n    const drawParticles = React.useCallback((ctx: CanvasRenderingContext2D) => {\n      ctx.save();\n      ctx.clip(stateRef.current.clip.path);\n      stateRef.current.particles.forEach((particle: any) => {\n        ctx.fillStyle = particle.c;\n        ctx.beginPath();\n        ctx.rect(particle.x, particle.y, particle.r, particle.r);\n        ctx.closePath();\n        ctx.fill();\n      });\n      ctx.restore();\n    }, []);\n\n    const moveDiscs = React.useCallback(() => {\n      stateRef.current.discs.forEach((disc: any) => {\n        disc.p = (disc.p + 0.001) % 1;\n        tweenDisc(disc);\n      });\n    }, [tweenDisc]);\n\n    const moveParticles = React.useCallback(() => {\n      stateRef.current.particles.forEach((particle: any, idx: number) => {\n        particle.p = 1 - particle.y / stateRef.current.particleArea.h;\n        particle.x = particle.sx + particle.dx * particle.p;\n        particle.y -= particle.vy;\n        if (particle.y < 0) {\n          stateRef.current.particles[idx] = initParticle();\n        }\n      });\n    }, [initParticle]);\n\n    const tick = React.useCallback(() => {\n      const canvas = canvasRef.current;\n      if (!canvas) return;\n      const ctx = canvas.getContext(\"2d\");\n      if (!ctx) return;\n      ctx.clearRect(0, 0, canvas.width, canvas.height);\n      ctx.save();\n      ctx.scale(stateRef.current.render.dpi, stateRef.current.render.dpi);\n      moveDiscs();\n      moveParticles();\n      drawDiscs(ctx);\n      drawLines(ctx);\n      drawParticles(ctx);\n      ctx.restore();\n      animationFrameIdRef.current = requestAnimationFrame(tick);\n    }, [moveDiscs, moveParticles, drawDiscs, drawLines, drawParticles]);\n\n    const init = React.useCallback(() => {\n      setSize();\n      setDiscs();\n      setLines();\n      setParticles();\n    }, [setSize, setDiscs, setLines, setParticles]);\n\n    React.useEffect(() => {\n      const canvas = canvasRef.current;\n      if (!canvas) return;\n      init();\n      tick();\n      const handleResize = () => {\n        setSize();\n        setDiscs();\n        setLines();\n        setParticles();\n      };\n      window.addEventListener(\"resize\", handleResize);\n      return () => {\n        window.removeEventListener(\"resize\", handleResize);\n        cancelAnimationFrame(animationFrameIdRef.current);\n      };\n    }, [init, tick, setSize, setDiscs, setLines, setParticles]);\n\n    return (\n      <div\n        className={cn(\n          \"relative size-full overflow-hidden\",\n          'before:content-[\"\"] before:absolute before:top-1/2 before:left-1/2 before:block before:size-[140%] dark:before:[background:radial-gradient(ellipse_at_50%_55%,transparent_10%,black_50%)] before:[background:radial-gradient(ellipse_at_50%_55%,transparent_10%,white_50%)] before:[transform:translate3d(-50%,-50%,0)]',\n          'after:content-[\"\"] after:absolute after:z-[5] after:top-1/2 after:left-1/2 after:block after:size-full after:[background:radial-gradient(ellipse_at_50%_75%,#a900ff_20%,transparent_75%)] after:[transform:translate3d(-50%,-50%,0)] after:mix-blend-overlay',\n          className,\n        )}\n      >\n        {children}\n        <canvas\n          ref={canvasRef}\n          className=\"absolute inset-0 block size-full dark:opacity-20 opacity-10\"\n          {...props}\n        />\n        <motion.div\n          className={cn(\n            \"absolute top-[-71.5%] left-1/2 z-[3] w-[30%] h-[140%] rounded-b-full blur-3xl opacity-75 dark:mix-blend-plus-lighter mix-blend-plus-darker [transform:translate3d(-50%,0,0)] [background-position:0%_100%] [background-size:100%_200%]\",\n            \"dark:[background:linear-gradient(20deg,#00f8f1,#ffbd1e20_16.5%,#fe848f_33%,#fe848f20_49.5%,#00f8f1_66%,#00f8f160_85.5%,#ffbd1e_100%)_0_100%_/_100%_200%] [background:linear-gradient(20deg,#00f8f1,#ffbd1e40_16.5%,#fe848f_33%,#fe848f40_49.5%,#00f8f1_66%,#00f8f180_85.5%,#ffbd1e_100%)_0_100%_/_100%_200%]\",\n          )}\n          animate={{ backgroundPosition: \"0% 300%\" }}\n          transition={{ duration: 5, ease: \"linear\", repeat: Infinity }}\n        />\n        <div className=\"absolute top-0 left-0 z-[7] size-full dark:[background:repeating-linear-gradient(transparent,transparent_1px,white_1px,white_2px)] mix-blend-overlay opacity-50\" />\n      </div>\n    );\n  },\n);\n\nexport { HoleBackground, type HoleBackgroundProps };\n"],"names":["HoleBackground","React","strokeColor","numberOfLines","numberOfDiscs","particleRGBColor","className","children","props","ref","canvasRef","animationFrameIdRef","stateRef","linear","p","easeInExpo","Math","tweenValue","start","end","ease","delta","easeFn","tweenDisc","disc","startDisc","endDisc","setSize","canvas","rect","window","setDiscs","width","height","prevBottom","i","bottom","clipPath","Path2D","setLines","linesAngle","angle","offCanvas","document","ctx","line","lineIsIn","p1","j","p0","initParticle","sx","ex","dx","y","r","vy","setParticles","totalParticles","drawDiscs","outerDisc","drawLines","drawParticles","particle","moveDiscs","moveParticles","idx","tick","requestAnimationFrame","init","handleResize","cancelAnimationFrame","cn","motion","Infinity"],"mappings":"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"}
+{"version":3,"file":"components\\ui\\hole-background.js","sources":["webpack://@arolariu/components/./src/components/ui/hole-background.tsx"],"sourcesContent":["\r\n\r\nimport {motion} from \"motion/react\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\ninterface HoleBackgroundProps extends React.HTMLAttributes<HTMLCanvasElement> {\r\n  strokeColor?: string;\r\n  numberOfLines?: number;\r\n  numberOfDiscs?: number;\r\n  particleRGBColor?: [number, number, number];\r\n}\r\n\r\nconst linear = (p: number) => p;\r\nconst easeInExpo = (p: number) => (p === 0 ? 0 : 2 ** (10 * (p - 1)));\r\n\r\nconst HoleBackground = React.forwardRef<HTMLCanvasElement, HoleBackgroundProps>(\r\n  (\r\n    {strokeColor = \"#737373\", numberOfLines = 50, numberOfDiscs = 50, particleRGBColor = [255, 255, 255], className, children, ...props},\r\n    ref,\r\n  ) => {\r\n    const canvasRef = React.useRef<HTMLCanvasElement>(null);\r\n    React.useImperativeHandle(ref, () => canvasRef.current as HTMLCanvasElement);\r\n\r\n    const animationFrameIdRef = React.useRef<number>(0);\r\n    const stateRef = React.useRef<any>({\r\n      discs: [] as any[],\r\n      lines: [] as any[],\r\n      particles: [] as any[],\r\n      clip: {},\r\n      startDisc: {},\r\n      endDisc: {},\r\n      rect: {width: 0, height: 0},\r\n      render: {width: 0, height: 0, dpi: 1},\r\n      particleArea: {},\r\n      linesCanvas: null,\r\n    });\r\n\r\n    const tweenValue = React.useCallback((start: number, end: number, p: number, ease: \"inExpo\" | null = null) => {\r\n      const delta = end - start;\r\n      const easeFn = ease === \"inExpo\" ? easeInExpo : linear;\r\n      return start + delta * easeFn(p);\r\n    }, []);\r\n\r\n    const tweenDisc = React.useCallback(\r\n      (disc: any) => {\r\n        const {startDisc, endDisc} = stateRef.current;\r\n        disc.x = tweenValue(startDisc.x, endDisc.x, disc.p);\r\n        disc.y = tweenValue(startDisc.y, endDisc.y, disc.p, \"inExpo\");\r\n        disc.w = tweenValue(startDisc.w, endDisc.w, disc.p);\r\n        disc.h = tweenValue(startDisc.h, endDisc.h, disc.p);\r\n      },\r\n      [tweenValue],\r\n    );\r\n\r\n    const setSize = React.useCallback(() => {\r\n      const canvas = canvasRef.current;\r\n      if (!canvas) return;\r\n      const rect = canvas.getBoundingClientRect();\r\n      stateRef.current.rect = {width: rect.width, height: rect.height};\r\n      stateRef.current.render = {\r\n        width: rect.width,\r\n        height: rect.height,\r\n        dpi: window.devicePixelRatio || 1,\r\n      };\r\n      canvas.width = stateRef.current.render.width * stateRef.current.render.dpi;\r\n      canvas.height = stateRef.current.render.height * stateRef.current.render.dpi;\r\n    }, []);\r\n\r\n    const setDiscs = React.useCallback(() => {\r\n      const {width, height} = stateRef.current.rect;\r\n      stateRef.current.discs = [];\r\n      stateRef.current.startDisc = {\r\n        x: width * 0.5,\r\n        y: height * 0.45,\r\n        w: width * 0.75,\r\n        h: height * 0.7,\r\n      };\r\n      stateRef.current.endDisc = {\r\n        x: width * 0.5,\r\n        y: height * 0.95,\r\n        w: 0,\r\n        h: 0,\r\n      };\r\n      let prevBottom = height;\r\n      stateRef.current.clip = {};\r\n      for (let i = 0; i < numberOfDiscs; i++) {\r\n        const p = i / numberOfDiscs;\r\n        const disc = {p, x: 0, y: 0, w: 0, h: 0};\r\n        tweenDisc(disc);\r\n        const bottom = disc.y + disc.h;\r\n        if (bottom <= prevBottom) {\r\n          stateRef.current.clip = {disc: {...disc}, i};\r\n        }\r\n        prevBottom = bottom;\r\n        stateRef.current.discs.push(disc);\r\n      }\r\n      const clipPath = new Path2D();\r\n      const {disc} = stateRef.current.clip;\r\n      clipPath.ellipse(disc.x, disc.y, disc.w, disc.h, 0, 0, Math.PI * 2);\r\n      clipPath.rect(disc.x - disc.w, 0, disc.w * 2, disc.y);\r\n      stateRef.current.clip.path = clipPath;\r\n    }, [tweenDisc]);\r\n\r\n    const setLines = React.useCallback(() => {\r\n      const {width, height} = stateRef.current.rect;\r\n      stateRef.current.lines = [];\r\n      const linesAngle = (Math.PI * 2) / numberOfLines;\r\n      for (let i = 0; i < numberOfLines; i++) {\r\n        stateRef.current.lines.push([]);\r\n      }\r\n      stateRef.current.discs.forEach((disc: any) => {\r\n        for (let i = 0; i < numberOfLines; i++) {\r\n          const angle = i * linesAngle;\r\n          const p = {\r\n            x: disc.x + Math.cos(angle) * disc.w,\r\n            y: disc.y + Math.sin(angle) * disc.h,\r\n          };\r\n          stateRef.current.lines[i].push(p);\r\n        }\r\n      });\r\n      const offCanvas = document.createElement(\"canvas\");\r\n      offCanvas.width = width;\r\n      offCanvas.height = height;\r\n      const ctx = offCanvas.getContext(\"2d\");\r\n      if (!ctx) return;\r\n      stateRef.current.lines.forEach((line: any) => {\r\n        ctx.save();\r\n        let lineIsIn = false;\r\n        line.forEach((p1: any, j: number) => {\r\n          if (j === 0) return;\r\n          const p0 = line[j - 1];\r\n          if (\r\n            !lineIsIn\r\n            && (ctx.isPointInPath(stateRef.current.clip.path, p1.x, p1.y) || ctx.isPointInStroke(stateRef.current.clip.path, p1.x, p1.y))\r\n          ) {\r\n            lineIsIn = true;\r\n          } else if (lineIsIn) {\r\n            ctx.clip(stateRef.current.clip.path);\r\n          }\r\n          ctx.beginPath();\r\n          ctx.moveTo(p0.x, p0.y);\r\n          ctx.lineTo(p1.x, p1.y);\r\n          ctx.strokeStyle = strokeColor;\r\n          ctx.lineWidth = 2;\r\n          ctx.stroke();\r\n          ctx.closePath();\r\n        });\r\n        ctx.restore();\r\n      });\r\n      stateRef.current.linesCanvas = offCanvas;\r\n    }, [strokeColor]);\r\n\r\n    const initParticle = React.useCallback((start: boolean = false) => {\r\n      const sx = stateRef.current.particleArea.sx + stateRef.current.particleArea.sw * Math.random();\r\n      const ex = stateRef.current.particleArea.ex + stateRef.current.particleArea.ew * Math.random();\r\n      const dx = ex - sx;\r\n      const y = start ? stateRef.current.particleArea.h * Math.random() : stateRef.current.particleArea.h;\r\n      const r = 0.5 + Math.random() * 4;\r\n      const vy = 0.5 + Math.random();\r\n      return {\r\n        x: sx,\r\n        sx,\r\n        dx,\r\n        y,\r\n        vy,\r\n        p: 0,\r\n        r,\r\n        c: `rgba(${particleRGBColor[0]}, ${particleRGBColor[1]}, ${particleRGBColor[2]}, ${Math.random()})`,\r\n      };\r\n    }, []);\r\n\r\n    const setParticles = React.useCallback(() => {\r\n      const {width, height} = stateRef.current.rect;\r\n      stateRef.current.particles = [];\r\n      const {disc} = stateRef.current.clip;\r\n      stateRef.current.particleArea = {\r\n        sw: disc.w * 0.5,\r\n        ew: disc.w * 2,\r\n        h: height * 0.85,\r\n      };\r\n      stateRef.current.particleArea.sx = (width - stateRef.current.particleArea.sw) / 2;\r\n      stateRef.current.particleArea.ex = (width - stateRef.current.particleArea.ew) / 2;\r\n      const totalParticles = 100;\r\n      for (let i = 0; i < totalParticles; i++) {\r\n        stateRef.current.particles.push(initParticle(true));\r\n      }\r\n    }, [initParticle]);\r\n\r\n    const drawDiscs = React.useCallback(\r\n      (ctx: CanvasRenderingContext2D) => {\r\n        ctx.strokeStyle = strokeColor;\r\n        ctx.lineWidth = 2;\r\n        const outerDisc = stateRef.current.startDisc;\r\n        ctx.beginPath();\r\n        ctx.ellipse(outerDisc.x, outerDisc.y, outerDisc.w, outerDisc.h, 0, 0, Math.PI * 2);\r\n        ctx.stroke();\r\n        ctx.closePath();\r\n        stateRef.current.discs.forEach((disc: any, i: number) => {\r\n          if (i % 5 !== 0) return;\r\n          if (disc.w < stateRef.current.clip.disc.w - 5) {\r\n            ctx.save();\r\n            ctx.clip(stateRef.current.clip.path);\r\n          }\r\n          ctx.beginPath();\r\n          ctx.ellipse(disc.x, disc.y, disc.w, disc.h, 0, 0, Math.PI * 2);\r\n          ctx.stroke();\r\n          ctx.closePath();\r\n          if (disc.w < stateRef.current.clip.disc.w - 5) {\r\n            ctx.restore();\r\n          }\r\n        });\r\n      },\r\n      [strokeColor],\r\n    );\r\n\r\n    const drawLines = React.useCallback((ctx: CanvasRenderingContext2D) => {\r\n      if (stateRef.current.linesCanvas) {\r\n        ctx.drawImage(stateRef.current.linesCanvas, 0, 0);\r\n      }\r\n    }, []);\r\n\r\n    const drawParticles = React.useCallback((ctx: CanvasRenderingContext2D) => {\r\n      ctx.save();\r\n      ctx.clip(stateRef.current.clip.path);\r\n      stateRef.current.particles.forEach((particle: any) => {\r\n        ctx.fillStyle = particle.c;\r\n        ctx.beginPath();\r\n        ctx.rect(particle.x, particle.y, particle.r, particle.r);\r\n        ctx.closePath();\r\n        ctx.fill();\r\n      });\r\n      ctx.restore();\r\n    }, []);\r\n\r\n    const moveDiscs = React.useCallback(() => {\r\n      stateRef.current.discs.forEach((disc: any) => {\r\n        disc.p = (disc.p + 0.001) % 1;\r\n        tweenDisc(disc);\r\n      });\r\n    }, [tweenDisc]);\r\n\r\n    const moveParticles = React.useCallback(() => {\r\n      stateRef.current.particles.forEach((particle: any, idx: number) => {\r\n        particle.p = 1 - particle.y / stateRef.current.particleArea.h;\r\n        particle.x = particle.sx + particle.dx * particle.p;\r\n        particle.y -= particle.vy;\r\n        if (particle.y < 0) {\r\n          stateRef.current.particles[idx] = initParticle();\r\n        }\r\n      });\r\n    }, [initParticle]);\r\n\r\n    const tick = React.useCallback(() => {\r\n      const canvas = canvasRef.current;\r\n      if (!canvas) return;\r\n      const ctx = canvas.getContext(\"2d\");\r\n      if (!ctx) return;\r\n      ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n      ctx.save();\r\n      ctx.scale(stateRef.current.render.dpi, stateRef.current.render.dpi);\r\n      moveDiscs();\r\n      moveParticles();\r\n      drawDiscs(ctx);\r\n      drawLines(ctx);\r\n      drawParticles(ctx);\r\n      ctx.restore();\r\n      animationFrameIdRef.current = requestAnimationFrame(tick);\r\n    }, [moveDiscs, moveParticles, drawDiscs, drawLines, drawParticles]);\r\n\r\n    const init = React.useCallback(() => {\r\n      setSize();\r\n      setDiscs();\r\n      setLines();\r\n      setParticles();\r\n    }, [setSize, setDiscs, setLines, setParticles]);\r\n\r\n    React.useEffect(() => {\r\n      const canvas = canvasRef.current;\r\n      if (!canvas) return;\r\n      init();\r\n      tick();\r\n      const handleResize = () => {\r\n        setSize();\r\n        setDiscs();\r\n        setLines();\r\n        setParticles();\r\n      };\r\n      window.addEventListener(\"resize\", handleResize);\r\n      return () => {\r\n        window.removeEventListener(\"resize\", handleResize);\r\n        cancelAnimationFrame(animationFrameIdRef.current);\r\n      };\r\n    }, [init, tick, setSize, setDiscs, setLines, setParticles]);\r\n\r\n    return (\r\n      <div\r\n        className={cn(\r\n          \"relative size-full overflow-hidden\",\r\n          'before:absolute before:top-1/2 before:left-1/2 before:block before:size-[140%] before:[transform:translate3d(-50%,-50%,0)] before:content-[\"\"] before:[background:radial-gradient(ellipse_at_50%_55%,transparent_10%,white_50%)] dark:before:[background:radial-gradient(ellipse_at_50%_55%,transparent_10%,black_50%)]',\r\n          'after:absolute after:top-1/2 after:left-1/2 after:z-[5] after:block after:size-full after:[transform:translate3d(-50%,-50%,0)] after:mix-blend-overlay after:content-[\"\"] after:[background:radial-gradient(ellipse_at_50%_75%,#a900ff_20%,transparent_75%)]',\r\n          className,\r\n        )}>\r\n        {children}\r\n        <canvas\r\n          ref={canvasRef}\r\n          className='absolute inset-0 block size-full opacity-10 dark:opacity-20'\r\n          {...props}\r\n        />\r\n        <motion.div\r\n          className={cn(\r\n            \"absolute top-[-71.5%] left-1/2 z-[3] h-[140%] w-[30%] [transform:translate3d(-50%,0,0)] rounded-b-full [background-size:100%_200%] [background-position:0%_100%] opacity-75 mix-blend-plus-darker blur-3xl dark:mix-blend-plus-lighter\",\r\n            \"[background:linear-gradient(20deg,#00f8f1,#ffbd1e40_16.5%,#fe848f_33%,#fe848f40_49.5%,#00f8f1_66%,#00f8f180_85.5%,#ffbd1e_100%)_0_100%_/_100%_200%] dark:[background:linear-gradient(20deg,#00f8f1,#ffbd1e20_16.5%,#fe848f_33%,#fe848f20_49.5%,#00f8f1_66%,#00f8f160_85.5%,#ffbd1e_100%)_0_100%_/_100%_200%]\",\r\n          )}\r\n          animate={{backgroundPosition: \"0% 300%\"}}\r\n          transition={{duration: 5, ease: \"linear\", repeat: Infinity}}\r\n        />\r\n        <div className='absolute top-0 left-0 z-[7] size-full opacity-50 mix-blend-overlay dark:[background:repeating-linear-gradient(transparent,transparent_1px,white_1px,white_2px)]' />\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nHoleBackground.displayName = \"HoleBackground\";\r\nexport {HoleBackground, type HoleBackgroundProps};\r\n"],"names":["linear","p","easeInExpo","HoleBackground","React","strokeColor","numberOfLines","numberOfDiscs","particleRGBColor","className","children","props","ref","canvasRef","animationFrameIdRef","stateRef","tweenValue","start","end","ease","delta","easeFn","tweenDisc","disc","startDisc","endDisc","setSize","canvas","rect","window","setDiscs","width","height","prevBottom","i","bottom","clipPath","Path2D","Math","setLines","linesAngle","angle","offCanvas","document","ctx","line","lineIsIn","p1","j","p0","initParticle","sx","ex","dx","y","r","vy","setParticles","totalParticles","drawDiscs","outerDisc","drawLines","drawParticles","particle","moveDiscs","moveParticles","idx","tick","requestAnimationFrame","init","handleResize","cancelAnimationFrame","cn","motion","Infinity"],"mappings":"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"}

package/dist/components/ui/hover-card.d.ts

@@ -1,7 +1,7 @@
-import * as React from "react";
 import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
-declare function HoverCard({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
-declare function HoverCardTrigger({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
-declare function HoverCardContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof HoverCardPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
-export { HoverCard, HoverCardTrigger, HoverCardContent };
+import * as React from "react";
+declare const HoverCard: React.FC<HoverCardPrimitive.HoverCardProps>;
+declare const HoverCardTrigger: React.ForwardRefExoticComponent<HoverCardPrimitive.HoverCardTriggerProps & React.RefAttributes<HTMLAnchorElement>>;
+declare const HoverCardContent: React.ForwardRefExoticComponent<Omit<HoverCardPrimitive.HoverCardContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { HoverCard, HoverCardContent, HoverCardTrigger };
 //# sourceMappingURL=hover-card.d.ts.map

package/dist/components/ui/hover-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hover-card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/hover-card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,kBAAkB,MAAM,4BAA4B,CAAC;AAIjE,iBAAS,SAAS,CAAC,EACjB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,2CAEtD;AAED,iBAAS,gBAAgB,CAAC,EACxB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,2CAIzD;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,KAAgB,EAChB,UAAc,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,2CAezD;AAED,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}
+{"version":3,"file":"hover-card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/hover-card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,kBAAkB,MAAM,4BAA4B,CAAC;AACjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,SAAS,6CAA0B,CAAC;AAE1C,QAAA,MAAM,gBAAgB,oHAA6B,CAAC;AAEpD,QAAA,MAAM,gBAAgB,oKAcpB,CAAC;AAGH,OAAO,EAAC,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAC,CAAC"}

package/dist/components/ui/hover-card.js

@@ -1,32 +1,18 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
-import "react";
-import { Content, Portal, Root, Trigger } from "@radix-ui/react-hover-card";
-import { cn } from "../../lib/utils.js";
-function HoverCard({ ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        "data-slot": "hover-card",
+import { Content, Root, Trigger } from "@radix-ui/react-hover-card";
+import { forwardRef } from "react";
+import { cn } from "../../lib/utilities.js";
+const HoverCard = Root;
+const HoverCardTrigger = Trigger;
+const HoverCardContent = /*#__PURE__*/ forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref)=>/*#__PURE__*/ jsx(Content, {
+        ref: ref,
+        align: align,
+        sideOffset: sideOffset,
+        className: cn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 origin-[--radix-hover-card-content-transform-origin] rounded-md border border-neutral-200 bg-white p-4 text-neutral-950 shadow-md outline-none dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50", className),
         ...props
-    });
-}
-function HoverCardTrigger({ ...props }) {
-    return /*#__PURE__*/ jsx(Trigger, {
-        "data-slot": "hover-card-trigger",
-        ...props
-    });
-}
-function HoverCardContent({ className, align = "center", sideOffset = 4, ...props }) {
-    return /*#__PURE__*/ jsx(Portal, {
-        "data-slot": "hover-card-portal",
-        children: /*#__PURE__*/ jsx(Content, {
-            "data-slot": "hover-card-content",
-            align: align,
-            sideOffset: sideOffset,
-            className: cn("bg-white text-neutral-950 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border border-neutral-200 p-4 shadow-md outline-hidden dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800", className),
-            ...props
-        })
-    });
-}
+    }));
+HoverCardContent.displayName = Content.displayName;
 export { HoverCard, HoverCardContent, HoverCardTrigger };
 
 //# sourceMappingURL=hover-card.js.map

package/dist/components/ui/hover-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\hover-card.js","sources":["webpack://@arolariu/components/./src/components/ui/hover-card.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as HoverCardPrimitive from \"@radix-ui/react-hover-card\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction HoverCard({\n  ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Root>) {\n  return <HoverCardPrimitive.Root data-slot=\"hover-card\" {...props} />;\n}\n\nfunction HoverCardTrigger({\n  ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Trigger>) {\n  return (\n    <HoverCardPrimitive.Trigger data-slot=\"hover-card-trigger\" {...props} />\n  );\n}\n\nfunction HoverCardContent({\n  className,\n  align = \"center\",\n  sideOffset = 4,\n  ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Content>) {\n  return (\n    <HoverCardPrimitive.Portal data-slot=\"hover-card-portal\">\n      <HoverCardPrimitive.Content\n        data-slot=\"hover-card-content\"\n        align={align}\n        sideOffset={sideOffset}\n        className={cn(\n          \"bg-white text-neutral-950 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border border-neutral-200 p-4 shadow-md outline-hidden dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800\",\n          className,\n        )}\n        {...props}\n      />\n    </HoverCardPrimitive.Portal>\n  );\n}\n\nexport { HoverCard, HoverCardTrigger, HoverCardContent };\n"],"names":["HoverCard","props","HoverCardPrimitive","HoverCardTrigger","HoverCardContent","className","align","sideOffset","cn"],"mappings":";;;;;AAOA,SAASA,UAAU,EACjB,GAAGC,OACkD;IACrD,OAAO,WAAP,GAAO,IAACC,MAAuB;QAAC,aAAU;QAAc,GAAGD,KAAK;;AAClE;AAEA,SAASE,iBAAiB,EACxB,GAAGF,OACqD;IACxD,OAAO,WAAP,GACE,IAACC,SAA0B;QAAC,aAAU;QAAsB,GAAGD,KAAK;;AAExE;AAEA,SAASG,iBAAiB,EACxBC,SAAS,EACTC,QAAQ,QAAQ,EAChBC,aAAa,CAAC,EACd,GAAGN,OACqD;IACxD,OAAO,WAAP,GACE,IAACC,QAAyB;QAAC,aAAU;kBACnC,kBAACA,SAA0B;YACzB,aAAU;YACV,OAAOI;YACP,YAAYC;YACZ,WAAWC,GACT,gjBACAH;YAED,GAAGJ,KAAK;;;AAIjB"}
+{"version":3,"file":"components\\ui\\hover-card.js","sources":["webpack://@arolariu/components/./src/components/ui/hover-card.tsx"],"sourcesContent":["\r\n\r\nimport * as HoverCardPrimitive from \"@radix-ui/react-hover-card\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst HoverCard = HoverCardPrimitive.Root;\r\n\r\nconst HoverCardTrigger = HoverCardPrimitive.Trigger;\r\n\r\nconst HoverCardContent = React.forwardRef<\r\n  React.ElementRef<typeof HoverCardPrimitive.Content>,\r\n  React.ComponentPropsWithoutRef<typeof HoverCardPrimitive.Content>\r\n>(({className, align = \"center\", sideOffset = 4, ...props}, ref) => (\r\n  <HoverCardPrimitive.Content\r\n    ref={ref}\r\n    align={align}\r\n    sideOffset={sideOffset}\r\n    className={cn(\r\n      \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 origin-[--radix-hover-card-content-transform-origin] rounded-md border border-neutral-200 bg-white p-4 text-neutral-950 shadow-md outline-none dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50\",\r\n      className,\r\n    )}\r\n    {...props}\r\n  />\r\n));\r\nHoverCardContent.displayName = HoverCardPrimitive.Content.displayName;\r\n\r\nexport {HoverCard, HoverCardContent, HoverCardTrigger};\r\n"],"names":["HoverCard","HoverCardPrimitive","HoverCardTrigger","HoverCardContent","React","className","align","sideOffset","props","ref","cn"],"mappings":";;;;;AAOA,MAAMA,YAAYC;AAElB,MAAMC,mBAAmBD;AAEzB,MAAME,mBAAmB,WAAnBA,GAAmBC,WAGvB,CAAC,EAACC,SAAS,EAAEC,QAAQ,QAAQ,EAAEC,aAAa,CAAC,EAAE,GAAGC,OAAM,EAAEC,MAAAA,WAAAA,GAC1D,IAACR,SAA0B;QACzB,KAAKQ;QACL,OAAOH;QACP,YAAYC;QACZ,WAAWG,GACT,8iBACAL;QAED,GAAGG,KAAK;;AAGbL,iBAAiB,WAAW,GAAGF,QAAAA,WAAsC"}

package/dist/components/ui/input-group.d.ts

@@ -0,0 +1,17 @@
+import { type VariantProps } from "class-variance-authority";
+import * as React from "react";
+import { Button } from "./button";
+declare function InputGroup({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare const inputGroupAddonVariants: (props?: {
+    align?: "inline-start" | "inline-end" | "block-start" | "block-end";
+} & import("class-variance-authority/types").ClassProp) => string;
+declare function InputGroupAddon({ className, align, ...props }: React.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>): import("react/jsx-runtime").JSX.Element;
+declare const inputGroupButtonVariants: (props?: {
+    size?: "sm" | "xs" | "icon-xs" | "icon-sm";
+} & import("class-variance-authority/types").ClassProp) => string;
+declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React.ComponentProps<typeof Button>, "size"> & VariantProps<typeof inputGroupButtonVariants>): import("react/jsx-runtime").JSX.Element;
+declare function InputGroupText({ className, ...props }: React.ComponentProps<"span">): import("react/jsx-runtime").JSX.Element;
+declare function InputGroupInput({ className, ...props }: React.ComponentProps<"input">): import("react/jsx-runtime").JSX.Element;
+declare function InputGroupTextarea({ className, ...props }: React.ComponentProps<"textarea">): import("react/jsx-runtime").JSX.Element;
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
+//# sourceMappingURL=input-group.d.ts.map

package/dist/components/ui/input-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["../../../src/components/ui/input-group.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,MAAM,EAAC,MAAM,wBAAwB,CAAC;AAK9C,iBAAS,UAAU,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CA0BrE;AAED,QAAA,MAAM,uBAAuB;;iEAe5B,CAAC;AAEF,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,uBAAuB,CAAC,2CAgB5E;AAED,QAAA,MAAM,wBAAwB;;iEAY5B,CAAC;AAEH,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,IAAe,EACf,OAAiB,EACjB,IAAW,EACX,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,MAAM,CAAC,GAAG,YAAY,CAAC,OAAO,wBAAwB,CAAC,2CAUnG;AAED,iBAAS,cAAc,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAU1E;AAED,iBAAS,eAAe,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,2CAQ5E;AAED,iBAAS,kBAAkB,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,2CAWlF;AAED,OAAO,EAAC,UAAU,EAAE,eAAe,EAAE,gBAAgB,EAAE,eAAe,EAAE,cAAc,EAAE,kBAAkB,EAAC,CAAC"}

package/dist/components/ui/input-group.js

@@ -0,0 +1,91 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import "react";
+import { Button } from "./button.js";
+import { Input } from "./input.js";
+import { Textarea } from "./textarea.js";
+import { cn } from "../../lib/utilities.js";
+function InputGroup({ className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        "data-slot": "input-group",
+        role: "group",
+        className: cn("group/input-group relative flex w-full items-center rounded-md border border-neutral-200 shadow-xs transition-[color,box-shadow] outline-none dark:border-neutral-800 dark:bg-neutral-200/30 dark:dark:bg-neutral-800/30", "h-9 has-[>textarea]:h-auto", "has-[>[data-align=inline-start]]:[&>input]:pl-2", "has-[>[data-align=inline-end]]:[&>input]:pr-2", "has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3", "has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3", "has-[[data-slot=input-group-control]:focus-visible]:ring-1 has-[[data-slot=input-group-control]:focus-visible]:ring-neutral-950 dark:has-[[data-slot=input-group-control]:focus-visible]:ring-neutral-300", "has-[[data-slot][aria-invalid=true]]:border-red-500 has-[[data-slot][aria-invalid=true]]:ring-red-500/20 dark:has-[[data-slot][aria-invalid=true]]:border-red-900 dark:dark:has-[[data-slot][aria-invalid=true]]:ring-red-900/40 dark:has-[[data-slot][aria-invalid=true]]:ring-red-500/40 dark:has-[[data-slot][aria-invalid=true]]:ring-red-900/20", className),
+        ...props
+    });
+}
+const inputGroupAddonVariants = cva("text-neutral-500 flex h-auto cursor-text select-none items-center justify-center gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 dark:text-neutral-400", {
+    variants: {
+        align: {
+            "inline-start": "order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]",
+            "inline-end": "order-last pr-3 has-[>button]:mr-[-0.4rem] has-[>kbd]:mr-[-0.35rem]",
+            "block-start": "[.border-b]:pb-3 order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5",
+            "block-end": "[.border-t]:pt-3 order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5"
+        }
+    },
+    defaultVariants: {
+        align: "inline-start"
+    }
+});
+function InputGroupAddon({ className, align = "inline-start", ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        role: "group",
+        "data-slot": "input-group-addon",
+        "data-align": align,
+        className: cn(inputGroupAddonVariants({
+            align
+        }), className),
+        onClick: (e)=>{
+            if (e.target.closest("button")) return;
+            e.currentTarget.parentElement?.querySelector("input")?.focus();
+        },
+        ...props
+    });
+}
+const inputGroupButtonVariants = cva("flex items-center gap-2 text-sm shadow-none", {
+    variants: {
+        size: {
+            xs: "h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg:not([class*='size-'])]:size-3.5",
+            sm: "h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5",
+            "icon-xs": "size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0",
+            "icon-sm": "size-8 p-0 has-[>svg]:p-0"
+        }
+    },
+    defaultVariants: {
+        size: "xs"
+    }
+});
+function InputGroupButton({ className, type = "button", variant = "ghost", size = "xs", ...props }) {
+    return /*#__PURE__*/ jsx(Button, {
+        type: type,
+        "data-size": size,
+        variant: variant,
+        className: cn(inputGroupButtonVariants({
+            size
+        }), className),
+        ...props
+    });
+}
+function InputGroupText({ className, ...props }) {
+    return /*#__PURE__*/ jsx("span", {
+        className: cn("flex items-center gap-2 text-sm text-neutral-500 dark:text-neutral-400 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
+        ...props
+    });
+}
+function InputGroupInput({ className, ...props }) {
+    return /*#__PURE__*/ jsx(Input, {
+        "data-slot": "input-group-control",
+        className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent", className),
+        ...props
+    });
+}
+function InputGroupTextarea({ className, ...props }) {
+    return /*#__PURE__*/ jsx(Textarea, {
+        "data-slot": "input-group-control",
+        className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent", className),
+        ...props
+    });
+}
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
+
+//# sourceMappingURL=input-group.js.map

package/dist/components/ui/input-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components\\ui\\input-group.js","sources":["webpack://@arolariu/components/./src/components/ui/input-group.tsx"],"sourcesContent":["\r\n\r\nimport {cva, type VariantProps} from \"class-variance-authority\";\r\nimport * as React from \"react\";\r\n\r\nimport {Button} from \"@/components/ui/button\";\r\nimport {Input} from \"@/components/ui/input\";\r\nimport {Textarea} from \"@/components/ui/textarea\";\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nfunction InputGroup({className, ...props}: React.ComponentProps<\"div\">) {\r\n  return (\r\n    <div\r\n      data-slot='input-group'\r\n      role='group'\r\n      className={cn(\r\n        \"group/input-group relative flex w-full items-center rounded-md border border-neutral-200 shadow-xs transition-[color,box-shadow] outline-none dark:border-neutral-800 dark:bg-neutral-200/30 dark:dark:bg-neutral-800/30\",\r\n        \"h-9 has-[>textarea]:h-auto\",\r\n\r\n        // Variants based on alignment.\r\n        \"has-[>[data-align=inline-start]]:[&>input]:pl-2\",\r\n        \"has-[>[data-align=inline-end]]:[&>input]:pr-2\",\r\n        \"has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3\",\r\n        \"has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3\",\r\n\r\n        // Focus state.\r\n        \"has-[[data-slot=input-group-control]:focus-visible]:ring-1 has-[[data-slot=input-group-control]:focus-visible]:ring-neutral-950 dark:has-[[data-slot=input-group-control]:focus-visible]:ring-neutral-300\",\r\n\r\n        // Error state.\r\n        \"has-[[data-slot][aria-invalid=true]]:border-red-500 has-[[data-slot][aria-invalid=true]]:ring-red-500/20 dark:has-[[data-slot][aria-invalid=true]]:border-red-900 dark:dark:has-[[data-slot][aria-invalid=true]]:ring-red-900/40 dark:has-[[data-slot][aria-invalid=true]]:ring-red-500/40 dark:has-[[data-slot][aria-invalid=true]]:ring-red-900/20\",\r\n\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nconst inputGroupAddonVariants = cva(\r\n  \"text-neutral-500 flex h-auto cursor-text select-none items-center justify-center gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 dark:text-neutral-400\",\r\n  {\r\n    variants: {\r\n      align: {\r\n        \"inline-start\": \"order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]\",\r\n        \"inline-end\": \"order-last pr-3 has-[>button]:mr-[-0.4rem] has-[>kbd]:mr-[-0.35rem]\",\r\n        \"block-start\": \"[.border-b]:pb-3 order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5\",\r\n        \"block-end\": \"[.border-t]:pt-3 order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5\",\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      align: \"inline-start\",\r\n    },\r\n  },\r\n);\r\n\r\nfunction InputGroupAddon({\r\n  className,\r\n  align = \"inline-start\",\r\n  ...props\r\n}: React.ComponentProps<\"div\"> & VariantProps<typeof inputGroupAddonVariants>) {\r\n  return (\r\n    <div\r\n      role='group'\r\n      data-slot='input-group-addon'\r\n      data-align={align}\r\n      className={cn(inputGroupAddonVariants({align}), className)}\r\n      onClick={(e) => {\r\n        if ((e.target as HTMLElement).closest(\"button\")) {\r\n          return;\r\n        }\r\n        e.currentTarget.parentElement?.querySelector(\"input\")?.focus();\r\n      }}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nconst inputGroupButtonVariants = cva(\"flex items-center gap-2 text-sm shadow-none\", {\r\n  variants: {\r\n    size: {\r\n      xs: \"h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg:not([class*='size-'])]:size-3.5\",\r\n      sm: \"h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5\",\r\n      \"icon-xs\": \"size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0\",\r\n      \"icon-sm\": \"size-8 p-0 has-[>svg]:p-0\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    size: \"xs\",\r\n  },\r\n});\r\n\r\nfunction InputGroupButton({\r\n  className,\r\n  type = \"button\",\r\n  variant = \"ghost\",\r\n  size = \"xs\",\r\n  ...props\r\n}: Omit<React.ComponentProps<typeof Button>, \"size\"> & VariantProps<typeof inputGroupButtonVariants>) {\r\n  return (\r\n    <Button\r\n      type={type}\r\n      data-size={size}\r\n      variant={variant}\r\n      className={cn(inputGroupButtonVariants({size}), className)}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction InputGroupText({className, ...props}: React.ComponentProps<\"span\">) {\r\n  return (\r\n    <span\r\n      className={cn(\r\n        \"flex items-center gap-2 text-sm text-neutral-500 dark:text-neutral-400 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction InputGroupInput({className, ...props}: React.ComponentProps<\"input\">) {\r\n  return (\r\n    <Input\r\n      data-slot='input-group-control'\r\n      className={cn(\"flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent\", className)}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction InputGroupTextarea({className, ...props}: React.ComponentProps<\"textarea\">) {\r\n  return (\r\n    <Textarea\r\n      data-slot='input-group-control'\r\n      className={cn(\r\n        \"flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nexport {InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea};\r\n"],"names":["InputGroup","className","props","cn","inputGroupAddonVariants","cva","InputGroupAddon","align","e","inputGroupButtonVariants","InputGroupButton","type","variant","size","Button","InputGroupText","InputGroupInput","Input","InputGroupTextarea","Textarea"],"mappings":";;;;;;;;AAUA,SAASA,WAAW,EAACC,SAAS,EAAE,GAAGC,OAAmC;IACpE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,MAAK;QACL,WAAWC,GACT,4NACA,8BAGA,mDACA,iDACA,kIACA,4HAGA,6MAGA,wVAEAF;QAED,GAAGC,KAAK;;AAGf;AAEA,MAAME,0BAA0BC,IAC9B,4QACA;IACE,UAAU;QACR,OAAO;YACL,gBAAgB;YAChB,cAAc;YACd,eAAe;YACf,aAAa;QACf;IACF;IACA,iBAAiB;QACf,OAAO;IACT;AACF;AAGF,SAASC,gBAAgB,EACvBL,SAAS,EACTM,QAAQ,cAAc,EACtB,GAAGL,OACwE;IAC3E,OAAO,WAAP,GACE,IAAC;QACC,MAAK;QACL,aAAU;QACV,cAAYK;QACZ,WAAWJ,GAAGC,wBAAwB;YAACG;QAAK,IAAIN;QAChD,SAAS,CAACO;YACR,IAAKA,EAAE,MAAM,CAAiB,OAAO,CAAC,WACpC;YAEFA,EAAE,aAAa,CAAC,aAAa,EAAE,cAAc,UAAU;QACzD;QACC,GAAGN,KAAK;;AAGf;AAEA,MAAMO,2BAA2BJ,IAAI,+CAA+C;IAClF,UAAU;QACR,MAAM;YACJ,IAAI;YACJ,IAAI;YACJ,WAAW;YACX,WAAW;QACb;IACF;IACA,iBAAiB;QACf,MAAM;IACR;AACF;AAEA,SAASK,iBAAiB,EACxBT,SAAS,EACTU,OAAO,QAAQ,EACfC,UAAU,OAAO,EACjBC,OAAO,IAAI,EACX,GAAGX,OAC+F;IAClG,OAAO,WAAP,GACE,IAACY,QAAMA;QACL,MAAMH;QACN,aAAWE;QACX,SAASD;QACT,WAAWT,GAAGM,yBAAyB;YAACI;QAAI,IAAIZ;QAC/C,GAAGC,KAAK;;AAGf;AAEA,SAASa,eAAe,EAACd,SAAS,EAAE,GAAGC,OAAoC;IACzE,OAAO,WAAP,GACE,IAAC;QACC,WAAWC,GACT,2IACAF;QAED,GAAGC,KAAK;;AAGf;AAEA,SAASc,gBAAgB,EAACf,SAAS,EAAE,GAAGC,OAAqC;IAC3E,OAAO,WAAP,GACE,IAACe,OAAKA;QACJ,aAAU;QACV,WAAWd,GAAG,oGAAoGF;QACjH,GAAGC,KAAK;;AAGf;AAEA,SAASgB,mBAAmB,EAACjB,SAAS,EAAE,GAAGC,OAAwC;IACjF,OAAO,WAAP,GACE,IAACiB,UAAQA;QACP,aAAU;QACV,WAAWhB,GACT,qHACAF;QAED,GAAGC,KAAK;;AAGf"}

package/dist/components/ui/input-otp.d.ts

@@ -1,12 +1,35 @@
 import * as React from "react";
-import { OTPInput } from "input-otp";
-declare function InputOTP({ className, containerClassName, ...props }: React.ComponentProps<typeof OTPInput> & {
+declare const InputOTP: React.ForwardRefExoticComponent<(Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "maxLength" | "textAlign" | "onComplete" | "pushPasswordManagerStrategy" | "pasteTransformer" | "containerClassName" | "noScriptCSSFallback"> & {
+    value?: string;
+    onChange?: (newValue: string) => unknown;
+    maxLength: number;
+    textAlign?: "left" | "center" | "right";
+    onComplete?: (...args: any[]) => unknown;
+    pushPasswordManagerStrategy?: "increase-width" | "none";
+    pasteTransformer?: (pasted: string) => string;
     containerClassName?: string;
-}): import("react/jsx-runtime").JSX.Element;
-declare function InputOTPGroup({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
-declare function InputOTPSlot({ index, className, ...props }: React.ComponentProps<"div"> & {
+    noScriptCSSFallback?: string | null;
+} & {
+    render: (props: import("input-otp").RenderProps) => React.ReactNode;
+    children?: never;
+} & React.RefAttributes<HTMLInputElement>, "ref"> | Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "maxLength" | "textAlign" | "onComplete" | "pushPasswordManagerStrategy" | "pasteTransformer" | "containerClassName" | "noScriptCSSFallback"> & {
+    value?: string;
+    onChange?: (newValue: string) => unknown;
+    maxLength: number;
+    textAlign?: "left" | "center" | "right";
+    onComplete?: (...args: any[]) => unknown;
+    pushPasswordManagerStrategy?: "increase-width" | "none";
+    pasteTransformer?: (pasted: string) => string;
+    containerClassName?: string;
+    noScriptCSSFallback?: string | null;
+} & {
+    render?: never;
+    children: React.ReactNode;
+} & React.RefAttributes<HTMLInputElement>, "ref">) & React.RefAttributes<HTMLInputElement>>;
+declare const InputOTPGroup: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const InputOTPSlot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     index: number;
-}): import("react/jsx-runtime").JSX.Element;
-declare function InputOTPSeparator({ ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
-export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };
+} & React.RefAttributes<HTMLDivElement>>;
+declare const InputOTPSeparator: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
 //# sourceMappingURL=input-otp.d.ts.map

package/dist/components/ui/input-otp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input-otp.d.ts","sourceRoot":"","sources":["../../../src/components/ui/input-otp.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAmB,MAAM,WAAW,CAAC;AAKtD,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,kBAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,GAAG;IACzC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,2CAYA;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ1E;AAED,iBAAS,YAAY,CAAC,EACpB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,KAAK,EAAE,MAAM,CAAC;CACf,2CAsBA;AAED,iBAAS,iBAAiB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAMnE;AAED,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,iBAAiB,EAAE,CAAC"}
+{"version":3,"file":"input-otp.d.ts","sourceRoot":"","sources":["../../../src/components/ui/input-otp.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,QAAQ;;;;;kBAK8C,GAAG;;;;;;;;;;;;;kBAAH,GAAG;;;;;;;;2FAI9D,CAAC;AAGF,QAAA,MAAM,aAAa,mKAMjB,CAAC;AAGH,QAAA,MAAM,YAAY;WAA6F,MAAM;wCAuBpH,CAAC;AAGF,QAAA,MAAM,iBAAiB,mKAOrB,CAAC;AAGH,OAAO,EAAC,QAAQ,EAAE,aAAa,EAAE,iBAAiB,EAAE,YAAY,EAAC,CAAC"}

package/dist/components/ui/input-otp.js

@@ -1,51 +1,48 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useContext } from "react";
 import { OTPInput, OTPInputContext } from "input-otp";
-import { MinusIcon } from "lucide-react";
-import { cn } from "../../lib/utils.js";
-function InputOTP({ className, containerClassName, ...props }) {
-    return /*#__PURE__*/ jsx(OTPInput, {
-        "data-slot": "input-otp",
-        containerClassName: cn("flex items-center gap-2 has-disabled:opacity-50", containerClassName),
+import { Minus } from "lucide-react";
+import { forwardRef, useContext } from "react";
+import { cn } from "../../lib/utilities.js";
+const InputOTP = /*#__PURE__*/ forwardRef(({ className, containerClassName, ...props }, ref)=>/*#__PURE__*/ jsx(OTPInput, {
+        ref: ref,
+        containerClassName: cn("flex items-center gap-2 has-[:disabled]:opacity-50", containerClassName),
         className: cn("disabled:cursor-not-allowed", className),
         ...props
-    });
-}
-function InputOTPGroup({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        "data-slot": "input-otp-group",
+    }));
+InputOTP.displayName = "InputOTP";
+const InputOTPGroup = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
         className: cn("flex items-center", className),
         ...props
-    });
-}
-function InputOTPSlot({ index, className, ...props }) {
+    }));
+InputOTPGroup.displayName = "InputOTPGroup";
+const InputOTPSlot = /*#__PURE__*/ forwardRef(({ index, className, ...props }, ref)=>{
     const inputOTPContext = useContext(OTPInputContext);
-    const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
+    const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
     return /*#__PURE__*/ jsxs("div", {
-        "data-slot": "input-otp-slot",
-        "data-active": isActive,
-        className: cn("data-[active=true]:border-neutral-950 data-[active=true]:ring-neutral-950/50 data-[active=true]:aria-invalid:ring-red-500/20 dark:data-[active=true]:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 data-[active=true]:aria-invalid:border-red-500 dark:bg-neutral-200/30 border-neutral-200 relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none first:rounded-l-md first:border-l last:rounded-r-md data-[active=true]:z-10 data-[active=true]:ring-[3px] dark:data-[active=true]:border-neutral-300 dark:data-[active=true]:ring-neutral-300/50 dark:data-[active=true]:aria-invalid:ring-red-900/20 dark:dark:data-[active=true]:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900 dark:data-[active=true]:aria-invalid:border-red-900 dark:dark:bg-neutral-800/30 dark:border-neutral-800", className),
+        ref: ref,
+        className: cn("relative flex h-9 w-9 items-center justify-center border-y border-r border-neutral-200 text-sm shadow-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md dark:border-neutral-800", isActive && "z-10 ring-1 ring-neutral-950 dark:ring-neutral-300", className),
         ...props,
         children: [
             char,
             hasFakeCaret && /*#__PURE__*/ jsx("div", {
                 className: "pointer-events-none absolute inset-0 flex items-center justify-center",
                 children: /*#__PURE__*/ jsx("div", {
-                    className: "animate-caret-blink bg-neutral-950 h-4 w-px duration-1000 dark:bg-neutral-50"
+                    className: "animate-caret-blink h-4 w-px bg-neutral-950 duration-1000 dark:bg-neutral-50"
                 })
             })
         ]
     });
-}
-function InputOTPSeparator({ ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        "data-slot": "input-otp-separator",
+});
+InputOTPSlot.displayName = "InputOTPSlot";
+const InputOTPSeparator = /*#__PURE__*/ forwardRef(({ ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
         role: "separator",
         ...props,
-        children: /*#__PURE__*/ jsx(MinusIcon, {})
-    });
-}
+        children: /*#__PURE__*/ jsx(Minus, {})
+    }));
+InputOTPSeparator.displayName = "InputOTPSeparator";
 export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
 
 //# sourceMappingURL=input-otp.js.map

package/dist/components/ui/input-otp.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\input-otp.js","sources":["webpack://@arolariu/components/./src/components/ui/input-otp.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { OTPInput, OTPInputContext } from \"input-otp\";\nimport { MinusIcon } from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction InputOTP({\n  className,\n  containerClassName,\n  ...props\n}: React.ComponentProps<typeof OTPInput> & {\n  containerClassName?: string;\n}) {\n  return (\n    <OTPInput\n      data-slot=\"input-otp\"\n      containerClassName={cn(\n        \"flex items-center gap-2 has-disabled:opacity-50\",\n        containerClassName,\n      )}\n      className={cn(\"disabled:cursor-not-allowed\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction InputOTPGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"input-otp-group\"\n      className={cn(\"flex items-center\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction InputOTPSlot({\n  index,\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  index: number;\n}) {\n  const inputOTPContext = React.useContext(OTPInputContext);\n  const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};\n\n  return (\n    <div\n      data-slot=\"input-otp-slot\"\n      data-active={isActive}\n      className={cn(\n        \"data-[active=true]:border-neutral-950 data-[active=true]:ring-neutral-950/50 data-[active=true]:aria-invalid:ring-red-500/20 dark:data-[active=true]:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 data-[active=true]:aria-invalid:border-red-500 dark:bg-neutral-200/30 border-neutral-200 relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none first:rounded-l-md first:border-l last:rounded-r-md data-[active=true]:z-10 data-[active=true]:ring-[3px] dark:data-[active=true]:border-neutral-300 dark:data-[active=true]:ring-neutral-300/50 dark:data-[active=true]:aria-invalid:ring-red-900/20 dark:dark:data-[active=true]:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900 dark:data-[active=true]:aria-invalid:border-red-900 dark:dark:bg-neutral-800/30 dark:border-neutral-800\",\n        className,\n      )}\n      {...props}\n    >\n      {char}\n      {hasFakeCaret && (\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n          <div className=\"animate-caret-blink bg-neutral-950 h-4 w-px duration-1000 dark:bg-neutral-50\" />\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction InputOTPSeparator({ ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div data-slot=\"input-otp-separator\" role=\"separator\" {...props}>\n      <MinusIcon />\n    </div>\n  );\n}\n\nexport { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };\n"],"names":["InputOTP","className","containerClassName","props","OTPInput","cn","InputOTPGroup","InputOTPSlot","index","inputOTPContext","React","OTPInputContext","char","hasFakeCaret","isActive","InputOTPSeparator","MinusIcon"],"mappings":";;;;;;AAQA,SAASA,SAAS,EAChBC,SAAS,EACTC,kBAAkB,EAClB,GAAGC,OAGJ;IACC,OAAO,WAAP,GACE,IAACC,UAAQA;QACP,aAAU;QACV,oBAAoBC,GAClB,mDACAH;QAEF,WAAWG,GAAG,+BAA+BJ;QAC5C,GAAGE,KAAK;;AAGf;AAEA,SAASG,cAAc,EAAEL,SAAS,EAAE,GAAGE,OAAoC;IACzE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWE,GAAG,qBAAqBJ;QAClC,GAAGE,KAAK;;AAGf;AAEA,SAASI,aAAa,EACpBC,KAAK,EACLP,SAAS,EACT,GAAGE,OAGJ;IACC,MAAMM,kBAAkBC,WAAiBC;IACzC,MAAM,EAAEC,IAAI,EAAEC,YAAY,EAAEC,QAAQ,EAAE,GAAGL,iBAAiB,KAAK,CAACD,MAAM,IAAI,CAAC;IAE3E,OAAO,WAAP,GACE,KAAC;QACC,aAAU;QACV,eAAaM;QACb,WAAWT,GACT,q1BACAJ;QAED,GAAGE,KAAK;;YAERS;YACAC,gBAAgB,WAAhBA,GACC,IAAC;gBAAI,WAAU;0BACb,kBAAC;oBAAI,WAAU;;;;;AAKzB;AAEA,SAASE,kBAAkB,EAAE,GAAGZ,OAAoC;IAClE,OAAO,WAAP,GACE,IAAC;QAAI,aAAU;QAAsB,MAAK;QAAa,GAAGA,KAAK;kBAC7D,kBAACa,WAASA,CAAAA;;AAGhB"}
+{"version":3,"file":"components\\ui\\input-otp.js","sources":["webpack://@arolariu/components/./src/components/ui/input-otp.tsx"],"sourcesContent":["\r\n\r\nimport {OTPInput, OTPInputContext} from \"input-otp\";\r\nimport {Minus} from \"lucide-react\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst InputOTP = React.forwardRef<React.ElementRef<typeof OTPInput>, React.ComponentPropsWithoutRef<typeof OTPInput>>(\r\n  ({className, containerClassName, ...props}, ref) => (\r\n    <OTPInput\r\n      ref={ref}\r\n      containerClassName={cn(\"flex items-center gap-2 has-[:disabled]:opacity-50\", containerClassName)}\r\n      className={cn(\"disabled:cursor-not-allowed\", className)}\r\n      {...props}\r\n    />\r\n  ),\r\n);\r\nInputOTP.displayName = \"InputOTP\";\r\n\r\nconst InputOTPGroup = React.forwardRef<React.ElementRef<\"div\">, React.ComponentPropsWithoutRef<\"div\">>(({className, ...props}, ref) => (\r\n  <div\r\n    ref={ref}\r\n    className={cn(\"flex items-center\", className)}\r\n    {...props}\r\n  />\r\n));\r\nInputOTPGroup.displayName = \"InputOTPGroup\";\r\n\r\nconst InputOTPSlot = React.forwardRef<React.ElementRef<\"div\">, React.ComponentPropsWithoutRef<\"div\"> & {index: number}>(\r\n  ({index, className, ...props}, ref) => {\r\n    const inputOTPContext = React.useContext(OTPInputContext);\r\n    const {char, hasFakeCaret, isActive} = inputOTPContext.slots[index];\r\n\r\n    return (\r\n      <div\r\n        ref={ref}\r\n        className={cn(\r\n          \"relative flex h-9 w-9 items-center justify-center border-y border-r border-neutral-200 text-sm shadow-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md dark:border-neutral-800\",\r\n          isActive && \"z-10 ring-1 ring-neutral-950 dark:ring-neutral-300\",\r\n          className,\r\n        )}\r\n        {...props}>\r\n        {char}\r\n        {hasFakeCaret && (\r\n          <div className='pointer-events-none absolute inset-0 flex items-center justify-center'>\r\n            <div className='animate-caret-blink h-4 w-px bg-neutral-950 duration-1000 dark:bg-neutral-50' />\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  },\r\n);\r\nInputOTPSlot.displayName = \"InputOTPSlot\";\r\n\r\nconst InputOTPSeparator = React.forwardRef<React.ElementRef<\"div\">, React.ComponentPropsWithoutRef<\"div\">>(({...props}, ref) => (\r\n  <div\r\n    ref={ref}\r\n    role='separator'\r\n    {...props}>\r\n    <Minus />\r\n  </div>\r\n));\r\nInputOTPSeparator.displayName = \"InputOTPSeparator\";\r\n\r\nexport {InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot};\r\n"],"names":["InputOTP","React","className","containerClassName","props","ref","OTPInput","cn","InputOTPGroup","InputOTPSlot","index","inputOTPContext","OTPInputContext","char","hasFakeCaret","isActive","InputOTPSeparator","Minus"],"mappings":";;;;;;AAQA,MAAMA,WAAW,WAAXA,GAAWC,WACf,CAAC,EAACC,SAAS,EAAEC,kBAAkB,EAAE,GAAGC,OAAM,EAAEC,MAAAA,WAAAA,GAC1C,IAACC,UAAQA;QACP,KAAKD;QACL,oBAAoBE,GAAG,sDAAsDJ;QAC7E,WAAWI,GAAG,+BAA+BL;QAC5C,GAAGE,KAAK;;AAIfJ,SAAS,WAAW,GAAG;AAEvB,MAAMQ,gBAAgB,WAAhBA,GAAgBP,WAAiF,CAAC,EAACC,SAAS,EAAE,GAAGE,OAAM,EAAEC,MAAAA,WAAAA,GAC7H,IAAC;QACC,KAAKA;QACL,WAAWE,GAAG,qBAAqBL;QAClC,GAAGE,KAAK;;AAGbI,cAAc,WAAW,GAAG;AAE5B,MAAMC,eAAe,WAAfA,GAAeR,WACnB,CAAC,EAACS,KAAK,EAAER,SAAS,EAAE,GAAGE,OAAM,EAAEC;IAC7B,MAAMM,kBAAkBV,WAAiBW;IACzC,MAAM,EAACC,IAAI,EAAEC,YAAY,EAAEC,QAAQ,EAAC,GAAGJ,gBAAgB,KAAK,CAACD,MAAM;IAEnE,OAAO,WAAP,GACE,KAAC;QACC,KAAKL;QACL,WAAWE,GACT,uMACAQ,YAAY,sDACZb;QAED,GAAGE,KAAK;;YACRS;YACAC,gBAAgB,WAAhBA,GACC,IAAC;gBAAI,WAAU;0BACb,kBAAC;oBAAI,WAAU;;;;;AAKzB;AAEFL,aAAa,WAAW,GAAG;AAE3B,MAAMO,oBAAoB,WAApBA,GAAoBf,WAAiF,CAAC,EAAC,GAAGG,OAAM,EAAEC,MAAAA,WAAAA,GACtH,IAAC;QACC,KAAKA;QACL,MAAK;QACJ,GAAGD,KAAK;kBACT,kBAACa,OAAKA,CAAAA;;AAGVD,kBAAkB,WAAW,GAAG"}

package/dist/components/ui/input.d.ts

@@ -1,4 +1,4 @@
 import * as React from "react";
-declare function Input({ className, type, ...props }: React.ComponentProps<"input">): import("react/jsx-runtime").JSX.Element;
+declare const Input: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export { Input };
 //# sourceMappingURL=input.d.ts.map

package/dist/components/ui/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/ui/input.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,2CAc1E;AAED,OAAO,EAAE,KAAK,EAAE,CAAC"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/ui/input.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,QAAA,MAAM,KAAK,8KAYT,CAAC;AAGH,OAAO,EAAC,KAAK,EAAC,CAAC"}

package/dist/components/ui/input.js

@@ -1,15 +1,14 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
-import "react";
-import { cn } from "../../lib/utils.js";
-function Input({ className, type, ...props }) {
-    return /*#__PURE__*/ jsx("input", {
+import { cn } from "../../lib/utilities.js";
+import { forwardRef } from "react";
+const Input = /*#__PURE__*/ forwardRef(({ className, type, ...props }, ref)=>/*#__PURE__*/ jsx("input", {
         type: type,
-        "data-slot": "input",
-        className: cn("file:text-neutral-950 placeholder:text-neutral-500 selection:bg-neutral-900 selection:text-neutral-50 dark:bg-neutral-200/30 border-neutral-200 flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:file:text-neutral-50 dark:placeholder:text-neutral-400 dark:selection:bg-neutral-50 dark:selection:text-neutral-900 dark:dark:bg-neutral-800/30 dark:border-neutral-800", "focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 focus-visible:ring-[3px] dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50", "aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900", className),
+        className: cn("flex h-9 w-full rounded-md border border-neutral-200 bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-neutral-950 placeholder:text-neutral-500 focus-visible:ring-1 focus-visible:ring-neutral-950 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:border-neutral-800 dark:file:text-neutral-50 dark:placeholder:text-neutral-400 dark:focus-visible:ring-neutral-300", className),
+        ref: ref,
         ...props
-    });
-}
+    }));
+Input.displayName = "Input";
 export { Input };
 
 //# sourceMappingURL=input.js.map

package/dist/components/ui/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\input.js","sources":["webpack://@arolariu/components/./src/components/ui/input.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <input\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        \"file:text-neutral-950 placeholder:text-neutral-500 selection:bg-neutral-900 selection:text-neutral-50 dark:bg-neutral-200/30 border-neutral-200 flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:file:text-neutral-50 dark:placeholder:text-neutral-400 dark:selection:bg-neutral-50 dark:selection:text-neutral-900 dark:dark:bg-neutral-800/30 dark:border-neutral-800\",\n        \"focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 focus-visible:ring-[3px] dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50\",\n        \"aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Input };\n"],"names":["Input","className","type","props","cn"],"mappings":";;;;AAKA,SAASA,MAAM,EAAEC,SAAS,EAAEC,IAAI,EAAE,GAAGC,OAAsC;IACzE,OAAO,WAAP,GACE,IAAC;QACC,MAAMD;QACN,aAAU;QACV,WAAWE,GACT,onBACA,4KACA,wMACAH;QAED,GAAGE,KAAK;;AAGf"}
+{"version":3,"file":"components\\ui\\input.js","sources":["webpack://@arolariu/components/./src/components/ui/input.tsx"],"sourcesContent":["\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\nimport * as React from \"react\";\r\n\r\nconst Input = React.forwardRef<HTMLInputElement, React.ComponentProps<\"input\">>(({className, type, ...props}, ref) => {\r\n  return (\r\n    <input\r\n      type={type}\r\n      className={cn(\r\n        \"flex h-9 w-full rounded-md border border-neutral-200 bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-neutral-950 placeholder:text-neutral-500 focus-visible:ring-1 focus-visible:ring-neutral-950 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:border-neutral-800 dark:file:text-neutral-50 dark:placeholder:text-neutral-400 dark:focus-visible:ring-neutral-300\",\r\n        className,\r\n      )}\r\n      ref={ref}\r\n      {...props}\r\n    />\r\n  );\r\n});\r\nInput.displayName = \"Input\";\r\n\r\nexport {Input};\r\n"],"names":["Input","React","className","type","props","ref","cn"],"mappings":";;;;AAKA,MAAMA,QAAQ,WAARA,GAAQC,WAAkE,CAAC,EAACC,SAAS,EAAEC,IAAI,EAAE,GAAGC,OAAM,EAAEC,MACrG,WAAP,GACE,IAAC;QACC,MAAMF;QACN,WAAWG,GACT,4eACAJ;QAEF,KAAKG;QACJ,GAAGD,KAAK;;AAIfJ,MAAM,WAAW,GAAG"}

package/dist/components/ui/item.d.ts

@@ -0,0 +1,24 @@
+import { type VariantProps } from "class-variance-authority";
+import * as React from "react";
+import { Separator } from "./separator";
+declare function ItemGroup({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): import("react/jsx-runtime").JSX.Element;
+declare const itemVariants: (props?: {
+    variant?: "default" | "outline" | "muted";
+    size?: "default" | "sm";
+} & import("class-variance-authority/types").ClassProp) => string;
+declare function Item({ className, variant, size, asChild, ...props }: React.ComponentProps<"div"> & VariantProps<typeof itemVariants> & {
+    asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare const itemMediaVariants: (props?: {
+    variant?: "image" | "default" | "icon";
+} & import("class-variance-authority/types").ClassProp) => string;
+declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): import("react/jsx-runtime").JSX.Element;
+declare function ItemContent({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function ItemTitle({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function ItemDescription({ className, ...props }: React.ComponentProps<"p">): import("react/jsx-runtime").JSX.Element;
+declare function ItemActions({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function ItemHeader({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function ItemFooter({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle };
+//# sourceMappingURL=item.d.ts.map

package/dist/components/ui/item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../src/components/ui/item.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,2BAA2B,CAAC;AAGpD,iBAAS,SAAS,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CASpE;AAED,iBAAS,aAAa,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,2CASnF;AAED,QAAA,MAAM,YAAY;;;iEAmBjB,CAAC;AAEF,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,OAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,GAAG;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAC,2CAWvF;AAED,QAAA,MAAM,iBAAiB;;iEActB,CAAC;AAEF,iBAAS,SAAS,CAAC,EAAC,SAAS,EAAE,OAAmB,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,2CASlI;AAED,iBAAS,WAAW,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQtE;AAED,iBAAS,SAAS,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQpE;AAED,iBAAS,eAAe,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,2CAYxE;AAED,iBAAS,WAAW,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQtE;AAED,iBAAS,UAAU,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQrE;AAED,iBAAS,UAAU,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQrE;AAED,OAAO,EAAC,IAAI,EAAE,WAAW,EAAE,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,SAAS,EAAC,CAAC"}