@alkimi.org/ui-kit 0.1.14 → 0.1.16

package/dist/chunk-WF73K6X2.mjs

@@ -0,0 +1,3 @@
+"use client";
+import A from"next/image";import{useCallback as y,useEffect as I,useRef as M,useState as L}from"react";import{jsx as D,jsxs as X}from"react/jsx-runtime";function J(o){return typeof o=="object"&&"src"in o}function U(o){return J(o)?o.src:o}function $({src:o,alt:P,duration:h=600,steps:l=15,className:R,onAnimationComplete:f,priority:C,quality:E,placeholder:z="empty",blurDataURL:T,objectFit:p="cover"}){let v=M(null),u=M(null),[d,b]=L("loading"),[n,H]=L(null),S=U(o),c=y((t,a,e,i,r)=>{t.imageSmoothingEnabled=!1;let m=Math.max(1,Math.floor(i/e)),s=Math.max(1,Math.floor(r/e));t.clearRect(0,0,i,r),t.drawImage(a,0,0,m,s),t.drawImage(u.current,0,0,m,s,0,0,i,r)},[]),w=y((t,a,e,i)=>{let r=Math.max(e,i)/4,m=h/l,s=0;b("animating");let x=()=>{let O=s/l,q=Math.max(1,Math.floor(r*(1-O)));c(t,a,q,e,i),s++,s<=l?window.setTimeout(x,m):(b("complete"),f?.())};x()},[h,l,c,f]);I(()=>{let t=v.current;if(!t)return;let a=()=>{let{width:i,height:r}=t.getBoundingClientRect();H({width:Math.floor(i),height:Math.floor(r)})},e=new ResizeObserver(a);return e.observe(t),a(),()=>{e.disconnect()}},[]),I(()=>{if(!n||n.width<=0||n.height<=0)return;let t=u.current;if(!t)return;let a=t.getContext("2d");if(!a)return;t.width=n.width,t.height=n.height;let e=new window.Image;return e.crossOrigin="anonymous",e.onload=()=>{let i=Math.max(n.width,n.height)/4;c(a,e,i,n.width,n.height),w(a,e,n.width,n.height)},e.onerror=()=>{console.error("PixelLoad: Failed to load image")},e.src=S,()=>{e.onload=null,e.onerror=null}},[S,n,w,c]);let g=d==="complete",N=d==="animating"||d==="loading";return X("div",{ref:v,className:`relative w-full h-full ${R||""}`,children:[D("canvas",{ref:u,className:"absolute top-0 left-0 w-full h-full",style:{objectFit:p,opacity:g?0:1,zIndex:N?2:1},"aria-hidden":g}),g&&D(A,{src:o,alt:P,fill:!0,priority:C,quality:E,placeholder:z,blurDataURL:T,className:"opacity-100 transition-opacity duration-150 ease-out z-[1]",style:{objectFit:p}})]})}export{$ as a};
+//# sourceMappingURL=chunk-WF73K6X2.mjs.map

package/dist/chunk-WF73K6X2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/PixelLoad.tsx"],"sourcesContent":["\"use client\"\n\nimport Image, { type StaticImageData } from \"next/image\"\nimport { JSX, useCallback, useEffect, useRef, useState } from \"react\"\n\ntype PixelLoadStatus = \"loading\" | \"animating\" | \"complete\"\n\ntype ImageSrc = string | StaticImageData\n\nexport interface PixelLoadProps {\n  src: ImageSrc\n  alt: string\n  duration?: number\n  steps?: number\n  className?: string\n  onAnimationComplete?: () => void\n  priority?: boolean\n  quality?: number\n  placeholder?: \"blur\" | \"empty\"\n  blurDataURL?: string\n  objectFit?: \"contain\" | \"cover\" | \"fill\" | \"none\" | \"scale-down\"\n}\n\nfunction isStaticImageData(src: ImageSrc): src is StaticImageData {\n  return typeof src === \"object\" && \"src\" in src\n}\n\nfunction getImageSrc(src: ImageSrc): string {\n  return isStaticImageData(src) ? src.src : src\n}\n\nexport function PixelLoad({\n  src,\n  alt,\n  duration = 600,\n  steps = 15,\n  className,\n  onAnimationComplete,\n  priority,\n  quality,\n  placeholder = \"empty\",\n  blurDataURL,\n  objectFit = \"cover\",\n}: PixelLoadProps): JSX.Element {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const canvasRef = useRef<HTMLCanvasElement>(null)\n  const [status, setStatus] = useState<PixelLoadStatus>(\"loading\")\n  const [dimensions, setDimensions] = useState<{\n    width: number\n    height: number\n  } | null>(null)\n\n  const imageSrc = getImageSrc(src)\n\n  const drawPixelated = useCallback(\n    (\n      ctx: CanvasRenderingContext2D,\n      img: HTMLImageElement,\n      pixelSize: number,\n      w: number,\n      h: number\n    ): void => {\n      ctx.imageSmoothingEnabled = false\n\n      const sw = Math.max(1, Math.floor(w / pixelSize))\n      const sh = Math.max(1, Math.floor(h / pixelSize))\n\n      ctx.clearRect(0, 0, w, h)\n      ctx.drawImage(img, 0, 0, sw, sh)\n      ctx.drawImage(canvasRef.current!, 0, 0, sw, sh, 0, 0, w, h)\n    },\n    []\n  )\n\n  const runAnimation = useCallback(\n    (\n      ctx: CanvasRenderingContext2D,\n      img: HTMLImageElement,\n      w: number,\n      h: number\n    ): void => {\n      const minPixelSize = Math.max(w, h) / 4\n      const intervalMs = duration / steps\n      let currentStep = 0\n\n      setStatus(\"animating\")\n\n      const animate = (): void => {\n        const progress = currentStep / steps\n        const pixelSize = Math.max(1, Math.floor(minPixelSize * (1 - progress)))\n\n        drawPixelated(ctx, img, pixelSize, w, h)\n\n        currentStep++\n\n        if (currentStep <= steps) {\n          window.setTimeout(animate, intervalMs)\n        } else {\n          setStatus(\"complete\")\n          onAnimationComplete?.()\n        }\n      }\n\n      animate()\n    },\n    [duration, steps, drawPixelated, onAnimationComplete]\n  )\n\n  useEffect(() => {\n    const container = containerRef.current\n    if (!container) return\n\n    const updateDimensions = (): void => {\n      const { width, height } = container.getBoundingClientRect()\n      setDimensions({ width: Math.floor(width), height: Math.floor(height) })\n    }\n\n    const resizeObserver = new ResizeObserver(updateDimensions)\n    resizeObserver.observe(container)\n    updateDimensions()\n\n    return (): void => {\n      resizeObserver.disconnect()\n    }\n  }, [])\n\n  useEffect(() => {\n    if (!dimensions) return\n\n    // Guard against invalid dimensions\n    if (dimensions.width <= 0 || dimensions.height <= 0) return\n\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const ctx = canvas.getContext(\"2d\")\n    if (!ctx) return\n\n    // Set canvas dimensions immediately to ensure it covers the area\n    canvas.width = dimensions.width\n    canvas.height = dimensions.height\n\n    const img = new window.Image()\n    img.crossOrigin = \"anonymous\"\n\n    img.onload = (): void => {\n      // Draw first frame immediately to prevent original image from showing\n      const minPixelSize = Math.max(dimensions.width, dimensions.height) / 4\n      drawPixelated(ctx, img, minPixelSize, dimensions.width, dimensions.height)\n      // Then start animation\n      runAnimation(ctx, img, dimensions.width, dimensions.height)\n    }\n\n    img.onerror = (): void => {\n      console.error(\"PixelLoad: Failed to load image\")\n    }\n\n    img.src = imageSrc\n\n    return (): void => {\n      img.onload = null\n      img.onerror = null\n    }\n  }, [imageSrc, dimensions, runAnimation, drawPixelated])\n\n  const isComplete = status === \"complete\"\n  const isAnimating = status === \"animating\" || status === \"loading\"\n\n  return (\n    <div\n      ref={containerRef}\n      className={`relative w-full h-full ${className || \"\"}`}\n    >\n      <canvas\n        ref={canvasRef}\n        className=\"absolute top-0 left-0 w-full h-full\"\n        style={{\n          objectFit,\n          opacity: isComplete ? 0 : 1,\n          zIndex: isAnimating ? 2 : 1,\n        }}\n        aria-hidden={isComplete}\n      />\n      {isComplete && (\n        <Image\n          src={src}\n          alt={alt}\n          fill\n          priority={priority}\n          quality={quality}\n          placeholder={placeholder}\n          blurDataURL={blurDataURL}\n          className=\"opacity-100 transition-opacity duration-150 ease-out z-[1]\"\n          style={{\n            objectFit,\n          }}\n        />\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","names":["Image","useCallback","useEffect","useRef","useState","jsx","jsxs","isStaticImageData","src","getImageSrc","PixelLoad","alt","duration","steps","className","onAnimationComplete","priority","quality","placeholder","blurDataURL","objectFit","containerRef","canvasRef","status","setStatus","dimensions","setDimensions","imageSrc","drawPixelated","ctx","img","pixelSize","w","h","sw","sh","runAnimation","minPixelSize","intervalMs","currentStep","animate","progress","container","updateDimensions","width","height","resizeObserver","canvas","isComplete","isAnimating"]}

