@arolariu/components 0.1.2 → 0.3.0

package/dist/components/ui/popover.js

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

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\popover.js","sources":["webpack://@arolariu/components/./src/components/ui/popover.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Popover({\n  ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n  return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\nfunction PopoverTrigger({\n  ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n  return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n  className,\n  align = \"center\",\n  sideOffset = 4,\n  ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n  return (\n    <PopoverPrimitive.Portal>\n      <PopoverPrimitive.Content\n        data-slot=\"popover-content\"\n        align={align}\n        sideOffset={sideOffset}\n        className={cn(\n          \"bg-white text-neutral-950 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border border-neutral-200 p-4 shadow-md outline-hidden dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800\",\n          className,\n        )}\n        {...props}\n      />\n    </PopoverPrimitive.Portal>\n  );\n}\n\nfunction PopoverAnchor({\n  ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n  return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };\n"],"names":["Popover","props","PopoverPrimitive","PopoverTrigger","PopoverContent","className","align","sideOffset","cn","PopoverAnchor"],"mappings":";;;;;AAOA,SAASA,QAAQ,EACf,GAAGC,OACgD;IACnD,OAAO,WAAP,GAAO,IAACC,MAAqB;QAAC,aAAU;QAAW,GAAGD,KAAK;;AAC7D;AAEA,SAASE,eAAe,EACtB,GAAGF,OACmD;IACtD,OAAO,WAAP,GAAO,IAACC,SAAwB;QAAC,aAAU;QAAmB,GAAGD,KAAK;;AACxE;AAEA,SAASG,eAAe,EACtBC,SAAS,EACTC,QAAQ,QAAQ,EAChBC,aAAa,CAAC,EACd,GAAGN,OACmD;IACtD,OAAO,WAAP,GACE,IAACC,QAAuB;kBACtB,kBAACA,SAAwB;YACvB,aAAU;YACV,OAAOI;YACP,YAAYC;YACZ,WAAWC,GACT,6iBACAH;YAED,GAAGJ,KAAK;;;AAIjB;AAEA,SAASQ,cAAc,EACrB,GAAGR,OACkD;IACrD,OAAO,WAAP,GAAO,IAACC,QAAuB;QAAC,aAAU;QAAkB,GAAGD,KAAK;;AACtE"}
+{"version":3,"file":"components\\ui\\popover.js","sources":["webpack://@arolariu/components/./src/components/ui/popover.tsx"],"sourcesContent":["\r\n\r\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst Popover = PopoverPrimitive.Root;\r\n\r\nconst PopoverTrigger = PopoverPrimitive.Trigger;\r\n\r\nconst PopoverAnchor = PopoverPrimitive.Anchor;\r\n\r\nconst PopoverContent = React.forwardRef<\r\n  React.ElementRef<typeof PopoverPrimitive.Content>,\r\n  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\r\n>(({className, align = \"center\", sideOffset = 4, ...props}, ref) => (\r\n  <PopoverPrimitive.Portal>\r\n    <PopoverPrimitive.Content\r\n      ref={ref}\r\n      align={align}\r\n      sideOffset={sideOffset}\r\n      className={cn(\r\n        \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-[--radix-popover-content-transform-origin] rounded-md border border-neutral-200 bg-white p-4 text-neutral-950 shadow-md outline-none dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  </PopoverPrimitive.Portal>\r\n));\r\nPopoverContent.displayName = PopoverPrimitive.Content.displayName;\r\n\r\nexport {Popover, PopoverAnchor, PopoverContent, PopoverTrigger};\r\n"],"names":["Popover","PopoverPrimitive","PopoverTrigger","PopoverAnchor","PopoverContent","React","className","align","sideOffset","props","ref","cn"],"mappings":";;;;;AAOA,MAAMA,UAAUC;AAEhB,MAAMC,iBAAiBD;AAEvB,MAAME,gBAAgBF;AAEtB,MAAMG,iBAAiB,WAAjBA,GAAiBC,WAGrB,CAAC,EAACC,SAAS,EAAEC,QAAQ,QAAQ,EAAEC,aAAa,CAAC,EAAE,GAAGC,OAAM,EAAEC,MAAAA,WAAAA,GAC1D,IAACT,QAAuB;kBACtB,kBAACA,SAAwB;YACvB,KAAKS;YACL,OAAOH;YACP,YAAYC;YACZ,WAAWG,GACT,2iBACAL;YAED,GAAGG,KAAK;;;AAIfL,eAAe,WAAW,GAAGH,QAAAA,WAAoC"}

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

@@ -1,5 +1,5 @@
-import * as React from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-declare function Progress({ className, value, ...props }: React.ComponentProps<typeof ProgressPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+import * as React from "react";
+declare const Progress: React.ForwardRefExoticComponent<Omit<ProgressPrimitive.ProgressProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { Progress };
 //# sourceMappingURL=progress.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../src/components/ui/progress.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAI9D,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,2CAiBrD;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../src/components/ui/progress.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAC9D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,QAAQ,2JAaZ,CAAC;AAGH,OAAO,EAAC,QAAQ,EAAC,CAAC"}

package/dist/components/ui/progress.js

@@ -1,22 +1,20 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
-import "react";
 import { Indicator, Root } from "@radix-ui/react-progress";
-import { cn } from "../../lib/utils.js";
-function Progress({ className, value, ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        "data-slot": "progress",
-        className: cn("bg-neutral-900/20 relative h-2 w-full overflow-hidden rounded-full dark:bg-neutral-50/20", className),
+import { forwardRef } from "react";
+import { cn } from "../../lib/utilities.js";
+const Progress = /*#__PURE__*/ forwardRef(({ className, value, ...props }, ref)=>/*#__PURE__*/ jsx(Root, {
+        ref: ref,
+        className: cn("relative h-2 w-full overflow-hidden rounded-full bg-neutral-900/20 dark:bg-neutral-50/20", className),
         ...props,
         children: /*#__PURE__*/ jsx(Indicator, {
-            "data-slot": "progress-indicator",
-            className: "bg-neutral-900 h-full w-full flex-1 transition-all dark:bg-neutral-50",
+            className: "h-full w-full flex-1 bg-neutral-900 transition-all dark:bg-neutral-50",
             style: {
                 transform: `translateX(-${100 - (value || 0)}%)`
             }
         })
-    });
-}
+    }));
+Progress.displayName = Root.displayName;
 export { Progress };
 
 //# sourceMappingURL=progress.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\progress.js","sources":["webpack://@arolariu/components/./src/components/ui/progress.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as ProgressPrimitive from \"@radix-ui/react-progress\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Progress({\n  className,\n  value,\n  ...props\n}: React.ComponentProps<typeof ProgressPrimitive.Root>) {\n  return (\n    <ProgressPrimitive.Root\n      data-slot=\"progress\"\n      className={cn(\n        \"bg-neutral-900/20 relative h-2 w-full overflow-hidden rounded-full dark:bg-neutral-50/20\",\n        className,\n      )}\n      {...props}\n    >\n      <ProgressPrimitive.Indicator\n        data-slot=\"progress-indicator\"\n        className=\"bg-neutral-900 h-full w-full flex-1 transition-all dark:bg-neutral-50\"\n        style={{ transform: `translateX(-${100 - (value || 0)}%)` }}\n      />\n    </ProgressPrimitive.Root>\n  );\n}\n\nexport { Progress };\n"],"names":["Progress","className","value","props","ProgressPrimitive","cn"],"mappings":";;;;;AAOA,SAASA,SAAS,EAChBC,SAAS,EACTC,KAAK,EACL,GAAGC,OACiD;IACpD,OAAO,WAAP,GACE,IAACC,MAAsB;QACrB,aAAU;QACV,WAAWC,GACT,4FACAJ;QAED,GAAGE,KAAK;kBAET,kBAACC,WAA2B;YAC1B,aAAU;YACV,WAAU;YACV,OAAO;gBAAE,WAAW,CAAC,YAAY,EAAE,MAAOF,CAAAA,SAAS,GAAG,EAAE,CAAC;YAAC;;;AAIlE"}
