erp-pro-ui 0.1.1 → 0.1.2

package/dist/chunks/ascii-text-C5tyNsR3.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ascii-text-C5tyNsR3.mjs","names":[],"sources":["../../src/components/effects/ascii-text/ASCIIText.tsx"],"sourcesContent":["import React, { useRef, useEffect } from \"react\";\nimport * as THREE from \"three\";\n\nconst vertexShader = `\nvarying vec2 vUv;\nuniform float uTime;\nuniform float mouse;\nuniform float uEnableWaves;\n\nvoid main() {\n    vUv = uv;\n    float time = uTime * 5.;\n\n    float waveFactor = uEnableWaves;\n\n    vec3 transformed = position;\n\n    transformed.x += sin(time + position.y) * 0.5 * waveFactor;\n    transformed.y += cos(time + position.z) * 0.15 * waveFactor;\n    transformed.z += sin(time + position.x) * waveFactor;\n\n    gl_Position = projectionMatrix * modelViewMatrix * vec4(transformed, 1.0);\n}\n`;\n\nconst fragmentShader = `\nvarying vec2 vUv;\nuniform float mouse;\nuniform float uTime;\nuniform sampler2D uTexture;\n\nvoid main() {\n    float time = uTime;\n    vec2 pos = vUv;\n    \n    float move = sin(time + mouse) * 0.01;\n    float r = texture2D(uTexture, pos + cos(time * 2. - time + pos.x) * .01).r;\n    float g = texture2D(uTexture, pos + tan(time * .5 + pos.x - time) * .01).g;\n    float b = texture2D(uTexture, pos - cos(time * 2. + time + pos.y) * .01).b;\n    float a = texture2D(uTexture, pos).a;\n    gl_FragColor = vec4(r, g, b, a);\n}\n`;\n\nconst PX_RATIO = typeof window !== \"undefined\" ? window.devicePixelRatio : 1;\n\nconst resolvedCanvasColorCache = new Map<string, string>();\n\nconst getThemeSignature = () => {\n  if (typeof document === \"undefined\") return \"\";\n\n  const root = document.documentElement;\n  return [\n    root.getAttribute(\"data-brand\") ?? \"\",\n    root.getAttribute(\"data-mode\") ?? \"\",\n    root.getAttribute(\"data-theme\") ?? \"\",\n  ].join(\"|\");\n};\n\nconst resolveCanvasColor = (value: string): string => {\n  if (typeof document === \"undefined\") return value;\n  if (!value.includes(\"var(\") && !value.includes(\"color-mix(\")) return value;\n\n  const cacheKey = `${getThemeSignature()}::${value}`;\n  const cachedValue = resolvedCanvasColorCache.get(cacheKey);\n  if (cachedValue) {\n    return cachedValue;\n  }\n\n  const probe = document.createElement(\"span\");\n  probe.style.color = value;\n  probe.style.position = \"fixed\";\n  probe.style.pointerEvents = \"none\";\n  probe.style.opacity = \"0\";\n  document.body.appendChild(probe);\n  const resolvedValue = getComputedStyle(probe).color || value;\n  document.body.removeChild(probe);\n  resolvedCanvasColorCache.set(cacheKey, resolvedValue);\n  return resolvedValue;\n};\n\ninterface AsciiFilterOptions {\n  fontSize?: number;\n  fontFamily?: string;\n  charset?: string;\n  invert?: boolean;\n}\n\nclass AsciiFilter {\n  renderer: THREE.WebGLRenderer;\n  domElement: HTMLDivElement;\n  pre: HTMLPreElement;\n  canvas: HTMLCanvasElement;\n  context: CanvasRenderingContext2D;\n  deg: number;\n  invert: boolean;\n  fontSize: number;\n  fontFamily: string;\n  charset: string;\n  width: number = 0;\n  height: number = 0;\n  cols: number = 0;\n  rows: number = 0;\n  center: { x: number; y: number } = { x: 0, y: 0 };\n  mouse: { x: number; y: number } = { x: 0, y: 0 };\n\n  constructor(\n    renderer: THREE.WebGLRenderer,\n    { fontSize, fontFamily, charset, invert }: AsciiFilterOptions = {},\n  ) {\n    this.renderer = renderer;\n    this.domElement = document.createElement(\"div\");\n    this.domElement.style.position = \"absolute\";\n    this.domElement.style.top = \"0\";\n    this.domElement.style.left = \"0\";\n    this.domElement.style.width = \"100%\";\n    this.domElement.style.height = \"100%\";\n\n    this.pre = document.createElement(\"pre\");\n    this.domElement.appendChild(this.pre);\n\n    this.canvas = document.createElement(\"canvas\");\n    const ctx = this.canvas.getContext(\"2d\");\n    if (!ctx) throw new Error(\"Could not get 2d context\");\n    this.context = ctx;\n    this.domElement.appendChild(this.canvas);\n\n    this.deg = 0;\n    this.invert = invert ?? true;\n    this.fontSize = fontSize ?? 12;\n    this.fontFamily = fontFamily ?? \"'Courier New', monospace\";\n    this.charset =\n      charset ??\n      \" .'`^\\\",:;Il!i~+_-?][}{1)(|/tfjrxnuvczXYUJCLQ0OZmwqpdbkhao*#MW&8%B@$\";\n\n    this.context.imageSmoothingEnabled = false;\n\n    this.onMouseMove = this.onMouseMove.bind(this);\n    document.addEventListener(\"mousemove\", this.onMouseMove);\n  }\n\n  setSize(width: number, height: number) {\n    this.width = width;\n    this.height = height;\n    this.renderer.setSize(width, height);\n    this.reset();\n\n    this.center = { x: width / 2, y: height / 2 };\n    this.mouse = { x: this.center.x, y: this.center.y };\n  }\n\n  reset() {\n    this.context.font = `${this.fontSize}px ${this.fontFamily}`;\n    const charWidth = this.context.measureText(\"A\").width;\n\n    this.cols = Math.floor(\n      this.width / (this.fontSize * (charWidth / this.fontSize)),\n    );\n    this.rows = Math.floor(this.height / this.fontSize);\n\n    this.canvas.width = this.cols;\n    this.canvas.height = this.rows;\n    this.pre.style.fontFamily = this.fontFamily;\n    this.pre.style.fontSize = `${this.fontSize}px`;\n    this.pre.style.margin = \"0\";\n    this.pre.style.padding = \"0\";\n    this.pre.style.lineHeight = \"1em\";\n    this.pre.style.position = \"absolute\";\n    this.pre.style.left = \"0\";\n    this.pre.style.top = \"0\";\n    this.pre.style.zIndex = \"9\";\n    this.pre.style.backgroundAttachment = \"fixed\";\n    this.pre.style.mixBlendMode = \"difference\";\n  }\n\n  render(scene: THREE.Scene, camera: THREE.Camera) {\n    this.renderer.render(scene, camera);\n\n    const w = this.canvas.width;\n    const h = this.canvas.height;\n    this.context.clearRect(0, 0, w, h);\n    if (this.context && w && h) {\n      this.context.drawImage(this.renderer.domElement, 0, 0, w, h);\n    }\n\n    this.asciify(this.context, w, h);\n    this.hue();\n  }\n\n  onMouseMove(e: MouseEvent) {\n    this.mouse = { x: e.clientX * PX_RATIO, y: e.clientY * PX_RATIO };\n  }\n\n  get dx() {\n    return this.mouse.x - this.center.x;\n  }\n\n  get dy() {\n    return this.mouse.y - this.center.y;\n  }\n\n  hue() {\n    const deg = (Math.atan2(this.dy, this.dx) * 180) / Math.PI;\n    this.deg += (deg - this.deg) * 0.075;\n    this.domElement.style.filter = `hue-rotate(${this.deg.toFixed(1)}deg)`;\n  }\n\n  asciify(ctx: CanvasRenderingContext2D, w: number, h: number) {\n    if (w && h) {\n      const imgData = ctx.getImageData(0, 0, w, h).data;\n      let str = \"\";\n      for (let y = 0; y < h; y++) {\n        for (let x = 0; x < w; x++) {\n          const i = x * 4 + y * 4 * w;\n          const [r, g, b, a] = [\n            imgData[i],\n            imgData[i + 1],\n            imgData[i + 2],\n            imgData[i + 3],\n          ];\n\n          if (a === 0) {\n            str += \" \";\n            continue;\n          }\n\n          const gray = (0.3 * r + 0.6 * g + 0.1 * b) / 255;\n          let idx = Math.floor((1 - gray) * (this.charset.length - 1));\n          if (this.invert) idx = this.charset.length - idx - 1;\n          str += this.charset[idx];\n        }\n        str += \"\\n\";\n      }\n      this.pre.innerHTML = str;\n    }\n  }\n\n  dispose() {\n    document.removeEventListener(\"mousemove\", this.onMouseMove);\n  }\n}\n\ninterface CanvasTxtOptions {\n  fontSize?: number;\n  fontFamily?: string;\n  color?: string;\n}\n\nclass CanvasTxt {\n  canvas: HTMLCanvasElement;\n  context: CanvasRenderingContext2D;\n  txt: string;\n  fontSize: number;\n  fontFamily: string;\n  color: string;\n  font: string;\n\n  constructor(\n    txt: string,\n    {\n      fontSize = 200,\n      fontFamily = \"Arial\",\n      color = \"var(--ds-color-fg)\",\n    }: CanvasTxtOptions = {},\n  ) {\n    this.canvas = document.createElement(\"canvas\");\n    const ctx = this.canvas.getContext(\"2d\");\n    if (!ctx) throw new Error(\"Could not get 2d context\");\n    this.context = ctx;\n    this.txt = txt;\n    this.fontSize = fontSize;\n    this.fontFamily = fontFamily;\n    this.color = color;\n\n    this.font = `600 ${this.fontSize}px ${this.fontFamily}`;\n  }\n\n  resize() {\n    this.context.font = this.font;\n    const metrics = this.context.measureText(this.txt);\n\n    const textWidth = Math.ceil(metrics.width) + 20;\n    const textHeight =\n      Math.ceil(\n        metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent,\n      ) + 20;\n\n    this.canvas.width = textWidth;\n    this.canvas.height = textHeight;\n  }\n\n  render() {\n    this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);\n    this.context.fillStyle = resolveCanvasColor(this.color);\n    this.context.font = this.font;\n\n    const metrics = this.context.measureText(this.txt);\n    const yPos = 10 + metrics.actualBoundingBoxAscent;\n\n    this.context.fillText(this.txt, 10, yPos);\n  }\n\n  get width() {\n    return this.canvas.width;\n  }\n\n  get height() {\n    return this.canvas.height;\n  }\n\n  get texture() {\n    return this.canvas;\n  }\n}\n\ninterface CanvAsciiOptions {\n  text: string;\n  asciiFontSize: number;\n  textFontSize: number;\n  textColor: string;\n  planeBaseHeight: number;\n  enableWaves: boolean;\n}\n\nclass CanvAscii {\n  textString: string;\n  asciiFontSize: number;\n  textFontSize: number;\n  textColor: string;\n  planeBaseHeight: number;\n  container: HTMLElement;\n  width: number;\n  height: number;\n  enableWaves: boolean;\n  camera: THREE.PerspectiveCamera;\n  scene: THREE.Scene;\n  mouse: { x: number; y: number };\n  textCanvas!: CanvasTxt;\n  texture!: THREE.CanvasTexture;\n  geometry!: THREE.PlaneGeometry;\n  material!: THREE.ShaderMaterial;\n  mesh!: THREE.Mesh;\n  renderer!: THREE.WebGLRenderer;\n  filter!: AsciiFilter;\n  center: { x: number; y: number } = { x: 0, y: 0 };\n  animationFrameId: number = 0;\n\n  constructor(\n    {\n      text,\n      asciiFontSize,\n      textFontSize,\n      textColor,\n      planeBaseHeight,\n      enableWaves,\n    }: CanvAsciiOptions,\n    containerElem: HTMLElement,\n    width: number,\n    height: number,\n  ) {\n    this.textString = text;\n    this.asciiFontSize = asciiFontSize;\n    this.textFontSize = textFontSize;\n    this.textColor = textColor;\n    this.planeBaseHeight = planeBaseHeight;\n    this.container = containerElem;\n    this.width = width;\n    this.height = height;\n    this.enableWaves = enableWaves;\n\n    this.camera = new THREE.PerspectiveCamera(\n      45,\n      this.width / this.height,\n      1,\n      1000,\n    );\n    this.camera.position.z = 30;\n\n    this.scene = new THREE.Scene();\n    this.mouse = { x: 0, y: 0 };\n\n    this.onMouseMove = this.onMouseMove.bind(this);\n\n    this.setMesh();\n    this.setRenderer();\n  }\n\n  setMesh() {\n    this.textCanvas = new CanvasTxt(this.textString, {\n      fontSize: this.textFontSize,\n      fontFamily: \"IBM Plex Mono\",\n      color: this.textColor,\n    });\n    this.textCanvas.resize();\n    this.textCanvas.render();\n\n    this.texture = new THREE.CanvasTexture(this.textCanvas.texture);\n    this.texture.minFilter = THREE.NearestFilter;\n\n    const textAspect = this.textCanvas.width / this.textCanvas.height;\n    const baseH = this.planeBaseHeight;\n    const planeW = baseH * textAspect;\n    const planeH = baseH;\n\n    this.geometry = new THREE.PlaneGeometry(planeW, planeH, 36, 36);\n    this.material = new THREE.ShaderMaterial({\n      vertexShader,\n      fragmentShader,\n      transparent: true,\n      uniforms: {\n        uTime: { value: 0 },\n        mouse: { value: 1.0 },\n        uTexture: { value: this.texture },\n        uEnableWaves: { value: this.enableWaves ? 1.0 : 0.0 },\n      },\n    });\n\n    this.mesh = new THREE.Mesh(this.geometry, this.material);\n    this.scene.add(this.mesh);\n  }\n\n  setRenderer() {\n    this.renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true });\n    this.renderer.setPixelRatio(1);\n    this.renderer.setClearColor(0x000000, 0);\n\n    this.filter = new AsciiFilter(this.renderer, {\n      fontFamily: \"IBM Plex Mono\",\n      fontSize: this.asciiFontSize,\n      invert: true,\n    });\n\n    this.container.appendChild(this.filter.domElement);\n    this.setSize(this.width, this.height);\n\n    this.container.addEventListener(\"mousemove\", this.onMouseMove);\n    this.container.addEventListener(\"touchmove\", this.onMouseMove);\n  }\n\n  setSize(w: number, h: number) {\n    this.width = w;\n    this.height = h;\n\n    this.camera.aspect = w / h;\n    this.camera.updateProjectionMatrix();\n\n    this.filter.setSize(w, h);\n\n    this.center = { x: w / 2, y: h / 2 };\n  }\n\n  load() {\n    this.animate();\n  }\n\n  onMouseMove(evt: any) {\n    const e = evt.touches ? evt.touches[0] : evt;\n    const bounds = this.container.getBoundingClientRect();\n    const x = e.clientX - bounds.left;\n    const y = e.clientY - bounds.top;\n    this.mouse = { x, y };\n  }\n\n  animate() {\n    const animateFrame = () => {\n      this.animationFrameId = requestAnimationFrame(animateFrame);\n      this.render();\n    };\n    animateFrame();\n  }\n\n  render() {\n    const time = new Date().getTime() * 0.001;\n\n    this.textCanvas.render();\n    this.texture.needsUpdate = true;\n\n    (this.mesh.material as any).uniforms.uTime.value = Math.sin(time);\n\n    this.updateRotation();\n    this.filter.render(this.scene, this.camera);\n  }\n\n  updateRotation() {\n    const map = (\n      n: number,\n      start: number,\n      stop: number,\n      start2: number,\n      stop2: number,\n    ) => {\n      return ((n - start) / (stop - start)) * (stop2 - start2) + start2;\n    };\n\n    const x = map(this.mouse.y, 0, this.height, 0.5, -0.5);\n    const y = map(this.mouse.x, 0, this.width, -0.5, 0.5);\n\n    this.mesh.rotation.x += (x - this.mesh.rotation.x) * 0.05;\n    this.mesh.rotation.y += (y - this.mesh.rotation.y) * 0.05;\n  }\n\n  clear() {\n    this.scene.traverse((obj: THREE.Object3D) => {\n      if (obj instanceof THREE.Mesh) {\n        if (Array.isArray(obj.material)) {\n          obj.material.forEach((m: THREE.Material) => m.dispose());\n        } else if (obj.material instanceof THREE.Material) {\n          obj.material.dispose();\n        }\n        obj.geometry.dispose();\n      }\n    });\n    this.scene.clear();\n  }\n\n  dispose() {\n    cancelAnimationFrame(this.animationFrameId);\n    this.filter.dispose();\n    if (this.filter.domElement.parentNode === this.container) {\n      this.container.removeChild(this.filter.domElement);\n    }\n    this.container.removeEventListener(\"mousemove\", this.onMouseMove);\n    this.container.removeEventListener(\"touchmove\", this.onMouseMove);\n    this.clear();\n    this.renderer.dispose();\n  }\n}\n\nexport interface ASCIITextProps {\n  text?: string;\n  asciiFontSize?: number;\n  textFontSize?: number;\n  textColor?: string;\n  planeBaseHeight?: number;\n  enableWaves?: boolean;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport const ASCIIText: React.FC<ASCIITextProps> = ({\n  text = \"David!\",\n  asciiFontSize = 8,\n  textFontSize = 200,\n  textColor = \"var(--ds-color-fg)\",\n  planeBaseHeight = 8,\n  enableWaves = true,\n  className = \"\",\n  style = {},\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const asciiRef = useRef<CanvAscii | null>(null);\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n\n    const { width, height } = containerRef.current.getBoundingClientRect();\n\n    const initAscii = (w: number, h: number) => {\n      if (asciiRef.current) asciiRef.current.dispose();\n      asciiRef.current = new CanvAscii(\n        {\n          text,\n          asciiFontSize,\n          textFontSize,\n          textColor,\n          planeBaseHeight,\n          enableWaves,\n        },\n        containerRef.current!,\n        w,\n        h,\n      );\n      asciiRef.current.load();\n    };\n\n    if (width === 0 || height === 0) {\n      const observer = new IntersectionObserver(\n        ([entry]) => {\n          if (\n            entry.isIntersecting &&\n            entry.boundingClientRect.width > 0 &&\n            entry.boundingClientRect.height > 0\n          ) {\n            initAscii(\n              entry.boundingClientRect.width,\n              entry.boundingClientRect.height,\n            );\n            observer.disconnect();\n          }\n        },\n        { threshold: 0.1 },\n      );\n\n      observer.observe(containerRef.current);\n\n      return () => {\n        observer.disconnect();\n        if (asciiRef.current) {\n          asciiRef.current.dispose();\n        }\n      };\n    }\n\n    initAscii(width, height);\n\n    const ro = new ResizeObserver((entries) => {\n      if (!entries[0] || !asciiRef.current) return;\n      const { width: w, height: h } = entries[0].contentRect;\n      if (w > 0 && h > 0) {\n        asciiRef.current.setSize(w, h);\n      }\n    });\n    ro.observe(containerRef.current);\n\n    return () => {\n      ro.disconnect();\n      if (asciiRef.current) {\n        asciiRef.current.dispose();\n      }\n    };\n  }, [\n    text,\n    asciiFontSize,\n    textFontSize,\n    textColor,\n    planeBaseHeight,\n    enableWaves,\n  ]);\n\n  return (\n    <div\n      ref={containerRef}\n      className={`ascii-text-container ${className}`}\n      style={{\n        position: \"absolute\",\n        width: \"100%\",\n        height: \"100%\",\n        ...style,\n      }}\n    >\n      <style>{`\n        @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&display=swap');\n\n        .ascii-text-container canvas {\n          position: absolute;\n          left: 0;\n          top: 0;\n          width: 100%;\n          height: 100%;\n          image-rendering: optimizeSpeed;\n          image-rendering: -moz-crisp-edges;\n          image-rendering: -o-crisp-edges;\n          image-rendering: -webkit-optimize-contrast;\n          image-rendering: optimize-contrast;\n          image-rendering: crisp-edges;\n          image-rendering: pixelated;\n        }\n\n        .ascii-text-container pre {\n          margin: 0;\n          user-select: none;\n          padding: 0;\n          line-height: 1em;\n          text-align: left;\n          position: absolute;\n          left: 0;\n          top: 0;\n          background-image: radial-gradient(circle, var(--ds-color-accent) 0%, var(--ds-color-accent-hover) 50%, var(--ds-color-warning) 100%);\n          background-attachment: fixed;\n          -webkit-text-fill-color: transparent;\n          -webkit-background-clip: text;\n          background-clip: text;\n          z-index: 9;\n          mix-blend-mode: difference;\n        }\n      `}</style>\n    </div>\n  );\n};\n\nexport default ASCIIText;\n"],"mappings":"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"}

