@arolariu/components 0.2.0 → 0.3.0

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\textarea.js","sources":["webpack://@arolariu/components/./src/components/ui/textarea.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nfunction Textarea({className, ...props}: Readonly<React.ComponentProps<\"textarea\">>) {\r\n  return (\r\n    <textarea\r\n      data-slot='textarea'\r\n      className={cn(\r\n        \"flex field-sizing-content min-h-16 w-full rounded-md border border-neutral-200 bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-950 focus-visible:ring-[3px] focus-visible:ring-neutral-950/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-red-500 aria-invalid:ring-red-500/20 md:text-sm dark:border-neutral-800 dark:bg-neutral-200/30 dark:dark:bg-neutral-800/30 dark:placeholder:text-neutral-400 dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50 dark:aria-invalid:border-red-900 dark:aria-invalid:ring-red-500/40 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nexport {Textarea};\r\n"],"names":["Textarea","className","props","cn"],"mappings":";;;;AAMA,SAASA,SAAS,EAACC,SAAS,EAAE,GAAGC,OAAkD;IACjF,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GACT,6tBACAF;QAED,GAAGC,KAAK;;AAGf"}
+{"version":3,"file":"components\\ui\\textarea.js","sources":["webpack://@arolariu/components/./src/components/ui/textarea.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst Textarea = React.forwardRef<HTMLTextAreaElement, React.ComponentProps<\"textarea\">>(({className, ...props}, ref) => {\r\n  return (\r\n    <textarea\r\n      className={cn(\r\n        \"flex min-h-[60px] w-full rounded-md border border-neutral-200 bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-neutral-500 focus-visible:ring-1 focus-visible:ring-neutral-950 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:border-neutral-800 dark:placeholder:text-neutral-400 dark:focus-visible:ring-neutral-300\",\r\n        className,\r\n      )}\r\n      ref={ref}\r\n      {...props}\r\n    />\r\n  );\r\n});\r\nTextarea.displayName = \"Textarea\";\r\n\r\nexport {Textarea};\r\n"],"names":["Textarea","React","className","props","ref","cn"],"mappings":";;;;AAMA,MAAMA,WAAW,WAAXA,GAAWC,WAAwE,CAAC,EAACC,SAAS,EAAE,GAAGC,OAAM,EAAEC,MACxG,WAAP,GACE,IAAC;QACC,WAAWC,GACT,mXACAH;QAEF,KAAKE;QACJ,GAAGD,KAAK;;AAIfH,SAAS,WAAW,GAAG"}

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

@@ -1,8 +1,13 @@
 import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
 import { type VariantProps } from "class-variance-authority";
 import * as React from "react";
-import { toggleVariants } from "./toggle";
-declare function ToggleGroup({ className, variant, size, children, ...props }: Readonly<React.ComponentProps<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>>): import("react/jsx-runtime").JSX.Element;
-declare function ToggleGroupItem({ className, children, variant, size, ...props }: Readonly<React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>>): import("react/jsx-runtime").JSX.Element;
+declare const ToggleGroup: React.ForwardRefExoticComponent<((Omit<ToggleGroupPrimitive.ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<ToggleGroupPrimitive.ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement>, "ref">) & VariantProps<(props?: {
+    variant?: "default" | "outline";
+    size?: "default" | "sm" | "lg";
+} & import("class-variance-authority/types").ClassProp) => string>) & React.RefAttributes<HTMLDivElement>>;
+declare const ToggleGroupItem: React.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: {
+    variant?: "default" | "outline";
+    size?: "default" | "sm" | "lg";
+} & import("class-variance-authority/types").ClassProp) => string> & React.RefAttributes<HTMLButtonElement>>;
 export { ToggleGroup, ToggleGroupItem };
 //# sourceMappingURL=toggle-group.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"toggle-group.d.ts","sourceRoot":"","sources":["../../../src/components/ui/toggle-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,oBAAoB,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAC,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAC3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,cAAc,EAAC,MAAM,wBAAwB,CAAC;AAQtD,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC,2CAexG;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC,2CAoBxG;AAED,OAAO,EAAC,WAAW,EAAE,eAAe,EAAC,CAAC"}
