@nuvia/components 1.1.2 → 1.2.0

package/dist/index.js

@@ -1141,7 +1141,7 @@ var CommandItem = React36.forwardRef(({ className, ...props }, ref) => /* @__PUR
   {
     ref,
     className: cn(
-      "relative flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none dark:data-[selected=true]:bg-secondary/25 data-[selected=true]:bg-secondary/50 data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+      "relative flex cursor-default gap-2 select-none items-center rounded-md px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-primary/25 data-[selected=true]:bg-secondary/50 data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
       className
     ),
     ...props
@@ -2943,7 +2943,7 @@ function Skeleton({
   return /* @__PURE__ */ jsx(
     "div",
     {
-      className: cn("animate-pulse rounded-md bg-secondary dark:bg-secondary/25", className),
+      className: cn("animate-pulse rounded-xl bg-primary/10 ", className),
       ...props
     }
   );
@@ -3028,7 +3028,15 @@ var SidebarProvider = React36.forwardRef(
         setOpenMobile,
         toggleSidebar
       }),
-      [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
+      [
+        state,
+        open,
+        setOpen,
+        isMobile,
+        openMobile,
+        setOpenMobile,
+        toggleSidebar
+      ]
     );
     return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx(
       "div",
@@ -3289,7 +3297,7 @@ var SidebarGroupLabel = React36.forwardRef(({ className, asChild = false, ...pro
       ref,
       "data-sidebar": "group-label",
       className: cn(
-        "duration-200 flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 outline-none ring-sidebar-ring transition-[margin,opa] ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        "duration-200 flex h-8 shrink-0 items-center rounded-xl px-2 text-xs font-medium text-sidebar-foreground/70 outline-none ring-sidebar-ring transition-[margin,opa] ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
         "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
         className
       ),
@@ -3306,7 +3314,7 @@ var SidebarGroupAction = React36.forwardRef(({ className, asChild = false, ...pr
       ref,
       "data-sidebar": "group-action",
       className: cn(
-        "absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-secondary/50 dark:hover:bg-secondary/25 hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        "absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-xl p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform bg-primary/10 hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
         // Increases the hit area of the button on mobile.
         "after:absolute after:-inset-2 after:md:hidden",
         "group-data-[collapsible=icon]:hidden",
@@ -3421,7 +3429,7 @@ var SidebarMenuAction = React36.forwardRef(({ className, asChild = false, showOn
       ref,
       "data-sidebar": "menu-action",
       className: cn(
-        "absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-secondary/50 dark:hover:bg-secondary/25 hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
+        "absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-xl p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-secondary/50 dark:hover:bg-secondary/25 hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
         // Increases the hit area of the button on mobile.
         "after:absolute after:-inset-2 after:md:hidden",
         "peer-data-[size=sm]/menu-button:top-1",
@@ -3442,7 +3450,7 @@ var SidebarMenuBadge = React36.forwardRef(({ className, ...props }, ref) => /* @
     ref,
     "data-sidebar": "menu-badge",
     className: cn(
-      "absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums text-sidebar-foreground select-none pointer-events-none",
+      "absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-xl px-1 text-xs font-medium tabular-nums text-sidebar-foreground select-none pointer-events-none",
       "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
       "peer-data-[size=sm]/menu-button:top-1",
       "peer-data-[size=default]/menu-button:top-1.5",
@@ -3463,13 +3471,13 @@ var SidebarMenuSkeleton = React36.forwardRef(({ className, showIcon = false, ...
     {
       ref,
       "data-sidebar": "menu-skeleton",
-      className: cn("rounded-md h-8 flex gap-2 px-2 items-center", className),
+      className: cn("rounded-xl h-8 flex gap-2 px-2 items-center", className),
       ...props,
       children: [
         showIcon && /* @__PURE__ */ jsx(
           Skeleton,
           {
-            className: "size-4 rounded-md",
+            className: "size-4 rounded-xl",
             "data-sidebar": "menu-skeleton-icon"
           }
         ),
@@ -3514,7 +3522,7 @@ var SidebarMenuSubButton = React36.forwardRef(({ asChild = false, size = "md", i
       "data-size": size,
       "data-active": isActive,
       className: cn(
-        "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-secondary/50 dark:hover:bg-secondary/25 hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
+        "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-xl px-2 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-secondary/50 dark:hover:bg-secondary/25 hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
         "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
         size === "sm" && "text-xs",
         size === "md" && "text-sm",
@@ -3573,12 +3581,19 @@ var Toaster = ({ ...props }) => {
     }
   );
 };
-var Spinner = ({ className, size = 24, strokeWidth = 80, text, textClassName }) => {
+var Spinner = ({
+  className,
+  size = 24,
+  strokeWidth = 80,
+  text,
+  textClassName
+}) => {
   const gradientId = useId();
   const patternId = useId();
   return /* @__PURE__ */ jsxs(
-    "span",
+    "output",
     {
+      "aria-label": "Carregando",
       className: `${className} flex justify-center items-center rounded-full aspect-square relative`,
       style: {
         width: size,
@@ -3602,12 +3617,12 @@ var Spinner = ({ className, size = 24, strokeWidth = 80, text, textClassName })
         /* @__PURE__ */ jsxs(
           "svg",
           {
+            "aria-hidden": "true",
             xmlns: "http://www.w3.org/2000/svg",
             version: "1.1",
             width: "100%",
             height: "100%",
             viewBox: "0 0 600 600",
-            role: "progressbar",
             className: "m-auto flex justify-center items-center",
             children: [
               /* @__PURE__ */ jsxs("defs", { children: [
@@ -3621,12 +3636,46 @@ var Spinner = ({ className, size = 24, strokeWidth = 80, text, textClassName })
               transform-origin: 300px 300px;
             }
           ` }),
-                /* @__PURE__ */ jsxs("linearGradient", { id: `Gradient${gradientId}`, gradientTransform: "rotate(90)", children: [
-                  /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: `hsl(var(--color-lilas-400))` }),
-                  /* @__PURE__ */ jsx("stop", { offset: "75%", stopColor: `hsl(var(--color-indigo-400)/0.5)` }),
-                  /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: `hsl(var(--color-madrugada-400)/0)` })
-                ] }),
-                /* @__PURE__ */ jsx("pattern", { id: `Pattern${patternId}`, x: "0", y: "0", width: "600", height: "600", patternUnits: "userSpaceOnUse", children: /* @__PURE__ */ jsx("g", { transform: "rotate(0, 300, 300)", children: /* @__PURE__ */ jsx("rect", { shapeRendering: "crispEdges", x: "0", y: "0", width: "300", height: "600", fill: `url(#Gradient${gradientId})` }) }) })
+                /* @__PURE__ */ jsxs(
+                  "linearGradient",
+                  {
+                    id: `Gradient${gradientId}`,
+                    gradientTransform: "rotate(90)",
+                    children: [
+                      /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "hsl(var(--color-lilas-400))" }),
+                      /* @__PURE__ */ jsx("stop", { offset: "75%", stopColor: "hsl(var(--color-indigo-400)/0.5)" }),
+                      /* @__PURE__ */ jsx(
+                        "stop",
+                        {
+                          offset: "100%",
+                          stopColor: "hsl(var(--color-madrugada-400)/0)"
+                        }
+                      )
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "pattern",
+                  {
+                    id: `Pattern${patternId}`,
+                    x: "0",
+                    y: "0",
+                    width: "600",
+                    height: "600",
+                    patternUnits: "userSpaceOnUse",
+                    children: /* @__PURE__ */ jsx("g", { transform: "rotate(0, 300, 300)", children: /* @__PURE__ */ jsx(
+                      "rect",
+                      {
+                        shapeRendering: "crispEdges",
+                        x: "0",
+                        y: "0",
+                        width: "300",
+                        height: "600",
+                        fill: `url(#Gradient${gradientId})`
+                      }
+                    ) })
+                  }
+                )
               ] }),
               /* @__PURE__ */ jsx(
                 "path",
@@ -3812,7 +3861,7 @@ var Textarea = React36.forwardRef(({ className, ...props }, ref) => {
     "textarea",
     {
       className: cn(
-        "flex min-h-[60px] w-full rounded-xl border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "flex min-h-[60px] w-full rounded-xl border border-input bg-background px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         className
       ),
       ref,