package/dist/chunks/{ascii-text-D6lVHWph.cjs → ascii-text-DlmArZXh.cjs}

@@ -45,6 +45,33 @@ void main() {
 }
 `;
 var PX_RATIO = typeof window !== "undefined" ? window.devicePixelRatio : 1;
+var resolvedCanvasColorCache = /* @__PURE__ */ new Map();
+var getThemeSignature = () => {
+	if (typeof document === "undefined") return "";
+	const root = document.documentElement;
+	return [
+		root.getAttribute("data-brand") ?? "",
+		root.getAttribute("data-mode") ?? "",
+		root.getAttribute("data-theme") ?? ""
+	].join("|");
+};
+var resolveCanvasColor = (value) => {
+	if (typeof document === "undefined") return value;
+	if (!value.includes("var(") && !value.includes("color-mix(")) return value;
+	const cacheKey = `${getThemeSignature()}::${value}`;
+	const cachedValue = resolvedCanvasColorCache.get(cacheKey);
+	if (cachedValue) return cachedValue;
+	const probe = document.createElement("span");
+	probe.style.color = value;
+	probe.style.position = "fixed";
+	probe.style.pointerEvents = "none";
+	probe.style.opacity = "0";
+	document.body.appendChild(probe);
+	const resolvedValue = getComputedStyle(probe).color || value;
+	document.body.removeChild(probe);
+	resolvedCanvasColorCache.set(cacheKey, resolvedValue);
+	return resolvedValue;
+};
 var AsciiFilter = class {
 	renderer;
 	domElement;
@@ -190,7 +217,7 @@ var CanvasTxt = class {
 	fontFamily;
 	color;
 	font;
-	constructor(txt, { fontSize = 200, fontFamily = "Arial", color = "#fdf9f3" } = {}) {
+	constructor(txt, { fontSize = 200, fontFamily = "Arial", color = "var(--ds-color-fg)" } = {}) {
 		this.canvas = document.createElement("canvas");
 		const ctx = this.canvas.getContext("2d");
 		if (!ctx) throw new Error("Could not get 2d context");
@@ -211,7 +238,7 @@ var CanvasTxt = class {
 	}
 	render() {
 		this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
-		this.context.fillStyle = this.color;
+		this.context.fillStyle = resolveCanvasColor(this.color);
 		this.context.font = this.font;
 		const yPos = 10 + this.context.measureText(this.txt).actualBoundingBoxAscent;
 		this.context.fillText(this.txt, 10, yPos);
@@ -384,7 +411,7 @@ var CanvAscii = class {
 		this.renderer.dispose();
 	}
 };
-var ASCIIText = ({ text = "David!", asciiFontSize = 8, textFontSize = 200, textColor = "#fdf9f3", planeBaseHeight = 8, enableWaves = true, className = "", style = {} }) => {
+var ASCIIText = ({ text = "David!", asciiFontSize = 8, textFontSize = 200, textColor = "var(--ds-color-fg)", planeBaseHeight = 8, enableWaves = true, className = "", style = {} }) => {
 	const containerRef = (0, react.useRef)(null);
 	const asciiRef = (0, react.useRef)(null);
 	(0, react.useEffect)(() => {
@@ -470,7 +497,7 @@ var ASCIIText = ({ text = "David!", asciiFontSize = 8, textFontSize = 200, textC
           position: absolute;
           left: 0;
           top: 0;
-          background-image: radial-gradient(circle, #ff6188 0%, #fc9867 50%, #ffd866 100%);
+          background-image: radial-gradient(circle, var(--ds-color-accent) 0%, var(--ds-color-accent-hover) 50%, var(--ds-color-warning) 100%);
           background-attachment: fixed;
           -webkit-text-fill-color: transparent;
           -webkit-background-clip: text;
@@ -489,4 +516,4 @@ Object.defineProperty(exports, "ASCIIText", {
 	}
 });
 
-//# sourceMappingURL=ascii-text-D6lVHWph.cjs.map
+//# sourceMappingURL=ascii-text-DlmArZXh.cjs.map

package/dist/chunks/ascii-text-DlmArZXh.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ascii-text-DlmArZXh.cjs","names":[],"sources":["../../src/components/effects/ascii-text/ASCIIText.tsx"],"sourcesContent":["import React, { useRef, useEffect } from \"react\";\nimport * as THREE from \"three\";\n\nconst vertexShader = `\nvarying vec2 vUv;\nuniform float uTime;\nuniform float mouse;\nuniform float uEnableWaves;\n\nvoid main() {\n    vUv = uv;\n    float time = uTime * 5.;\n\n    float waveFactor = uEnableWaves;\n\n    vec3 transformed = position;\n\n    transformed.x += sin(time + position.y) * 0.5 * waveFactor;\n    transformed.y += cos(time + position.z) * 0.15 * waveFactor;\n    transformed.z += sin(time + position.x) * waveFactor;\n\n    gl_Position = projectionMatrix * modelViewMatrix * vec4(transformed, 1.0);\n}\n`;\n\nconst fragmentShader = `\nvarying vec2 vUv;\nuniform float mouse;\nuniform float uTime;\nuniform sampler2D uTexture;\n\nvoid main() {\n    float time = uTime;\n    vec2 pos = vUv;\n    \n    float move = sin(time + mouse) * 0.01;\n    float r = texture2D(uTexture, pos + cos(time * 2. - time + pos.x) * .01).r;\n    float g = texture2D(uTexture, pos + tan(time * .5 + pos.x - time) * .01).g;\n    float b = texture2D(uTexture, pos - cos(time * 2. + time + pos.y) * .01).b;\n    float a = texture2D(uTexture, pos).a;\n    gl_FragColor = vec4(r, g, b, a);\n}\n`;\n\nconst PX_RATIO = typeof window !== \"undefined\" ? window.devicePixelRatio : 1;\n\nconst resolvedCanvasColorCache = new Map<string, string>();\n\nconst getThemeSignature = () => {\n  if (typeof document === \"undefined\") return \"\";\n\n  const root = document.documentElement;\n  return [\n    root.getAttribute(\"data-brand\") ?? \"\",\n    root.getAttribute(\"data-mode\") ?? \"\",\n    root.getAttribute(\"data-theme\") ?? \"\",\n  ].join(\"|\");\n};\n\nconst resolveCanvasColor = (value: string): string => {\n  if (typeof document === \"undefined\") return value;\n  if (!value.includes(\"var(\") && !value.includes(\"color-mix(\")) return value;\n\n  const cacheKey = `${getThemeSignature()}::${value}`;\n  const cachedValue = resolvedCanvasColorCache.get(cacheKey);\n  if (cachedValue) {\n    return cachedValue;\n  }\n\n  const probe = document.createElement(\"span\");\n  probe.style.color = value;\n  probe.style.position = \"fixed\";\n  probe.style.pointerEvents = \"none\";\n  probe.style.opacity = \"0\";\n  document.body.appendChild(probe);\n  const resolvedValue = getComputedStyle(probe).color || value;\n  document.body.removeChild(probe);\n  resolvedCanvasColorCache.set(cacheKey, resolvedValue);\n  return resolvedValue;\n};\n\ninterface AsciiFilterOptions {\n  fontSize?: number;\n  fontFamily?: string;\n  charset?: string;\n  invert?: boolean;\n}\n\nclass AsciiFilter {\n  renderer: THREE.WebGLRenderer;\n  domElement: HTMLDivElement;\n  pre: HTMLPreElement;\n  canvas: HTMLCanvasElement;\n  context: CanvasRenderingContext2D;\n  deg: number;\n  invert: boolean;\n  fontSize: number;\n  fontFamily: string;\n  charset: string;\n  width: number = 0;\n  height: number = 0;\n  cols: number = 0;\n  rows: number = 0;\n  center: { x: number; y: number } = { x: 0, y: 0 };\n  mouse: { x: number; y: number } = { x: 0, y: 0 };\n\n  constructor(\n    renderer: THREE.WebGLRenderer,\n    { fontSize, fontFamily, charset, invert }: AsciiFilterOptions = {},\n  ) {\n    this.renderer = renderer;\n    this.domElement = document.createElement(\"div\");\n    this.domElement.style.position = \"absolute\";\n    this.domElement.style.top = \"0\";\n    this.domElement.style.left = \"0\";\n    this.domElement.style.width = \"100%\";\n    this.domElement.style.height = \"100%\";\n\n    this.pre = document.createElement(\"pre\");\n    this.domElement.appendChild(this.pre);\n\n    this.canvas = document.createElement(\"canvas\");\n    const ctx = this.canvas.getContext(\"2d\");\n    if (!ctx) throw new Error(\"Could not get 2d context\");\n    this.context = ctx;\n    this.domElement.appendChild(this.canvas);\n\n    this.deg = 0;\n    this.invert = invert ?? true;\n    this.fontSize = fontSize ?? 12;\n    this.fontFamily = fontFamily ?? \"'Courier New', monospace\";\n    this.charset =\n      charset ??\n      \" .'`^\\\",:;Il!i~+_-?][}{1)(|/tfjrxnuvczXYUJCLQ0OZmwqpdbkhao*#MW&8%B@$\";\n\n    this.context.imageSmoothingEnabled = false;\n\n    this.onMouseMove = this.onMouseMove.bind(this);\n    document.addEventListener(\"mousemove\", this.onMouseMove);\n  }\n\n  setSize(width: number, height: number) {\n    this.width = width;\n    this.height = height;\n    this.renderer.setSize(width, height);\n    this.reset();\n\n    this.center = { x: width / 2, y: height / 2 };\n    this.mouse = { x: this.center.x, y: this.center.y };\n  }\n\n  reset() {\n    this.context.font = `${this.fontSize}px ${this.fontFamily}`;\n    const charWidth = this.context.measureText(\"A\").width;\n\n    this.cols = Math.floor(\n      this.width / (this.fontSize * (charWidth / this.fontSize)),\n    );\n    this.rows = Math.floor(this.height / this.fontSize);\n\n    this.canvas.width = this.cols;\n    this.canvas.height = this.rows;\n    this.pre.style.fontFamily = this.fontFamily;\n    this.pre.style.fontSize = `${this.fontSize}px`;\n    this.pre.style.margin = \"0\";\n    this.pre.style.padding = \"0\";\n    this.pre.style.lineHeight = \"1em\";\n    this.pre.style.position = \"absolute\";\n    this.pre.style.left = \"0\";\n    this.pre.style.top = \"0\";\n    this.pre.style.zIndex = \"9\";\n    this.pre.style.backgroundAttachment = \"fixed\";\n    this.pre.style.mixBlendMode = \"difference\";\n  }\n\n  render(scene: THREE.Scene, camera: THREE.Camera) {\n    this.renderer.render(scene, camera);\n\n    const w = this.canvas.width;\n    const h = this.canvas.height;\n    this.context.clearRect(0, 0, w, h);\n    if (this.context && w && h) {\n      this.context.drawImage(this.renderer.domElement, 0, 0, w, h);\n    }\n\n    this.asciify(this.context, w, h);\n    this.hue();\n  }\n\n  onMouseMove(e: MouseEvent) {\n    this.mouse = { x: e.clientX * PX_RATIO, y: e.clientY * PX_RATIO };\n  }\n\n  get dx() {\n    return this.mouse.x - this.center.x;\n  }\n\n  get dy() {\n    return this.mouse.y - this.center.y;\n  }\n\n  hue() {\n    const deg = (Math.atan2(this.dy, this.dx) * 180) / Math.PI;\n    this.deg += (deg - this.deg) * 0.075;\n    this.domElement.style.filter = `hue-rotate(${this.deg.toFixed(1)}deg)`;\n  }\n\n  asciify(ctx: CanvasRenderingContext2D, w: number, h: number) {\n    if (w && h) {\n      const imgData = ctx.getImageData(0, 0, w, h).data;\n      let str = \"\";\n      for (let y = 0; y < h; y++) {\n        for (let x = 0; x < w; x++) {\n          const i = x * 4 + y * 4 * w;\n          const [r, g, b, a] = [\n            imgData[i],\n            imgData[i + 1],\n            imgData[i + 2],\n            imgData[i + 3],\n          ];\n\n          if (a === 0) {\n            str += \" \";\n            continue;\n          }\n\n          const gray = (0.3 * r + 0.6 * g + 0.1 * b) / 255;\n          let idx = Math.floor((1 - gray) * (this.charset.length - 1));\n          if (this.invert) idx = this.charset.length - idx - 1;\n          str += this.charset[idx];\n        }\n        str += \"\\n\";\n      }\n      this.pre.innerHTML = str;\n    }\n  }\n\n  dispose() {\n    document.removeEventListener(\"mousemove\", this.onMouseMove);\n  }\n}\n\ninterface CanvasTxtOptions {\n  fontSize?: number;\n  fontFamily?: string;\n  color?: string;\n}\n\nclass CanvasTxt {\n  canvas: HTMLCanvasElement;\n  context: CanvasRenderingContext2D;\n  txt: string;\n  fontSize: number;\n  fontFamily: string;\n  color: string;\n  font: string;\n\n  constructor(\n    txt: string,\n    {\n      fontSize = 200,\n      fontFamily = \"Arial\",\n      color = \"var(--ds-color-fg)\",\n    }: CanvasTxtOptions = {},\n  ) {\n    this.canvas = document.createElement(\"canvas\");\n    const ctx = this.canvas.getContext(\"2d\");\n    if (!ctx) throw new Error(\"Could not get 2d context\");\n    this.context = ctx;\n    this.txt = txt;\n    this.fontSize = fontSize;\n    this.fontFamily = fontFamily;\n    this.color = color;\n\n    this.font = `600 ${this.fontSize}px ${this.fontFamily}`;\n  }\n\n  resize() {\n    this.context.font = this.font;\n    const metrics = this.context.measureText(this.txt);\n\n    const textWidth = Math.ceil(metrics.width) + 20;\n    const textHeight =\n      Math.ceil(\n        metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent,\n      ) + 20;\n\n    this.canvas.width = textWidth;\n    this.canvas.height = textHeight;\n  }\n\n  render() {\n    this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);\n    this.context.fillStyle = resolveCanvasColor(this.color);\n    this.context.font = this.font;\n\n    const metrics = this.context.measureText(this.txt);\n    const yPos = 10 + metrics.actualBoundingBoxAscent;\n\n    this.context.fillText(this.txt, 10, yPos);\n  }\n\n  get width() {\n    return this.canvas.width;\n  }\n\n  get height() {\n    return this.canvas.height;\n  }\n\n  get texture() {\n    return this.canvas;\n  }\n}\n\ninterface CanvAsciiOptions {\n  text: string;\n  asciiFontSize: number;\n  textFontSize: number;\n  textColor: string;\n  planeBaseHeight: number;\n  enableWaves: boolean;\n}\n\nclass CanvAscii {\n  textString: string;\n  asciiFontSize: number;\n  textFontSize: number;\n  textColor: string;\n  planeBaseHeight: number;\n  container: HTMLElement;\n  width: number;\n  height: number;\n  enableWaves: boolean;\n  camera: THREE.PerspectiveCamera;\n  scene: THREE.Scene;\n  mouse: { x: number; y: number };\n  textCanvas!: CanvasTxt;\n  texture!: THREE.CanvasTexture;\n  geometry!: THREE.PlaneGeometry;\n  material!: THREE.ShaderMaterial;\n  mesh!: THREE.Mesh;\n  renderer!: THREE.WebGLRenderer;\n  filter!: AsciiFilter;\n  center: { x: number; y: number } = { x: 0, y: 0 };\n  animationFrameId: number = 0;\n\n  constructor(\n    {\n      text,\n      asciiFontSize,\n      textFontSize,\n      textColor,\n      planeBaseHeight,\n      enableWaves,\n    }: CanvAsciiOptions,\n    containerElem: HTMLElement,\n    width: number,\n    height: number,\n  ) {\n    this.textString = text;\n    this.asciiFontSize = asciiFontSize;\n    this.textFontSize = textFontSize;\n    this.textColor = textColor;\n    this.planeBaseHeight = planeBaseHeight;\n    this.container = containerElem;\n    this.width = width;\n    this.height = height;\n    this.enableWaves = enableWaves;\n\n    this.camera = new THREE.PerspectiveCamera(\n      45,\n      this.width / this.height,\n      1,\n      1000,\n    );\n    this.camera.position.z = 30;\n\n    this.scene = new THREE.Scene();\n    this.mouse = { x: 0, y: 0 };\n\n    this.onMouseMove = this.onMouseMove.bind(this);\n\n    this.setMesh();\n    this.setRenderer();\n  }\n\n  setMesh() {\n    this.textCanvas = new CanvasTxt(this.textString, {\n      fontSize: this.textFontSize,\n      fontFamily: \"IBM Plex Mono\",\n      color: this.textColor,\n    });\n    this.textCanvas.resize();\n    this.textCanvas.render();\n\n    this.texture = new THREE.CanvasTexture(this.textCanvas.texture);\n    this.texture.minFilter = THREE.NearestFilter;\n\n    const textAspect = this.textCanvas.width / this.textCanvas.height;\n    const baseH = this.planeBaseHeight;\n    const planeW = baseH * textAspect;\n    const planeH = baseH;\n\n    this.geometry = new THREE.PlaneGeometry(planeW, planeH, 36, 36);\n    this.material = new THREE.ShaderMaterial({\n      vertexShader,\n      fragmentShader,\n      transparent: true,\n      uniforms: {\n        uTime: { value: 0 },\n        mouse: { value: 1.0 },\n        uTexture: { value: this.texture },\n        uEnableWaves: { value: this.enableWaves ? 1.0 : 0.0 },\n      },\n    });\n\n    this.mesh = new THREE.Mesh(this.geometry, this.material);\n    this.scene.add(this.mesh);\n  }\n\n  setRenderer() {\n    this.renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true });\n    this.renderer.setPixelRatio(1);\n    this.renderer.setClearColor(0x000000, 0);\n\n    this.filter = new AsciiFilter(this.renderer, {\n      fontFamily: \"IBM Plex Mono\",\n      fontSize: this.asciiFontSize,\n      invert: true,\n    });\n\n    this.container.appendChild(this.filter.domElement);\n    this.setSize(this.width, this.height);\n\n    this.container.addEventListener(\"mousemove\", this.onMouseMove);\n    this.container.addEventListener(\"touchmove\", this.onMouseMove);\n  }\n\n  setSize(w: number, h: number) {\n    this.width = w;\n    this.height = h;\n\n    this.camera.aspect = w / h;\n    this.camera.updateProjectionMatrix();\n\n    this.filter.setSize(w, h);\n\n    this.center = { x: w / 2, y: h / 2 };\n  }\n\n  load() {\n    this.animate();\n  }\n\n  onMouseMove(evt: any) {\n    const e = evt.touches ? evt.touches[0] : evt;\n    const bounds = this.container.getBoundingClientRect();\n    const x = e.clientX - bounds.left;\n    const y = e.clientY - bounds.top;\n    this.mouse = { x, y };\n  }\n\n  animate() {\n    const animateFrame = () => {\n      this.animationFrameId = requestAnimationFrame(animateFrame);\n      this.render();\n    };\n    animateFrame();\n  }\n\n  render() {\n    const time = new Date().getTime() * 0.001;\n\n    this.textCanvas.render();\n    this.texture.needsUpdate = true;\n\n    (this.mesh.material as any).uniforms.uTime.value = Math.sin(time);\n\n    this.updateRotation();\n    this.filter.render(this.scene, this.camera);\n  }\n\n  updateRotation() {\n    const map = (\n      n: number,\n      start: number,\n      stop: number,\n      start2: number,\n      stop2: number,\n    ) => {\n      return ((n - start) / (stop - start)) * (stop2 - start2) + start2;\n    };\n\n    const x = map(this.mouse.y, 0, this.height, 0.5, -0.5);\n    const y = map(this.mouse.x, 0, this.width, -0.5, 0.5);\n\n    this.mesh.rotation.x += (x - this.mesh.rotation.x) * 0.05;\n    this.mesh.rotation.y += (y - this.mesh.rotation.y) * 0.05;\n  }\n\n  clear() {\n    this.scene.traverse((obj: THREE.Object3D) => {\n      if (obj instanceof THREE.Mesh) {\n        if (Array.isArray(obj.material)) {\n          obj.material.forEach((m: THREE.Material) => m.dispose());\n        } else if (obj.material instanceof THREE.Material) {\n          obj.material.dispose();\n        }\n        obj.geometry.dispose();\n      }\n    });\n    this.scene.clear();\n  }\n\n  dispose() {\n    cancelAnimationFrame(this.animationFrameId);\n    this.filter.dispose();\n    if (this.filter.domElement.parentNode === this.container) {\n      this.container.removeChild(this.filter.domElement);\n    }\n    this.container.removeEventListener(\"mousemove\", this.onMouseMove);\n    this.container.removeEventListener(\"touchmove\", this.onMouseMove);\n    this.clear();\n    this.renderer.dispose();\n  }\n}\n\nexport interface ASCIITextProps {\n  text?: string;\n  asciiFontSize?: number;\n  textFontSize?: number;\n  textColor?: string;\n  planeBaseHeight?: number;\n  enableWaves?: boolean;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport const ASCIIText: React.FC<ASCIITextProps> = ({\n  text = \"David!\",\n  asciiFontSize = 8,\n  textFontSize = 200,\n  textColor = \"var(--ds-color-fg)\",\n  planeBaseHeight = 8,\n  enableWaves = true,\n  className = \"\",\n  style = {},\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const asciiRef = useRef<CanvAscii | null>(null);\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n\n    const { width, height } = containerRef.current.getBoundingClientRect();\n\n    const initAscii = (w: number, h: number) => {\n      if (asciiRef.current) asciiRef.current.dispose();\n      asciiRef.current = new CanvAscii(\n        {\n          text,\n          asciiFontSize,\n          textFontSize,\n          textColor,\n          planeBaseHeight,\n          enableWaves,\n        },\n        containerRef.current!,\n        w,\n        h,\n      );\n      asciiRef.current.load();\n    };\n\n    if (width === 0 || height === 0) {\n      const observer = new IntersectionObserver(\n        ([entry]) => {\n          if (\n            entry.isIntersecting &&\n            entry.boundingClientRect.width > 0 &&\n            entry.boundingClientRect.height > 0\n          ) {\n            initAscii(\n              entry.boundingClientRect.width,\n              entry.boundingClientRect.height,\n            );\n            observer.disconnect();\n          }\n        },\n        { threshold: 0.1 },\n      );\n\n      observer.observe(containerRef.current);\n\n      return () => {\n        observer.disconnect();\n        if (asciiRef.current) {\n          asciiRef.current.dispose();\n        }\n      };\n    }\n\n    initAscii(width, height);\n\n    const ro = new ResizeObserver((entries) => {\n      if (!entries[0] || !asciiRef.current) return;\n      const { width: w, height: h } = entries[0].contentRect;\n      if (w > 0 && h > 0) {\n        asciiRef.current.setSize(w, h);\n      }\n    });\n    ro.observe(containerRef.current);\n\n    return () => {\n      ro.disconnect();\n      if (asciiRef.current) {\n        asciiRef.current.dispose();\n      }\n    };\n  }, [\n    text,\n    asciiFontSize,\n    textFontSize,\n    textColor,\n    planeBaseHeight,\n    enableWaves,\n  ]);\n\n  return (\n    <div\n      ref={containerRef}\n      className={`ascii-text-container ${className}`}\n      style={{\n        position: \"absolute\",\n        width: \"100%\",\n        height: \"100%\",\n        ...style,\n      }}\n    >\n      <style>{`\n        @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&display=swap');\n\n        .ascii-text-container canvas {\n          position: absolute;\n          left: 0;\n          top: 0;\n          width: 100%;\n          height: 100%;\n          image-rendering: optimizeSpeed;\n          image-rendering: -moz-crisp-edges;\n          image-rendering: -o-crisp-edges;\n          image-rendering: -webkit-optimize-contrast;\n          image-rendering: optimize-contrast;\n          image-rendering: crisp-edges;\n          image-rendering: pixelated;\n        }\n\n        .ascii-text-container pre {\n          margin: 0;\n          user-select: none;\n          padding: 0;\n          line-height: 1em;\n          text-align: left;\n          position: absolute;\n          left: 0;\n          top: 0;\n          background-image: radial-gradient(circle, var(--ds-color-accent) 0%, var(--ds-color-accent-hover) 50%, var(--ds-color-warning) 100%);\n          background-attachment: fixed;\n          -webkit-text-fill-color: transparent;\n          -webkit-background-clip: text;\n          background-clip: text;\n          z-index: 9;\n          mix-blend-mode: difference;\n        }\n      `}</style>\n    </div>\n  );\n};\n\nexport default ASCIIText;\n"],"mappings":"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"}