package/dist/chunk-WJXJQZGO.js

@@ -0,0 +1,3 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }"use client";
+var _chunkFUYXCJOQjs = require('./chunk-FUYXCJOQ.js');var _react = require('react'); var a = _interopRequireWildcard(_react);var _reactslot = require('@radix-ui/react-slot');var _classvarianceauthority = require('class-variance-authority');var _jsxruntime = require('react/jsx-runtime');var p=_classvarianceauthority.cva.call(void 0, "inline-flex items-center cursor-pointer justify-center whitespace-nowrap rounded-3xl font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",{variants:{variant:{default:"bg-primary text-primary-foreground hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground hover:bg-destructive/90",outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary/80 text-secondary-foreground hover:bg-secondary",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2 text-base",sm:"h-8 text-sm px-3 py-2",lg:"h-10 px-8 py-2 text-base",icon:"h-9 w-9"}},defaultVariants:{variant:"default",size:"default"}}),b= exports.b =a.forwardRef(({className:i,variant:s,size:d,asChild:c=!1,loading:e=!1,icon:r,...t},u)=>_jsxruntime.jsxs.call(void 0, c?_reactslot.Slot:"button",{className:_chunkFUYXCJOQjs.a.call(void 0, p({variant:s,size:d,className:i})),ref:u,disabled:e||t.disabled,...t,children:[e&&_jsxruntime.jsx.call(void 0, "div",{className:"mr-2 h-4 w-4 animate-spin rounded-full border border-primary-foreground border-t-transparent"}),!e&&r&&_jsxruntime.jsx.call(void 0, "span",{className:"mr-2",children:r}),t.children]}));b.displayName="Button";exports.a = p; exports.b = b;
+//# sourceMappingURL=chunk-WJXJQZGO.js.map

package/dist/chunk-WJXJQZGO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/chunk-WJXJQZGO.js","../src/components/button.tsx"],"names":["buttonVariants","cva","Button","className","variant","size","asChild","loading","icon","props","ref","jsxs","Slot","cn","jsx"],"mappings":"AAAA,uWAAY;AACZ,sDAAuC,uECDhB,iDACF,kEACkB,+CAwDjC,IApDAA,CAAAA,CAAiBC,yCAAAA,gSACrB,CACA,CACE,QAAA,CAAU,CACR,OAAA,CAAS,CACP,OAAA,CAAS,wDAAA,CACT,WAAA,CACE,oEAAA,CACF,OAAA,CACE,gFAAA,CACF,SAAA,CACE,8DAAA,CACF,KAAA,CAAO,8CAAA,CACP,IAAA,CAAM,iDACR,CAAA,CACA,IAAA,CAAM,CACJ,OAAA,CAAS,yBAAA,CACT,EAAA,CAAI,uBAAA,CACJ,EAAA,CAAI,0BAAA,CACJ,IAAA,CAAM,SACR,CACF,CAAA,CACA,eAAA,CAAiB,CACf,OAAA,CAAS,SAAA,CACT,IAAA,CAAM,SACR,CACF,CACF,CAAA,CAUMC,CAAAA,aAAe,CAAA,CAAA,UAAA,CACnB,CACE,CACE,SAAA,CAAAC,CAAAA,CACA,OAAA,CAAAC,CAAAA,CACA,IAAA,CAAAC,CAAAA,CACA,OAAA,CAAAC,CAAAA,CAAU,CAAA,CAAA,CACV,OAAA,CAAAC,CAAAA,CAAU,CAAA,CAAA,CACV,IAAA,CAAAC,CAAAA,CACA,GAAGC,CACL,CAAA,CACAC,CAAAA,CAAAA,EAIEC,8BAAAA,CAFWL,CAAUM,eAAAA,CAAO,QAAA,CAE3B,CACC,SAAA,CAAWC,gCAAAA,CAAGb,CAAe,CAAE,OAAA,CAAAI,CAAAA,CAAS,IAAA,CAAAC,CAAAA,CAAM,SAAA,CAAAF,CAAU,CAAC,CAAC,CAAA,CAC1D,GAAA,CAAKO,CAAAA,CACL,QAAA,CAAUH,CAAAA,EAAWE,CAAAA,CAAM,QAAA,CAC1B,GAAGA,CAAAA,CAEH,QAAA,CAAA,CAAAF,CAAAA,EACCO,6BAAAA,KAAC,CAAA,CAAI,SAAA,CAAU,8FAAA,CAA+F,CAAA,CAE/G,CAACP,CAAAA,EAAWC,CAAAA,EAAQM,6BAAAA,MAAC,CAAA,CAAK,SAAA,CAAU,MAAA,CAAQ,QAAA,CAAAN,CAAAA,CAAK,CAAA,CACjDC,CAAAA,CAAM,QAAA,CAAA,CACT,CAGN,CAAA,CACAP,CAAAA,CAAO,WAAA,CAAc,QAAA,CAAA,6BAAA","file":"/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/chunk-WJXJQZGO.js","sourcesContent":[null,"import * as React from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst buttonVariants = cva(\n  \"inline-flex items-center cursor-pointer justify-center whitespace-nowrap rounded-3xl font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n        destructive:\n          \"bg-destructive text-destructive-foreground hover:bg-destructive/90\",\n        outline:\n          \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n        secondary:\n          \"bg-secondary/80 text-secondary-foreground hover:bg-secondary\",\n        ghost: \"hover:bg-accent hover:text-accent-foreground\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default: \"h-9 px-4 py-2 text-base\",\n        sm: \"h-8 text-sm px-3 py-2\",\n        lg: \"h-10 px-8 py-2 text-base\",\n        icon: \"h-9 w-9\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean\n  loading?: boolean\n  icon?: React.ReactNode\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      variant,\n      size,\n      asChild = false,\n      loading = false,\n      icon,\n      ...props\n    },\n    ref\n  ) => {\n    const Comp = asChild ? Slot : \"button\"\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, size, className }))}\n        ref={ref}\n        disabled={loading || props.disabled}\n        {...props}\n      >\n        {loading && (\n          <div className=\"mr-2 h-4 w-4 animate-spin rounded-full border border-primary-foreground border-t-transparent\" />\n        )}\n        {!loading && icon && <span className=\"mr-2\">{icon}</span>}\n        {props.children}\n      </Comp>\n    )\n  }\n)\nButton.displayName = \"Button\"\n\nexport { Button, buttonVariants }\n"]}

