@underverse-ui/underverse 0.2.51 → 0.2.53

package/dist/index.cjs

@@ -2225,13 +2225,36 @@ var sizeClasses = {
   md: "h-10 w-10 text-base",
   lg: "h-14 w-14 text-lg"
 };
-var Avatar = ({ src, alt = "avatar", fallback = "?", size = "md", className, onClick, ...props }) => {
+var statusColors = {
+  online: "bg-success",
+  offline: "bg-muted-foreground",
+  busy: "bg-destructive",
+  away: "bg-warning",
+  none: "bg-transparent"
+};
+var statusDotSizes = {
+  sm: "w-2 h-2 border",
+  md: "w-3 h-3 border-2",
+  lg: "w-4 h-4 border-2"
+};
+var Avatar = ({
+  src,
+  alt = "avatar",
+  fallback = "?",
+  size = "md",
+  showStatus = true,
+  status = "online",
+  hideStatusOnHover = true,
+  className,
+  onClick,
+  ...props
+}) => {
   const hasValidSrc = !!(src && src.trim().length > 0);
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
     "div",
     {
       className: cn(
-        "relative inline-flex items-center justify-center overflow-hidden rounded-full bg-muted text-foreground select-none transition-all duration-200 ease-soft",
+        "group relative inline-flex items-center justify-center overflow-visible rounded-full bg-muted text-foreground select-none transition-all duration-200 ease-soft",
         onClick && "cursor-pointer hover:ring-2 hover:ring-primary/50 hover:ring-offset-2 hover:shadow-lg active:scale-95",
         sizeClasses[size],
         className
@@ -2239,31 +2262,44 @@ var Avatar = ({ src, alt = "avatar", fallback = "?", size = "md", className, onC
       onClick,
       ...props,
       children: [
-        hasValidSrc && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "absolute inset-0", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-          SmartImage,
-          {
-            src,
-            alt,
-            fill: true,
-            ratioClass: void 0,
-            className: "h-full w-full",
-            roundedClass: "rounded-full",
-            fit: "cover",
-            objectPosition: "center",
-            quality: 80
-          }
-        ) }),
-        !hasValidSrc && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-          "span",
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "absolute inset-0 overflow-hidden rounded-full", children: [
+          hasValidSrc && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+            SmartImage,
+            {
+              src,
+              alt,
+              fill: true,
+              ratioClass: void 0,
+              className: "h-full w-full",
+              roundedClass: "rounded-full",
+              fit: "cover",
+              objectPosition: "center",
+              quality: 80
+            }
+          ),
+          !hasValidSrc && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+            "span",
+            {
+              className: cn(
+                "font-bold uppercase bg-linear-to-br from-primary to-primary/80 bg-clip-text text-transparent",
+                "transition-all duration-200 animate-fade-in"
+              ),
+              children: fallback
+            }
+          ) })
+        ] }),
+        showStatus && status !== "none" && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          "div",
           {
             className: cn(
-              "font-bold uppercase bg-linear-to-br from-primary to-primary/80 bg-clip-text text-transparent",
-              "transition-all duration-200 animate-fade-in"
-            ),
-            children: fallback
+              "absolute bottom-0 right-0 rounded-full border-background z-10",
+              statusColors[status],
+              statusDotSizes[size],
+              "transition-opacity duration-200",
+              hideStatusOnHover ? "opacity-100 group-hover:opacity-50" : "opacity-100"
+            )
           }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "absolute bottom-0 right-0 w-3 h-3 bg-success border-2 border-background rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-200" })
+        )
       ]
     }
   );
@@ -5516,33 +5552,15 @@ var variantClasses = {
   primary: "bg-primary/5",
   accent: "bg-accent/10"
 };
-var spacingClasses2 = {
-  none: "",
-  sm: "p-2",
-  md: "p-4",
-  lg: "p-6",
-  xl: "p-8"
-};
 var ScrollArea = (0, import_react14.forwardRef)(
-  ({ className, contentClassName, children, variant = "default", spacing = "none", fullWidth = true, outlined = false, ...props }, ref) => {
+  ({ className, contentClassName, children, variant = "default", outlined = false, ...props }, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       "div",
       {
         ref,
         className: cn("relative overflow-hidden", variantClasses[variant], outlined && "rounded-lg border border-border/60", className),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-          "div",
-          {
-            className: cn(
-              "h-full w-full overflow-y-auto scroll-area-viewport",
-              spacingClasses2[spacing],
-              !fullWidth && "container mx-auto px-4 md:px-6",
-              contentClassName
-            ),
-            children
-          }
-        )
+        children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: cn("h-full w-full overflow-y-auto scroll-area-viewport", contentClassName), children })
       }
     );
   }