package/dist/chunks/background-gradient-animation-BL-lnrJe.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"background-gradient-animation-BL-lnrJe.mjs","names":[],"sources":["../../src/components/effects/background-gradient-animation/BackgroundGradientAnimation.tsx","../../src/components/effects/background-gradient-animation/BackgroundGradientAnimationDemo.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { mergeClassNames } from '../../../utils';\n\nexport interface BackgroundGradientAnimationProps {\n  gradientBackgroundStart?: string;\n  gradientBackgroundEnd?: string;\n  firstColor?: string;\n  secondColor?: string;\n  thirdColor?: string;\n  fourthColor?: string;\n  fifthColor?: string;\n  pointerColor?: string;\n  size?: string;\n  blendingValue?: string;\n  children?: React.ReactNode;\n  className?: string;\n  interactive?: boolean;\n  containerClassName?: string;\n}\n\nexport const BackgroundGradientAnimation = ({\n  gradientBackgroundStart = 'rgb(108, 0, 162)',\n  gradientBackgroundEnd = 'rgb(0, 17, 82)',\n  firstColor = '18, 113, 255',\n  secondColor = '221, 74, 255',\n  thirdColor = '100, 220, 255',\n  fourthColor = '200, 50, 50',\n  fifthColor = '180, 180, 50',\n  pointerColor = '140, 100, 255',\n  size = '80%',\n  blendingValue = 'hard-light',\n  children,\n  className,\n  interactive = true,\n  containerClassName,\n}: BackgroundGradientAnimationProps) => {\n  const interactiveRef = useRef<HTMLDivElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const currentPositionRef = useRef({ x: 0, y: 0 });\n  const targetPositionRef = useRef({ x: 0, y: 0 });\n\n  useEffect(() => {\n    if (!interactive) {\n      return;\n    }\n\n    let animationFrameId = 0;\n\n    const move = () => {\n      const interactiveElement = interactiveRef.current;\n\n      if (interactiveElement) {\n        const currentPosition = currentPositionRef.current;\n        const targetPosition = targetPositionRef.current;\n\n        currentPosition.x += (targetPosition.x - currentPosition.x) / 20;\n        currentPosition.y += (targetPosition.y - currentPosition.y) / 20;\n\n        interactiveElement.style.transform = `translate(${Math.round(\n          currentPosition.x,\n        )}px, ${Math.round(currentPosition.y)}px)`;\n      }\n\n      animationFrameId = window.requestAnimationFrame(move);\n    };\n\n    animationFrameId = window.requestAnimationFrame(move);\n\n    return () => {\n      window.cancelAnimationFrame(animationFrameId);\n    };\n  }, [interactive]);\n\n  const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (interactiveRef.current) {\n      const rect = interactiveRef.current.getBoundingClientRect();\n      targetPositionRef.current = {\n        x: event.clientX - rect.left,\n        y: event.clientY - rect.top,\n      };\n    }\n  };\n\n  const [isSafari] = useState(() =>\n    typeof navigator !== 'undefined'\n      ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent)\n      : false,\n  );\n\n  const blobStyle = (\n    color: string,\n    _animationClass: string,\n    transformOrigin: string,\n    opacity: number = 1,\n  ): React.CSSProperties => ({\n    position: 'absolute',\n    width: size,\n    height: size,\n    top: `calc(50% - ${size} / 2)`,\n    left: `calc(50% - ${size} / 2)`,\n    background: `radial-gradient(circle at center, rgba(${color}, 0.8) 0, rgba(${color}, 0) 50%) no-repeat`,\n    mixBlendMode: blendingValue as React.CSSProperties['mixBlendMode'],\n    transformOrigin,\n    opacity,\n  });\n\n  return (\n    <div\n      ref={containerRef}\n      className={mergeClassNames(\n        'h-screen w-screen relative overflow-hidden top-0 left-0',\n        containerClassName,\n      )}\n      style={{\n        background: `linear-gradient(40deg, ${gradientBackgroundStart}, ${gradientBackgroundEnd})`,\n      }}\n    >\n      <svg className=\"hidden\">\n        <defs>\n          <filter id=\"blurMe\">\n            <feGaussianBlur\n              in=\"SourceGraphic\"\n              stdDeviation=\"10\"\n              result=\"blur\"\n            />\n            <feColorMatrix\n              in=\"blur\"\n              mode=\"matrix\"\n              values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -8\"\n              result=\"goo\"\n            />\n            <feBlend in=\"SourceGraphic\" in2=\"goo\" />\n          </filter>\n        </defs>\n      </svg>\n      <div className={mergeClassNames('', className)}>{children}</div>\n      <div\n        className=\"h-full w-full\"\n        style={{\n          filter: isSafari ? 'blur(24px)' : 'url(#blurMe) blur(40px)',\n        }}\n      >\n        {/* First blob */}\n        <div\n          className=\"ui:animate-gradient-first\"\n          style={blobStyle(\n            firstColor,\n            'animate-gradient-first',\n            'center center',\n          )}\n        />\n        {/* Second blob */}\n        <div\n          className=\"ui:animate-gradient-second\"\n          style={blobStyle(\n            secondColor,\n            'animate-gradient-second',\n            'calc(50% - 400px)',\n          )}\n        />\n        {/* Third blob */}\n        <div\n          className=\"ui:animate-gradient-third\"\n          style={blobStyle(\n            thirdColor,\n            'animate-gradient-third',\n            'calc(50% + 400px)',\n          )}\n        />\n        {/* Fourth blob */}\n        <div\n          className=\"ui:animate-gradient-fourth\"\n          style={blobStyle(\n            fourthColor,\n            'animate-gradient-fourth',\n            'calc(50% - 200px)',\n            0.7,\n          )}\n        />\n        {/* Fifth blob */}\n        <div\n          className=\"ui:animate-gradient-fifth\"\n          style={blobStyle(\n            fifthColor,\n            'animate-gradient-fifth',\n            'calc(50% - 800px) calc(50% + 800px)',\n          )}\n        />\n\n        {interactive && (\n          <div\n            ref={interactiveRef}\n            onMouseMove={handleMouseMove}\n            className=\"absolute w-full h-full\"\n            style={{\n              top: '-50%',\n              left: '-50%',\n              willChange: 'transform',\n              opacity: 0.7,\n              background: `radial-gradient(circle at center, rgba(${pointerColor}, 0.8) 0, rgba(${pointerColor}, 0) 50%) no-repeat`,\n              mixBlendMode:\n                blendingValue as React.CSSProperties['mixBlendMode'],\n            }}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n","import { BackgroundGradientAnimation } from \"./BackgroundGradientAnimation\";\n\nexport default function BackgroundGradientAnimationDemo() {\n  return (\n    <BackgroundGradientAnimation>\n      <div className=\"ui:absolute ui:z-50 ui:inset-0 ui:flex ui:items-center ui:justify-center ui:text-white ui:font-bold ui:px-4 ui:pointer-events-none ui:text-3xl ui:text-center md:ui:text-4xl lg:ui:text-7xl\">\n        <p className=\"ui:bg-clip-text ui:text-transparent ui:drop-shadow-2xl ui:bg-gradient-to-b ui:from-white/80 ui:to-white/20\">\n          Gradients X Animations\n        </p>\n      </div>\n    </BackgroundGradientAnimation>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"background-gradient-animation-BL-lnrJe.mjs","names":[],"sources":["../../src/components/effects/background-gradient-animation/BackgroundGradientAnimation.tsx","../../src/components/effects/background-gradient-animation/BackgroundGradientAnimationDemo.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { mergeClassNames } from \"../../../utils\";\n\nexport interface BackgroundGradientAnimationProps {\n  gradientBackgroundStart?: string;\n  gradientBackgroundEnd?: string;\n  firstColor?: string;\n  secondColor?: string;\n  thirdColor?: string;\n  fourthColor?: string;\n  fifthColor?: string;\n  pointerColor?: string;\n  size?: string;\n  blendingValue?: string;\n  children?: React.ReactNode;\n  className?: string;\n  interactive?: boolean;\n  containerClassName?: string;\n}\n\nexport const BackgroundGradientAnimation = ({\n  gradientBackgroundStart = \"rgb(108, 0, 162)\",\n  gradientBackgroundEnd = \"rgb(0, 17, 82)\",\n  firstColor = \"18, 113, 255\",\n  secondColor = \"221, 74, 255\",\n  thirdColor = \"100, 220, 255\",\n  fourthColor = \"200, 50, 50\",\n  fifthColor = \"180, 180, 50\",\n  pointerColor = \"140, 100, 255\",\n  size = \"80%\",\n  blendingValue = \"hard-light\",\n  children,\n  className,\n  interactive = true,\n  containerClassName,\n}: BackgroundGradientAnimationProps) => {\n  const interactiveRef = useRef<HTMLDivElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const currentPositionRef = useRef({ x: 0, y: 0 });\n  const targetPositionRef = useRef({ x: 0, y: 0 });\n\n  useEffect(() => {\n    if (!interactive) {\n      return;\n    }\n\n    let animationFrameId = 0;\n\n    const move = () => {\n      const interactiveElement = interactiveRef.current;\n\n      if (interactiveElement) {\n        const currentPosition = currentPositionRef.current;\n        const targetPosition = targetPositionRef.current;\n\n        currentPosition.x += (targetPosition.x - currentPosition.x) / 20;\n        currentPosition.y += (targetPosition.y - currentPosition.y) / 20;\n\n        interactiveElement.style.transform = `translate(${Math.round(\n          currentPosition.x,\n        )}px, ${Math.round(currentPosition.y)}px)`;\n      }\n\n      animationFrameId = window.requestAnimationFrame(move);\n    };\n\n    animationFrameId = window.requestAnimationFrame(move);\n\n    return () => {\n      window.cancelAnimationFrame(animationFrameId);\n    };\n  }, [interactive]);\n\n  const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (interactiveRef.current) {\n      const rect = interactiveRef.current.getBoundingClientRect();\n      targetPositionRef.current = {\n        x: event.clientX - rect.left,\n        y: event.clientY - rect.top,\n      };\n    }\n  };\n\n  const [isSafari] = useState(() =>\n    typeof navigator !== \"undefined\"\n      ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent)\n      : false,\n  );\n\n  const blobStyle = (\n    color: string,\n    _animationClass: string,\n    transformOrigin: string,\n    opacity: number = 1,\n  ): React.CSSProperties => ({\n    position: \"absolute\",\n    width: size,\n    height: size,\n    top: `calc(50% - ${size} / 2)`,\n    left: `calc(50% - ${size} / 2)`,\n    background: `radial-gradient(circle at center, rgba(${color}, 0.8) 0, rgba(${color}, 0) 50%) no-repeat`,\n    mixBlendMode: blendingValue as React.CSSProperties[\"mixBlendMode\"],\n    transformOrigin,\n    opacity,\n  });\n\n  return (\n    <div\n      ref={containerRef}\n      className={mergeClassNames(\n        \"h-screen w-screen relative overflow-hidden top-0 left-0\",\n        containerClassName,\n      )}\n      style={{\n        background: `linear-gradient(40deg, ${gradientBackgroundStart}, ${gradientBackgroundEnd})`,\n      }}\n    >\n      <svg className=\"hidden\">\n        <defs>\n          <filter id=\"blurMe\">\n            <feGaussianBlur\n              in=\"SourceGraphic\"\n              stdDeviation=\"10\"\n              result=\"blur\"\n            />\n            <feColorMatrix\n              in=\"blur\"\n              mode=\"matrix\"\n              values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -8\"\n              result=\"goo\"\n            />\n            <feBlend in=\"SourceGraphic\" in2=\"goo\" />\n          </filter>\n        </defs>\n      </svg>\n      <div className={mergeClassNames(\"\", className)}>{children}</div>\n      <div\n        className=\"h-full w-full\"\n        style={{\n          filter: isSafari ? \"blur(24px)\" : \"url(#blurMe) blur(40px)\",\n        }}\n      >\n        {/* First blob */}\n        <div\n          className=\"ui:animate-gradient-first\"\n          style={blobStyle(\n            firstColor,\n            \"animate-gradient-first\",\n            \"center center\",\n          )}\n        />\n        {/* Second blob */}\n        <div\n          className=\"ui:animate-gradient-second\"\n          style={blobStyle(\n            secondColor,\n            \"animate-gradient-second\",\n            \"calc(50% - 400px)\",\n          )}\n        />\n        {/* Third blob */}\n        <div\n          className=\"ui:animate-gradient-third\"\n          style={blobStyle(\n            thirdColor,\n            \"animate-gradient-third\",\n            \"calc(50% + 400px)\",\n          )}\n        />\n        {/* Fourth blob */}\n        <div\n          className=\"ui:animate-gradient-fourth\"\n          style={blobStyle(\n            fourthColor,\n            \"animate-gradient-fourth\",\n            \"calc(50% - 200px)\",\n            0.7,\n          )}\n        />\n        {/* Fifth blob */}\n        <div\n          className=\"ui:animate-gradient-fifth\"\n          style={blobStyle(\n            fifthColor,\n            \"animate-gradient-fifth\",\n            \"calc(50% - 800px) calc(50% + 800px)\",\n          )}\n        />\n\n        {interactive && (\n          <div\n            ref={interactiveRef}\n            onMouseMove={handleMouseMove}\n            className=\"absolute w-full h-full\"\n            style={{\n              top: \"-50%\",\n              left: \"-50%\",\n              willChange: \"transform\",\n              opacity: 0.7,\n              background: `radial-gradient(circle at center, rgba(${pointerColor}, 0.8) 0, rgba(${pointerColor}, 0) 50%) no-repeat`,\n              mixBlendMode:\n                blendingValue as React.CSSProperties[\"mixBlendMode\"],\n            }}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n","import { BackgroundGradientAnimation } from \"./BackgroundGradientAnimation\";\n\nexport default function BackgroundGradientAnimationDemo() {\n  return (\n    <BackgroundGradientAnimation>\n      <div className=\"ui:absolute ui:z-50 ui:inset-0 ui:flex ui:items-center ui:justify-center ui:text-white ui:font-bold ui:px-4 ui:pointer-events-none ui:text-3xl ui:text-center md:ui:text-4xl lg:ui:text-7xl\">\n        <p className=\"ui:bg-clip-text ui:text-transparent ui:drop-shadow-2xl ui:bg-gradient-to-b ui:from-white/80 ui:to-white/20\">\n          Gradients X Animations\n        </p>\n      </div>\n    </BackgroundGradientAnimation>\n  );\n}\n"],"mappings":"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"}