+{"version":3,"file":"components\\ui\\progress.js","sources":["webpack://@arolariu/components/./src/components/ui/progress.tsx"],"sourcesContent":["\r\n\r\nimport * as ProgressPrimitive from \"@radix-ui/react-progress\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst Progress = React.forwardRef<\r\n  React.ElementRef<typeof ProgressPrimitive.Root>,\r\n  React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>\r\n>(({className, value, ...props}, ref) => (\r\n  <ProgressPrimitive.Root\r\n    ref={ref}\r\n    className={cn(\"relative h-2 w-full overflow-hidden rounded-full bg-neutral-900/20 dark:bg-neutral-50/20\", className)}\r\n    {...props}>\r\n    <ProgressPrimitive.Indicator\r\n      className='h-full w-full flex-1 bg-neutral-900 transition-all dark:bg-neutral-50'\r\n      style={{transform: `translateX(-${100 - (value || 0)}%)`}}\r\n    />\r\n  </ProgressPrimitive.Root>\r\n));\r\nProgress.displayName = ProgressPrimitive.Root.displayName;\r\n\r\nexport {Progress};\r\n"],"names":["Progress","React","className","value","props","ref","ProgressPrimitive","cn"],"mappings":";;;;;AAOA,MAAMA,WAAW,WAAXA,GAAWC,WAGf,CAAC,EAACC,SAAS,EAAEC,KAAK,EAAE,GAAGC,OAAM,EAAEC,MAAAA,WAAAA,GAC/B,IAACC,MAAsB;QACrB,KAAKD;QACL,WAAWE,GAAG,4FAA4FL;QACzG,GAAGE,KAAK;kBACT,kBAACE,WAA2B;YAC1B,WAAU;YACV,OAAO;gBAAC,WAAW,CAAC,YAAY,EAAE,MAAOH,CAAAA,SAAS,GAAG,EAAE,CAAC;YAAA;;;AAI9DH,SAAS,WAAW,GAAGM,KAAAA,WAAkC"}

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