package/dist/chunk-XNHJPYUV.mjs

@@ -0,0 +1,3 @@
+"use client";
+import{a as o}from"./chunk-S5TKCF6T.mjs";import*as a from"react";import{Slot as l}from"@radix-ui/react-slot";import{cva as f}from"class-variance-authority";import{jsx as n,jsxs as m}from"react/jsx-runtime";var p=f("inline-flex items-center cursor-pointer justify-center whitespace-nowrap rounded-3xl font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",{variants:{variant:{default:"bg-primary text-primary-foreground hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground hover:bg-destructive/90",outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary/80 text-secondary-foreground hover:bg-secondary",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2 text-base",sm:"h-8 text-sm px-3 py-2",lg:"h-10 px-8 py-2 text-base",icon:"h-9 w-9"}},defaultVariants:{variant:"default",size:"default"}}),b=a.forwardRef(({className:i,variant:s,size:d,asChild:c=!1,loading:e=!1,icon:r,...t},u)=>m(c?l:"button",{className:o(p({variant:s,size:d,className:i})),ref:u,disabled:e||t.disabled,...t,children:[e&&n("div",{className:"mr-2 h-4 w-4 animate-spin rounded-full border border-primary-foreground border-t-transparent"}),!e&&r&&n("span",{className:"mr-2",children:r}),t.children]}));b.displayName="Button";export{p as a,b};
+//# sourceMappingURL=chunk-XNHJPYUV.mjs.map

package/dist/chunk-XNHJPYUV.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/button.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst buttonVariants = cva(\n  \"inline-flex items-center cursor-pointer justify-center whitespace-nowrap rounded-3xl font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n        destructive:\n          \"bg-destructive text-destructive-foreground hover:bg-destructive/90\",\n        outline:\n          \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n        secondary:\n          \"bg-secondary/80 text-secondary-foreground hover:bg-secondary\",\n        ghost: \"hover:bg-accent hover:text-accent-foreground\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default: \"h-9 px-4 py-2 text-base\",\n        sm: \"h-8 text-sm px-3 py-2\",\n        lg: \"h-10 px-8 py-2 text-base\",\n        icon: \"h-9 w-9\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean\n  loading?: boolean\n  icon?: React.ReactNode\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      variant,\n      size,\n      asChild = false,\n      loading = false,\n      icon,\n      ...props\n    },\n    ref\n  ) => {\n    const Comp = asChild ? Slot : \"button\"\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, size, className }))}\n        ref={ref}\n        disabled={loading || props.disabled}\n        {...props}\n      >\n        {loading && (\n          <div className=\"mr-2 h-4 w-4 animate-spin rounded-full border border-primary-foreground border-t-transparent\" />\n        )}\n        {!loading && icon && <span className=\"mr-2\">{icon}</span>}\n        {props.children}\n      </Comp>\n    )\n  }\n)\nButton.displayName = \"Button\"\n\nexport { Button, buttonVariants }\n"],"mappings":";yCAAA,UAAYA,MAAW,QACvB,OAAS,QAAAC,MAAY,uBACrB,OAAS,OAAAC,MAA8B,2BAwDjC,OAOI,OAAAC,EAPJ,QAAAC,MAAA,oBApDN,IAAMC,EAAiBC,EACrB,iSACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,yDACT,YACE,qEACF,QACE,iFACF,UACE,+DACF,MAAO,+CACP,KAAM,iDACR,EACA,KAAM,CACJ,QAAS,0BACT,GAAI,wBACJ,GAAI,2BACJ,KAAM,SACR,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,SACR,CACF,CACF,EAUMC,EAAe,aACnB,CACE,CACE,UAAAC,EACA,QAAAC,EACA,KAAAC,EACA,QAAAC,EAAU,GACV,QAAAC,EAAU,GACV,KAAAC,EACA,GAAGC,CACL,EACAC,IAIEX,EAFWO,EAAUK,EAAO,SAE3B,CACC,UAAWC,EAAGZ,EAAe,CAAE,QAAAI,EAAS,KAAAC,EAAM,UAAAF,CAAU,CAAC,CAAC,EAC1D,IAAKO,EACL,SAAUH,GAAWE,EAAM,SAC1B,GAAGA,EAEH,UAAAF,GACCT,EAAC,OAAI,UAAU,+FAA+F,EAE/G,CAACS,GAAWC,GAAQV,EAAC,QAAK,UAAU,OAAQ,SAAAU,EAAK,EACjDC,EAAM,UACT,CAGN,EACAP,EAAO,YAAc","names":["React","Slot","cva","jsx","jsxs","buttonVariants","cva","Button","className","variant","size","asChild","loading","icon","props","ref","Slot","cn"]}

package/dist/components/GlitchLink.js