+{"version":3,"file":"toggle-group.d.ts","sourceRoot":"","sources":["../../../src/components/ui/toggle-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,oBAAoB,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAC,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAC3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,QAAA,MAAM,WAAW;;;0GAUf,CAAC;AAIH,QAAA,MAAM,eAAe;;;4GAoBnB,CAAC;AAIH,OAAO,EAAC,WAAW,EAAE,eAAe,EAAC,CAAC"}

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

@@ -1,19 +1,16 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { Item, Root } from "@radix-ui/react-toggle-group";
-import { createContext, useContext } from "react";
+import { createContext, forwardRef, useContext } from "react";
 import { toggleVariants } from "./toggle.js";
 import { cn } from "../../lib/utilities.js";
 const ToggleGroupContext = /*#__PURE__*/ createContext({
     size: "default",
     variant: "default"
 });
-function ToggleGroup({ className, variant, size, children, ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        "data-slot": "toggle-group",
-        "data-variant": variant,
-        "data-size": size,
-        className: cn("group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs", className),
+const ToggleGroup = /*#__PURE__*/ forwardRef(({ className, variant, size, children, ...props }, ref)=>/*#__PURE__*/ jsx(Root, {
+        ref: ref,
+        className: cn("flex items-center justify-center gap-1", className),
         ...props,
         children: /*#__PURE__*/ jsx(ToggleGroupContext.Provider, {
             value: {
@@ -22,22 +19,21 @@ function ToggleGroup({ className, variant, size, children, ...props }) {
             },
             children: children
         })
-    });
-}
-function ToggleGroupItem({ className, children, variant, size, ...props }) {
+    }));
+ToggleGroup.displayName = Root.displayName;
+const ToggleGroupItem = /*#__PURE__*/ forwardRef(({ className, children, variant, size, ...props }, ref)=>{
     const context = useContext(ToggleGroupContext);
     return /*#__PURE__*/ jsx(Item, {
-        "data-slot": "toggle-group-item",
-        "data-variant": context.variant || variant,
-        "data-size": context.size || size,
+        ref: ref,
         className: cn(toggleVariants({
             variant: context.variant || variant,
             size: context.size || size
-        }), "min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l", className),
+        }), className),
         ...props,
         children: children
     });
-}
+});
+ToggleGroupItem.displayName = Item.displayName;
 export { ToggleGroup, ToggleGroupItem };
 
 //# sourceMappingURL=toggle-group.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\toggle-group.js","sources":["webpack://@arolariu/components/./src/components/ui/toggle-group.tsx"],"sourcesContent":["\r\n\r\nimport * as ToggleGroupPrimitive from \"@radix-ui/react-toggle-group\";\r\nimport {type VariantProps} from \"class-variance-authority\";\r\nimport * as React from \"react\";\r\n\r\nimport {toggleVariants} from \"@/components/ui/toggle\";\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst ToggleGroupContext = React.createContext<VariantProps<typeof toggleVariants>>({\r\n  size: \"default\",\r\n  variant: \"default\",\r\n});\r\n\r\nfunction ToggleGroup({\r\n  className,\r\n  variant,\r\n  size,\r\n  children,\r\n  ...props\r\n}: Readonly<React.ComponentProps<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>>) {\r\n  return (\r\n    <ToggleGroupPrimitive.Root\r\n      data-slot='toggle-group'\r\n      data-variant={variant}\r\n      data-size={size}\r\n      className={cn(\"group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs\", className)}\r\n      {...props}>\r\n      <ToggleGroupContext.Provider\r\n        // eslint-disable-next-line react/jsx-no-constructed-context-values -- not applicable.\r\n        value={{variant, size}}>\r\n        {children}\r\n      </ToggleGroupContext.Provider>\r\n    </ToggleGroupPrimitive.Root>\r\n  );\r\n}\r\n\r\nfunction ToggleGroupItem({\r\n  className,\r\n  children,\r\n  variant,\r\n  size,\r\n  ...props\r\n}: Readonly<React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>>) {\r\n  const context = React.useContext(ToggleGroupContext);\r\n\r\n  return (\r\n    <ToggleGroupPrimitive.Item\r\n      data-slot='toggle-group-item'\r\n      data-variant={context.variant || variant}\r\n      data-size={context.size || size}\r\n      className={cn(\r\n        toggleVariants({\r\n          variant: context.variant || variant,\r\n          size: context.size || size,\r\n        }),\r\n        \"min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l\",\r\n        className,\r\n      )}\r\n      {...props}>\r\n      {children}\r\n    </ToggleGroupPrimitive.Item>\r\n  );\r\n}\r\n\r\nexport {ToggleGroup, ToggleGroupItem};\r\n"],"names":["ToggleGroupContext","React","ToggleGroup","className","variant","size","children","props","ToggleGroupPrimitive","cn","ToggleGroupItem","context","toggleVariants"],"mappings":";;;;;;AASA,MAAMA,qBAAqB,WAArBA,GAAqBC,cAAyD;IAClF,MAAM;IACN,SAAS;AACX;AAEA,SAASC,YAAY,EACnBC,SAAS,EACTC,OAAO,EACPC,IAAI,EACJC,QAAQ,EACR,GAAGC,OACoG;IACvG,OAAO,WAAP,GACE,IAACC,MAAyB;QACxB,aAAU;QACV,gBAAcJ;QACd,aAAWC;QACX,WAAWI,GAAG,0FAA0FN;QACvG,GAAGI,KAAK;kBACT,kBAACP,mBAAmB,QAAQ;YAE1B,OAAO;gBAACI;gBAASC;YAAI;sBACpBC;;;AAIT;AAEA,SAASI,gBAAgB,EACvBP,SAAS,EACTG,QAAQ,EACRF,OAAO,EACPC,IAAI,EACJ,GAAGE,OACoG;IACvG,MAAMI,UAAUV,WAAiBD;IAEjC,OAAO,WAAP,GACE,IAACQ,MAAyB;QACxB,aAAU;QACV,gBAAcG,QAAQ,OAAO,IAAIP;QACjC,aAAWO,QAAQ,IAAI,IAAIN;QAC3B,WAAWI,GACTG,eAAe;YACb,SAASD,QAAQ,OAAO,IAAIP;YAC5B,MAAMO,QAAQ,IAAI,IAAIN;QACxB,IACA,+LACAF;QAED,GAAGI,KAAK;kBACRD;;AAGP"}
+{"version":3,"file":"components\\ui\\toggle-group.js","sources":["webpack://@arolariu/components/./src/components/ui/toggle-group.tsx"],"sourcesContent":["\r\n\r\nimport * as ToggleGroupPrimitive from \"@radix-ui/react-toggle-group\";\r\nimport {type VariantProps} from \"class-variance-authority\";\r\nimport * as React from \"react\";\r\n\r\nimport {toggleVariants} from \"@/components/ui/toggle\";\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst ToggleGroupContext = React.createContext<VariantProps<typeof toggleVariants>>({\r\n  size: \"default\",\r\n  variant: \"default\",\r\n});\r\n\r\nconst ToggleGroup = React.forwardRef<\r\n  React.ElementRef<typeof ToggleGroupPrimitive.Root>,\r\n  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>\r\n>(({className, variant, size, children, ...props}, ref) => (\r\n  <ToggleGroupPrimitive.Root\r\n    ref={ref}\r\n    className={cn(\"flex items-center justify-center gap-1\", className)}\r\n    {...props}>\r\n    <ToggleGroupContext.Provider value={{variant, size}}>{children}</ToggleGroupContext.Provider>\r\n  </ToggleGroupPrimitive.Root>\r\n));\r\n\r\nToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;\r\n\r\nconst ToggleGroupItem = React.forwardRef<\r\n  React.ElementRef<typeof ToggleGroupPrimitive.Item>,\r\n  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>\r\n>(({className, children, variant, size, ...props}, ref) => {\r\n  const context = React.useContext(ToggleGroupContext);\r\n\r\n  return (\r\n    <ToggleGroupPrimitive.Item\r\n      ref={ref}\r\n      className={cn(\r\n        toggleVariants({\r\n          variant: context.variant || variant,\r\n          size: context.size || size,\r\n        }),\r\n        className,\r\n      )}\r\n      {...props}>\r\n      {children}\r\n    </ToggleGroupPrimitive.Item>\r\n  );\r\n});\r\n\r\nToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;\r\n\r\nexport {ToggleGroup, ToggleGroupItem};\r\n"],"names":["ToggleGroupContext","React","ToggleGroup","className","variant","size","children","props","ref","ToggleGroupPrimitive","cn","ToggleGroupItem","context","toggleVariants"],"mappings":";;;;;;AASA,MAAMA,qBAAqB,WAArBA,GAAqBC,cAAyD;IAClF,MAAM;IACN,SAAS;AACX;AAEA,MAAMC,cAAc,WAAdA,GAAcD,WAGlB,CAAC,EAACE,SAAS,EAAEC,OAAO,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGC,OAAM,EAAEC,MAAAA,WAAAA,GACjD,IAACC,MAAyB;QACxB,KAAKD;QACL,WAAWE,GAAG,0CAA0CP;QACvD,GAAGI,KAAK;kBACT,kBAACP,mBAAmB,QAAQ;YAAC,OAAO;gBAACI;gBAASC;YAAI;sBAAIC;;;AAI1DJ,YAAY,WAAW,GAAGO,KAAAA,WAAqC;AAE/D,MAAME,kBAAkB,WAAlBA,GAAkBV,WAGtB,CAAC,EAACE,SAAS,EAAEG,QAAQ,EAAEF,OAAO,EAAEC,IAAI,EAAE,GAAGE,OAAM,EAAEC;IACjD,MAAMI,UAAUX,WAAiBD;IAEjC,OAAO,WAAP,GACE,IAACS,MAAyB;QACxB,KAAKD;QACL,WAAWE,GACTG,eAAe;YACb,SAASD,QAAQ,OAAO,IAAIR;YAC5B,MAAMQ,QAAQ,IAAI,IAAIP;QACxB,IACAF;QAED,GAAGI,KAAK;kBACRD;;AAGP;AAEAK,gBAAgB,WAAW,GAAGF,KAAAA,WAAqC"}

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