@@ -1,6 +1,6 @@
-import * as React from "react";
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-declare function RadioGroup({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
-declare function RadioGroupItem({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
+import * as React from "react";
+declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const RadioGroupItem: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 export { RadioGroup, RadioGroupItem };
 //# sourceMappingURL=radio-group.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../src/components/ui/radio-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AAKnE,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,2CAQvD;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,2CAkBvD;AAED,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAC"}
+{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../src/components/ui/radio-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AAEnE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,UAAU,+JAWd,CAAC;AAGH,QAAA,MAAM,cAAc,yKAiBlB,CAAC;AAGH,OAAO,EAAC,UAAU,EAAE,cAAc,EAAC,CAAC"}

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

@@ -1,30 +1,27 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
-import "react";
 import { Indicator, Item, Root } from "@radix-ui/react-radio-group";
-import { CircleIcon } from "lucide-react";
-import { cn } from "../../lib/utils.js";
-function RadioGroup({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        "data-slot": "radio-group",
-        className: cn("grid gap-3", className),
-        ...props
-    });
-}
-function RadioGroupItem({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Item, {
-        "data-slot": "radio-group-item",
-        className: cn("border-neutral-200 text-neutral-900 focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:bg-neutral-200/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-800 dark:text-neutral-50 dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900 dark:dark:bg-neutral-800/30", className),
+import { Circle } from "lucide-react";
+import { forwardRef } from "react";
+import { cn } from "../../lib/utilities.js";
+const RadioGroup = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(Root, {
+        className: cn("grid gap-2", className),
+        ...props,
+        ref: ref
+    }));
+RadioGroup.displayName = Root.displayName;
+const RadioGroupItem = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(Item, {
+        ref: ref,
+        className: cn("aspect-square h-4 w-4 rounded-full border border-neutral-200 border-neutral-900 text-neutral-900 shadow focus:outline-none focus-visible:ring-1 focus-visible:ring-neutral-950 disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-50 dark:border-neutral-800 dark:text-neutral-50 dark:focus-visible:ring-neutral-300", className),
         ...props,
         children: /*#__PURE__*/ jsx(Indicator, {
-            "data-slot": "radio-group-indicator",
-            className: "relative flex items-center justify-center",
-            children: /*#__PURE__*/ jsx(CircleIcon, {
-                className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2"
+            className: "flex items-center justify-center",
+            children: /*#__PURE__*/ jsx(Circle, {
+                className: "fill-primary h-3.5 w-3.5"
             })
         })
-    });
-}
+    }));
+RadioGroupItem.displayName = Item.displayName;
 export { RadioGroup, RadioGroupItem };
 
 //# sourceMappingURL=radio-group.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\radio-group.js","sources":["webpack://@arolariu/components/./src/components/ui/radio-group.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport { CircleIcon } from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction RadioGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Root>) {\n  return (\n    <RadioGroupPrimitive.Root\n      data-slot=\"radio-group\"\n      className={cn(\"grid gap-3\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction RadioGroupItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {\n  return (\n    <RadioGroupPrimitive.Item\n      data-slot=\"radio-group-item\"\n      className={cn(\n        \"border-neutral-200 text-neutral-900 focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:bg-neutral-200/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-800 dark:text-neutral-50 dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900 dark:dark:bg-neutral-800/30\",\n        className,\n      )}\n      {...props}\n    >\n      <RadioGroupPrimitive.Indicator\n        data-slot=\"radio-group-indicator\"\n        className=\"relative flex items-center justify-center\"\n      >\n        <CircleIcon className=\"fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2\" />\n      </RadioGroupPrimitive.Indicator>\n    </RadioGroupPrimitive.Item>\n  );\n}\n\nexport { RadioGroup, RadioGroupItem };\n"],"names":["RadioGroup","className","props","RadioGroupPrimitive","cn","RadioGroupItem","CircleIcon"],"mappings":";;;;;;AAQA,SAASA,WAAW,EAClBC,SAAS,EACT,GAAGC,OACmD;IACtD,OAAO,WAAP,GACE,IAACC,MAAwB;QACvB,aAAU;QACV,WAAWC,GAAG,cAAcH;QAC3B,GAAGC,KAAK;;AAGf;AAEA,SAASG,eAAe,EACtBJ,SAAS,EACT,GAAGC,OACmD;IACtD,OAAO,WAAP,GACE,IAACC,MAAwB;QACvB,aAAU;QACV,WAAWC,GACT,4oBACAH;QAED,GAAGC,KAAK;kBAET,kBAACC,WAA6B;YAC5B,aAAU;YACV,WAAU;sBAEV,kBAACG,YAAUA;gBAAC,WAAU;;;;AAI9B"}
+{"version":3,"file":"components\\ui\\radio-group.js","sources":["webpack://@arolariu/components/./src/components/ui/radio-group.tsx"],"sourcesContent":["\r\n\r\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\r\nimport {Circle} from \"lucide-react\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst RadioGroup = React.forwardRef<\r\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\r\n  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>\r\n>(({className, ...props}, ref) => {\r\n  return (\r\n    <RadioGroupPrimitive.Root\r\n      className={cn(\"grid gap-2\", className)}\r\n      {...props}\r\n      ref={ref}\r\n    />\r\n  );\r\n});\r\nRadioGroup.displayName = RadioGroupPrimitive.Root.displayName;\r\n\r\nconst RadioGroupItem = React.forwardRef<\r\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\r\n  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>\r\n>(({className, ...props}, ref) => {\r\n  return (\r\n    <RadioGroupPrimitive.Item\r\n      ref={ref}\r\n      className={cn(\r\n        \"aspect-square h-4 w-4 rounded-full border border-neutral-200 border-neutral-900 text-neutral-900 shadow focus:outline-none focus-visible:ring-1 focus-visible:ring-neutral-950 disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-50 dark:border-neutral-800 dark:text-neutral-50 dark:focus-visible:ring-neutral-300\",\r\n        className,\r\n      )}\r\n      {...props}>\r\n      <RadioGroupPrimitive.Indicator className='flex items-center justify-center'>\r\n        <Circle className='fill-primary h-3.5 w-3.5' />\r\n      </RadioGroupPrimitive.Indicator>\r\n    </RadioGroupPrimitive.Item>\r\n  );\r\n});\r\nRadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;\r\n\r\nexport {RadioGroup, RadioGroupItem};\r\n"],"names":["RadioGroup","React","className","props","ref","RadioGroupPrimitive","cn","RadioGroupItem","Circle"],"mappings":";;;;;;AAQA,MAAMA,aAAa,WAAbA,GAAaC,WAGjB,CAAC,EAACC,SAAS,EAAE,GAAGC,OAAM,EAAEC,MACjB,WAAP,GACE,IAACC,MAAwB;QACvB,WAAWC,GAAG,cAAcJ;QAC3B,GAAGC,KAAK;QACT,KAAKC;;AAIXJ,WAAW,WAAW,GAAGK,KAAAA,WAAoC;AAE7D,MAAME,iBAAiB,WAAjBA,GAAiBN,WAGrB,CAAC,EAACC,SAAS,EAAE,GAAGC,OAAM,EAAEC,MACjB,WAAP,GACE,IAACC,MAAwB;QACvB,KAAKD;QACL,WAAWE,GACT,0UACAJ;QAED,GAAGC,KAAK;kBACT,kBAACE,WAA6B;YAAC,WAAU;sBACvC,kBAACG,QAAMA;gBAAC,WAAU;;;;AAK1BD,eAAe,WAAW,GAAGF,KAAAA,WAAoC"}

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

@@ -1,9 +1,24 @@
-import * as React from "react";
 import * as ResizablePrimitive from "react-resizable-panels";
-declare function ResizablePanelGroup({ className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>): import("react/jsx-runtime").JSX.Element;
-declare function ResizablePanel({ ...props }: React.ComponentProps<typeof ResizablePrimitive.Panel>): import("react/jsx-runtime").JSX.Element;
-declare function ResizableHandle({ withHandle, className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
+declare const ResizablePanelGroup: ({ className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => import("react/jsx-runtime").JSX.Element;
+declare const ResizablePanel: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLDivElement | HTMLElement | HTMLObjectElement | HTMLMapElement | HTMLAnchorElement | HTMLButtonElement | HTMLFormElement | HTMLHeadingElement | HTMLImageElement | HTMLInputElement | HTMLLabelElement | HTMLLIElement | HTMLOListElement | HTMLParagraphElement | HTMLSelectElement | HTMLSpanElement | HTMLUListElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLLegendElement | HTMLLinkElement | HTMLMetaElement | HTMLMeterElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSourceElement | HTMLStyleElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLVideoElement | HTMLTableCaptionElement | HTMLMenuElement | HTMLPictureElement>, "id" | "onResize"> & {
+    className?: string;
+    collapsedSize?: number | undefined;
+    collapsible?: boolean | undefined;
+    defaultSize?: number | undefined;
+    id?: string;
+    maxSize?: number | undefined;
+    minSize?: number | undefined;
+    onCollapse?: ResizablePrimitive.PanelOnCollapse;
+    onExpand?: ResizablePrimitive.PanelOnExpand;
+    onResize?: ResizablePrimitive.PanelOnResize;
+    order?: number;
+    style?: object;
+    tagName?: keyof HTMLElementTagNameMap | undefined;
+} & {
+    children?: import("react").ReactNode | undefined;
+} & import("react").RefAttributes<ResizablePrimitive.ImperativePanelHandle>>;
+declare const ResizableHandle: ({ withHandle, className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
     withHandle?: boolean;
-}): import("react/jsx-runtime").JSX.Element;
-export { ResizablePanelGroup, ResizablePanel, ResizableHandle };
+}) => import("react/jsx-runtime").JSX.Element;
+export { ResizableHandle, ResizablePanel, ResizablePanelGroup };
 //# sourceMappingURL=resizable.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"resizable.d.ts","sourceRoot":"","sources":["../../../src/components/ui/resizable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,kBAAkB,MAAM,wBAAwB,CAAC;AAI7D,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,2CAW5D;AAED,iBAAS,cAAc,CAAC,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,KAAK,CAAC,2CAEvD;AAED,iBAAS,eAAe,CAAC,EACvB,UAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,iBAAiB,CAAC,GAAG;IACrE,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,2CAiBA;AAED,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,eAAe,EAAE,CAAC"}
+{"version":3,"file":"resizable.d.ts","sourceRoot":"","sources":["../../../src/components/ui/resizable.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,kBAAkB,MAAM,wBAAwB,CAAC;AAI7D,QAAA,MAAM,mBAAmB,GAAI,yBAAuB,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,4CAK7G,CAAC;AAEF,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;4EAA2B,CAAC;AAEhD,QAAA,MAAM,eAAe,GAAI,qCAItB,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,iBAAiB,CAAC,GAAG;IACrE,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,4CAaA,CAAC;AAEF,OAAO,EAAC,eAAe,EAAE,cAAc,EAAE,mBAAmB,EAAC,CAAC"}

package/dist/components/ui/resizable.js

@@ -1,35 +1,23 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
-import "react";
-import { GripVerticalIcon } from "lucide-react";
+import { GripVertical } from "lucide-react";
 import { Panel, PanelGroup, PanelResizeHandle } from "react-resizable-panels";
-import { cn } from "../../lib/utils.js";
-function ResizablePanelGroup({ className, ...props }) {
-    return /*#__PURE__*/ jsx(PanelGroup, {
-        "data-slot": "resizable-panel-group",
+import { cn } from "../../lib/utilities.js";
+const ResizablePanelGroup = ({ className, ...props })=>/*#__PURE__*/ jsx(PanelGroup, {
         className: cn("flex h-full w-full data-[panel-group-direction=vertical]:flex-col", className),
         ...props
     });
-}
-function ResizablePanel({ ...props }) {
-    return /*#__PURE__*/ jsx(Panel, {
-        "data-slot": "resizable-panel",
-        ...props
-    });
-}
-function ResizableHandle({ withHandle, className, ...props }) {
-    return /*#__PURE__*/ jsx(PanelResizeHandle, {
-        "data-slot": "resizable-handle",
-        className: cn("bg-neutral-200 focus-visible:ring-neutral-950 relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90 dark:bg-neutral-800 dark:focus-visible:ring-neutral-300", className),
+const ResizablePanel = Panel;
+const ResizableHandle = ({ withHandle, className, ...props })=>/*#__PURE__*/ jsx(PanelResizeHandle, {
+        className: cn("relative flex w-px items-center justify-center bg-neutral-200 after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-neutral-950 focus-visible:ring-offset-1 focus-visible:outline-none data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 dark:bg-neutral-800 dark:focus-visible:ring-neutral-300 [&[data-panel-group-direction=vertical]>div]:rotate-90", className),
         ...props,
         children: withHandle && /*#__PURE__*/ jsx("div", {
-            className: "bg-neutral-200 z-10 flex h-4 w-3 items-center justify-center rounded-xs border dark:bg-neutral-800",
-            children: /*#__PURE__*/ jsx(GripVerticalIcon, {
-                className: "size-2.5"
+            className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border border-neutral-200 bg-neutral-200 dark:border-neutral-800 dark:bg-neutral-800",
+            children: /*#__PURE__*/ jsx(GripVertical, {
+                className: "h-2.5 w-2.5"
             })
         })
     });
-}
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };
 
 //# sourceMappingURL=resizable.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\resizable.js","sources":["webpack://@arolariu/components/./src/components/ui/resizable.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { GripVerticalIcon } from \"lucide-react\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction ResizablePanelGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) {\n  return (\n    <ResizablePrimitive.PanelGroup\n      data-slot=\"resizable-panel-group\"\n      className={cn(\n        \"flex h-full w-full data-[panel-group-direction=vertical]:flex-col\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ResizablePanel({\n  ...props\n}: React.ComponentProps<typeof ResizablePrimitive.Panel>) {\n  return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />;\n}\n\nfunction ResizableHandle({\n  withHandle,\n  className,\n  ...props\n}: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {\n  withHandle?: boolean;\n}) {\n  return (\n    <ResizablePrimitive.PanelResizeHandle\n      data-slot=\"resizable-handle\"\n      className={cn(\n        \"bg-neutral-200 focus-visible:ring-neutral-950 relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90 dark:bg-neutral-800 dark:focus-visible:ring-neutral-300\",\n        className,\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"bg-neutral-200 z-10 flex h-4 w-3 items-center justify-center rounded-xs border dark:bg-neutral-800\">\n          <GripVerticalIcon className=\"size-2.5\" />\n        </div>\n      )}\n    </ResizablePrimitive.PanelResizeHandle>\n  );\n}\n\nexport { ResizablePanelGroup, ResizablePanel, ResizableHandle };\n"],"names":["ResizablePanelGroup","className","props","ResizablePrimitive","cn","ResizablePanel","ResizableHandle","withHandle","GripVerticalIcon"],"mappings":";;;;;;AAQA,SAASA,oBAAoB,EAC3BC,SAAS,EACT,GAAGC,OACwD;IAC3D,OAAO,WAAP,GACE,IAACC,YAA6B;QAC5B,aAAU;QACV,WAAWC,GACT,qEACAH;QAED,GAAGC,KAAK;;AAGf;AAEA,SAASG,eAAe,EACtB,GAAGH,OACmD;IACtD,OAAO,WAAP,GAAO,IAACC,OAAwB;QAAC,aAAU;QAAmB,GAAGD,KAAK;;AACxE;AAEA,SAASI,gBAAgB,EACvBC,UAAU,EACVN,SAAS,EACT,GAAGC,OAGJ;IACC,OAAO,WAAP,GACE,IAACC,mBAAoC;QACnC,aAAU;QACV,WAAWC,GACT,itBACAH;QAED,GAAGC,KAAK;kBAERK,cAAc,WAAdA,GACC,IAAC;YAAI,WAAU;sBACb,kBAACC,kBAAgBA;gBAAC,WAAU;;;;AAKtC"}
+{"version":3,"file":"components\\ui\\resizable.js","sources":["webpack://@arolariu/components/./src/components/ui/resizable.tsx"],"sourcesContent":["\r\n\r\nimport {GripVertical} from \"lucide-react\";\r\nimport * as ResizablePrimitive from \"react-resizable-panels\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst ResizablePanelGroup = ({className, ...props}: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => (\r\n  <ResizablePrimitive.PanelGroup\r\n    className={cn(\"flex h-full w-full data-[panel-group-direction=vertical]:flex-col\", className)}\r\n    {...props}\r\n  />\r\n);\r\n\r\nconst ResizablePanel = ResizablePrimitive.Panel;\r\n\r\nconst ResizableHandle = ({\r\n  withHandle,\r\n  className,\r\n  ...props\r\n}: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {\r\n  withHandle?: boolean;\r\n}) => (\r\n  <ResizablePrimitive.PanelResizeHandle\r\n    className={cn(\r\n      \"relative flex w-px items-center justify-center bg-neutral-200 after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-neutral-950 focus-visible:ring-offset-1 focus-visible:outline-none data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 dark:bg-neutral-800 dark:focus-visible:ring-neutral-300 [&[data-panel-group-direction=vertical]>div]:rotate-90\",\r\n      className,\r\n    )}\r\n    {...props}>\r\n    {withHandle && (\r\n      <div className='z-10 flex h-4 w-3 items-center justify-center rounded-sm border border-neutral-200 bg-neutral-200 dark:border-neutral-800 dark:bg-neutral-800'>\r\n        <GripVertical className='h-2.5 w-2.5' />\r\n      </div>\r\n    )}\r\n  </ResizablePrimitive.PanelResizeHandle>\r\n);\r\n\r\nexport {ResizableHandle, ResizablePanel, ResizablePanelGroup};\r\n"],"names":["ResizablePanelGroup","className","props","ResizablePrimitive","cn","ResizablePanel","ResizableHandle","withHandle","GripVertical"],"mappings":";;;;;AAOA,MAAMA,sBAAsB,CAAC,EAACC,SAAS,EAAE,GAAGC,OAAkE,iBAC5G,IAACC,YAA6B;QAC5B,WAAWC,GAAG,qEAAqEH;QAClF,GAAGC,KAAK;;AAIb,MAAMG,iBAAiBF;AAEvB,MAAMG,kBAAkB,CAAC,EACvBC,UAAU,EACVN,SAAS,EACT,GAAGC,OAGJ,iBACC,IAACC,mBAAoC;QACnC,WAAWC,GACT,+sBACAH;QAED,GAAGC,KAAK;kBACRK,cAAc,WAAdA,GACC,IAAC;YAAI,WAAU;sBACb,kBAACC,cAAYA;gBAAC,WAAU"}

package/dist/components/ui/ripple-button.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
 import { type HTMLMotionProps, type Transition } from "motion/react";
+import * as React from "react";
 interface RippleButtonProps extends HTMLMotionProps<"button"> {
     children: React.ReactNode;
     rippleClassName?: string;

package/dist/components/ui/ripple-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ripple-button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/ripple-button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,eAAe,EAAU,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAU7E,UAAU,iBAAkB,SAAQ,eAAe,CAAC,QAAQ,CAAC;IAC3D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED,QAAA,MAAM,YAAY,0GAsFjB,CAAC;AAIF,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,CAAC"}
+{"version":3,"file":"ripple-button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/ripple-button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,KAAK,eAAe,EAAU,KAAK,UAAU,EAAC,MAAM,cAAc,CAAC;AAC3E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,UAAU,iBAAkB,SAAQ,eAAe,CAAC,QAAQ,CAAC;IAC3D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED,QAAA,MAAM,YAAY,0GAiEjB,CAAC;AAIF,OAAO,EAAC,YAAY,EAAE,KAAK,iBAAiB,EAAC,CAAC"}

package/dist/components/ui/ripple-button.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback, useImperativeHandle, useRef, useState } from "react";
 import { motion } from "motion/react";
-import { cn } from "../../lib/utils.js";
+import { forwardRef, useCallback, useImperativeHandle, useRef, useState } from "react";
+import { cn } from "../../lib/utilities.js";
 const RippleButton = /*#__PURE__*/ forwardRef(({ children, onClick, className, rippleClassName, scale = 10, transition = {
     duration: 0.6,
     ease: "easeOut"
@@ -45,7 +45,7 @@ const RippleButton = /*#__PURE__*/ forwardRef(({ children, onClick, className, r
         whileHover: {
             scale: 1.05
         },
-        className: cn("relative h-10 px-4 py-2 text-sm font-medium text-primary-foreground overflow-hidden bg-primary cursor-pointer rounded-lg focus:outline-none", className),
+        className: cn("text-primary-foreground bg-primary relative h-10 cursor-pointer overflow-hidden rounded-lg px-4 py-2 text-sm font-medium focus:outline-none", className),
         ...props,
         children: [
             children,
@@ -59,7 +59,7 @@ const RippleButton = /*#__PURE__*/ forwardRef(({ children, onClick, className, r
                         opacity: 0
                     },
                     transition: transition,
-                    className: cn("absolute bg-primary-foreground rounded-full size-5 pointer-events-none", rippleClassName),
+                    className: cn("bg-primary-foreground pointer-events-none absolute size-5 rounded-full", rippleClassName),
                     style: {
                         top: ripple.y - 10,
                         left: ripple.x - 10

package/dist/components/ui/ripple-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\ripple-button.js","sources":["webpack://@arolariu/components/./src/components/ui/ripple-button.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { type HTMLMotionProps, motion, type Transition } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface Ripple {\n  id: number;\n  x: number;\n  y: number;\n}\n\ninterface RippleButtonProps extends HTMLMotionProps<\"button\"> {\n  children: React.ReactNode;\n  rippleClassName?: string;\n  scale?: number;\n  transition?: Transition;\n}\n\nconst RippleButton = React.forwardRef<HTMLButtonElement, RippleButtonProps>(\n  (\n    {\n      children,\n      onClick,\n      className,\n      rippleClassName,\n      scale = 10,\n      transition = { duration: 0.6, ease: \"easeOut\" },\n      ...props\n    },\n    ref,\n  ) => {\n    const [ripples, setRipples] = React.useState<Ripple[]>([]);\n    const buttonRef = React.useRef<HTMLButtonElement>(null);\n    React.useImperativeHandle(\n      ref,\n      () => buttonRef.current as HTMLButtonElement,\n    );\n\n    const createRipple = React.useCallback(\n      (event: React.MouseEvent<HTMLButtonElement>) => {\n        const button = buttonRef.current;\n        if (!button) return;\n\n        const rect = button.getBoundingClientRect();\n        const x = event.clientX - rect.left;\n        const y = event.clientY - rect.top;\n\n        const newRipple: Ripple = {\n          id: Date.now(),\n          x,\n          y,\n        };\n\n        setRipples((prev) => [...prev, newRipple]);\n\n        setTimeout(() => {\n          setRipples((prev) => prev.filter((r) => r.id !== newRipple.id));\n        }, 600);\n      },\n      [],\n    );\n\n    const handleClick = React.useCallback(\n      (event: React.MouseEvent<HTMLButtonElement>) => {\n        createRipple(event);\n        if (onClick) {\n          onClick(event);\n        }\n      },\n      [createRipple, onClick],\n    );\n\n    return (\n      <motion.button\n        ref={buttonRef}\n        onClick={handleClick}\n        whileTap={{ scale: 0.95 }}\n        whileHover={{ scale: 1.05 }}\n        className={cn(\n          \"relative h-10 px-4 py-2 text-sm font-medium text-primary-foreground overflow-hidden bg-primary cursor-pointer rounded-lg focus:outline-none\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {ripples.map((ripple) => (\n          <motion.span\n            key={ripple.id}\n            initial={{ scale: 0, opacity: 0.5 }}\n            animate={{ scale, opacity: 0 }}\n            transition={transition}\n            className={cn(\n              \"absolute bg-primary-foreground rounded-full size-5 pointer-events-none\",\n              rippleClassName,\n            )}\n            style={{\n              top: ripple.y - 10,\n              left: ripple.x - 10,\n            }}\n          />\n        ))}\n      </motion.button>\n    );\n  },\n);\n\nRippleButton.displayName = \"RippleButton\";\n\nexport { RippleButton, type RippleButtonProps };\n"],"names":["RippleButton","React","children","onClick","className","rippleClassName","scale","transition","props","ref","ripples","setRipples","buttonRef","createRipple","event","button","rect","x","y","newRipple","Date","prev","setTimeout","r","handleClick","motion","cn","ripple"],"mappings":";;;;;AAoBA,MAAMA,eAAe,WAAfA,GAAeC,WACnB,CACE,EACEC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,eAAe,EACfC,QAAQ,EAAE,EACVC,aAAa;IAAE,UAAU;IAAK,MAAM;AAAU,CAAC,EAC/C,GAAGC,OACJ,EACDC;IAEA,MAAM,CAACC,SAASC,WAAW,GAAGV,SAAyB,EAAE;IACzD,MAAMW,YAAYX,OAAgC;IAClDA,oBACEQ,KACA,IAAMG,UAAU,OAAO;IAGzB,MAAMC,eAAeZ,YACnB,CAACa;QACC,MAAMC,SAASH,UAAU,OAAO;QAChC,IAAI,CAACG,QAAQ;QAEb,MAAMC,OAAOD,OAAO,qBAAqB;QACzC,MAAME,IAAIH,MAAM,OAAO,GAAGE,KAAK,IAAI;QACnC,MAAME,IAAIJ,MAAM,OAAO,GAAGE,KAAK,GAAG;QAElC,MAAMG,YAAoB;YACxB,IAAIC,KAAK,GAAG;YACZH;YACAC;QACF;QAEAP,WAAW,CAACU,OAAS;mBAAIA;gBAAMF;aAAU;QAEzCG,WAAW;YACTX,WAAW,CAACU,OAASA,KAAK,MAAM,CAAC,CAACE,IAAMA,EAAE,EAAE,KAAKJ,UAAU,EAAE;QAC/D,GAAG;IACL,GACA,EAAE;IAGJ,MAAMK,cAAcvB,YAClB,CAACa;QACCD,aAAaC;QACb,IAAIX,SACFA,QAAQW;IAEZ,GACA;QAACD;QAAcV;KAAQ;IAGzB,OAAO,WAAP,GACE,KAACsB,OAAO,MAAM;QACZ,KAAKb;QACL,SAASY;QACT,UAAU;YAAE,OAAO;QAAK;QACxB,YAAY;YAAE,OAAO;QAAK;QAC1B,WAAWE,GACT,+IACAtB;QAED,GAAGI,KAAK;;YAERN;YACAQ,QAAQ,GAAG,CAAC,CAACiB,SAAAA,WAAAA,GACZ,IAACF,OAAO,IAAI;oBAEV,SAAS;wBAAE,OAAO;wBAAG,SAAS;oBAAI;oBAClC,SAAS;wBAAEnB;wBAAO,SAAS;oBAAE;oBAC7B,YAAYC;oBACZ,WAAWmB,GACT,0EACArB;oBAEF,OAAO;wBACL,KAAKsB,OAAO,CAAC,GAAG;wBAChB,MAAMA,OAAO,CAAC,GAAG;oBACnB;mBAXKA,OAAO,EAAE;;;AAgBxB;AAGF3B,aAAa,WAAW,GAAG"}
+{"version":3,"file":"components\\ui\\ripple-button.js","sources":["webpack://@arolariu/components/./src/components/ui/ripple-button.tsx"],"sourcesContent":["\r\n\r\nimport {type HTMLMotionProps, motion, type Transition} from \"motion/react\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\ninterface Ripple {\r\n  id: number;\r\n  x: number;\r\n  y: number;\r\n}\r\n\r\ninterface RippleButtonProps extends HTMLMotionProps<\"button\"> {\r\n  children: React.ReactNode;\r\n  rippleClassName?: string;\r\n  scale?: number;\r\n  transition?: Transition;\r\n}\r\n\r\nconst RippleButton = React.forwardRef<HTMLButtonElement, RippleButtonProps>(\r\n  ({children, onClick, className, rippleClassName, scale = 10, transition = {duration: 0.6, ease: \"easeOut\"}, ...props}, ref) => {\r\n    const [ripples, setRipples] = React.useState<Ripple[]>([]);\r\n    const buttonRef = React.useRef<HTMLButtonElement>(null);\r\n    React.useImperativeHandle(ref, () => buttonRef.current as HTMLButtonElement);\r\n\r\n    const createRipple = React.useCallback((event: React.MouseEvent<HTMLButtonElement>) => {\r\n      const button = buttonRef.current;\r\n      if (!button) return;\r\n\r\n      const rect = button.getBoundingClientRect();\r\n      const x = event.clientX - rect.left;\r\n      const y = event.clientY - rect.top;\r\n\r\n      const newRipple: Ripple = {\r\n        id: Date.now(),\r\n        x,\r\n        y,\r\n      };\r\n\r\n      setRipples((prev) => [...prev, newRipple]);\r\n\r\n      setTimeout(() => {\r\n        setRipples((prev) => prev.filter((r) => r.id !== newRipple.id));\r\n      }, 600);\r\n    }, []);\r\n\r\n    const handleClick = React.useCallback(\r\n      (event: React.MouseEvent<HTMLButtonElement>) => {\r\n        createRipple(event);\r\n        if (onClick) {\r\n          onClick(event);\r\n        }\r\n      },\r\n      [createRipple, onClick],\r\n    );\r\n\r\n    return (\r\n      <motion.button\r\n        ref={buttonRef}\r\n        onClick={handleClick}\r\n        whileTap={{scale: 0.95}}\r\n        whileHover={{scale: 1.05}}\r\n        className={cn(\r\n          \"text-primary-foreground bg-primary relative h-10 cursor-pointer overflow-hidden rounded-lg px-4 py-2 text-sm font-medium focus:outline-none\",\r\n          className,\r\n        )}\r\n        {...props}>\r\n        {children}\r\n        {ripples.map((ripple) => (\r\n          <motion.span\r\n            key={ripple.id}\r\n            initial={{scale: 0, opacity: 0.5}}\r\n            animate={{scale, opacity: 0}}\r\n            transition={transition}\r\n            className={cn(\"bg-primary-foreground pointer-events-none absolute size-5 rounded-full\", rippleClassName)}\r\n            style={{\r\n              top: ripple.y - 10,\r\n              left: ripple.x - 10,\r\n            }}\r\n          />\r\n        ))}\r\n      </motion.button>\r\n    );\r\n  },\r\n);\r\n\r\nRippleButton.displayName = \"RippleButton\";\r\n\r\nexport {RippleButton, type RippleButtonProps};\r\n"],"names":["RippleButton","React","children","onClick","className","rippleClassName","scale","transition","props","ref","ripples","setRipples","buttonRef","createRipple","event","button","rect","x","y","newRipple","Date","prev","setTimeout","r","handleClick","motion","cn","ripple"],"mappings":";;;;;AAoBA,MAAMA,eAAe,WAAfA,GAAeC,WACnB,CAAC,EAACC,QAAQ,EAAEC,OAAO,EAAEC,SAAS,EAAEC,eAAe,EAAEC,QAAQ,EAAE,EAAEC,aAAa;IAAC,UAAU;IAAK,MAAM;AAAS,CAAC,EAAE,GAAGC,OAAM,EAAEC;IACrH,MAAM,CAACC,SAASC,WAAW,GAAGV,SAAyB,EAAE;IACzD,MAAMW,YAAYX,OAAgC;IAClDA,oBAA0BQ,KAAK,IAAMG,UAAU,OAAO;IAEtD,MAAMC,eAAeZ,YAAkB,CAACa;QACtC,MAAMC,SAASH,UAAU,OAAO;QAChC,IAAI,CAACG,QAAQ;QAEb,MAAMC,OAAOD,OAAO,qBAAqB;QACzC,MAAME,IAAIH,MAAM,OAAO,GAAGE,KAAK,IAAI;QACnC,MAAME,IAAIJ,MAAM,OAAO,GAAGE,KAAK,GAAG;QAElC,MAAMG,YAAoB;YACxB,IAAIC,KAAK,GAAG;YACZH;YACAC;QACF;QAEAP,WAAW,CAACU,OAAS;mBAAIA;gBAAMF;aAAU;QAEzCG,WAAW;YACTX,WAAW,CAACU,OAASA,KAAK,MAAM,CAAC,CAACE,IAAMA,EAAE,EAAE,KAAKJ,UAAU,EAAE;QAC/D,GAAG;IACL,GAAG,EAAE;IAEL,MAAMK,cAAcvB,YAClB,CAACa;QACCD,aAAaC;QACb,IAAIX,SACFA,QAAQW;IAEZ,GACA;QAACD;QAAcV;KAAQ;IAGzB,OAAO,WAAP,GACE,KAACsB,OAAO,MAAM;QACZ,KAAKb;QACL,SAASY;QACT,UAAU;YAAC,OAAO;QAAI;QACtB,YAAY;YAAC,OAAO;QAAI;QACxB,WAAWE,GACT,+IACAtB;QAED,GAAGI,KAAK;;YACRN;YACAQ,QAAQ,GAAG,CAAC,CAACiB,SAAAA,WAAAA,GACZ,IAACF,OAAO,IAAI;oBAEV,SAAS;wBAAC,OAAO;wBAAG,SAAS;oBAAG;oBAChC,SAAS;wBAACnB;wBAAO,SAAS;oBAAC;oBAC3B,YAAYC;oBACZ,WAAWmB,GAAG,0EAA0ErB;oBACxF,OAAO;wBACL,KAAKsB,OAAO,CAAC,GAAG;wBAChB,MAAMA,OAAO,CAAC,GAAG;oBACnB;mBARKA,OAAO,EAAE;;;AAaxB;AAGF3B,aAAa,WAAW,GAAG"}

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

@@ -1 +1 @@
-{"version":3,"file":"scratcher.d.ts","sourceRoot":"","sources":["../../../src/components/ui/scratcher.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,UAAU,cAAc;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;CAC3C;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA0J9C,CAAC"}
+{"version":3,"file":"scratcher.d.ts","sourceRoot":"","sources":["../../../src/components/ui/scratcher.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAEzD,UAAU,cAAc;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;CAC3C;AAID,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAoJ9C,CAAC"}

package/dist/components/ui/scratcher.js

@@ -1,13 +1,14 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { cn } from "../../lib/utils.js";
+import { cn } from "../../lib/utilities.js";
 import { motion, useAnimation } from "motion/react";
 import { useEffect, useRef, useState } from "react";
-const Scratcher = ({ width, height, minScratchPercentage = 50, onComplete, children, className, gradientColors = [
+const defaultGradientColors = [
     "#A97CF8",
     "#F38CB8",
     "#FDCC92"
-] })=>{
+];
+const Scratcher = ({ width, height, minScratchPercentage = 50, onComplete, children, className, gradientColors = defaultGradientColors })=>{
     const canvasRef = useRef(null);
     const [isScratching, setIsScratching] = useState(false);
     const [isComplete, setIsComplete] = useState(false);
@@ -35,7 +36,8 @@ const Scratcher = ({ width, height, minScratchPercentage = 50, onComplete, child
         };
         const handleDocumentTouchMove = (event)=>{
             if (!isScratching) return;
-            const touch = event.touches[0];
+            const [touch] = event.touches;
+            if (!touch) return;
             scratch(touch.clientX, touch.clientY);
         };
         const handleDocumentMouseUp = ()=>{
@@ -132,7 +134,7 @@ const Scratcher = ({ width, height, minScratchPercentage = 50, onComplete, child
                 ref: canvasRef,
                 width: width,
                 height: height,
-                className: "absolute left-0 top-0",
+                className: "absolute top-0 left-0",
                 onMouseDown: handleMouseDown,
                 onTouchStart: handleTouchStart
             }),

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\scratcher.js","sources":["webpack://@arolariu/components/./src/components/ui/scratcher.tsx"],"sourcesContent":["\n\nimport { cn } from \"@/lib/utils\";\nimport { motion, useAnimation } from \"motion/react\";\nimport React, { useEffect, useRef, useState } from \"react\";\n\ninterface ScratcherProps {\n  children: React.ReactNode;\n  width: number;\n  height: number;\n  minScratchPercentage?: number;\n  className?: string;\n  onComplete?: () => void;\n  gradientColors?: [string, string, string];\n}\n\nexport const Scratcher: React.FC<ScratcherProps> = ({\n  width,\n  height,\n  minScratchPercentage = 50,\n  onComplete,\n  children,\n  className,\n  gradientColors = [\"#A97CF8\", \"#F38CB8\", \"#FDCC92\"],\n}) => {\n  const canvasRef = useRef<HTMLCanvasElement>(null);\n  const [isScratching, setIsScratching] = useState(false);\n  const [isComplete, setIsComplete] = useState(false);\n\n  const controls = useAnimation();\n\n  useEffect(() => {\n    const canvas = canvasRef.current;\n    const ctx = canvas?.getContext(\"2d\");\n    if (canvas && ctx) {\n      ctx.fillStyle = \"#ccc\";\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\n      const gradient = ctx.createLinearGradient(\n        0,\n        0,\n        canvas.width,\n        canvas.height,\n      );\n      gradient.addColorStop(0, gradientColors[0]);\n      gradient.addColorStop(0.5, gradientColors[1]);\n      gradient.addColorStop(1, gradientColors[2]);\n      ctx.fillStyle = gradient;\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\n    }\n  }, [gradientColors]);\n\n  useEffect(() => {\n    const handleDocumentMouseMove = (event: MouseEvent) => {\n      if (!isScratching) return;\n      scratch(event.clientX, event.clientY);\n    };\n\n    const handleDocumentTouchMove = (event: TouchEvent) => {\n      if (!isScratching) return;\n      const touch = event.touches[0];\n      scratch(touch.clientX, touch.clientY);\n    };\n\n    const handleDocumentMouseUp = () => {\n      setIsScratching(false);\n      checkCompletion();\n    };\n\n    const handleDocumentTouchEnd = () => {\n      setIsScratching(false);\n      checkCompletion();\n    };\n\n    document.addEventListener(\"mousedown\", handleDocumentMouseMove);\n    document.addEventListener(\"mousemove\", handleDocumentMouseMove);\n    document.addEventListener(\"touchstart\", handleDocumentTouchMove);\n    document.addEventListener(\"touchmove\", handleDocumentTouchMove);\n    document.addEventListener(\"mouseup\", handleDocumentMouseUp);\n    document.addEventListener(\"touchend\", handleDocumentTouchEnd);\n    document.addEventListener(\"touchcancel\", handleDocumentTouchEnd);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleDocumentMouseMove);\n      document.removeEventListener(\"mousemove\", handleDocumentMouseMove);\n      document.removeEventListener(\"touchstart\", handleDocumentTouchMove);\n      document.removeEventListener(\"touchmove\", handleDocumentTouchMove);\n      document.removeEventListener(\"mouseup\", handleDocumentMouseUp);\n      document.removeEventListener(\"touchend\", handleDocumentTouchEnd);\n      document.removeEventListener(\"touchcancel\", handleDocumentTouchEnd);\n    };\n  }, [isScratching]);\n\n  const handleMouseDown = () => setIsScratching(true);\n\n  const handleTouchStart = () => setIsScratching(true);\n\n  const scratch = (clientX: number, clientY: number) => {\n    const canvas = canvasRef.current;\n    const ctx = canvas?.getContext(\"2d\");\n    if (canvas && ctx) {\n      const rect = canvas.getBoundingClientRect();\n      const x = clientX - rect.left + 16;\n      const y = clientY - rect.top + 16;\n      ctx.globalCompositeOperation = \"destination-out\";\n      ctx.beginPath();\n      ctx.arc(x, y, 30, 0, Math.PI * 2);\n      ctx.fill();\n    }\n  };\n\n  const startAnimation = async () => {\n    await controls.start({\n      scale: [1, 1.5, 1],\n      rotate: [0, 10, -10, 10, -10, 0],\n      transition: { duration: 0.5 },\n    });\n\n    // Call onComplete after animation finishes\n    if (onComplete) {\n      onComplete();\n    }\n  };\n\n  const checkCompletion = () => {\n    if (isComplete) return;\n\n    const canvas = canvasRef.current;\n    const ctx = canvas?.getContext(\"2d\");\n    if (canvas && ctx) {\n      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);\n      const pixels = imageData.data;\n      const totalPixels = pixels.length / 4;\n      let clearPixels = 0;\n\n      for (let i = 3; i < pixels.length; i += 4) {\n        if (pixels[i] === 0) clearPixels++;\n      }\n\n      const percentage = (clearPixels / totalPixels) * 100;\n\n      if (percentage >= minScratchPercentage) {\n        setIsComplete(true);\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\n        startAnimation();\n      }\n    }\n  };\n\n  return (\n    <motion.div\n      className={cn(\"relative select-none\", className)}\n      style={{\n        width,\n        height,\n        cursor:\n          \"url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIj4KICA8Y2lyY2xlIGN4PSIxNiIgY3k9IjE2IiByPSIxNSIgc3R5bGU9ImZpbGw6I2ZmZjtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MXB4OyIgLz4KPC9zdmc+'), auto\",\n      }}\n      animate={controls}\n    >\n      <canvas\n        ref={canvasRef}\n        width={width}\n        height={height}\n        className=\"absolute left-0 top-0\"\n        onMouseDown={handleMouseDown}\n        onTouchStart={handleTouchStart}\n      ></canvas>\n      {children}\n    </motion.div>\n  );\n};\n"],"names":["Scratcher","width","height","minScratchPercentage","onComplete","children","className","gradientColors","canvasRef","useRef","isScratching","setIsScratching","useState","isComplete","setIsComplete","controls","useAnimation","useEffect","canvas","ctx","gradient","handleDocumentMouseMove","event","scratch","handleDocumentTouchMove","touch","handleDocumentMouseUp","checkCompletion","handleDocumentTouchEnd","document","handleMouseDown","handleTouchStart","clientX","clientY","rect","x","y","Math","startAnimation","imageData","pixels","totalPixels","clearPixels","i","percentage","motion","cn"],"mappings":"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"}
+{"version":3,"file":"components\\ui\\scratcher.js","sources":["webpack://@arolariu/components/./src/components/ui/scratcher.tsx"],"sourcesContent":["\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\nimport {motion, useAnimation} from \"motion/react\";\r\nimport React, {useEffect, useRef, useState} from \"react\";\r\n\r\ninterface ScratcherProps {\r\n  children: React.ReactNode;\r\n  width: number;\r\n  height: number;\r\n  minScratchPercentage?: number;\r\n  className?: string;\r\n  onComplete?: () => void;\r\n  gradientColors?: [string, string, string];\r\n}\r\n\r\nconst defaultGradientColors: [string, string, string] = [\"#A97CF8\", \"#F38CB8\", \"#FDCC92\"];\r\n\r\nexport const Scratcher: React.FC<ScratcherProps> = ({\r\n  width,\r\n  height,\r\n  minScratchPercentage = 50,\r\n  onComplete,\r\n  children,\r\n  className,\r\n  gradientColors = defaultGradientColors,\r\n}) => {\r\n  const canvasRef = useRef<HTMLCanvasElement>(null);\r\n  const [isScratching, setIsScratching] = useState(false);\r\n  const [isComplete, setIsComplete] = useState(false);\r\n\r\n  const controls = useAnimation();\r\n\r\n  useEffect(() => {\r\n    const canvas = canvasRef.current;\r\n    const ctx = canvas?.getContext(\"2d\");\r\n    if (canvas && ctx) {\r\n      ctx.fillStyle = \"#ccc\";\r\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\r\n      const gradient = ctx.createLinearGradient(0, 0, canvas.width, canvas.height);\r\n      gradient.addColorStop(0, gradientColors[0]);\r\n      gradient.addColorStop(0.5, gradientColors[1]);\r\n      gradient.addColorStop(1, gradientColors[2]);\r\n      ctx.fillStyle = gradient;\r\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\r\n    }\r\n  }, [gradientColors]);\r\n\r\n  useEffect(() => {\r\n    const handleDocumentMouseMove = (event: MouseEvent) => {\r\n      if (!isScratching) return;\r\n      scratch(event.clientX, event.clientY);\r\n    };\r\n\r\n    const handleDocumentTouchMove = (event: TouchEvent) => {\r\n      if (!isScratching) return;\r\n      const [touch] = event.touches;\r\n      if (!touch) return;\r\n      scratch(touch.clientX, touch.clientY);\r\n    };\r\n\r\n    const handleDocumentMouseUp = () => {\r\n      setIsScratching(false);\r\n      checkCompletion();\r\n    };\r\n\r\n    const handleDocumentTouchEnd = () => {\r\n      setIsScratching(false);\r\n      checkCompletion();\r\n    };\r\n\r\n    document.addEventListener(\"mousedown\", handleDocumentMouseMove);\r\n    document.addEventListener(\"mousemove\", handleDocumentMouseMove);\r\n    document.addEventListener(\"touchstart\", handleDocumentTouchMove);\r\n    document.addEventListener(\"touchmove\", handleDocumentTouchMove);\r\n    document.addEventListener(\"mouseup\", handleDocumentMouseUp);\r\n    document.addEventListener(\"touchend\", handleDocumentTouchEnd);\r\n    document.addEventListener(\"touchcancel\", handleDocumentTouchEnd);\r\n\r\n    return () => {\r\n      document.removeEventListener(\"mousedown\", handleDocumentMouseMove);\r\n      document.removeEventListener(\"mousemove\", handleDocumentMouseMove);\r\n      document.removeEventListener(\"touchstart\", handleDocumentTouchMove);\r\n      document.removeEventListener(\"touchmove\", handleDocumentTouchMove);\r\n      document.removeEventListener(\"mouseup\", handleDocumentMouseUp);\r\n      document.removeEventListener(\"touchend\", handleDocumentTouchEnd);\r\n      document.removeEventListener(\"touchcancel\", handleDocumentTouchEnd);\r\n    };\r\n  }, [isScratching]);\r\n\r\n  const handleMouseDown = () => setIsScratching(true);\r\n\r\n  const handleTouchStart = () => setIsScratching(true);\r\n\r\n  const scratch = (clientX: number, clientY: number) => {\r\n    const canvas = canvasRef.current;\r\n    const ctx = canvas?.getContext(\"2d\");\r\n    if (canvas && ctx) {\r\n      const rect = canvas.getBoundingClientRect();\r\n      const x = clientX - rect.left + 16;\r\n      const y = clientY - rect.top + 16;\r\n      ctx.globalCompositeOperation = \"destination-out\";\r\n      ctx.beginPath();\r\n      ctx.arc(x, y, 30, 0, Math.PI * 2);\r\n      ctx.fill();\r\n    }\r\n  };\r\n\r\n  const startAnimation = async () => {\r\n    await controls.start({\r\n      scale: [1, 1.5, 1],\r\n      rotate: [0, 10, -10, 10, -10, 0],\r\n      transition: {duration: 0.5},\r\n    });\r\n\r\n    // Call onComplete after animation finishes\r\n    if (onComplete) {\r\n      onComplete();\r\n    }\r\n  };\r\n\r\n  const checkCompletion = () => {\r\n    if (isComplete) return;\r\n\r\n    const canvas = canvasRef.current;\r\n    const ctx = canvas?.getContext(\"2d\");\r\n    if (canvas && ctx) {\r\n      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);\r\n      const pixels = imageData.data;\r\n      const totalPixels = pixels.length / 4;\r\n      let clearPixels = 0;\r\n\r\n      for (let i = 3; i < pixels.length; i += 4) {\r\n        if (pixels[i] === 0) clearPixels++;\r\n      }\r\n\r\n      const percentage = (clearPixels / totalPixels) * 100;\r\n\r\n      if (percentage >= minScratchPercentage) {\r\n        setIsComplete(true);\r\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n        startAnimation();\r\n      }\r\n    }\r\n  };\r\n\r\n  return (\r\n    <motion.div\r\n      className={cn(\"relative select-none\", className)}\r\n      style={{\r\n        width,\r\n        height,\r\n        cursor:\r\n          \"url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIj4KICA8Y2lyY2xlIGN4PSIxNiIgY3k9IjE2IiByPSIxNSIgc3R5bGU9ImZpbGw6I2ZmZjtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MXB4OyIgLz4KPC9zdmc+'), auto\",\r\n      }}\r\n      animate={controls}>\r\n      <canvas\r\n        ref={canvasRef}\r\n        width={width}\r\n        height={height}\r\n        className='absolute top-0 left-0'\r\n        onMouseDown={handleMouseDown}\r\n        onTouchStart={handleTouchStart}></canvas>\r\n      {children}\r\n    </motion.div>\r\n  );\r\n};\r\n"],"names":["defaultGradientColors","Scratcher","width","height","minScratchPercentage","onComplete","children","className","gradientColors","canvasRef","useRef","isScratching","setIsScratching","useState","isComplete","setIsComplete","controls","useAnimation","useEffect","canvas","ctx","gradient","handleDocumentMouseMove","event","scratch","handleDocumentTouchMove","touch","handleDocumentMouseUp","checkCompletion","handleDocumentTouchEnd","document","handleMouseDown","handleTouchStart","clientX","clientY","rect","x","y","Math","startAnimation","imageData","pixels","totalPixels","clearPixels","i","percentage","motion","cn"],"mappings":"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"}

package/dist/components/ui/scroll-area.d.ts

@@ -1,6 +1,6 @@
-import * as React from "react";
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-declare function ScrollArea({ className, children, ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
-declare function ScrollBar({ className, orientation, ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>): import("react/jsx-runtime").JSX.Element;
+import * as React from "react";
+declare const ScrollArea: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ScrollBar: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaScrollbarProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { ScrollArea, ScrollBar };
 //# sourceMappingURL=scroll-area.d.ts.map

package/dist/components/ui/scroll-area.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scroll-area.d.ts","sourceRoot":"","sources":["../../../src/components/ui/scroll-area.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AAInE,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,2CAiBvD;AAED,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,WAAwB,EACxB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,mBAAmB,CAAC,2CAqBtE;AAED,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"scroll-area.d.ts","sourceRoot":"","sources":["../../../src/components/ui/scroll-area.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AACnE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,UAAU,+JAYd,CAAC;AAGH,QAAA,MAAM,SAAS,wKAgBb,CAAC;AAGH,OAAO,EAAC,UAAU,EAAE,SAAS,EAAC,CAAC"}

package/dist/components/ui/scroll-area.js

@@ -1,36 +1,32 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import "react";
 import { Corner, Root, ScrollAreaScrollbar, ScrollAreaThumb, Viewport } from "@radix-ui/react-scroll-area";
-import { cn } from "../../lib/utils.js";
-function ScrollArea({ className, children, ...props }) {
-    return /*#__PURE__*/ jsxs(Root, {
-        "data-slot": "scroll-area",
-        className: cn("relative", className),
+import { forwardRef } from "react";
+import { cn } from "../../lib/utilities.js";
+const ScrollArea = /*#__PURE__*/ forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ jsxs(Root, {
+        ref: ref,
+        className: cn("relative overflow-hidden", className),
         ...props,
         children: [
             /*#__PURE__*/ jsx(Viewport, {
-                "data-slot": "scroll-area-viewport",
-                className: "focus-visible:ring-neutral-950/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1 dark:focus-visible:ring-neutral-300/50",
+                className: "h-full w-full rounded-[inherit]",
                 children: children
             }),
             /*#__PURE__*/ jsx(ScrollBar, {}),
             /*#__PURE__*/ jsx(Corner, {})
         ]
-    });
-}
-function ScrollBar({ className, orientation = "vertical", ...props }) {
-    return /*#__PURE__*/ jsx(ScrollAreaScrollbar, {
-        "data-slot": "scroll-area-scrollbar",
+    }));
+ScrollArea.displayName = Root.displayName;
+const ScrollBar = /*#__PURE__*/ forwardRef(({ className, orientation = "vertical", ...props }, ref)=>/*#__PURE__*/ jsx(ScrollAreaScrollbar, {
+        ref: ref,
         orientation: orientation,
-        className: cn("flex touch-none p-px transition-colors select-none", "vertical" === orientation && "h-full w-2.5 border-l border-l-transparent", "horizontal" === orientation && "h-2.5 flex-col border-t border-t-transparent", className),
+        className: cn("flex touch-none transition-colors select-none", "vertical" === orientation && "h-full w-2.5 border-l border-l-transparent p-[1px]", "horizontal" === orientation && "h-2.5 flex-col border-t border-t-transparent p-[1px]", className),
         ...props,
         children: /*#__PURE__*/ jsx(ScrollAreaThumb, {
-            "data-slot": "scroll-area-thumb",
-            className: "bg-neutral-200 relative flex-1 rounded-full dark:bg-neutral-800"
+            className: "relative flex-1 rounded-full bg-neutral-200 dark:bg-neutral-800"
         })
-    });
-}
+    }));
+ScrollBar.displayName = ScrollAreaScrollbar.displayName;
 export { ScrollArea, ScrollBar };
 
 //# sourceMappingURL=scroll-area.js.map