@@ -1,89 +1,3 @@
-"use client"
-"use strict";
-"use client";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/GlitchLink.tsx
-var GlitchLink_exports = {};
-__export(GlitchLink_exports, {
-  DEFAULT_SYMBOLS: () => DEFAULT_SYMBOLS,
-  default: () => GlitchLink_default
-});
-module.exports = __toCommonJS(GlitchLink_exports);
-var import_link = __toESM(require("next/link"));
-var import_react = require("react");
-var import_react_slot = require("@radix-ui/react-slot");
-var import_jsx_runtime = require("react/jsx-runtime");
-var DEFAULT_SYMBOLS = ["/", "#", "*"];
-var GlitchLink = ({
-  href,
-  children,
-  symbols = DEFAULT_SYMBOLS,
-  className,
-  asChild = false,
-  ...props
-}) => {
-  const [isHovering, setIsHovering] = (0, import_react.useState)(false);
-  const getTextContent = (node) => {
-    if (typeof node === "string") return node;
-    if ((0, import_react.isValidElement)(node) && node.props.children) {
-      return getTextContent(node.props.children);
-    }
-    return "";
-  };
-  const text = getTextContent(children);
-  const getRandomGlitch = () => {
-    if (!isHovering || !text) return text;
-    return text.split(" ").map((word) => {
-      const randomLetterIndex = Math.floor(Math.random() * word.length);
-      return word.replace(
-        word[randomLetterIndex],
-        symbols[Math.floor(Math.random() * symbols.length)]
-      );
-    }).join(" ");
-  };
-  const commonProps = {
-    className,
-    onMouseEnter: () => setIsHovering(true),
-    onMouseLeave: () => setIsHovering(false),
-    ...props
-  };
-  if (asChild && (0, import_react.isValidElement)(children)) {
-    const content2 = text ? isHovering ? getRandomGlitch() : text : children;
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_slot.Slot, { ...commonProps, children: (0, import_react.cloneElement)(children, {}, content2) });
-  }
-  const content = text ? isHovering ? getRandomGlitch() : children : children;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_link.default, { href: href || "#", ...commonProps, children: content });
-};
-var GlitchLink_default = GlitchLink;
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  DEFAULT_SYMBOLS
-});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+"use client";var _chunkJNEIOQGFjs = require('../chunk-JNEIOQGF.js');exports.DEFAULT_SYMBOLS = _chunkJNEIOQGFjs.a; exports.default = _chunkJNEIOQGFjs.b;
 //# sourceMappingURL=GlitchLink.js.map

package/dist/components/GlitchLink.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/GlitchLink.tsx"],"sourcesContent":["\"use client\"\nimport Link from \"next/link\"\nimport {\n  RefAttributes,\n  useState,\n  ReactNode,\n  cloneElement,\n  isValidElement,\n} from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\n\nexport const DEFAULT_SYMBOLS = [\"/\", \"#\", \"*\"]\n\ntype GlitchLinkProps = RefAttributes<HTMLAnchorElement> & {\n  href?: string\n  children: ReactNode\n  symbols?: string[]\n  className?: string\n  asChild?: boolean\n}\n\nconst GlitchLink = ({\n  href,\n  children,\n  symbols = DEFAULT_SYMBOLS,\n  className,\n  asChild = false,\n  ...props\n}: GlitchLinkProps) => {\n  const [isHovering, setIsHovering] = useState(false)\n\n  // Extract text from children - either direct string or from child element\n  const getTextContent = (node: ReactNode): string => {\n    if (typeof node === \"string\") return node\n    if (isValidElement(node) && node.props.children) {\n      return getTextContent(node.props.children)\n    }\n    return \"\"\n  }\n\n  const text = getTextContent(children)\n\n  const getRandomGlitch = () => {\n    if (!isHovering || !text) return text\n    return text\n      .split(\" \")\n      .map((word: string) => {\n        // take one random letter from the word\n        const randomLetterIndex = Math.floor(Math.random() * word.length)\n\n        // replace the letter with a random symbol\n        return word.replace(\n          word[randomLetterIndex],\n          symbols[Math.floor(Math.random() * symbols.length)]\n        )\n      })\n      .join(\" \")\n  }\n\n  const commonProps = {\n    className,\n    onMouseEnter: () => setIsHovering(true),\n    onMouseLeave: () => setIsHovering(false),\n    ...props,\n  }\n\n  if (asChild && isValidElement(children)) {\n    const content = text ? (isHovering ? getRandomGlitch() : text) : children\n    return (\n      <Slot {...commonProps}>\n        {cloneElement(children as React.ReactElement, {}, content)}\n      </Slot>\n    )\n  }\n\n  const content = text ? (isHovering ? getRandomGlitch() : children) : children\n\n  return (\n    <Link href={href || \"#\"} {...commonProps}>\n      {content}\n    </Link>\n  )\n}\n\nexport default GlitchLink\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAAiB;AACjB,mBAMO;AACP,wBAAqB;AA4Df;AA1DC,IAAM,kBAAkB,CAAC,KAAK,KAAK,GAAG;AAU7C,IAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAuB;AACrB,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAGlD,QAAM,iBAAiB,CAAC,SAA4B;AAClD,QAAI,OAAO,SAAS,SAAU,QAAO;AACrC,YAAI,6BAAe,IAAI,KAAK,KAAK,MAAM,UAAU;AAC/C,aAAO,eAAe,KAAK,MAAM,QAAQ;AAAA,IAC3C;AACA,WAAO;AAAA,EACT;AAEA,QAAM,OAAO,eAAe,QAAQ;AAEpC,QAAM,kBAAkB,MAAM;AAC5B,QAAI,CAAC,cAAc,CAAC,KAAM,QAAO;AACjC,WAAO,KACJ,MAAM,GAAG,EACT,IAAI,CAAC,SAAiB;AAErB,YAAM,oBAAoB,KAAK,MAAM,KAAK,OAAO,IAAI,KAAK,MAAM;AAGhE,aAAO,KAAK;AAAA,QACV,KAAK,iBAAiB;AAAA,QACtB,QAAQ,KAAK,MAAM,KAAK,OAAO,IAAI,QAAQ,MAAM,CAAC;AAAA,MACpD;AAAA,IACF,CAAC,EACA,KAAK,GAAG;AAAA,EACb;AAEA,QAAM,cAAc;AAAA,IAClB;AAAA,IACA,cAAc,MAAM,cAAc,IAAI;AAAA,IACtC,cAAc,MAAM,cAAc,KAAK;AAAA,IACvC,GAAG;AAAA,EACL;AAEA,MAAI,eAAW,6BAAe,QAAQ,GAAG;AACvC,UAAMA,WAAU,OAAQ,aAAa,gBAAgB,IAAI,OAAQ;AACjE,WACE,4CAAC,0BAAM,GAAG,aACP,yCAAa,UAAgC,CAAC,GAAGA,QAAO,GAC3D;AAAA,EAEJ;AAEA,QAAM,UAAU,OAAQ,aAAa,gBAAgB,IAAI,WAAY;AAErE,SACE,4CAAC,YAAAC,SAAA,EAAK,MAAM,QAAQ,KAAM,GAAG,aAC1B,mBACH;AAEJ;AAEA,IAAO,qBAAQ;","names":["content","Link"]}
+{"version":3,"sources":["/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/components/GlitchLink.js"],"names":[],"mappings":"AAAA,qFAAY;AACZ,YAAY,CAAC,uDAAqC,mFAA0C","file":"/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/components/GlitchLink.js"}

package/dist/components/GlitchLink.mjs

@@ -1,59 +1,3 @@
-"use client"
 "use client";