package/dist/chunks/background-gradient-animation-CXV9GDH8.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"background-gradient-animation-CXV9GDH8.cjs","names":[],"sources":["../../src/components/effects/background-gradient-animation/BackgroundGradientAnimation.tsx","../../src/components/effects/background-gradient-animation/BackgroundGradientAnimationDemo.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { mergeClassNames } from '../../../utils';\n\nexport interface BackgroundGradientAnimationProps {\n  gradientBackgroundStart?: string;\n  gradientBackgroundEnd?: string;\n  firstColor?: string;\n  secondColor?: string;\n  thirdColor?: string;\n  fourthColor?: string;\n  fifthColor?: string;\n  pointerColor?: string;\n  size?: string;\n  blendingValue?: string;\n  children?: React.ReactNode;\n  className?: string;\n  interactive?: boolean;\n  containerClassName?: string;\n}\n\nexport const BackgroundGradientAnimation = ({\n  gradientBackgroundStart = 'rgb(108, 0, 162)',\n  gradientBackgroundEnd = 'rgb(0, 17, 82)',\n  firstColor = '18, 113, 255',\n  secondColor = '221, 74, 255',\n  thirdColor = '100, 220, 255',\n  fourthColor = '200, 50, 50',\n  fifthColor = '180, 180, 50',\n  pointerColor = '140, 100, 255',\n  size = '80%',\n  blendingValue = 'hard-light',\n  children,\n  className,\n  interactive = true,\n  containerClassName,\n}: BackgroundGradientAnimationProps) => {\n  const interactiveRef = useRef<HTMLDivElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const currentPositionRef = useRef({ x: 0, y: 0 });\n  const targetPositionRef = useRef({ x: 0, y: 0 });\n\n  useEffect(() => {\n    if (!interactive) {\n      return;\n    }\n\n    let animationFrameId = 0;\n\n    const move = () => {\n      const interactiveElement = interactiveRef.current;\n\n      if (interactiveElement) {\n        const currentPosition = currentPositionRef.current;\n        const targetPosition = targetPositionRef.current;\n\n        currentPosition.x += (targetPosition.x - currentPosition.x) / 20;\n        currentPosition.y += (targetPosition.y - currentPosition.y) / 20;\n\n        interactiveElement.style.transform = `translate(${Math.round(\n          currentPosition.x,\n        )}px, ${Math.round(currentPosition.y)}px)`;\n      }\n\n      animationFrameId = window.requestAnimationFrame(move);\n    };\n\n    animationFrameId = window.requestAnimationFrame(move);\n\n    return () => {\n      window.cancelAnimationFrame(animationFrameId);\n    };\n  }, [interactive]);\n\n  const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (interactiveRef.current) {\n      const rect = interactiveRef.current.getBoundingClientRect();\n      targetPositionRef.current = {\n        x: event.clientX - rect.left,\n        y: event.clientY - rect.top,\n      };\n    }\n  };\n\n  const [isSafari] = useState(() =>\n    typeof navigator !== 'undefined'\n      ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent)\n      : false,\n  );\n\n  const blobStyle = (\n    color: string,\n    _animationClass: string,\n    transformOrigin: string,\n    opacity: number = 1,\n  ): React.CSSProperties => ({\n    position: 'absolute',\n    width: size,\n    height: size,\n    top: `calc(50% - ${size} / 2)`,\n    left: `calc(50% - ${size} / 2)`,\n    background: `radial-gradient(circle at center, rgba(${color}, 0.8) 0, rgba(${color}, 0) 50%) no-repeat`,\n    mixBlendMode: blendingValue as React.CSSProperties['mixBlendMode'],\n    transformOrigin,\n    opacity,\n  });\n\n  return (\n    <div\n      ref={containerRef}\n      className={mergeClassNames(\n        'h-screen w-screen relative overflow-hidden top-0 left-0',\n        containerClassName,\n      )}\n      style={{\n        background: `linear-gradient(40deg, ${gradientBackgroundStart}, ${gradientBackgroundEnd})`,\n      }}\n    >\n      <svg className=\"hidden\">\n        <defs>\n          <filter id=\"blurMe\">\n            <feGaussianBlur\n              in=\"SourceGraphic\"\n              stdDeviation=\"10\"\n              result=\"blur\"\n            />\n            <feColorMatrix\n              in=\"blur\"\n              mode=\"matrix\"\n              values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -8\"\n              result=\"goo\"\n            />\n            <feBlend in=\"SourceGraphic\" in2=\"goo\" />\n          </filter>\n        </defs>\n      </svg>\n      <div className={mergeClassNames('', className)}>{children}</div>\n      <div\n        className=\"h-full w-full\"\n        style={{\n          filter: isSafari ? 'blur(24px)' : 'url(#blurMe) blur(40px)',\n        }}\n      >\n        {/* First blob */}\n        <div\n          className=\"ui:animate-gradient-first\"\n          style={blobStyle(\n            firstColor,\n            'animate-gradient-first',\n            'center center',\n          )}\n        />\n        {/* Second blob */}\n        <div\n          className=\"ui:animate-gradient-second\"\n          style={blobStyle(\n            secondColor,\n            'animate-gradient-second',\n            'calc(50% - 400px)',\n          )}\n        />\n        {/* Third blob */}\n        <div\n          className=\"ui:animate-gradient-third\"\n          style={blobStyle(\n            thirdColor,\n            'animate-gradient-third',\n            'calc(50% + 400px)',\n          )}\n        />\n        {/* Fourth blob */}\n        <div\n          className=\"ui:animate-gradient-fourth\"\n          style={blobStyle(\n            fourthColor,\n            'animate-gradient-fourth',\n            'calc(50% - 200px)',\n            0.7,\n          )}\n        />\n        {/* Fifth blob */}\n        <div\n          className=\"ui:animate-gradient-fifth\"\n          style={blobStyle(\n            fifthColor,\n            'animate-gradient-fifth',\n            'calc(50% - 800px) calc(50% + 800px)',\n          )}\n        />\n\n        {interactive && (\n          <div\n            ref={interactiveRef}\n            onMouseMove={handleMouseMove}\n            className=\"absolute w-full h-full\"\n            style={{\n              top: '-50%',\n              left: '-50%',\n              willChange: 'transform',\n              opacity: 0.7,\n              background: `radial-gradient(circle at center, rgba(${pointerColor}, 0.8) 0, rgba(${pointerColor}, 0) 50%) no-repeat`,\n              mixBlendMode:\n                blendingValue as React.CSSProperties['mixBlendMode'],\n            }}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n","import { BackgroundGradientAnimation } from \"./BackgroundGradientAnimation\";\n\nexport default function BackgroundGradientAnimationDemo() {\n  return (\n    <BackgroundGradientAnimation>\n      <div className=\"ui:absolute ui:z-50 ui:inset-0 ui:flex ui:items-center ui:justify-center ui:text-white ui:font-bold ui:px-4 ui:pointer-events-none ui:text-3xl ui:text-center md:ui:text-4xl lg:ui:text-7xl\">\n        <p className=\"ui:bg-clip-text ui:text-transparent ui:drop-shadow-2xl ui:bg-gradient-to-b ui:from-white/80 ui:to-white/20\">\n          Gradients X Animations\n        </p>\n      </div>\n    </BackgroundGradientAnimation>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"background-gradient-animation-CXV9GDH8.cjs","names":[],"sources":["../../src/components/effects/background-gradient-animation/BackgroundGradientAnimation.tsx","../../src/components/effects/background-gradient-animation/BackgroundGradientAnimationDemo.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { mergeClassNames } from \"../../../utils\";\n\nexport interface BackgroundGradientAnimationProps {\n  gradientBackgroundStart?: string;\n  gradientBackgroundEnd?: string;\n  firstColor?: string;\n  secondColor?: string;\n  thirdColor?: string;\n  fourthColor?: string;\n  fifthColor?: string;\n  pointerColor?: string;\n  size?: string;\n  blendingValue?: string;\n  children?: React.ReactNode;\n  className?: string;\n  interactive?: boolean;\n  containerClassName?: string;\n}\n\nexport const BackgroundGradientAnimation = ({\n  gradientBackgroundStart = \"rgb(108, 0, 162)\",\n  gradientBackgroundEnd = \"rgb(0, 17, 82)\",\n  firstColor = \"18, 113, 255\",\n  secondColor = \"221, 74, 255\",\n  thirdColor = \"100, 220, 255\",\n  fourthColor = \"200, 50, 50\",\n  fifthColor = \"180, 180, 50\",\n  pointerColor = \"140, 100, 255\",\n  size = \"80%\",\n  blendingValue = \"hard-light\",\n  children,\n  className,\n  interactive = true,\n  containerClassName,\n}: BackgroundGradientAnimationProps) => {\n  const interactiveRef = useRef<HTMLDivElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const currentPositionRef = useRef({ x: 0, y: 0 });\n  const targetPositionRef = useRef({ x: 0, y: 0 });\n\n  useEffect(() => {\n    if (!interactive) {\n      return;\n    }\n\n    let animationFrameId = 0;\n\n    const move = () => {\n      const interactiveElement = interactiveRef.current;\n\n      if (interactiveElement) {\n        const currentPosition = currentPositionRef.current;\n        const targetPosition = targetPositionRef.current;\n\n        currentPosition.x += (targetPosition.x - currentPosition.x) / 20;\n        currentPosition.y += (targetPosition.y - currentPosition.y) / 20;\n\n        interactiveElement.style.transform = `translate(${Math.round(\n          currentPosition.x,\n        )}px, ${Math.round(currentPosition.y)}px)`;\n      }\n\n      animationFrameId = window.requestAnimationFrame(move);\n    };\n\n    animationFrameId = window.requestAnimationFrame(move);\n\n    return () => {\n      window.cancelAnimationFrame(animationFrameId);\n    };\n  }, [interactive]);\n\n  const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (interactiveRef.current) {\n      const rect = interactiveRef.current.getBoundingClientRect();\n      targetPositionRef.current = {\n        x: event.clientX - rect.left,\n        y: event.clientY - rect.top,\n      };\n    }\n  };\n\n  const [isSafari] = useState(() =>\n    typeof navigator !== \"undefined\"\n      ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent)\n      : false,\n  );\n\n  const blobStyle = (\n    color: string,\n    _animationClass: string,\n    transformOrigin: string,\n    opacity: number = 1,\n  ): React.CSSProperties => ({\n    position: \"absolute\",\n    width: size,\n    height: size,\n    top: `calc(50% - ${size} / 2)`,\n    left: `calc(50% - ${size} / 2)`,\n    background: `radial-gradient(circle at center, rgba(${color}, 0.8) 0, rgba(${color}, 0) 50%) no-repeat`,\n    mixBlendMode: blendingValue as React.CSSProperties[\"mixBlendMode\"],\n    transformOrigin,\n    opacity,\n  });\n\n  return (\n    <div\n      ref={containerRef}\n      className={mergeClassNames(\n        \"h-screen w-screen relative overflow-hidden top-0 left-0\",\n        containerClassName,\n      )}\n      style={{\n        background: `linear-gradient(40deg, ${gradientBackgroundStart}, ${gradientBackgroundEnd})`,\n      }}\n    >\n      <svg className=\"hidden\">\n        <defs>\n          <filter id=\"blurMe\">\n            <feGaussianBlur\n              in=\"SourceGraphic\"\n              stdDeviation=\"10\"\n              result=\"blur\"\n            />\n            <feColorMatrix\n              in=\"blur\"\n              mode=\"matrix\"\n              values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -8\"\n              result=\"goo\"\n            />\n            <feBlend in=\"SourceGraphic\" in2=\"goo\" />\n          </filter>\n        </defs>\n      </svg>\n      <div className={mergeClassNames(\"\", className)}>{children}</div>\n      <div\n        className=\"h-full w-full\"\n        style={{\n          filter: isSafari ? \"blur(24px)\" : \"url(#blurMe) blur(40px)\",\n        }}\n      >\n        {/* First blob */}\n        <div\n          className=\"ui:animate-gradient-first\"\n          style={blobStyle(\n            firstColor,\n            \"animate-gradient-first\",\n            \"center center\",\n          )}\n        />\n        {/* Second blob */}\n        <div\n          className=\"ui:animate-gradient-second\"\n          style={blobStyle(\n            secondColor,\n            \"animate-gradient-second\",\n            \"calc(50% - 400px)\",\n          )}\n        />\n        {/* Third blob */}\n        <div\n          className=\"ui:animate-gradient-third\"\n          style={blobStyle(\n            thirdColor,\n            \"animate-gradient-third\",\n            \"calc(50% + 400px)\",\n          )}\n        />\n        {/* Fourth blob */}\n        <div\n          className=\"ui:animate-gradient-fourth\"\n          style={blobStyle(\n            fourthColor,\n            \"animate-gradient-fourth\",\n            \"calc(50% - 200px)\",\n            0.7,\n          )}\n        />\n        {/* Fifth blob */}\n        <div\n          className=\"ui:animate-gradient-fifth\"\n          style={blobStyle(\n            fifthColor,\n            \"animate-gradient-fifth\",\n            \"calc(50% - 800px) calc(50% + 800px)\",\n          )}\n        />\n\n        {interactive && (\n          <div\n            ref={interactiveRef}\n            onMouseMove={handleMouseMove}\n            className=\"absolute w-full h-full\"\n            style={{\n              top: \"-50%\",\n              left: \"-50%\",\n              willChange: \"transform\",\n              opacity: 0.7,\n              background: `radial-gradient(circle at center, rgba(${pointerColor}, 0.8) 0, rgba(${pointerColor}, 0) 50%) no-repeat`,\n              mixBlendMode:\n                blendingValue as React.CSSProperties[\"mixBlendMode\"],\n            }}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n","import { BackgroundGradientAnimation } from \"./BackgroundGradientAnimation\";\n\nexport default function BackgroundGradientAnimationDemo() {\n  return (\n    <BackgroundGradientAnimation>\n      <div className=\"ui:absolute ui:z-50 ui:inset-0 ui:flex ui:items-center ui:justify-center ui:text-white ui:font-bold ui:px-4 ui:pointer-events-none ui:text-3xl ui:text-center md:ui:text-4xl lg:ui:text-7xl\">\n        <p className=\"ui:bg-clip-text ui:text-transparent ui:drop-shadow-2xl ui:bg-gradient-to-b ui:from-white/80 ui:to-white/20\">\n          Gradients X Animations\n        </p>\n      </div>\n    </BackgroundGradientAnimation>\n  );\n}\n"],"mappings":"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"}