@@ -5,6 +5,9 @@ declare const toggleVariants: (props?: {
     variant?: "default" | "outline";
     size?: "default" | "sm" | "lg";
 } & import("class-variance-authority/types").ClassProp) => string;
-declare function Toggle({ className, variant, size, ...props }: Readonly<React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>>): import("react/jsx-runtime").JSX.Element;
+declare const Toggle: React.ForwardRefExoticComponent<Omit<TogglePrimitive.ToggleProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: {
+    variant?: "default" | "outline";
+    size?: "default" | "sm" | "lg";
+} & import("class-variance-authority/types").ClassProp) => string> & React.RefAttributes<HTMLButtonElement>>;
 export { Toggle, toggleVariants };
 //# sourceMappingURL=toggle.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../../src/components/ui/toggle.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAM,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,cAAc;;;iEAoBnB,CAAC;AAEF,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,EACP,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC,2CAQnG;AAED,OAAO,EAAC,MAAM,EAAE,cAAc,EAAC,CAAC"}
+{"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../../src/components/ui/toggle.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAM,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,cAAc;;;iEAoBnB,CAAC;AAEF,QAAA,MAAM,MAAM;;;4GASV,CAAC;AAIH,OAAO,EAAC,MAAM,EAAE,cAAc,EAAC,CAAC"}

package/dist/components/ui/toggle.js

@@ -2,13 +2,13 @@
 import { jsx } from "react/jsx-runtime";
 import { Root } from "@radix-ui/react-toggle";
 import { cva } from "class-variance-authority";
-import "react";
+import { forwardRef } from "react";
 import { cn } from "../../lib/utilities.js";