-
-// src/components/GlitchLink.tsx
-import Link from "next/link";
-import {
-  useState,
-  cloneElement,
-  isValidElement
-} from "react";
-import { Slot } from "@radix-ui/react-slot";
-import { jsx } from "react/jsx-runtime";
-var DEFAULT_SYMBOLS = ["/", "#", "*"];
-var GlitchLink = ({
-  href,
-  children,
-  symbols = DEFAULT_SYMBOLS,
-  className,
-  asChild = false,
-  ...props
-}) => {
-  const [isHovering, setIsHovering] = useState(false);
-  const getTextContent = (node) => {
-    if (typeof node === "string") return node;
-    if (isValidElement(node) && node.props.children) {
-      return getTextContent(node.props.children);
-    }
-    return "";
-  };
-  const text = getTextContent(children);
-  const getRandomGlitch = () => {
-    if (!isHovering || !text) return text;
-    return text.split(" ").map((word) => {
-      const randomLetterIndex = Math.floor(Math.random() * word.length);
-      return word.replace(
-        word[randomLetterIndex],
-        symbols[Math.floor(Math.random() * symbols.length)]
-      );
-    }).join(" ");
-  };
-  const commonProps = {
-    className,
-    onMouseEnter: () => setIsHovering(true),
-    onMouseLeave: () => setIsHovering(false),
-    ...props
-  };
-  if (asChild && isValidElement(children)) {
-    const content2 = text ? isHovering ? getRandomGlitch() : text : children;
-    return /* @__PURE__ */ jsx(Slot, { ...commonProps, children: cloneElement(children, {}, content2) });
-  }
-  const content = text ? isHovering ? getRandomGlitch() : children : children;
-  return /* @__PURE__ */ jsx(Link, { href: href || "#", ...commonProps, children: content });
-};
-var GlitchLink_default = GlitchLink;
-export {
-  DEFAULT_SYMBOLS,
-  GlitchLink_default as default
-};
+"use client";import{a,b}from"../chunk-IK3C7KV5.mjs";export{a as DEFAULT_SYMBOLS,b as default};
 //# sourceMappingURL=GlitchLink.mjs.map

package/dist/components/GlitchLink.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/GlitchLink.tsx"],"sourcesContent":["\"use client\"\nimport Link from \"next/link\"\nimport {\n  RefAttributes,\n  useState,\n  ReactNode,\n  cloneElement,\n  isValidElement,\n} from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\n\nexport const DEFAULT_SYMBOLS = [\"/\", \"#\", \"*\"]\n\ntype GlitchLinkProps = RefAttributes<HTMLAnchorElement> & {\n  href?: string\n  children: ReactNode\n  symbols?: string[]\n  className?: string\n  asChild?: boolean\n}\n\nconst GlitchLink = ({\n  href,\n  children,\n  symbols = DEFAULT_SYMBOLS,\n  className,\n  asChild = false,\n  ...props\n}: GlitchLinkProps) => {\n  const [isHovering, setIsHovering] = useState(false)\n\n  // Extract text from children - either direct string or from child element\n  const getTextContent = (node: ReactNode): string => {\n    if (typeof node === \"string\") return node\n    if (isValidElement(node) && node.props.children) {\n      return getTextContent(node.props.children)\n    }\n    return \"\"\n  }\n\n  const text = getTextContent(children)\n\n  const getRandomGlitch = () => {\n    if (!isHovering || !text) return text\n    return text\n      .split(\" \")\n      .map((word: string) => {\n        // take one random letter from the word\n        const randomLetterIndex = Math.floor(Math.random() * word.length)\n\n        // replace the letter with a random symbol\n        return word.replace(\n          word[randomLetterIndex],\n          symbols[Math.floor(Math.random() * symbols.length)]\n        )\n      })\n      .join(\" \")\n  }\n\n  const commonProps = {\n    className,\n    onMouseEnter: () => setIsHovering(true),\n    onMouseLeave: () => setIsHovering(false),\n    ...props,\n  }\n\n  if (asChild && isValidElement(children)) {\n    const content = text ? (isHovering ? getRandomGlitch() : text) : children\n    return (\n      <Slot {...commonProps}>\n        {cloneElement(children as React.ReactElement, {}, content)}\n      </Slot>\n    )\n  }\n\n  const content = text ? (isHovering ? getRandomGlitch() : children) : children\n\n  return (\n    <Link href={href || \"#\"} {...commonProps}>\n      {content}\n    </Link>\n  )\n}\n\nexport default GlitchLink\n"],"mappings":";;;;AACA,OAAO,UAAU;AACjB;AAAA,EAEE;AAAA,EAEA;AAAA,EACA;AAAA,OACK;AACP,SAAS,YAAY;AA4Df;AA1DC,IAAM,kBAAkB,CAAC,KAAK,KAAK,GAAG;AAU7C,IAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAuB;AACrB,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAGlD,QAAM,iBAAiB,CAAC,SAA4B;AAClD,QAAI,OAAO,SAAS,SAAU,QAAO;AACrC,QAAI,eAAe,IAAI,KAAK,KAAK,MAAM,UAAU;AAC/C,aAAO,eAAe,KAAK,MAAM,QAAQ;AAAA,IAC3C;AACA,WAAO;AAAA,EACT;AAEA,QAAM,OAAO,eAAe,QAAQ;AAEpC,QAAM,kBAAkB,MAAM;AAC5B,QAAI,CAAC,cAAc,CAAC,KAAM,QAAO;AACjC,WAAO,KACJ,MAAM,GAAG,EACT,IAAI,CAAC,SAAiB;AAErB,YAAM,oBAAoB,KAAK,MAAM,KAAK,OAAO,IAAI,KAAK,MAAM;AAGhE,aAAO,KAAK;AAAA,QACV,KAAK,iBAAiB;AAAA,QACtB,QAAQ,KAAK,MAAM,KAAK,OAAO,IAAI,QAAQ,MAAM,CAAC;AAAA,MACpD;AAAA,IACF,CAAC,EACA,KAAK,GAAG;AAAA,EACb;AAEA,QAAM,cAAc;AAAA,IAClB;AAAA,IACA,cAAc,MAAM,cAAc,IAAI;AAAA,IACtC,cAAc,MAAM,cAAc,KAAK;AAAA,IACvC,GAAG;AAAA,EACL;AAEA,MAAI,WAAW,eAAe,QAAQ,GAAG;AACvC,UAAMA,WAAU,OAAQ,aAAa,gBAAgB,IAAI,OAAQ;AACjE,WACE,oBAAC,QAAM,GAAG,aACP,uBAAa,UAAgC,CAAC,GAAGA,QAAO,GAC3D;AAAA,EAEJ;AAEA,QAAM,UAAU,OAAQ,aAAa,gBAAgB,IAAI,WAAY;AAErE,SACE,oBAAC,QAAK,MAAM,QAAQ,KAAM,GAAG,aAC1B,mBACH;AAEJ;AAEA,IAAO,qBAAQ;","names":["content"]}
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/PixelLoad.js