package/dist/chunks/{button-CmNEMp_O.mjs → button-B0Lhj0AS.mjs}

@@ -18,8 +18,8 @@ var baseClasses = `
   disabled:cursor-not-allowed
 `;
 var variantClassMap = {
-	primary: "bg-primary hover:bg-primary-600 text-primary-foreground shadow-md",
-	secondary: "bg-neutral-200 dark:bg-neutral-700 border border-neutral-300 dark:border-neutral-600 text-neutral-800 dark:text-white shadow-sm hover:bg-neutral-300 dark:hover:bg-neutral-600"
+	primary: "bg-accent hover:bg-accent-hover text-on-accent shadow-2",
+	secondary: "bg-surface border border-border text-fg shadow-1 hover:border-border-strong hover:bg-canvas"
 };
 var sizeClassMap = {
 	small: "py-2 px-3 text-xs",
@@ -39,4 +39,4 @@ var Button = ({ primary = false, size = "medium", backgroundColor, label, childr
 //#endregion
 export { Button as t };
 
-//# sourceMappingURL=button-CmNEMp_O.mjs.map
+//# sourceMappingURL=button-B0Lhj0AS.mjs.map

package/dist/chunks/button-B0Lhj0AS.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-B0Lhj0AS.mjs","names":[],"sources":["../../src/components/forms/button/Button.tsx"],"sourcesContent":["import type { ButtonProps } from \"./types\";\n\nconst baseClasses = `\n  inline-flex\n  items-center\n  justify-center\n  gap-2\n  cursor-pointer\n  rounded-lg\n  font-semibold\n  leading-none\n  transition-all\n  duration-200\n  ease-in-out\n  active:scale-95\n  hover:opacity-90\n  disabled:opacity-50\n  disabled:cursor-not-allowed\n`;\nconst variantClassMap = {\n  primary: \"bg-accent hover:bg-accent-hover text-on-accent shadow-2\",\n  secondary:\n    \"bg-surface border border-border text-fg shadow-1 hover:border-border-strong hover:bg-canvas\",\n};\nconst sizeClassMap = {\n  small: \"py-2 px-3 text-xs\",\n  medium: \"py-2.5 px-4 text-sm\",\n  large: \"py-3 px-6 text-base\",\n};\n\nexport const Button = ({\n  primary = false,\n  size = \"medium\",\n  backgroundColor,\n  label,\n  children,\n  type = \"button\",\n  className = \"\",\n  ...props\n}: ButtonProps) => {\n  const variantClasses = variantClassMap[primary ? \"primary\" : \"secondary\"];\n  const sizeClasses =\n    sizeClassMap[size as keyof typeof sizeClassMap] || sizeClassMap.medium;\n\n  return (\n    <button\n      type={type}\n      className={`${baseClasses} ${variantClasses} ${sizeClasses} ${className}`.trim()}\n      style={backgroundColor ? { backgroundColor } : undefined}\n      {...props}\n    >\n      {children}\n      {label && <span>{label}</span>}\n    </button>\n  );\n};\n"],"mappings":";;AAEA,IAAM,cAAc;;;;;;;;;;;;;;;;;AAiBpB,IAAM,kBAAkB;CACtB,SAAS;CACT,WACE;CACH;AACD,IAAM,eAAe;CACnB,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAED,IAAa,UAAU,EACrB,UAAU,OACV,OAAO,UACP,iBACA,OACA,UACA,OAAO,UACP,YAAY,IACZ,GAAG,YACc;CACjB,MAAM,iBAAiB,gBAAgB,UAAU,YAAY;AAI7D,QACE,qBAAC,UAAD;EACQ;EACN,WAAW,GAAG,YAAY,GAAG,eAAe,GAL9C,aAAa,SAAsC,aAAa,OAKH,GAAG,YAAY,MAAM;EAChF,OAAO,kBAAkB,EAAE,iBAAiB,GAAG,KAAA;EAC/C,GAAI;YAJN,CAMG,UACA,SAAS,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA,CACvB"}

package/dist/chunks/{button-BH1eUjae.cjs → button-CZL6kFzT.cjs}

@@ -19,8 +19,8 @@ var baseClasses = `
   disabled:cursor-not-allowed
 `;
 var variantClassMap = {
-	primary: "bg-primary hover:bg-primary-600 text-primary-foreground shadow-md",
-	secondary: "bg-neutral-200 dark:bg-neutral-700 border border-neutral-300 dark:border-neutral-600 text-neutral-800 dark:text-white shadow-sm hover:bg-neutral-300 dark:hover:bg-neutral-600"
+	primary: "bg-accent hover:bg-accent-hover text-on-accent shadow-2",
+	secondary: "bg-surface border border-border text-fg shadow-1 hover:border-border-strong hover:bg-canvas"
 };
 var sizeClassMap = {
 	small: "py-2 px-3 text-xs",
@@ -45,4 +45,4 @@ Object.defineProperty(exports, "Button", {
 	}
 });
 
-//# sourceMappingURL=button-BH1eUjae.cjs.map
+//# sourceMappingURL=button-CZL6kFzT.cjs.map

package/dist/chunks/button-CZL6kFzT.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-CZL6kFzT.cjs","names":[],"sources":["../../src/components/forms/button/Button.tsx"],"sourcesContent":["import type { ButtonProps } from \"./types\";\n\nconst baseClasses = `\n  inline-flex\n  items-center\n  justify-center\n  gap-2\n  cursor-pointer\n  rounded-lg\n  font-semibold\n  leading-none\n  transition-all\n  duration-200\n  ease-in-out\n  active:scale-95\n  hover:opacity-90\n  disabled:opacity-50\n  disabled:cursor-not-allowed\n`;\nconst variantClassMap = {\n  primary: \"bg-accent hover:bg-accent-hover text-on-accent shadow-2\",\n  secondary:\n    \"bg-surface border border-border text-fg shadow-1 hover:border-border-strong hover:bg-canvas\",\n};\nconst sizeClassMap = {\n  small: \"py-2 px-3 text-xs\",\n  medium: \"py-2.5 px-4 text-sm\",\n  large: \"py-3 px-6 text-base\",\n};\n\nexport const Button = ({\n  primary = false,\n  size = \"medium\",\n  backgroundColor,\n  label,\n  children,\n  type = \"button\",\n  className = \"\",\n  ...props\n}: ButtonProps) => {\n  const variantClasses = variantClassMap[primary ? \"primary\" : \"secondary\"];\n  const sizeClasses =\n    sizeClassMap[size as keyof typeof sizeClassMap] || sizeClassMap.medium;\n\n  return (\n    <button\n      type={type}\n      className={`${baseClasses} ${variantClasses} ${sizeClasses} ${className}`.trim()}\n      style={backgroundColor ? { backgroundColor } : undefined}\n      {...props}\n    >\n      {children}\n      {label && <span>{label}</span>}\n    </button>\n  );\n};\n"],"mappings":";;;AAEA,IAAM,cAAc;;;;;;;;;;;;;;;;;AAiBpB,IAAM,kBAAkB;CACtB,SAAS;CACT,WACE;CACH;AACD,IAAM,eAAe;CACnB,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAED,IAAa,UAAU,EACrB,UAAU,OACV,OAAO,UACP,iBACA,OACA,UACA,OAAO,UACP,YAAY,IACZ,GAAG,YACc;CACjB,MAAM,iBAAiB,gBAAgB,UAAU,YAAY;AAI7D,QACE,iBAAA,GAAA,kBAAA,MAAC,UAAD;EACQ;EACN,WAAW,GAAG,YAAY,GAAG,eAAe,GAL9C,aAAa,SAAsC,aAAa,OAKH,GAAG,YAAY,MAAM;EAChF,OAAO,kBAAkB,EAAE,iBAAiB,GAAG,KAAA;EAC/C,GAAI;YAJN,CAMG,UACA,SAAS,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAA,UAAO,OAAa,CAAA,CACvB"}