-const toggleVariants = cva("inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-neutral-100 hover:text-neutral-500 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-neutral-100 data-[state=on]:text-neutral-900 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 whitespace-nowrap dark:hover:bg-neutral-800 dark:hover:text-neutral-400 dark:data-[state=on]:bg-neutral-800 dark:data-[state=on]: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", {
+const toggleVariants = cva("inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium transition-colors hover:bg-neutral-100 hover:text-neutral-500 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-neutral-950 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-neutral-100 data-[state=on]:text-neutral-900 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 dark:hover:bg-neutral-800 dark:hover:text-neutral-400 dark:focus-visible:ring-neutral-300 dark:data-[state=on]:bg-neutral-800 dark:data-[state=on]:text-neutral-50", {
     variants: {
         variant: {
             default: "bg-transparent",
-            outline: "border border-neutral-200 bg-transparent shadow-xs hover:bg-neutral-100 hover:text-neutral-900 dark:border-neutral-800 dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
+            outline: "border border-neutral-200 bg-transparent shadow-sm hover:bg-neutral-100 hover:text-neutral-900 dark:border-neutral-800 dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
         },
         size: {
             default: "h-9 px-2 min-w-9",
@@ -21,17 +21,16 @@ const toggleVariants = cva("inline-flex items-center justify-center gap-2 rounde
         size: "default"
     }
 });
-function Toggle({ className, variant, size, ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        "data-slot": "toggle",
+const Toggle = /*#__PURE__*/ forwardRef(({ className, variant, size, ...props }, ref)=>/*#__PURE__*/ jsx(Root, {
+        ref: ref,
         className: cn(toggleVariants({
             variant,
             size,
             className
         })),
         ...props
-    });
-}
+    }));
+Toggle.displayName = Root.displayName;
 export { Toggle, toggleVariants };
 
 //# sourceMappingURL=toggle.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\toggle.js","sources":["webpack://@arolariu/components/./src/components/ui/toggle.tsx"],"sourcesContent":["\r\n\r\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\r\nimport {cva, type VariantProps} from \"class-variance-authority\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst toggleVariants = cva(\r\n  \"inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-neutral-100 hover:text-neutral-500 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-neutral-100 data-[state=on]:text-neutral-900 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 whitespace-nowrap dark:hover:bg-neutral-800 dark:hover:text-neutral-400 dark:data-[state=on]:bg-neutral-800 dark:data-[state=on]: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\",\r\n  {\r\n    variants: {\r\n      variant: {\r\n        default: \"bg-transparent\",\r\n        outline:\r\n          \"border border-neutral-200 bg-transparent shadow-xs hover:bg-neutral-100 hover:text-neutral-900 dark:border-neutral-800 dark:hover:bg-neutral-800 dark:hover:text-neutral-50\",\r\n      },\r\n      size: {\r\n        default: \"h-9 px-2 min-w-9\",\r\n        sm: \"h-8 px-1.5 min-w-8\",\r\n        lg: \"h-10 px-2.5 min-w-10\",\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      variant: \"default\",\r\n      size: \"default\",\r\n    },\r\n  },\r\n);\r\n\r\nfunction Toggle({\r\n  className,\r\n  variant,\r\n  size,\r\n  ...props\r\n}: Readonly<React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>>) {\r\n  return (\r\n    <TogglePrimitive.Root\r\n      data-slot='toggle'\r\n      className={cn(toggleVariants({variant, size, className}))}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nexport {Toggle, toggleVariants};\r\n"],"names":["toggleVariants","cva","Toggle","className","variant","size","props","TogglePrimitive","cn"],"mappings":";;;;;;AAQA,MAAMA,iBAAiBC,IACrB,y2BACA;IACE,UAAU;QACR,SAAS;YACP,SAAS;YACT,SACE;QACJ;QACA,MAAM;YACJ,SAAS;YACT,IAAI;YACJ,IAAI;QACN;IACF;IACA,iBAAiB;QACf,SAAS;QACT,MAAM;IACR;AACF;AAGF,SAASC,OAAO,EACdC,SAAS,EACTC,OAAO,EACPC,IAAI,EACJ,GAAGC,OAC+F;IAClG,OAAO,WAAP,GACE,IAACC,MAAoB;QACnB,aAAU;QACV,WAAWC,GAAGR,eAAe;YAACI;YAASC;YAAMF;QAAS;QACrD,GAAGG,KAAK;;AAGf"}
+{"version":3,"file":"components\\ui\\toggle.js","sources":["webpack://@arolariu/components/./src/components/ui/toggle.tsx"],"sourcesContent":["\r\n\r\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\r\nimport {cva, type VariantProps} from \"class-variance-authority\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst toggleVariants = cva(\r\n  \"inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium transition-colors hover:bg-neutral-100 hover:text-neutral-500 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-neutral-950 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-neutral-100 data-[state=on]:text-neutral-900 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 dark:hover:bg-neutral-800 dark:hover:text-neutral-400 dark:focus-visible:ring-neutral-300 dark:data-[state=on]:bg-neutral-800 dark:data-[state=on]:text-neutral-50\",\r\n  {\r\n    variants: {\r\n      variant: {\r\n        default: \"bg-transparent\",\r\n        outline:\r\n          \"border border-neutral-200 bg-transparent shadow-sm hover:bg-neutral-100 hover:text-neutral-900 dark:border-neutral-800 dark:hover:bg-neutral-800 dark:hover:text-neutral-50\",\r\n      },\r\n      size: {\r\n        default: \"h-9 px-2 min-w-9\",\r\n        sm: \"h-8 px-1.5 min-w-8\",\r\n        lg: \"h-10 px-2.5 min-w-10\",\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      variant: \"default\",\r\n      size: \"default\",\r\n    },\r\n  },\r\n);\r\n\r\nconst Toggle = React.forwardRef<\r\n  React.ElementRef<typeof TogglePrimitive.Root>,\r\n  React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>\r\n>(({className, variant, size, ...props}, ref) => (\r\n  <TogglePrimitive.Root\r\n    ref={ref}\r\n    className={cn(toggleVariants({variant, size, className}))}\r\n    {...props}\r\n  />\r\n));\r\n\r\nToggle.displayName = TogglePrimitive.Root.displayName;\r\n\r\nexport {Toggle, toggleVariants};\r\n"],"names":["toggleVariants","cva","Toggle","React","className","variant","size","props","ref","TogglePrimitive","cn"],"mappings":";;;;;;AAQA,MAAMA,iBAAiBC,IACrB,6iBACA;IACE,UAAU;QACR,SAAS;YACP,SAAS;YACT,SACE;QACJ;QACA,MAAM;YACJ,SAAS;YACT,IAAI;YACJ,IAAI;QACN;IACF;IACA,iBAAiB;QACf,SAAS;QACT,MAAM;IACR;AACF;AAGF,MAAMC,SAAS,WAATA,GAASC,WAGb,CAAC,EAACC,SAAS,EAAEC,OAAO,EAAEC,IAAI,EAAE,GAAGC,OAAM,EAAEC,MAAAA,WAAAA,GACvC,IAACC,MAAoB;QACnB,KAAKD;QACL,WAAWE,GAAGV,eAAe;YAACK;YAASC;YAAMF;QAAS;QACrD,GAAGG,KAAK;;AAIbL,OAAO,WAAW,GAAGO,KAAAA,WAAgC"}

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

@@ -1,8 +1,8 @@
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import * as React from "react";
-declare function TooltipProvider({ delayDuration, ...props }: Readonly<React.ComponentProps<typeof TooltipPrimitive.Provider>>): import("react/jsx-runtime").JSX.Element;
-declare function Tooltip({ ...props }: Readonly<React.ComponentProps<typeof TooltipPrimitive.Root>>): import("react/jsx-runtime").JSX.Element;
-declare function TooltipTrigger({ ...props }: Readonly<React.ComponentProps<typeof TooltipPrimitive.Trigger>>): import("react/jsx-runtime").JSX.Element;
-declare function TooltipContent({ className, sideOffset, children, ...props }: Readonly<React.ComponentProps<typeof TooltipPrimitive.Content>>): import("react/jsx-runtime").JSX.Element;
+declare const TooltipProvider: React.FC<TooltipPrimitive.TooltipProviderProps>;
+declare const Tooltip: React.FC<TooltipPrimitive.TooltipProps>;
+declare const TooltipTrigger: React.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const TooltipContent: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
 //# sourceMappingURL=tooltip.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/ui/tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,iBAAS,eAAe,CAAC,EAAC,aAAiB,EAAE,GAAG,KAAK,EAAC,EAAE,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,QAAQ,CAAC,CAAC,2CAQvH;AAED,iBAAS,OAAO,CAAC,EAAC,GAAG,KAAK,EAAC,EAAE,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,CAAC,2CASxF;AAED,iBAAS,cAAc,CAAC,EAAC,GAAG,KAAK,EAAC,EAAE,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAC,2CAOlG;AAED,iBAAS,cAAc,CAAC,EAAC,SAAS,EAAE,UAAc,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAC,2CAgBvI;AAED,OAAO,EAAC,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,cAAc,EAAC,CAAC"}
+{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/ui/tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,eAAe,iDAA4B,CAAC;AAElD,QAAA,MAAM,OAAO,yCAAwB,CAAC;AAEtC,QAAA,MAAM,cAAc,gHAA2B,CAAC;AAEhD,QAAA,MAAM,cAAc,gKAelB,CAAC;AAGH,OAAO,EAAC,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,cAAc,EAAC,CAAC"}

package/dist/components/ui/tooltip.js

@@ -1,45 +1,20 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Arrow, Content, Portal, Provider, Root, Trigger } from "@radix-ui/react-tooltip";
-import "react";
+import { jsx } from "react/jsx-runtime";
+import { Content, Portal, Provider, Root, Trigger } from "@radix-ui/react-tooltip";
+import { forwardRef } from "react";
 import { cn } from "../../lib/utilities.js";
-function TooltipProvider({ delayDuration = 0, ...props }) {
-    return /*#__PURE__*/ jsx(Provider, {
-        "data-slot": "tooltip-provider",
-        delayDuration: delayDuration,
-        ...props
-    });
-}
-function Tooltip({ ...props }) {
-    return /*#__PURE__*/ jsx(TooltipProvider, {
-        children: /*#__PURE__*/ jsx(Root, {
-            "data-slot": "tooltip",
-            ...props
-        })
-    });
-}
-function TooltipTrigger({ ...props }) {
-    return /*#__PURE__*/ jsx(Trigger, {
-        "data-slot": "tooltip-trigger",
-        ...props
-    });
-}
-function TooltipContent({ className, sideOffset = 0, children, ...props }) {
-    return /*#__PURE__*/ jsx(Portal, {
-        children: /*#__PURE__*/ jsxs(Content, {
-            "data-slot": "tooltip-content",
+const TooltipProvider = Provider;
+const Tooltip = Root;
+const TooltipTrigger = Trigger;
+const TooltipContent = /*#__PURE__*/ forwardRef(({ className, sideOffset = 4, ...props }, ref)=>/*#__PURE__*/ jsx(Portal, {
+        children: /*#__PURE__*/ jsx(Content, {
+            ref: ref,
             sideOffset: sideOffset,
-            className: cn("animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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-fit origin-(--radix-tooltip-content-transform-origin) rounded-md bg-neutral-900 px-3 py-1.5 text-xs text-balance text-neutral-50 dark:bg-neutral-50 dark:text-neutral-900", className),
-            ...props,
-            children: [
-                children,
-                /*#__PURE__*/ jsx(Arrow, {
-                    className: "fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-neutral-900 dark:bg-neutral-50"
-                })
-            ]
+            className: cn("animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 origin-[--radix-tooltip-content-transform-origin] overflow-hidden rounded-md bg-neutral-900 px-3 py-1.5 text-xs text-neutral-50 dark:bg-neutral-50 dark:text-neutral-900", className),
+            ...props
         })
-    });
-}
+    }));
+TooltipContent.displayName = Content.displayName;
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
 
 //# sourceMappingURL=tooltip.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\tooltip.js","sources":["webpack://@arolariu/components/./src/components/ui/tooltip.tsx"],"sourcesContent":["\r\n\r\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nfunction TooltipProvider({delayDuration = 0, ...props}: Readonly<React.ComponentProps<typeof TooltipPrimitive.Provider>>) {\r\n  return (\r\n    <TooltipPrimitive.Provider\r\n      data-slot='tooltip-provider'\r\n      delayDuration={delayDuration}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction Tooltip({...props}: Readonly<React.ComponentProps<typeof TooltipPrimitive.Root>>) {\r\n  return (\r\n    <TooltipProvider>\r\n      <TooltipPrimitive.Root\r\n        data-slot='tooltip'\r\n        {...props}\r\n      />\r\n    </TooltipProvider>\r\n  );\r\n}\r\n\r\nfunction TooltipTrigger({...props}: Readonly<React.ComponentProps<typeof TooltipPrimitive.Trigger>>) {\r\n  return (\r\n    <TooltipPrimitive.Trigger\r\n      data-slot='tooltip-trigger'\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction TooltipContent({className, sideOffset = 0, children, ...props}: Readonly<React.ComponentProps<typeof TooltipPrimitive.Content>>) {\r\n  return (\r\n    <TooltipPrimitive.Portal>\r\n      <TooltipPrimitive.Content\r\n        data-slot='tooltip-content'\r\n        sideOffset={sideOffset}\r\n        className={cn(\r\n          \"animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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-fit origin-(--radix-tooltip-content-transform-origin) rounded-md bg-neutral-900 px-3 py-1.5 text-xs text-balance text-neutral-50 dark:bg-neutral-50 dark:text-neutral-900\",\r\n          className,\r\n        )}\r\n        {...props}>\r\n        {children}\r\n        <TooltipPrimitive.Arrow className='fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-neutral-900 dark:bg-neutral-50' />\r\n      </TooltipPrimitive.Content>\r\n    </TooltipPrimitive.Portal>\r\n  );\r\n}\r\n\r\nexport {Tooltip, TooltipContent, TooltipProvider, TooltipTrigger};\r\n"],"names":["TooltipProvider","delayDuration","props","TooltipPrimitive","Tooltip","TooltipTrigger","TooltipContent","className","sideOffset","children","cn"],"mappings":";;;;;AAOA,SAASA,gBAAgB,EAACC,gBAAgB,CAAC,EAAE,GAAGC,OAAwE;IACtH,OAAO,WAAP,GACE,IAACC,UAAyB;QACxB,aAAU;QACV,eAAeF;QACd,GAAGC,KAAK;;AAGf;AAEA,SAASE,QAAQ,EAAC,GAAGF,OAAoE;IACvF,OAAO,WAAP,GACE,IAACF,iBAAAA;kBACC,kBAACG,MAAqB;YACpB,aAAU;YACT,GAAGD,KAAK;;;AAIjB;AAEA,SAASG,eAAe,EAAC,GAAGH,OAAuE;IACjG,OAAO,WAAP,GACE,IAACC,SAAwB;QACvB,aAAU;QACT,GAAGD,KAAK;;AAGf;AAEA,SAASI,eAAe,EAACC,SAAS,EAAEC,aAAa,CAAC,EAAEC,QAAQ,EAAE,GAAGP,OAAuE;IACtI,OAAO,WAAP,GACE,IAACC,QAAuB;kBACtB,mBAACA,SAAwB;YACvB,aAAU;YACV,YAAYK;YACZ,WAAWE,GACT,+cACAH;YAED,GAAGL,KAAK;;gBACRO;8BACD,IAACN,OAAsB;oBAAC,WAAU;;;;;AAI1C"}
+{"version":3,"file":"components\\ui\\tooltip.js","sources":["webpack://@arolariu/components/./src/components/ui/tooltip.tsx"],"sourcesContent":["\r\n\r\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\r\nimport * as React from \"react\";\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nconst TooltipProvider = TooltipPrimitive.Provider;\r\n\r\nconst Tooltip = TooltipPrimitive.Root;\r\n\r\nconst TooltipTrigger = TooltipPrimitive.Trigger;\r\n\r\nconst TooltipContent = React.forwardRef<\r\n  React.ElementRef<typeof TooltipPrimitive.Content>,\r\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>\r\n>(({className, sideOffset = 4, ...props}, ref) => (\r\n  <TooltipPrimitive.Portal>\r\n    <TooltipPrimitive.Content\r\n      ref={ref}\r\n      sideOffset={sideOffset}\r\n      className={cn(\r\n        \"animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 origin-[--radix-tooltip-content-transform-origin] overflow-hidden rounded-md bg-neutral-900 px-3 py-1.5 text-xs text-neutral-50 dark:bg-neutral-50 dark:text-neutral-900\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  </TooltipPrimitive.Portal>\r\n));\r\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\r\n\r\nexport {Tooltip, TooltipContent, TooltipProvider, TooltipTrigger};\r\n"],"names":["TooltipProvider","TooltipPrimitive","Tooltip","TooltipTrigger","TooltipContent","React","className","sideOffset","props","ref","cn"],"mappings":";;;;;AAOA,MAAMA,kBAAkBC;AAExB,MAAMC,UAAUD;AAEhB,MAAME,iBAAiBF;AAEvB,MAAMG,iBAAiB,WAAjBA,GAAiBC,WAGrB,CAAC,EAACC,SAAS,EAAEC,aAAa,CAAC,EAAE,GAAGC,OAAM,EAAEC,MAAAA,WAAAA,GACxC,IAACR,QAAuB;kBACtB,kBAACA,SAAwB;YACvB,KAAKQ;YACL,YAAYF;YACZ,WAAWG,GACT,4cACAJ;YAED,GAAGE,KAAK;;;AAIfJ,eAAe,WAAW,GAAGH,QAAAA,WAAoC"}

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

@@ -1 +1 @@
-{"version":3,"file":"typewriter.d.ts","sourceRoot":"","sources":["../../../src/components/ui/typewriter.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,eAAO,MAAM,cAAc,GAAI,wCAI5B;IACD,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAC;QACb,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,EAAE,CAAC;IACJ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,KAAG,KAAK,CAAC,GAAG,CAAC,OAwEb,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,wCAIlC;IACD,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAC;QACb,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,EAAE,CAAC;IACJ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,KAAG,KAAK,CAAC,GAAG,CAAC,OAsEb,CAAC"}
+{"version":3,"file":"typewriter.d.ts","sourceRoot":"","sources":["../../../src/components/ui/typewriter.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,eAAO,MAAM,cAAc,GAAI,wCAI5B;IACD,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAC;QACb,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,EAAE,CAAC;IACJ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,KAAG,KAAK,CAAC,GAAG,CAAC,OAwEb,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,wCAIlC;IACD,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAC;QACb,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,EAAE,CAAC;IACJ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,KAAG,KAAK,CAAC,GAAG,CAAC,OAsEb,CAAC"}

package/dist/components/ui/typewriter.js

@@ -6,9 +6,7 @@ import { useEffect } from "react";
 const TypewriterText = ({ words, className, cursorClassName })=>{
     const wordsArray = words.map((word)=>({
             ...word,
-            text: [
-                ...word.text
-            ]
+            text: word.text.split("")
         }));
     const [scope, animate] = useAnimate();
     const isInView = useInView(scope);
@@ -64,9 +62,7 @@ const TypewriterText = ({ words, className, cursorClassName })=>{
 const TypewriterTextSmooth = ({ words, className, cursorClassName })=>{
     const wordsArray = words.map((word)=>({
             ...word,
-            text: [
-                ...word.text
-            ]
+            text: word.text.split("")
         }));
     const renderWords = ()=>/*#__PURE__*/ jsx("div", {
             children: wordsArray.map((word, idx)=>/*#__PURE__*/ jsxs("div", {

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

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\typewriter.js","sources":["webpack://@arolariu/components/./src/components/ui/typewriter.tsx"],"sourcesContent":["\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\nimport {motion, stagger, useAnimate, useInView} from \"motion/react\";\r\nimport * as React from \"react\";\r\nimport {useEffect} from \"react\";\r\n\r\nexport const TypewriterText = ({\r\n  words,\r\n  className,\r\n  cursorClassName,\r\n}: {\r\n  words: {\r\n    text: string;\r\n    className?: string;\r\n  }[];\r\n  className?: string;\r\n  cursorClassName?: string;\r\n}): React.JSX.Element => {\r\n  // split text inside of words into array of characters\r\n  const wordsArray = words.map((word) => {\r\n    return {\r\n      ...word,\r\n      text: [...word.text],\r\n    };\r\n  });\r\n\r\n  const [scope, animate] = useAnimate();\r\n  const isInView = useInView(scope);\r\n  useEffect(() => {\r\n    if (isInView) {\r\n      animate(\r\n        \"span\",\r\n        {\r\n          display: \"inline-block\",\r\n          opacity: 1,\r\n          width: \"fit-content\",\r\n        },\r\n        {\r\n          duration: 0.3,\r\n          delay: stagger(0.1),\r\n          ease: \"easeInOut\",\r\n        },\r\n      );\r\n    }\r\n  }, [isInView]);\r\n\r\n  const renderWords = () => {\r\n    return (\r\n      <motion.div\r\n        ref={scope}\r\n        className='inline'>\r\n        {wordsArray.map((word, idx) => {\r\n          return (\r\n            <div\r\n              key={`word-${idx}`}\r\n              className='inline-block'>\r\n              {word.text.map((char, index) => (\r\n                <motion.span\r\n                  initial={{}}\r\n                  key={`char-${index}`}\r\n                  className={cn(`hidden text-black opacity-0 dark:text-white`, word.className)}>\r\n                  {char}\r\n                </motion.span>\r\n              ))}\r\n              &nbsp;\r\n            </div>\r\n          );\r\n        })}\r\n      </motion.div>\r\n    );\r\n  };\r\n  return (\r\n    <div className={cn(\"text-center text-base font-bold sm:text-xl md:text-3xl lg:text-5xl\", className)}>\r\n      {renderWords()}\r\n      <motion.span\r\n        initial={{\r\n          opacity: 0,\r\n        }}\r\n        animate={{\r\n          opacity: 1,\r\n        }}\r\n        transition={{\r\n          duration: 0.8,\r\n          repeat: Infinity,\r\n          repeatType: \"reverse\",\r\n        }}\r\n        className={cn(\"inline-block h-4 w-[4px] rounded-sm bg-blue-500 md:h-6 lg:h-10\", cursorClassName)}></motion.span>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport const TypewriterTextSmooth = ({\r\n  words,\r\n  className,\r\n  cursorClassName,\r\n}: {\r\n  words: {\r\n    text: string;\r\n    className?: string;\r\n  }[];\r\n  className?: string;\r\n  cursorClassName?: string;\r\n}): React.JSX.Element => {\r\n  // split text inside of words into array of characters\r\n  const wordsArray = words.map((word) => {\r\n    return {\r\n      ...word,\r\n      text: [...word.text],\r\n    };\r\n  });\r\n  const renderWords = () => {\r\n    return (\r\n      <div>\r\n        {wordsArray.map((word, idx) => {\r\n          return (\r\n            <div\r\n              key={`word-${idx}`}\r\n              className='inline-block'>\r\n              {word.text.map((char, index) => (\r\n                <span\r\n                  key={`char-${index}`}\r\n                  className={cn(`text-black dark:text-white`, word.className)}>\r\n                  {char}\r\n                </span>\r\n              ))}\r\n              &nbsp;\r\n            </div>\r\n          );\r\n        })}\r\n      </div>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <div className={cn(\"my-6 flex space-x-1\", className)}>\r\n      <motion.div\r\n        className='overflow-hidden pb-2'\r\n        initial={{\r\n          width: \"0%\",\r\n        }}\r\n        whileInView={{\r\n          width: \"fit-content\",\r\n        }}\r\n        transition={{\r\n          duration: 2,\r\n          ease: \"linear\",\r\n          delay: 1,\r\n        }}>\r\n        <div\r\n          className='lg:text:3xl text-xs font-bold sm:text-base md:text-xl xl:text-5xl'\r\n          style={{\r\n            whiteSpace: \"nowrap\",\r\n          }}>\r\n          {renderWords()}{\" \"}\r\n        </div>{\" \"}\r\n      </motion.div>\r\n      <motion.span\r\n        initial={{\r\n          opacity: 0,\r\n        }}\r\n        animate={{\r\n          opacity: 1,\r\n        }}\r\n        transition={{\r\n          duration: 0.8,\r\n\r\n          repeat: Infinity,\r\n          repeatType: \"reverse\",\r\n        }}\r\n        className={cn(\"block h-4 w-[4px] rounded-sm bg-blue-500 sm:h-6 xl:h-12\", cursorClassName)}></motion.span>\r\n    </div>\r\n  );\r\n};\r\n"],"names":["TypewriterText","words","className","cursorClassName","wordsArray","word","scope","animate","useAnimate","isInView","useInView","useEffect","stagger","renderWords","motion","idx","char","index","cn","Infinity","TypewriterTextSmooth"],"mappings":";;;;;AAOO,MAAMA,iBAAiB,CAAC,EAC7BC,KAAK,EACLC,SAAS,EACTC,eAAe,EAQhB;IAEC,MAAMC,aAAaH,MAAM,GAAG,CAAC,CAACI,OACrB;YACL,GAAGA,IAAI;YACP,MAAM;mBAAIA,KAAK,IAAI;aAAC;QACtB;IAGF,MAAM,CAACC,OAAOC,QAAQ,GAAGC;IACzB,MAAMC,WAAWC,UAAUJ;IAC3BK,UAAU;QACR,IAAIF,UACFF,QACE,QACA;YACE,SAAS;YACT,SAAS;YACT,OAAO;QACT,GACA;YACE,UAAU;YACV,OAAOK,QAAQ;YACf,MAAM;QACR;IAGN,GAAG;QAACH;KAAS;IAEb,MAAMI,cAAc,IACX,WAAP,GACE,IAACC,OAAO,GAAG;YACT,KAAKR;YACL,WAAU;sBACTF,WAAW,GAAG,CAAC,CAACC,MAAMU,MACd,WAAP,GACE,KAAC;oBAEC,WAAU;;wBACTV,KAAK,IAAI,CAAC,GAAG,CAAC,CAACW,MAAMC,QAAAA,WAAAA,GACpB,IAACH,OAAO,IAAI;gCACV,SAAS,CAAC;gCAEV,WAAWI,GAAG,+CAA+Cb,KAAK,SAAS;0CAC1EW;+BAFI,CAAC,KAAK,EAAEC,OAAO;wBAIrB;;mBATE,CAAC,KAAK,EAAEF,KAAK;;IAiB9B,OAAO,WAAP,GACE,KAAC;QAAI,WAAWG,GAAG,sEAAsEhB;;YACtFW;0BACD,IAACC,OAAO,IAAI;gBACV,SAAS;oBACP,SAAS;gBACX;gBACA,SAAS;oBACP,SAAS;gBACX;gBACA,YAAY;oBACV,UAAU;oBACV,QAAQK;oBACR,YAAY;gBACd;gBACA,WAAWD,GAAG,kEAAkEf;;;;AAGxF;AAEO,MAAMiB,uBAAuB,CAAC,EACnCnB,KAAK,EACLC,SAAS,EACTC,eAAe,EAQhB;IAEC,MAAMC,aAAaH,MAAM,GAAG,CAAC,CAACI,OACrB;YACL,GAAGA,IAAI;YACP,MAAM;mBAAIA,KAAK,IAAI;aAAC;QACtB;IAEF,MAAMQ,cAAc,IACX,WAAP,GACE,IAAC;sBACET,WAAW,GAAG,CAAC,CAACC,MAAMU,MACd,WAAP,GACE,KAAC;oBAEC,WAAU;;wBACTV,KAAK,IAAI,CAAC,GAAG,CAAC,CAACW,MAAMC,QAAAA,WAAAA,GACpB,IAAC;gCAEC,WAAWC,GAAG,8BAA8Bb,KAAK,SAAS;0CACzDW;+BAFI,CAAC,KAAK,EAAEC,OAAO;wBAIrB;;mBARE,CAAC,KAAK,EAAEF,KAAK;;IAiB9B,OAAO,WAAP,GACE,KAAC;QAAI,WAAWG,GAAG,uBAAuBhB;;0BACxC,KAACY,OAAO,GAAG;gBACT,WAAU;gBACV,SAAS;oBACP,OAAO;gBACT;gBACA,aAAa;oBACX,OAAO;gBACT;gBACA,YAAY;oBACV,UAAU;oBACV,MAAM;oBACN,OAAO;gBACT;;kCACA,KAAC;wBACC,WAAU;wBACV,OAAO;4BACL,YAAY;wBACd;;4BACCD;4BAAe;;;oBACX;;;0BAET,IAACC,OAAO,IAAI;gBACV,SAAS;oBACP,SAAS;gBACX;gBACA,SAAS;oBACP,SAAS;gBACX;gBACA,YAAY;oBACV,UAAU;oBAEV,QAAQK;oBACR,YAAY;gBACd;gBACA,WAAWD,GAAG,2DAA2Df;;;;AAGjF"}
+{"version":3,"file":"components\\ui\\typewriter.js","sources":["webpack://@arolariu/components/./src/components/ui/typewriter.tsx"],"sourcesContent":["\r\n\r\nimport {cn} from \"@/lib/utilities\";\r\nimport {motion, stagger, useAnimate, useInView} from \"motion/react\";\r\nimport * as React from \"react\";\r\n\r\nexport const TypewriterText = ({\r\n  words,\r\n  className,\r\n  cursorClassName,\r\n}: {\r\n  words: {\r\n    text: string;\r\n    className?: string;\r\n  }[];\r\n  className?: string;\r\n  cursorClassName?: string;\r\n}): React.JSX.Element => {\r\n  // split text inside of words into array of characters\r\n  const wordsArray = words.map((word) => {\r\n    return {\r\n      ...word,\r\n      text: word.text.split(\"\"),\r\n    };\r\n  });\r\n\r\n  const [scope, animate] = useAnimate();\r\n  const isInView = useInView(scope);\r\n  React.useEffect(() => {\r\n    if (isInView) {\r\n      animate(\r\n        \"span\",\r\n        {\r\n          display: \"inline-block\",\r\n          opacity: 1,\r\n          width: \"fit-content\",\r\n        },\r\n        {\r\n          duration: 0.3,\r\n          delay: stagger(0.1),\r\n          ease: \"easeInOut\",\r\n        },\r\n      );\r\n    }\r\n  }, [isInView]);\r\n\r\n  const renderWords = () => {\r\n    return (\r\n      <motion.div\r\n        ref={scope}\r\n        className='inline'>\r\n        {wordsArray.map((word, idx) => {\r\n          return (\r\n            <div\r\n              key={`word-${idx}`}\r\n              className='inline-block'>\r\n              {word.text.map((char, index) => (\r\n                <motion.span\r\n                  initial={{}}\r\n                  key={`char-${index}`}\r\n                  className={cn(`hidden text-black opacity-0 dark:text-white`, word.className)}>\r\n                  {char}\r\n                </motion.span>\r\n              ))}\r\n              &nbsp;\r\n            </div>\r\n          );\r\n        })}\r\n      </motion.div>\r\n    );\r\n  };\r\n  return (\r\n    <div className={cn(\"text-center text-base font-bold sm:text-xl md:text-3xl lg:text-5xl\", className)}>\r\n      {renderWords()}\r\n      <motion.span\r\n        initial={{\r\n          opacity: 0,\r\n        }}\r\n        animate={{\r\n          opacity: 1,\r\n        }}\r\n        transition={{\r\n          duration: 0.8,\r\n          repeat: Infinity,\r\n          repeatType: \"reverse\",\r\n        }}\r\n        className={cn(\"inline-block h-4 w-[4px] rounded-sm bg-blue-500 md:h-6 lg:h-10\", cursorClassName)}></motion.span>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport const TypewriterTextSmooth = ({\r\n  words,\r\n  className,\r\n  cursorClassName,\r\n}: {\r\n  words: {\r\n    text: string;\r\n    className?: string;\r\n  }[];\r\n  className?: string;\r\n  cursorClassName?: string;\r\n}): React.JSX.Element => {\r\n  // split text inside of words into array of characters\r\n  const wordsArray = words.map((word) => {\r\n    return {\r\n      ...word,\r\n      text: word.text.split(\"\"),\r\n    };\r\n  });\r\n  const renderWords = () => {\r\n    return (\r\n      <div>\r\n        {wordsArray.map((word, idx) => {\r\n          return (\r\n            <div\r\n              key={`word-${idx}`}\r\n              className='inline-block'>\r\n              {word.text.map((char, index) => (\r\n                <span\r\n                  key={`char-${index}`}\r\n                  className={cn(`text-black dark:text-white`, word.className)}>\r\n                  {char}\r\n                </span>\r\n              ))}\r\n              &nbsp;\r\n            </div>\r\n          );\r\n        })}\r\n      </div>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <div className={cn(\"my-6 flex space-x-1\", className)}>\r\n      <motion.div\r\n        className='overflow-hidden pb-2'\r\n        initial={{\r\n          width: \"0%\",\r\n        }}\r\n        whileInView={{\r\n          width: \"fit-content\",\r\n        }}\r\n        transition={{\r\n          duration: 2,\r\n          ease: \"linear\",\r\n          delay: 1,\r\n        }}>\r\n        <div\r\n          className='lg:text:3xl text-xs font-bold sm:text-base md:text-xl xl:text-5xl'\r\n          style={{\r\n            whiteSpace: \"nowrap\",\r\n          }}>\r\n          {renderWords()}{\" \"}\r\n        </div>{\" \"}\r\n      </motion.div>\r\n      <motion.span\r\n        initial={{\r\n          opacity: 0,\r\n        }}\r\n        animate={{\r\n          opacity: 1,\r\n        }}\r\n        transition={{\r\n          duration: 0.8,\r\n\r\n          repeat: Infinity,\r\n          repeatType: \"reverse\",\r\n        }}\r\n        className={cn(\"block h-4 w-[4px] rounded-sm bg-blue-500 sm:h-6 xl:h-12\", cursorClassName)}></motion.span>\r\n    </div>\r\n  );\r\n};\r\n"],"names":["TypewriterText","words","className","cursorClassName","wordsArray","word","scope","animate","useAnimate","isInView","useInView","React","stagger","renderWords","motion","idx","char","index","cn","Infinity","TypewriterTextSmooth"],"mappings":";;;;;AAMO,MAAMA,iBAAiB,CAAC,EAC7BC,KAAK,EACLC,SAAS,EACTC,eAAe,EAQhB;IAEC,MAAMC,aAAaH,MAAM,GAAG,CAAC,CAACI,OACrB;YACL,GAAGA,IAAI;YACP,MAAMA,KAAK,IAAI,CAAC,KAAK,CAAC;QACxB;IAGF,MAAM,CAACC,OAAOC,QAAQ,GAAGC;IACzB,MAAMC,WAAWC,UAAUJ;IAC3BK,UAAgB;QACd,IAAIF,UACFF,QACE,QACA;YACE,SAAS;YACT,SAAS;YACT,OAAO;QACT,GACA;YACE,UAAU;YACV,OAAOK,QAAQ;YACf,MAAM;QACR;IAGN,GAAG;QAACH;KAAS;IAEb,MAAMI,cAAc,IACX,WAAP,GACE,IAACC,OAAO,GAAG;YACT,KAAKR;YACL,WAAU;sBACTF,WAAW,GAAG,CAAC,CAACC,MAAMU,MACd,WAAP,GACE,KAAC;oBAEC,WAAU;;wBACTV,KAAK,IAAI,CAAC,GAAG,CAAC,CAACW,MAAMC,QAAAA,WAAAA,GACpB,IAACH,OAAO,IAAI;gCACV,SAAS,CAAC;gCAEV,WAAWI,GAAG,+CAA+Cb,KAAK,SAAS;0CAC1EW;+BAFI,CAAC,KAAK,EAAEC,OAAO;wBAIrB;;mBATE,CAAC,KAAK,EAAEF,KAAK;;IAiB9B,OAAO,WAAP,GACE,KAAC;QAAI,WAAWG,GAAG,sEAAsEhB;;YACtFW;0BACD,IAACC,OAAO,IAAI;gBACV,SAAS;oBACP,SAAS;gBACX;gBACA,SAAS;oBACP,SAAS;gBACX;gBACA,YAAY;oBACV,UAAU;oBACV,QAAQK;oBACR,YAAY;gBACd;gBACA,WAAWD,GAAG,kEAAkEf;;;;AAGxF;AAEO,MAAMiB,uBAAuB,CAAC,EACnCnB,KAAK,EACLC,SAAS,EACTC,eAAe,EAQhB;IAEC,MAAMC,aAAaH,MAAM,GAAG,CAAC,CAACI,OACrB;YACL,GAAGA,IAAI;YACP,MAAMA,KAAK,IAAI,CAAC,KAAK,CAAC;QACxB;IAEF,MAAMQ,cAAc,IACX,WAAP,GACE,IAAC;sBACET,WAAW,GAAG,CAAC,CAACC,MAAMU,MACd,WAAP,GACE,KAAC;oBAEC,WAAU;;wBACTV,KAAK,IAAI,CAAC,GAAG,CAAC,CAACW,MAAMC,QAAAA,WAAAA,GACpB,IAAC;gCAEC,WAAWC,GAAG,8BAA8Bb,KAAK,SAAS;0CACzDW;+BAFI,CAAC,KAAK,EAAEC,OAAO;wBAIrB;;mBARE,CAAC,KAAK,EAAEF,KAAK;;IAiB9B,OAAO,WAAP,GACE,KAAC;QAAI,WAAWG,GAAG,uBAAuBhB;;0BACxC,KAACY,OAAO,GAAG;gBACT,WAAU;gBACV,SAAS;oBACP,OAAO;gBACT;gBACA,aAAa;oBACX,OAAO;gBACT;gBACA,YAAY;oBACV,UAAU;oBACV,MAAM;oBACN,OAAO;gBACT;;kCACA,KAAC;wBACC,WAAU;wBACV,OAAO;4BACL,YAAY;wBACd;;4BACCD;4BAAe;;;oBACX;;;0BAET,IAACC,OAAO,IAAI;gBACV,SAAS;oBACP,SAAS;gBACX;gBACA,SAAS;oBACP,SAAS;gBACX;gBACA,YAAY;oBACV,UAAU;oBAEV,QAAQK;oBACR,YAAY;gBACd;gBACA,WAAWD,GAAG,2DAA2Df;;;;AAGjF"}