@@ -1,182 +1,3 @@
-"use client"
-"use strict";
-"use client";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/PixelLoad.tsx
-var PixelLoad_exports = {};
-__export(PixelLoad_exports, {
-  PixelLoad: () => PixelLoad
-});
-module.exports = __toCommonJS(PixelLoad_exports);
-var import_image = __toESM(require("next/image"));
-var import_react = require("react");
-var import_jsx_runtime = require("react/jsx-runtime");
-function isStaticImageData(src) {
-  return typeof src === "object" && "src" in src;
-}
-function getImageSrc(src) {
-  return isStaticImageData(src) ? src.src : src;
-}
-function PixelLoad({
-  src,
-  alt,
-  duration = 600,
-  steps = 15,
-  className,
-  onAnimationComplete,
-  priority,
-  quality,
-  placeholder = "empty",
-  blurDataURL,
-  objectFit = "cover"
-}) {
-  const containerRef = (0, import_react.useRef)(null);
-  const canvasRef = (0, import_react.useRef)(null);
-  const [status, setStatus] = (0, import_react.useState)("loading");
-  const [dimensions, setDimensions] = (0, import_react.useState)(null);
-  const imageSrc = getImageSrc(src);
-  const drawPixelated = (0, import_react.useCallback)(
-    (ctx, img, pixelSize, w, h) => {
-      ctx.imageSmoothingEnabled = false;
-      const sw = Math.max(1, Math.floor(w / pixelSize));
-      const sh = Math.max(1, Math.floor(h / pixelSize));
-      ctx.clearRect(0, 0, w, h);
-      ctx.drawImage(img, 0, 0, sw, sh);
-      ctx.drawImage(canvasRef.current, 0, 0, sw, sh, 0, 0, w, h);
-    },
-    []
-  );
-  const runAnimation = (0, import_react.useCallback)(
-    (ctx, img, w, h) => {
-      const minPixelSize = Math.max(w, h) / 4;
-      const intervalMs = duration / steps;
-      let currentStep = 0;
-      setStatus("animating");
-      const animate = () => {
-        const progress = currentStep / steps;
-        const pixelSize = Math.max(1, Math.floor(minPixelSize * (1 - progress)));
-        drawPixelated(ctx, img, pixelSize, w, h);
-        currentStep++;
-        if (currentStep <= steps) {
-          window.setTimeout(animate, intervalMs);
-        } else {
-          setStatus("complete");
-          onAnimationComplete?.();
-        }
-      };
-      animate();
-    },
-    [duration, steps, drawPixelated, onAnimationComplete]
-  );
-  (0, import_react.useEffect)(() => {
-    const container = containerRef.current;
-    if (!container) return;
-    const updateDimensions = () => {
-      const { width, height } = container.getBoundingClientRect();
-      setDimensions({ width: Math.floor(width), height: Math.floor(height) });
-    };
-    const resizeObserver = new ResizeObserver(updateDimensions);
-    resizeObserver.observe(container);
-    updateDimensions();
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, []);
-  (0, import_react.useEffect)(() => {
-    if (!dimensions) return;
-    if (dimensions.width <= 0 || dimensions.height <= 0) return;
-    const canvas = canvasRef.current;
-    if (!canvas) return;
-    const ctx = canvas.getContext("2d");
-    if (!ctx) return;
-    canvas.width = dimensions.width;
-    canvas.height = dimensions.height;
-    const img = new window.Image();
-    img.crossOrigin = "anonymous";
-    img.onload = () => {
-      const minPixelSize = Math.max(dimensions.width, dimensions.height) / 4;
-      drawPixelated(ctx, img, minPixelSize, dimensions.width, dimensions.height);
-      runAnimation(ctx, img, dimensions.width, dimensions.height);
-    };
-    img.onerror = () => {
-      console.error("PixelLoad: Failed to load image");
-    };
-    img.src = imageSrc;
-    return () => {
-      img.onload = null;
-      img.onerror = null;
-    };
-  }, [imageSrc, dimensions, runAnimation, drawPixelated]);
-  const isComplete = status === "complete";
-  const isAnimating = status === "animating" || status === "loading";
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-    "div",
-    {
-      ref: containerRef,
-      className: `relative w-full h-full ${className || ""}`,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "canvas",
-          {
-            ref: canvasRef,
-            className: "absolute top-0 left-0 w-full h-full",
-            style: {
-              objectFit,
-              opacity: isComplete ? 0 : 1,
-              zIndex: isAnimating ? 2 : 1
-            },
-            "aria-hidden": isComplete
-          }
-        ),
-        isComplete && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          import_image.default,
-          {
-            src,
-            alt,
-            fill: true,
-            priority,
-            quality,
-            placeholder,
-            blurDataURL,
-            className: "opacity-100 transition-opacity duration-150 ease-out z-[1]",
-            style: {
-              objectFit
-            }
-          }
-        )
-      ]
-    }
-  );
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  PixelLoad
-});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+"use client";var _chunkR74QDO2Zjs = require('../chunk-R74QDO2Z.js');exports.PixelLoad = _chunkR74QDO2Zjs.a;
 //# sourceMappingURL=PixelLoad.js.map