package/dist/chunks/{card-CzstAQYy.mjs → card-CcIF6z2H.mjs}

@@ -4,7 +4,7 @@ var Card = ({ title, description }) => {
 	return /* @__PURE__ */ jsx("div", {
 		className: "ui",
 		children: /* @__PURE__ */ jsx("div", {
-			className: "backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg overflow-hidden sm:max-w-xs lg:max-w-sm xl:max-w-md transition-all duration-300 hover:-translate-y-1 hover:shadow-xl",
+			className: "backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg overflow-hidden sm:max-w-xs lg:max-w-sm xl:max-w-md",
 			children: /* @__PURE__ */ jsxs("div", {
 				className: "px-6 py-4",
 				children: [/* @__PURE__ */ jsx("h2", {
@@ -21,4 +21,4 @@ var Card = ({ title, description }) => {
 //#endregion
 export { Card as t };
 
-//# sourceMappingURL=card-CzstAQYy.mjs.map
+//# sourceMappingURL=card-CcIF6z2H.mjs.map

package/dist/chunks/card-CcIF6z2H.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-CcIF6z2H.mjs","names":[],"sources":["../../src/components/data-display/card/Card.tsx"],"sourcesContent":["import type { CardProps } from \"./types\";\n\nexport const Card = ({ title, description }: CardProps) => {\n  return (\n    <div className=\"ui\">\n      <div className=\"backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg overflow-hidden sm:max-w-xs lg:max-w-sm xl:max-w-md\">\n        <div className=\"px-6 py-4\">\n          <h2 className=\"text-neutral-900 dark:text-white font-bold text-xl mb-2\">\n            {title}\n          </h2>\n          <p className=\"text-neutral-700 dark:text-neutral-300 bg-transparent border-none rounded-none font-sans text-base\">\n            {description}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;AAEA,IAAa,QAAQ,EAAE,OAAO,kBAA6B;AACzD,QACE,oBAAC,OAAD;EAAK,WAAU;YACb,oBAAC,OAAD;GAAK,WAAU;aACb,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,oBAAC,MAAD;KAAI,WAAU;eACX;KACE,CAAA,EACL,oBAAC,KAAD;KAAG,WAAU;eACV;KACC,CAAA,CACA;;GACF,CAAA;EACF,CAAA"}

package/dist/chunks/{card-DZGM4zLx.cjs → card-gt-HZh0h.cjs}

@@ -5,7 +5,7 @@ var Card = ({ title, description }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: "ui",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg overflow-hidden sm:max-w-xs lg:max-w-sm xl:max-w-md transition-all duration-300 hover:-translate-y-1 hover:shadow-xl",
+			className: "backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg overflow-hidden sm:max-w-xs lg:max-w-sm xl:max-w-md",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "px-6 py-4",
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
@@ -27,4 +27,4 @@ Object.defineProperty(exports, "Card", {
 	}
 });
 
-//# sourceMappingURL=card-DZGM4zLx.cjs.map
+//# sourceMappingURL=card-gt-HZh0h.cjs.map

package/dist/chunks/card-gt-HZh0h.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-gt-HZh0h.cjs","names":[],"sources":["../../src/components/data-display/card/Card.tsx"],"sourcesContent":["import type { CardProps } from \"./types\";\n\nexport const Card = ({ title, description }: CardProps) => {\n  return (\n    <div className=\"ui\">\n      <div className=\"backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg overflow-hidden sm:max-w-xs lg:max-w-sm xl:max-w-md\">\n        <div className=\"px-6 py-4\">\n          <h2 className=\"text-neutral-900 dark:text-white font-bold text-xl mb-2\">\n            {title}\n          </h2>\n          <p className=\"text-neutral-700 dark:text-neutral-300 bg-transparent border-none rounded-none font-sans text-base\">\n            {description}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;AAEA,IAAa,QAAQ,EAAE,OAAO,kBAA6B;AACzD,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAU;YACb,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,WAAU;aACb,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;KAAI,WAAU;eACX;KACE,CAAA,EACL,iBAAA,GAAA,kBAAA,KAAC,KAAD;KAAG,WAAU;eACV;KACC,CAAA,CACA;;GACF,CAAA;EACF,CAAA"}

package/dist/chunks/{carousel-47Eiyzwg.cjs → carousel-Cq5uwqQt.cjs}

@@ -1,6 +1,6 @@
 require("./chunk-B_GkZjkl.cjs");
 const require_utils = require("./utils-B4SmmY4J.cjs");
-const require_icons = require("./icons-DYkpqWYG.cjs");
+const require_icons = require("./icons-BxIzP2jd.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let framer_motion = require("framer-motion");
@@ -290,7 +290,7 @@ var Carousel = ({ items, className, autoPlay = 0, showArrows = true, showDots =
 				}, index))
 			}),
 			autoPlay > 0 && !isPaused && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(framer_motion.motion.div, {
-				className: "ui:absolute ui:bottom-0 ui:left-0 ui:h-1 ui:bg-primary/80 ui:rounded-full",
+				className: "ui:absolute ui:bottom-0 ui:left-0 ui:h-1 ui:bg-accent/80 ui:rounded-full",
 				initial: { width: "0%" },
 				animate: { width: "100%" },
 				transition: {
@@ -310,4 +310,4 @@ Object.defineProperty(exports, "Carousel", {
 	}
 });
 
-//# sourceMappingURL=carousel-47Eiyzwg.cjs.map
+//# sourceMappingURL=carousel-Cq5uwqQt.cjs.map

package/dist/chunks/{carousel-BJ3nm2bw.mjs.map → carousel-Cq5uwqQt.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"carousel-BJ3nm2bw.mjs","names":[],"sources":["../../src/components/navigation/carousel/Carousel.tsx"],"sourcesContent":["import { useState, useEffect, useCallback, useRef } from \"react\";\nimport { motion, AnimatePresence } from \"framer-motion\";\n\nimport { ChevronLeftIcon, ChevronRightIcon } from \"../../icons\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { CarouselProps, CarouselAnimation } from \"./types\";\n\nconst variantStyles = {\n  default: \"ui:bg-white ui:dark:bg-neutral-900 ui:shadow-xl\",\n  glass:\n    \"ui:bg-white/60 ui:dark:bg-neutral-900/50 ui:backdrop-blur-2xl ui:border ui:border-white/40 ui:dark:border-white/10\",\n  minimal: \"ui:bg-transparent\",\n};\n\n// Animation variants for different carousel transitions\nconst getAnimationVariants = (animation: CarouselAnimation) => {\n  const variants = {\n    slide: {\n      enter: (direction: number) => ({\n        x: direction > 0 ? \"100%\" : \"-100%\",\n        opacity: 0,\n      }),\n      center: { x: 0, opacity: 1 },\n      exit: (direction: number) => ({\n        x: direction < 0 ? \"100%\" : \"-100%\",\n        opacity: 0,\n      }),\n    },\n    fade: {\n      enter: () => ({ opacity: 0 }),\n      center: { opacity: 1 },\n      exit: () => ({ opacity: 0 }),\n    },\n    scale: {\n      enter: (direction: number) => ({\n        scale: 0.8,\n        opacity: 0,\n        x: direction > 0 ? 50 : -50,\n      }),\n      center: { scale: 1, opacity: 1, x: 0 },\n      exit: (direction: number) => ({\n        scale: 0.8,\n        opacity: 0,\n        x: direction < 0 ? 50 : -50,\n      }),\n    },\n    flip: {\n      enter: (direction: number) => ({\n        rotateY: direction > 0 ? 90 : -90,\n        opacity: 0,\n      }),\n      center: { rotateY: 0, opacity: 1 },\n      exit: (direction: number) => ({\n        rotateY: direction < 0 ? 90 : -90,\n        opacity: 0,\n      }),\n    },\n    cube: {\n      enter: (direction: number) => ({\n        rotateY: direction > 0 ? 90 : -90,\n        x: direction > 0 ? \"50%\" : \"-50%\",\n        opacity: 0,\n        scale: 0.8,\n      }),\n      center: { rotateY: 0, x: 0, opacity: 1, scale: 1 },\n      exit: (direction: number) => ({\n        rotateY: direction < 0 ? 90 : -90,\n        x: direction < 0 ? \"50%\" : \"-50%\",\n        opacity: 0,\n        scale: 0.8,\n      }),\n    },\n    cards: {\n      enter: (direction: number) => ({\n        scale: 0.9,\n        opacity: 0,\n        y: direction > 0 ? 100 : -100,\n        rotateZ: direction > 0 ? 5 : -5,\n      }),\n      center: { scale: 1, opacity: 1, y: 0, rotateZ: 0 },\n      exit: (direction: number) => ({\n        scale: 0.9,\n        opacity: 0,\n        y: direction < 0 ? 100 : -100,\n        rotateZ: direction < 0 ? 5 : -5,\n      }),\n    },\n  };\n  return variants[animation];\n};\n\n// Transition configs for each animation\nconst getTransitionConfig = (\n  animation: CarouselAnimation,\n  duration: number,\n) => {\n  const durationSec = duration / 1000;\n  const configs: Record<CarouselAnimation, object> = {\n    slide: {\n      x: { type: \"spring\", stiffness: 300, damping: 30 },\n      opacity: { duration: durationSec },\n    },\n    fade: {\n      opacity: { duration: durationSec, ease: \"easeInOut\" },\n    },\n    scale: {\n      type: \"spring\",\n      stiffness: 200,\n      damping: 25,\n      opacity: { duration: durationSec },\n    },\n    flip: {\n      type: \"spring\",\n      stiffness: 100,\n      damping: 20,\n      opacity: { duration: durationSec * 0.5 },\n    },\n    cube: {\n      type: \"spring\",\n      stiffness: 100,\n      damping: 20,\n      opacity: { duration: durationSec * 0.5 },\n    },\n    cards: {\n      type: \"spring\",\n      stiffness: 150,\n      damping: 20,\n      opacity: { duration: durationSec },\n    },\n  };\n  return configs[animation];\n};\n\nexport const Carousel = ({\n  items,\n  className,\n  autoPlay = 0,\n  showArrows = true,\n  showDots = true,\n  infinite = true,\n  pauseOnHover = true,\n  animationDuration = 500,\n  // gap and slidesPerView reserved for future multi-slide support\n  gap: _gap = 0,\n  slidesPerView: _slidesPerView = 1,\n  renderArrow,\n  renderDot,\n  onSlideChange,\n  variant = \"glass\",\n  height = 400,\n  style,\n  initialSlide = 0,\n  draggable = true,\n  animation = \"slide\",\n}: CarouselProps) => {\n  const animationVariants = getAnimationVariants(animation);\n  const transitionConfig = getTransitionConfig(animation, animationDuration);\n  const [[currentIndex, direction], setSlide] = useState([initialSlide, 0]);\n  const [isPaused, setIsPaused] = useState(false);\n  const intervalRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const totalSlides = items.length;\n\n  const goToSlide = useCallback(\n    (index: number, dir?: number) => {\n      let newIndex = index;\n      if (infinite) {\n        if (index < 0) newIndex = totalSlides - 1;\n        else if (index >= totalSlides) newIndex = 0;\n      } else {\n        if (index < 0) newIndex = 0;\n        else if (index >= totalSlides) newIndex = totalSlides - 1;\n      }\n      const newDirection = dir ?? (newIndex > currentIndex ? 1 : -1);\n      setSlide([newIndex, newDirection]);\n      onSlideChange?.(newIndex);\n    },\n    [currentIndex, infinite, totalSlides, onSlideChange],\n  );\n\n  const goNext = useCallback(\n    () => goToSlide(currentIndex + 1, 1),\n    [currentIndex, goToSlide],\n  );\n  const goPrev = useCallback(\n    () => goToSlide(currentIndex - 1, -1),\n    [currentIndex, goToSlide],\n  );\n\n  // Auto-play\n  useEffect(() => {\n    if (autoPlay > 0 && !isPaused) {\n      intervalRef.current = setInterval(goNext, autoPlay);\n    }\n    return () => {\n      if (intervalRef.current) clearInterval(intervalRef.current);\n    };\n  }, [autoPlay, isPaused, goNext]);\n\n  // Keyboard navigation\n  useEffect(() => {\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === \"ArrowLeft\") goPrev();\n      if (e.key === \"ArrowRight\") goNext();\n    };\n    window.addEventListener(\"keydown\", handleKeyDown);\n    return () => window.removeEventListener(\"keydown\", handleKeyDown);\n  }, [goNext, goPrev]);\n\n  // Drag handling\n  const handleDragEnd = (\n    _event: MouseEvent | TouchEvent | PointerEvent,\n    info: {\n      offset: { x: number; y: number };\n      velocity: { x: number; y: number };\n    },\n  ) => {\n    const threshold = 50;\n    if (info.offset.x < -threshold) goNext();\n    else if (info.offset.x > threshold) goPrev();\n  };\n\n  const currentItem = items[currentIndex];\n\n  return (\n    <div\n      className={mergeClassNames(\n        \"ui:relative ui:overflow-hidden ui:rounded-2xl ui:w-full\",\n        variantStyles[variant],\n        className,\n      )}\n      style={{\n        height: typeof height === \"number\" ? `${height}px` : height,\n        ...style,\n      }}\n      onMouseEnter={() => pauseOnHover && setIsPaused(true)}\n      onMouseLeave={() => pauseOnHover && setIsPaused(false)}\n    >\n      {/* Slides */}\n      <AnimatePresence initial={false} custom={direction} mode=\"wait\">\n        <motion.div\n          key={currentIndex}\n          custom={direction}\n          variants={animationVariants}\n          initial=\"enter\"\n          animate=\"center\"\n          exit=\"exit\"\n          transition={transitionConfig}\n          drag={draggable ? \"x\" : false}\n          dragConstraints={{ left: 0, right: 0 }}\n          dragElastic={0.2}\n          onDragEnd={handleDragEnd}\n          className=\"ui:absolute ui:inset-0 ui:flex ui:items-center ui:justify-center ui:cursor-grab active:ui:cursor-grabbing\"\n          style={{\n            perspective:\n              animation === \"flip\" || animation === \"cube\" ? 1000 : undefined,\n          }}\n        >\n          {currentItem.image ? (\n            <div className=\"ui:relative ui:w-full ui:h-full\">\n              <img\n                src={currentItem.image}\n                alt={currentItem.alt || currentItem.title || \"Carousel slide\"}\n                className=\"ui:w-full ui:h-full ui:object-cover\"\n              />\n              {(currentItem.title || currentItem.description) && (\n                <div className=\"ui:absolute ui:bottom-0 ui:left-0 ui:right-0 ui:p-6 ui:bg-gradient-to-t ui:from-black/70 ui:to-transparent\">\n                  {currentItem.title && (\n                    <h3 className=\"ui:text-2xl ui:font-bold ui:text-white ui:mb-2\">\n                      {currentItem.title}\n                    </h3>\n                  )}\n                  {currentItem.description && (\n                    <p className=\"ui:text-white/80\">\n                      {currentItem.description}\n                    </p>\n                  )}\n                </div>\n              )}\n            </div>\n          ) : (\n            <div className=\"ui:w-full ui:h-full ui:flex ui:items-center ui:justify-center ui:p-6\">\n              {currentItem.content}\n            </div>\n          )}\n        </motion.div>\n      </AnimatePresence>\n\n      {/* Navigation Arrows */}\n      {showArrows && totalSlides > 1 && (\n        <>\n          {renderArrow ? (\n            <>\n              {renderArrow({ direction: \"prev\", onClick: goPrev })}\n              {renderArrow({ direction: \"next\", onClick: goNext })}\n            </>\n          ) : (\n            <>\n              <motion.button\n                type=\"button\"\n                onClick={goPrev}\n                className=\"ui:absolute ui:left-4 ui:top-1/2 ui:-translate-y-1/2 ui:z-20 ui:p-2 ui:rounded-full ui:bg-white/80 ui:dark:bg-neutral-800/80 ui:backdrop-blur-sm ui:text-neutral-800 ui:dark:text-white ui:shadow-lg ui:transition-all hover:ui:bg-white ui:dark:hover:bg-neutral-700\"\n                whileHover={{ scale: 1.1 }}\n                whileTap={{ scale: 0.9 }}\n                aria-label=\"Previous slide\"\n              >\n                <ChevronLeftIcon className=\"ui:w-6 ui:h-6\" aria-hidden=\"true\" />\n              </motion.button>\n              <motion.button\n                type=\"button\"\n                onClick={goNext}\n                className=\"ui:absolute ui:right-4 ui:top-1/2 ui:-translate-y-1/2 ui:z-20 ui:p-2 ui:rounded-full ui:bg-white/80 ui:dark:bg-neutral-800/80 ui:backdrop-blur-sm ui:text-neutral-800 ui:dark:text-white ui:shadow-lg ui:transition-all hover:ui:bg-white ui:dark:hover:bg-neutral-700\"\n                whileHover={{ scale: 1.1 }}\n                whileTap={{ scale: 0.9 }}\n                aria-label=\"Next slide\"\n              >\n                <ChevronRightIcon\n                  className=\"ui:w-6 ui:h-6\"\n                  aria-hidden=\"true\"\n                />\n              </motion.button>\n            </>\n          )}\n        </>\n      )}\n\n      {/* Dot Indicators */}\n      {showDots && totalSlides > 1 && (\n        <div className=\"ui:absolute ui:bottom-4 ui:left-1/2 ui:-translate-x-1/2 ui:z-20 ui:flex ui:gap-2 ui:p-2 ui:rounded-full ui:bg-black/20 ui:dark:bg-white/10 ui:backdrop-blur-sm\">\n          {items.map((_, index) =>\n            renderDot ? (\n              renderDot({\n                index,\n                active: index === currentIndex,\n                onClick: () => goToSlide(index),\n              })\n            ) : (\n              <motion.button\n                key={index}\n                type=\"button\"\n                onClick={() => goToSlide(index)}\n                className={mergeClassNames(\n                  \"ui:rounded-full ui:transition-all ui:duration-300\",\n                  index === currentIndex\n                    ? \"ui:w-8 ui:h-2.5 ui:bg-white ui:shadow-lg\"\n                    : \"ui:w-2.5 ui:h-2.5 ui:bg-white/60 hover:ui:bg-white/90\",\n                )}\n                whileHover={{ scale: 1.2 }}\n                whileTap={{ scale: 0.9 }}\n                aria-label={`Go to slide ${index + 1}`}\n                aria-current={index === currentIndex ? \"true\" : undefined}\n              />\n            ),\n          )}\n        </div>\n      )}\n\n      {/* Progress indicator */}\n      {autoPlay > 0 && !isPaused && (\n        <motion.div\n          className=\"ui:absolute ui:bottom-0 ui:left-0 ui:h-1 ui:bg-primary/80 ui:rounded-full\"\n          initial={{ width: \"0%\" }}\n          animate={{ width: \"100%\" }}\n          transition={{ duration: autoPlay / 1000, ease: \"linear\" }}\n          key={currentIndex}\n        />\n      )}\n    </div>\n  );\n};\n\nCarousel.displayName = \"Carousel\";\n\nexport default Carousel;\n"],"mappings":"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"}
+{"version":3,"file":"carousel-Cq5uwqQt.cjs","names":[],"sources":["../../src/components/navigation/carousel/Carousel.tsx"],"sourcesContent":["import { useState, useEffect, useCallback, useRef } from \"react\";\nimport { motion, AnimatePresence } from \"framer-motion\";\n\nimport { ChevronLeftIcon, ChevronRightIcon } from \"../../icons\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { CarouselProps, CarouselAnimation } from \"./types\";\n\nconst variantStyles = {\n  default: \"ui:bg-white ui:dark:bg-neutral-900 ui:shadow-xl\",\n  glass:\n    \"ui:bg-white/60 ui:dark:bg-neutral-900/50 ui:backdrop-blur-2xl ui:border ui:border-white/40 ui:dark:border-white/10\",\n  minimal: \"ui:bg-transparent\",\n};\n\n// Animation variants for different carousel transitions\nconst getAnimationVariants = (animation: CarouselAnimation) => {\n  const variants = {\n    slide: {\n      enter: (direction: number) => ({\n        x: direction > 0 ? \"100%\" : \"-100%\",\n        opacity: 0,\n      }),\n      center: { x: 0, opacity: 1 },\n      exit: (direction: number) => ({\n        x: direction < 0 ? \"100%\" : \"-100%\",\n        opacity: 0,\n      }),\n    },\n    fade: {\n      enter: () => ({ opacity: 0 }),\n      center: { opacity: 1 },\n      exit: () => ({ opacity: 0 }),\n    },\n    scale: {\n      enter: (direction: number) => ({\n        scale: 0.8,\n        opacity: 0,\n        x: direction > 0 ? 50 : -50,\n      }),\n      center: { scale: 1, opacity: 1, x: 0 },\n      exit: (direction: number) => ({\n        scale: 0.8,\n        opacity: 0,\n        x: direction < 0 ? 50 : -50,\n      }),\n    },\n    flip: {\n      enter: (direction: number) => ({\n        rotateY: direction > 0 ? 90 : -90,\n        opacity: 0,\n      }),\n      center: { rotateY: 0, opacity: 1 },\n      exit: (direction: number) => ({\n        rotateY: direction < 0 ? 90 : -90,\n        opacity: 0,\n      }),\n    },\n    cube: {\n      enter: (direction: number) => ({\n        rotateY: direction > 0 ? 90 : -90,\n        x: direction > 0 ? \"50%\" : \"-50%\",\n        opacity: 0,\n        scale: 0.8,\n      }),\n      center: { rotateY: 0, x: 0, opacity: 1, scale: 1 },\n      exit: (direction: number) => ({\n        rotateY: direction < 0 ? 90 : -90,\n        x: direction < 0 ? \"50%\" : \"-50%\",\n        opacity: 0,\n        scale: 0.8,\n      }),\n    },\n    cards: {\n      enter: (direction: number) => ({\n        scale: 0.9,\n        opacity: 0,\n        y: direction > 0 ? 100 : -100,\n        rotateZ: direction > 0 ? 5 : -5,\n      }),\n      center: { scale: 1, opacity: 1, y: 0, rotateZ: 0 },\n      exit: (direction: number) => ({\n        scale: 0.9,\n        opacity: 0,\n        y: direction < 0 ? 100 : -100,\n        rotateZ: direction < 0 ? 5 : -5,\n      }),\n    },\n  };\n  return variants[animation];\n};\n\n// Transition configs for each animation\nconst getTransitionConfig = (\n  animation: CarouselAnimation,\n  duration: number,\n) => {\n  const durationSec = duration / 1000;\n  const configs: Record<CarouselAnimation, object> = {\n    slide: {\n      x: { type: \"spring\", stiffness: 300, damping: 30 },\n      opacity: { duration: durationSec },\n    },\n    fade: {\n      opacity: { duration: durationSec, ease: \"easeInOut\" },\n    },\n    scale: {\n      type: \"spring\",\n      stiffness: 200,\n      damping: 25,\n      opacity: { duration: durationSec },\n    },\n    flip: {\n      type: \"spring\",\n      stiffness: 100,\n      damping: 20,\n      opacity: { duration: durationSec * 0.5 },\n    },\n    cube: {\n      type: \"spring\",\n      stiffness: 100,\n      damping: 20,\n      opacity: { duration: durationSec * 0.5 },\n    },\n    cards: {\n      type: \"spring\",\n      stiffness: 150,\n      damping: 20,\n      opacity: { duration: durationSec },\n    },\n  };\n  return configs[animation];\n};\n\nexport const Carousel = ({\n  items,\n  className,\n  autoPlay = 0,\n  showArrows = true,\n  showDots = true,\n  infinite = true,\n  pauseOnHover = true,\n  animationDuration = 500,\n  // gap and slidesPerView reserved for future multi-slide support\n  gap: _gap = 0,\n  slidesPerView: _slidesPerView = 1,\n  renderArrow,\n  renderDot,\n  onSlideChange,\n  variant = \"glass\",\n  height = 400,\n  style,\n  initialSlide = 0,\n  draggable = true,\n  animation = \"slide\",\n}: CarouselProps) => {\n  const animationVariants = getAnimationVariants(animation);\n  const transitionConfig = getTransitionConfig(animation, animationDuration);\n  const [[currentIndex, direction], setSlide] = useState([initialSlide, 0]);\n  const [isPaused, setIsPaused] = useState(false);\n  const intervalRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const totalSlides = items.length;\n\n  const goToSlide = useCallback(\n    (index: number, dir?: number) => {\n      let newIndex = index;\n      if (infinite) {\n        if (index < 0) newIndex = totalSlides - 1;\n        else if (index >= totalSlides) newIndex = 0;\n      } else {\n        if (index < 0) newIndex = 0;\n        else if (index >= totalSlides) newIndex = totalSlides - 1;\n      }\n      const newDirection = dir ?? (newIndex > currentIndex ? 1 : -1);\n      setSlide([newIndex, newDirection]);\n      onSlideChange?.(newIndex);\n    },\n    [currentIndex, infinite, totalSlides, onSlideChange],\n  );\n\n  const goNext = useCallback(\n    () => goToSlide(currentIndex + 1, 1),\n    [currentIndex, goToSlide],\n  );\n  const goPrev = useCallback(\n    () => goToSlide(currentIndex - 1, -1),\n    [currentIndex, goToSlide],\n  );\n\n  // Auto-play\n  useEffect(() => {\n    if (autoPlay > 0 && !isPaused) {\n      intervalRef.current = setInterval(goNext, autoPlay);\n    }\n    return () => {\n      if (intervalRef.current) clearInterval(intervalRef.current);\n    };\n  }, [autoPlay, isPaused, goNext]);\n\n  // Keyboard navigation\n  useEffect(() => {\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === \"ArrowLeft\") goPrev();\n      if (e.key === \"ArrowRight\") goNext();\n    };\n    window.addEventListener(\"keydown\", handleKeyDown);\n    return () => window.removeEventListener(\"keydown\", handleKeyDown);\n  }, [goNext, goPrev]);\n\n  // Drag handling\n  const handleDragEnd = (\n    _event: MouseEvent | TouchEvent | PointerEvent,\n    info: {\n      offset: { x: number; y: number };\n      velocity: { x: number; y: number };\n    },\n  ) => {\n    const threshold = 50;\n    if (info.offset.x < -threshold) goNext();\n    else if (info.offset.x > threshold) goPrev();\n  };\n\n  const currentItem = items[currentIndex];\n\n  return (\n    <div\n      className={mergeClassNames(\n        \"ui:relative ui:overflow-hidden ui:rounded-2xl ui:w-full\",\n        variantStyles[variant],\n        className,\n      )}\n      style={{\n        height: typeof height === \"number\" ? `${height}px` : height,\n        ...style,\n      }}\n      onMouseEnter={() => pauseOnHover && setIsPaused(true)}\n      onMouseLeave={() => pauseOnHover && setIsPaused(false)}\n    >\n      {/* Slides */}\n      <AnimatePresence initial={false} custom={direction} mode=\"wait\">\n        <motion.div\n          key={currentIndex}\n          custom={direction}\n          variants={animationVariants}\n          initial=\"enter\"\n          animate=\"center\"\n          exit=\"exit\"\n          transition={transitionConfig}\n          drag={draggable ? \"x\" : false}\n          dragConstraints={{ left: 0, right: 0 }}\n          dragElastic={0.2}\n          onDragEnd={handleDragEnd}\n          className=\"ui:absolute ui:inset-0 ui:flex ui:items-center ui:justify-center ui:cursor-grab active:ui:cursor-grabbing\"\n          style={{\n            perspective:\n              animation === \"flip\" || animation === \"cube\" ? 1000 : undefined,\n          }}\n        >\n          {currentItem.image ? (\n            <div className=\"ui:relative ui:w-full ui:h-full\">\n              <img\n                src={currentItem.image}\n                alt={currentItem.alt || currentItem.title || \"Carousel slide\"}\n                className=\"ui:w-full ui:h-full ui:object-cover\"\n              />\n              {(currentItem.title || currentItem.description) && (\n                <div className=\"ui:absolute ui:bottom-0 ui:left-0 ui:right-0 ui:p-6 ui:bg-gradient-to-t ui:from-black/70 ui:to-transparent\">\n                  {currentItem.title && (\n                    <h3 className=\"ui:text-2xl ui:font-bold ui:text-white ui:mb-2\">\n                      {currentItem.title}\n                    </h3>\n                  )}\n                  {currentItem.description && (\n                    <p className=\"ui:text-white/80\">\n                      {currentItem.description}\n                    </p>\n                  )}\n                </div>\n              )}\n            </div>\n          ) : (\n            <div className=\"ui:w-full ui:h-full ui:flex ui:items-center ui:justify-center ui:p-6\">\n              {currentItem.content}\n            </div>\n          )}\n        </motion.div>\n      </AnimatePresence>\n\n      {/* Navigation Arrows */}\n      {showArrows && totalSlides > 1 && (\n        <>\n          {renderArrow ? (\n            <>\n              {renderArrow({ direction: \"prev\", onClick: goPrev })}\n              {renderArrow({ direction: \"next\", onClick: goNext })}\n            </>\n          ) : (\n            <>\n              <motion.button\n                type=\"button\"\n                onClick={goPrev}\n                className=\"ui:absolute ui:left-4 ui:top-1/2 ui:-translate-y-1/2 ui:z-20 ui:p-2 ui:rounded-full ui:bg-white/80 ui:dark:bg-neutral-800/80 ui:backdrop-blur-sm ui:text-neutral-800 ui:dark:text-white ui:shadow-lg ui:transition-all hover:ui:bg-white ui:dark:hover:bg-neutral-700\"\n                whileHover={{ scale: 1.1 }}\n                whileTap={{ scale: 0.9 }}\n                aria-label=\"Previous slide\"\n              >\n                <ChevronLeftIcon className=\"ui:w-6 ui:h-6\" aria-hidden=\"true\" />\n              </motion.button>\n              <motion.button\n                type=\"button\"\n                onClick={goNext}\n                className=\"ui:absolute ui:right-4 ui:top-1/2 ui:-translate-y-1/2 ui:z-20 ui:p-2 ui:rounded-full ui:bg-white/80 ui:dark:bg-neutral-800/80 ui:backdrop-blur-sm ui:text-neutral-800 ui:dark:text-white ui:shadow-lg ui:transition-all hover:ui:bg-white ui:dark:hover:bg-neutral-700\"\n                whileHover={{ scale: 1.1 }}\n                whileTap={{ scale: 0.9 }}\n                aria-label=\"Next slide\"\n              >\n                <ChevronRightIcon\n                  className=\"ui:w-6 ui:h-6\"\n                  aria-hidden=\"true\"\n                />\n              </motion.button>\n            </>\n          )}\n        </>\n      )}\n\n      {/* Dot Indicators */}\n      {showDots && totalSlides > 1 && (\n        <div className=\"ui:absolute ui:bottom-4 ui:left-1/2 ui:-translate-x-1/2 ui:z-20 ui:flex ui:gap-2 ui:p-2 ui:rounded-full ui:bg-black/20 ui:dark:bg-white/10 ui:backdrop-blur-sm\">\n          {items.map((_, index) =>\n            renderDot ? (\n              renderDot({\n                index,\n                active: index === currentIndex,\n                onClick: () => goToSlide(index),\n              })\n            ) : (\n              <motion.button\n                key={index}\n                type=\"button\"\n                onClick={() => goToSlide(index)}\n                className={mergeClassNames(\n                  \"ui:rounded-full ui:transition-all ui:duration-300\",\n                  index === currentIndex\n                    ? \"ui:w-8 ui:h-2.5 ui:bg-white ui:shadow-lg\"\n                    : \"ui:w-2.5 ui:h-2.5 ui:bg-white/60 hover:ui:bg-white/90\",\n                )}\n                whileHover={{ scale: 1.2 }}\n                whileTap={{ scale: 0.9 }}\n                aria-label={`Go to slide ${index + 1}`}\n                aria-current={index === currentIndex ? \"true\" : undefined}\n              />\n            ),\n          )}\n        </div>\n      )}\n\n      {/* Progress indicator */}\n      {autoPlay > 0 && !isPaused && (\n        <motion.div\n          className=\"ui:absolute ui:bottom-0 ui:left-0 ui:h-1 ui:bg-accent/80 ui:rounded-full\"\n          initial={{ width: \"0%\" }}\n          animate={{ width: \"100%\" }}\n          transition={{ duration: autoPlay / 1000, ease: \"linear\" }}\n          key={currentIndex}\n        />\n      )}\n    </div>\n  );\n};\n\nCarousel.displayName = \"Carousel\";\n\nexport default Carousel;\n"],"mappings":"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"}

package/dist/chunks/{carousel-BJ3nm2bw.mjs → carousel-DJdqBVRK.mjs}

@@ -1,5 +1,5 @@
 import { n as mergeClassNames } from "./utils-ati1KkDb.mjs";
-import { D as ChevronRightIcon, O as ChevronLeftIcon } from "./icons-CrM6pFkv.mjs";
+import { M as ChevronLeftIcon, j as ChevronRightIcon } from "./icons-DuumN7z-.mjs";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { AnimatePresence, motion } from "framer-motion";
@@ -289,7 +289,7 @@ var Carousel = ({ items, className, autoPlay = 0, showArrows = true, showDots =
 				}, index))
 			}),
 			autoPlay > 0 && !isPaused && /* @__PURE__ */ jsx(motion.div, {
-				className: "ui:absolute ui:bottom-0 ui:left-0 ui:h-1 ui:bg-primary/80 ui:rounded-full",
+				className: "ui:absolute ui:bottom-0 ui:left-0 ui:h-1 ui:bg-accent/80 ui:rounded-full",
 				initial: { width: "0%" },
 				animate: { width: "100%" },
 				transition: {
@@ -304,4 +304,4 @@ Carousel.displayName = "Carousel";
 //#endregion
 export { Carousel as t };
 
-//# sourceMappingURL=carousel-BJ3nm2bw.mjs.map
+//# sourceMappingURL=carousel-DJdqBVRK.mjs.map