package/dist/components/PixelLoad.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/PixelLoad.tsx"],"sourcesContent":["\"use client\"\n\nimport Image, { type StaticImageData } from \"next/image\"\nimport { JSX, useCallback, useEffect, useRef, useState } from \"react\"\n\ntype PixelLoadStatus = \"loading\" | \"animating\" | \"complete\"\n\ntype ImageSrc = string | StaticImageData\n\nexport interface PixelLoadProps {\n  src: ImageSrc\n  alt: string\n  duration?: number\n  steps?: number\n  className?: string\n  onAnimationComplete?: () => void\n  priority?: boolean\n  quality?: number\n  placeholder?: \"blur\" | \"empty\"\n  blurDataURL?: string\n  objectFit?: \"contain\" | \"cover\" | \"fill\" | \"none\" | \"scale-down\"\n}\n\nfunction isStaticImageData(src: ImageSrc): src is StaticImageData {\n  return typeof src === \"object\" && \"src\" in src\n}\n\nfunction getImageSrc(src: ImageSrc): string {\n  return isStaticImageData(src) ? src.src : src\n}\n\nexport function PixelLoad({\n  src,\n  alt,\n  duration = 600,\n  steps = 15,\n  className,\n  onAnimationComplete,\n  priority,\n  quality,\n  placeholder = \"empty\",\n  blurDataURL,\n  objectFit = \"cover\",\n}: PixelLoadProps): JSX.Element {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const canvasRef = useRef<HTMLCanvasElement>(null)\n  const [status, setStatus] = useState<PixelLoadStatus>(\"loading\")\n  const [dimensions, setDimensions] = useState<{\n    width: number\n    height: number\n  } | null>(null)\n\n  const imageSrc = getImageSrc(src)\n\n  const drawPixelated = useCallback(\n    (\n      ctx: CanvasRenderingContext2D,\n      img: HTMLImageElement,\n      pixelSize: number,\n      w: number,\n      h: number\n    ): void => {\n      ctx.imageSmoothingEnabled = false\n\n      const sw = Math.max(1, Math.floor(w / pixelSize))\n      const sh = Math.max(1, Math.floor(h / pixelSize))\n\n      ctx.clearRect(0, 0, w, h)\n      ctx.drawImage(img, 0, 0, sw, sh)\n      ctx.drawImage(canvasRef.current!, 0, 0, sw, sh, 0, 0, w, h)\n    },\n    []\n  )\n\n  const runAnimation = useCallback(\n    (\n      ctx: CanvasRenderingContext2D,\n      img: HTMLImageElement,\n      w: number,\n      h: number\n    ): void => {\n      const minPixelSize = Math.max(w, h) / 4\n      const intervalMs = duration / steps\n      let currentStep = 0\n\n      setStatus(\"animating\")\n\n      const animate = (): void => {\n        const progress = currentStep / steps\n        const pixelSize = Math.max(1, Math.floor(minPixelSize * (1 - progress)))\n\n        drawPixelated(ctx, img, pixelSize, w, h)\n\n        currentStep++\n\n        if (currentStep <= steps) {\n          window.setTimeout(animate, intervalMs)\n        } else {\n          setStatus(\"complete\")\n          onAnimationComplete?.()\n        }\n      }\n\n      animate()\n    },\n    [duration, steps, drawPixelated, onAnimationComplete]\n  )\n\n  useEffect(() => {\n    const container = containerRef.current\n    if (!container) return\n\n    const updateDimensions = (): void => {\n      const { width, height } = container.getBoundingClientRect()\n      setDimensions({ width: Math.floor(width), height: Math.floor(height) })\n    }\n\n    const resizeObserver = new ResizeObserver(updateDimensions)\n    resizeObserver.observe(container)\n    updateDimensions()\n\n    return (): void => {\n      resizeObserver.disconnect()\n    }\n  }, [])\n\n  useEffect(() => {\n    if (!dimensions) return\n\n    // Guard against invalid dimensions\n    if (dimensions.width <= 0 || dimensions.height <= 0) return\n\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const ctx = canvas.getContext(\"2d\")\n    if (!ctx) return\n\n    // Set canvas dimensions immediately to ensure it covers the area\n    canvas.width = dimensions.width\n    canvas.height = dimensions.height\n\n    const img = new window.Image()\n    img.crossOrigin = \"anonymous\"\n\n    img.onload = (): void => {\n      // Draw first frame immediately to prevent original image from showing\n      const minPixelSize = Math.max(dimensions.width, dimensions.height) / 4\n      drawPixelated(ctx, img, minPixelSize, dimensions.width, dimensions.height)\n      // Then start animation\n      runAnimation(ctx, img, dimensions.width, dimensions.height)\n    }\n\n    img.onerror = (): void => {\n      console.error(\"PixelLoad: Failed to load image\")\n    }\n\n    img.src = imageSrc\n\n    return (): void => {\n      img.onload = null\n      img.onerror = null\n    }\n  }, [imageSrc, dimensions, runAnimation, drawPixelated])\n\n  const isComplete = status === \"complete\"\n  const isAnimating = status === \"animating\" || status === \"loading\"\n\n  return (\n    <div\n      ref={containerRef}\n      className={`relative w-full h-full ${className || \"\"}`}\n    >\n      <canvas\n        ref={canvasRef}\n        className=\"absolute top-0 left-0 w-full h-full\"\n        style={{\n          objectFit,\n          opacity: isComplete ? 0 : 1,\n          zIndex: isAnimating ? 2 : 1,\n        }}\n        aria-hidden={isComplete}\n      />\n      {isComplete && (\n        <Image\n          src={src}\n          alt={alt}\n          fill\n          priority={priority}\n          quality={quality}\n          placeholder={placeholder}\n          blurDataURL={blurDataURL}\n          className=\"opacity-100 transition-opacity duration-150 ease-out z-[1]\"\n          style={{\n            objectFit,\n          }}\n        />\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","names":["Image"]}
+{"version":3,"sources":["/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/components/PixelLoad.js"],"names":[],"mappings":"AAAA,qFAAY;AACZ,YAAY,CAAC,uDAAmC,uCAAuB","file":"/Users/admin/Desktop/PROJECTS/alkimi-ui-kit/dist/components/PixelLoad.js"}

package/dist/components/PixelLoad.mjs

@@ -1,148 +1,3 @@
-"use client"
 "use client";
-
-// src/components/PixelLoad.tsx
-import Image from "next/image";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function isStaticImageData(src) {
-  return typeof src === "object" && "src" in src;
-}
-function getImageSrc(src) {
-  return isStaticImageData(src) ? src.src : src;
-}
-function PixelLoad({
-  src,
-  alt,
-  duration = 600,
-  steps = 15,
-  className,
-  onAnimationComplete,
-  priority,
-  quality,
-  placeholder = "empty",
-  blurDataURL,
-  objectFit = "cover"
-}) {
-  const containerRef = useRef(null);
-  const canvasRef = useRef(null);
-  const [status, setStatus] = useState("loading");
-  const [dimensions, setDimensions] = useState(null);
-  const imageSrc = getImageSrc(src);
-  const drawPixelated = useCallback(
-    (ctx, img, pixelSize, w, h) => {
-      ctx.imageSmoothingEnabled = false;
-      const sw = Math.max(1, Math.floor(w / pixelSize));
-      const sh = Math.max(1, Math.floor(h / pixelSize));
-      ctx.clearRect(0, 0, w, h);
-      ctx.drawImage(img, 0, 0, sw, sh);
-      ctx.drawImage(canvasRef.current, 0, 0, sw, sh, 0, 0, w, h);
-    },
-    []
-  );
-  const runAnimation = useCallback(
-    (ctx, img, w, h) => {
-      const minPixelSize = Math.max(w, h) / 4;
-      const intervalMs = duration / steps;
-      let currentStep = 0;
-      setStatus("animating");
-      const animate = () => {
-        const progress = currentStep / steps;
-        const pixelSize = Math.max(1, Math.floor(minPixelSize * (1 - progress)));
-        drawPixelated(ctx, img, pixelSize, w, h);
-        currentStep++;
-        if (currentStep <= steps) {
-          window.setTimeout(animate, intervalMs);
-        } else {
-          setStatus("complete");
-          onAnimationComplete?.();
-        }
-      };
-      animate();
-    },
-    [duration, steps, drawPixelated, onAnimationComplete]
-  );
-  useEffect(() => {
-    const container = containerRef.current;
-    if (!container) return;
-    const updateDimensions = () => {
-      const { width, height } = container.getBoundingClientRect();
-      setDimensions({ width: Math.floor(width), height: Math.floor(height) });
-    };
-    const resizeObserver = new ResizeObserver(updateDimensions);
-    resizeObserver.observe(container);
-    updateDimensions();
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, []);
-  useEffect(() => {
-    if (!dimensions) return;
-    if (dimensions.width <= 0 || dimensions.height <= 0) return;
-    const canvas = canvasRef.current;
-    if (!canvas) return;
-    const ctx = canvas.getContext("2d");
-    if (!ctx) return;
-    canvas.width = dimensions.width;
-    canvas.height = dimensions.height;
-    const img = new window.Image();
-    img.crossOrigin = "anonymous";
-    img.onload = () => {
-      const minPixelSize = Math.max(dimensions.width, dimensions.height) / 4;
-      drawPixelated(ctx, img, minPixelSize, dimensions.width, dimensions.height);
-      runAnimation(ctx, img, dimensions.width, dimensions.height);
-    };
-    img.onerror = () => {
-      console.error("PixelLoad: Failed to load image");
-    };
-    img.src = imageSrc;
-    return () => {
-      img.onload = null;
-      img.onerror = null;
-    };
-  }, [imageSrc, dimensions, runAnimation, drawPixelated]);
-  const isComplete = status === "complete";
-  const isAnimating = status === "animating" || status === "loading";
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: containerRef,
-      className: `relative w-full h-full ${className || ""}`,
-      children: [
-        /* @__PURE__ */ jsx(
-          "canvas",
-          {
-            ref: canvasRef,
-            className: "absolute top-0 left-0 w-full h-full",
-            style: {
-              objectFit,
-              opacity: isComplete ? 0 : 1,
-              zIndex: isAnimating ? 2 : 1
-            },
-            "aria-hidden": isComplete
-          }
-        ),
-        isComplete && /* @__PURE__ */ jsx(
-          Image,
-          {
-            src,
-            alt,
-            fill: true,
-            priority,
-            quality,
-            placeholder,
-            blurDataURL,
-            className: "opacity-100 transition-opacity duration-150 ease-out z-[1]",
-            style: {
-              objectFit
-            }
-          }
-        )
-      ]
-    }
-  );
-}
-export {
-  PixelLoad
-};
+"use client";import{a}from"../chunk-WF73K6X2.mjs";export{a as PixelLoad};
 //# sourceMappingURL=PixelLoad.mjs.map

package/dist/components/PixelLoad.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/PixelLoad.tsx"],"sourcesContent":["\"use client\"\n\nimport Image, { type StaticImageData } from \"next/image\"\nimport { JSX, useCallback, useEffect, useRef, useState } from \"react\"\n\ntype PixelLoadStatus = \"loading\" | \"animating\" | \"complete\"\n\ntype ImageSrc = string | StaticImageData\n\nexport interface PixelLoadProps {\n  src: ImageSrc\n  alt: string\n  duration?: number\n  steps?: number\n  className?: string\n  onAnimationComplete?: () => void\n  priority?: boolean\n  quality?: number\n  placeholder?: \"blur\" | \"empty\"\n  blurDataURL?: string\n  objectFit?: \"contain\" | \"cover\" | \"fill\" | \"none\" | \"scale-down\"\n}\n\nfunction isStaticImageData(src: ImageSrc): src is StaticImageData {\n  return typeof src === \"object\" && \"src\" in src\n}\n\nfunction getImageSrc(src: ImageSrc): string {\n  return isStaticImageData(src) ? src.src : src\n}\n\nexport function PixelLoad({\n  src,\n  alt,\n  duration = 600,\n  steps = 15,\n  className,\n  onAnimationComplete,\n  priority,\n  quality,\n  placeholder = \"empty\",\n  blurDataURL,\n  objectFit = \"cover\",\n}: PixelLoadProps): JSX.Element {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const canvasRef = useRef<HTMLCanvasElement>(null)\n  const [status, setStatus] = useState<PixelLoadStatus>(\"loading\")\n  const [dimensions, setDimensions] = useState<{\n    width: number\n    height: number\n  } | null>(null)\n\n  const imageSrc = getImageSrc(src)\n\n  const drawPixelated = useCallback(\n    (\n      ctx: CanvasRenderingContext2D,\n      img: HTMLImageElement,\n      pixelSize: number,\n      w: number,\n      h: number\n    ): void => {\n      ctx.imageSmoothingEnabled = false\n\n      const sw = Math.max(1, Math.floor(w / pixelSize))\n      const sh = Math.max(1, Math.floor(h / pixelSize))\n\n      ctx.clearRect(0, 0, w, h)\n      ctx.drawImage(img, 0, 0, sw, sh)\n      ctx.drawImage(canvasRef.current!, 0, 0, sw, sh, 0, 0, w, h)\n    },\n    []\n  )\n\n  const runAnimation = useCallback(\n    (\n      ctx: CanvasRenderingContext2D,\n      img: HTMLImageElement,\n      w: number,\n      h: number\n    ): void => {\n      const minPixelSize = Math.max(w, h) / 4\n      const intervalMs = duration / steps\n      let currentStep = 0\n\n      setStatus(\"animating\")\n\n      const animate = (): void => {\n        const progress = currentStep / steps\n        const pixelSize = Math.max(1, Math.floor(minPixelSize * (1 - progress)))\n\n        drawPixelated(ctx, img, pixelSize, w, h)\n\n        currentStep++\n\n        if (currentStep <= steps) {\n          window.setTimeout(animate, intervalMs)\n        } else {\n          setStatus(\"complete\")\n          onAnimationComplete?.()\n        }\n      }\n\n      animate()\n    },\n    [duration, steps, drawPixelated, onAnimationComplete]\n  )\n\n  useEffect(() => {\n    const container = containerRef.current\n    if (!container) return\n\n    const updateDimensions = (): void => {\n      const { width, height } = container.getBoundingClientRect()\n      setDimensions({ width: Math.floor(width), height: Math.floor(height) })\n    }\n\n    const resizeObserver = new ResizeObserver(updateDimensions)\n    resizeObserver.observe(container)\n    updateDimensions()\n\n    return (): void => {\n      resizeObserver.disconnect()\n    }\n  }, [])\n\n  useEffect(() => {\n    if (!dimensions) return\n\n    // Guard against invalid dimensions\n    if (dimensions.width <= 0 || dimensions.height <= 0) return\n\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const ctx = canvas.getContext(\"2d\")\n    if (!ctx) return\n\n    // Set canvas dimensions immediately to ensure it covers the area\n    canvas.width = dimensions.width\n    canvas.height = dimensions.height\n\n    const img = new window.Image()\n    img.crossOrigin = \"anonymous\"\n\n    img.onload = (): void => {\n      // Draw first frame immediately to prevent original image from showing\n      const minPixelSize = Math.max(dimensions.width, dimensions.height) / 4\n      drawPixelated(ctx, img, minPixelSize, dimensions.width, dimensions.height)\n      // Then start animation\n      runAnimation(ctx, img, dimensions.width, dimensions.height)\n    }\n\n    img.onerror = (): void => {\n      console.error(\"PixelLoad: Failed to load image\")\n    }\n\n    img.src = imageSrc\n\n    return (): void => {\n      img.onload = null\n      img.onerror = null\n    }\n  }, [imageSrc, dimensions, runAnimation, drawPixelated])\n\n  const isComplete = status === \"complete\"\n  const isAnimating = status === \"animating\" || status === \"loading\"\n\n  return (\n    <div\n      ref={containerRef}\n      className={`relative w-full h-full ${className || \"\"}`}\n    >\n      <canvas\n        ref={canvasRef}\n        className=\"absolute top-0 left-0 w-full h-full\"\n        style={{\n          objectFit,\n          opacity: isComplete ? 0 : 1,\n          zIndex: isAnimating ? 2 : 1,\n        }}\n        aria-hidden={isComplete}\n      />\n      {isComplete && (\n        <Image\n          src={src}\n          alt={alt}\n          fill\n          priority={priority}\n          quality={quality}\n          placeholder={placeholder}\n          blurDataURL={blurDataURL}\n          className=\"opacity-100 transition-opacity duration-150 ease-out z-[1]\"\n          style={{\n            objectFit,\n          }}\n        />\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}