@algenium/blocks 1.7.0 → 1.9.0

package/dist/index.cjs

@@ -1,19 +1,19 @@
 'use strict';
 
 var React2 = require('react');
-var nextThemes = require('next-themes');
 var lucideReact = require('lucide-react');
+var jsxRuntime = require('react/jsx-runtime');
+var nextThemes = require('next-themes');
 var framerMotion = require('framer-motion');
 var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
-var jsxRuntime = require('react/jsx-runtime');
 var reactSlot = require('@radix-ui/react-slot');
-var TooltipPrimitive = require('@radix-ui/react-tooltip');
 var SliderPrimitive = require('@radix-ui/react-slider');
 var TogglePrimitive = require('@radix-ui/react-toggle');
 var DialogPrimitive = require('@radix-ui/react-dialog');
 var vaul = require('vaul');
 var PopoverPrimitive = require('@radix-ui/react-popover');
 var ScrollAreaPrimitive = require('@radix-ui/react-scroll-area');
+var TooltipPrimitive = require('@radix-ui/react-tooltip');
 var dateFns = require('date-fns');
 var reactDayPicker = require('react-day-picker');
 var valid = require('card-validator');
@@ -40,12 +40,12 @@ function _interopNamespace(e) {
 
 var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
 var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(DropdownMenuPrimitive);
-var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
 var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
 var TogglePrimitive__namespace = /*#__PURE__*/_interopNamespace(TogglePrimitive);
 var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
 var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
 var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPrimitive);
+var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
 var valid__default = /*#__PURE__*/_interopDefault(valid);
 
 var CalendarContext = React2.createContext(null);
@@ -3115,6 +3115,93 @@ var twMerge = /* @__PURE__ */ createTailwindMerge(getDefaultConfig);
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+function LoadingState({
+  label = "Cargando\u2026",
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: "status",
+      "aria-live": "polite",
+      className: cn(
+        "flex items-center justify-center gap-2 py-12 text-sm text-muted-foreground",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "size-4 animate-spin", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { children: label })
+      ]
+    }
+  );
+}
+function ErrorState({
+  title = "Algo sali\xF3 mal",
+  description,
+  action,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: "alert",
+      className: cn(
+        "flex flex-col items-center gap-3 rounded-xl border border-dashed border-destructive/40 bg-destructive/5 py-12 text-center",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "size-6 text-destructive", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-medium", children: title }),
+          description ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: description }) : null
+        ] }),
+        action
+      ]
+    }
+  );
+}
+function EmptyState({
+  title,
+  description,
+  action,
+  icon: Icon = lucideReact.Inbox,
+  variant = "default",
+  className
+}) {
+  const isCompact = variant === "compact";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col items-center gap-3 text-center",
+        isCompact ? "px-4 py-6" : "rounded-xl border border-dashed py-12",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Icon,
+          {
+            className: cn(
+              "text-muted-foreground",
+              isCompact ? "size-8 opacity-50" : "size-6"
+            ),
+            "aria-hidden": "true"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("font-medium", isCompact && "text-sm"), children: title }),
+          description ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: description }) : null
+        ] }),
+        action
+      ]
+    }
+  );
+}
+var miniMenuContentClassName = "max-h-none overflow-x-visible overflow-y-visible";
+var miniMenuContentDefaults = {
+  sideOffset: 8,
+  collisionPadding: 12
+};
 function DropdownMenu({
   ...props
 }) {
@@ -3413,52 +3500,6 @@ function Button({
     }
   );
 }
-function TooltipProvider({
-  delayDuration = 0,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TooltipPrimitive__namespace.Provider,
-    {
-      "data-slot": "tooltip-provider",
-      delayDuration,
-      ...props
-    }
-  );
-}
-function Tooltip({
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { "data-slot": "tooltip", ...props }) });
-}
-function TooltipTrigger({
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { "data-slot": "tooltip-trigger", ...props });
-}
-function TooltipContent({
-  className,
-  sideOffset = 0,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-    TooltipPrimitive__namespace.Content,
-    {
-      "data-slot": "tooltip-content",
-      sideOffset,
-      className: cn(
-        "bg-foreground text-background 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 px-3 py-1.5 text-xs text-balance",
-        className
-      ),
-      ...props,
-      children: [
-        children,
-        /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
-      ]
-    }
-  ) });
-}
 var defaultLabels = {
   theme: "Theme",
   system: "System",
@@ -3502,11 +3543,8 @@ function ThemeSwitcher({
   size = "sm",
   shape = "rounded",
   variant = "default",
-  align = "center",
-  side = "top",
-  tooltipSide = "bottom",
-  tooltipAlign = "center",
-  tooltipSideOffset = 8,
+  align = "end",
+  side = "bottom",
   labels: userLabels
 }) {
   const { theme, setTheme } = nextThemes.useTheme();
@@ -3540,43 +3578,42 @@ function ThemeSwitcher({
   const CurrentIcon = themes.find((t) => t.key === currentTheme)?.icon || lucideReact.Monitor;
   if (variant === "mini") {
     return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-          Button,
-          {
-            "data-testid": "theme-switcher",
-            variant: "ghost",
-            size: "icon",
-            "aria-label": labels.theme,
-            className: cn(sizes.buttonMini, shapeClass, className),
-            children: /* @__PURE__ */ jsxRuntime.jsx(CurrentIcon, { className: sizes.iconMini })
-          }
-        ) }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          TooltipContent,
-          {
-            side: tooltipSide,
-            align: tooltipAlign,
-            sideOffset: tooltipSideOffset,
-            children: labels.theme
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuContent, { side, align, sideOffset: 8, children: themes.map(({ key, icon: Icon }) => /* @__PURE__ */ jsxRuntime.jsxs(
-        DropdownMenuItem,
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+        Button,
         {
-          onClick: () => handleThemeClick(key),
-          className: cn(
-            "gap-2 cursor-pointer",
-            currentTheme === key && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
-          ),
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-4 w-4" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: labels[key] })
-          ]
-        },
-        key
-      )) })
+          "data-testid": "theme-switcher",
+          variant: "ghost",
+          size: "icon",
+          "aria-label": labels.theme,
+          className: cn(sizes.buttonMini, shapeClass, className),
+          children: /* @__PURE__ */ jsxRuntime.jsx(CurrentIcon, { className: sizes.iconMini })
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        DropdownMenuContent,
+        {
+          side,
+          align,
+          sideOffset: miniMenuContentDefaults.sideOffset,
+          collisionPadding: miniMenuContentDefaults.collisionPadding,
+          className: miniMenuContentClassName,
+          children: themes.map(({ key, icon: Icon }) => /* @__PURE__ */ jsxRuntime.jsxs(
+            DropdownMenuItem,
+            {
+              onClick: () => handleThemeClick(key),
+              className: cn(
+                "gap-2 cursor-pointer",
+                currentTheme === key && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-4 w-4" }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: labels[key] })
+              ]
+            },
+            key
+          ))
+        }
+      )
     ] });
   }
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -3670,11 +3707,8 @@ function LanguageSwitcher({
   shape = "rounded",
   variant = "default",
   showIcon = true,
-  align = "center",
-  side = "top",
-  tooltipSide = "bottom",
-  tooltipAlign = "center",
-  tooltipSideOffset = 8
+  align = "end",
+  side = "bottom"
 }) {
   const context = useLanguageContext();
   const contextLanguages = context?.languages?.map((lang) => ({
@@ -3692,34 +3726,24 @@ function LanguageSwitcher({
   };
   if (variant === "mini") {
     return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-          Button,
-          {
-            variant: "ghost",
-            size: "icon",
-            "aria-label": defaultLabels4.language,
-            className: cn(sizes.buttonMini, shapeClass, className),
-            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Languages, { className: sizes.iconMini })
-          }
-        ) }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          TooltipContent,
-          {
-            side: tooltipSide,
-            align: tooltipAlign,
-            sideOffset: tooltipSideOffset,
-            children: defaultLabels4.language
-          }
-        )
-      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          "aria-label": defaultLabels4.language,
+          className: cn(sizes.buttonMini, shapeClass, className),
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Languages, { className: sizes.iconMini })
+        }
+      ) }),
       /* @__PURE__ */ jsxRuntime.jsx(
         DropdownMenuContent,
         {
           side,
           align,
-          sideOffset: 8,
-          className: "min-w-0 w-auto",
+          sideOffset: miniMenuContentDefaults.sideOffset,
+          collisionPadding: miniMenuContentDefaults.collisionPadding,
+          className: cn(miniMenuContentClassName, "min-w-0 w-auto"),
           children: languages.map(({ key, nativeName }) => /* @__PURE__ */ jsxRuntime.jsx(
             DropdownMenuItem,
             {
@@ -3919,10 +3943,7 @@ function EnvironmentSwitcher({
   shape = "rounded",
   variant = "mini",
   align = "end",
-  side = "bottom",
-  tooltipSide = "bottom",
-  tooltipAlign = "center",
-  tooltipSideOffset = 8
+  side = "bottom"
 }) {
   const ctx = useEnvironmentContext();
   const labels = { ...defaultLabels2, ...userLabels };
@@ -3938,53 +3959,18 @@ function EnvironmentSwitcher({
   };
   if (variant === "mini") {
     return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
-          Button,
-          {
-            "data-testid": "environment-switcher",
-            variant: "outline",
-            size: "sm",
-            "aria-label": labels.environment,
-            className: cn(
-              sizes.buttonMini,
-              shapeClass,
-              "font-medium tabular-nums border-border bg-background",
-              className
-            ),
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "span",
-                {
-                  className: cn(
-                    "rounded-full shrink-0 ring-1 ring-background",
-                    sizes.dot,
-                    getEnvironmentDotClass(environment)
-                  ),
-                  "aria-hidden": true
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-[5.5rem] truncate", children: getEnvironmentLabel(environment, labels) })
-            ]
-          }
-        ) }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          TooltipContent,
-          {
-            side: tooltipSide,
-            align: tooltipAlign,
-            sideOffset: tooltipSideOffset,
-            children: labels.environment
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuContent, { side, align, sideOffset: 8, children: environments.map((env) => /* @__PURE__ */ jsxRuntime.jsxs(
-        DropdownMenuItem,
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
+        Button,
         {
-          onClick: () => handleSelect(env),
+          "data-testid": "environment-switcher",
+          variant: "outline",
+          size: "sm",
+          "aria-label": labels.environment,
           className: cn(
-            "gap-2 cursor-pointer",
-            environment === env && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
+            sizes.buttonMini,
+            shapeClass,
+            "font-medium tabular-nums border-border bg-background",
+            className
           ),
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -3993,16 +3979,50 @@ function EnvironmentSwitcher({
                 className: cn(
                   "rounded-full shrink-0 ring-1 ring-background",
                   sizes.dot,
-                  getEnvironmentDotClass(env)
+                  getEnvironmentDotClass(environment)
                 ),
                 "aria-hidden": true
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: getEnvironmentLabel(env, labels) })
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-[5.5rem] truncate", children: getEnvironmentLabel(environment, labels) })
           ]
-        },
-        env
-      )) })
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        DropdownMenuContent,
+        {
+          side,
+          align,
+          sideOffset: miniMenuContentDefaults.sideOffset,
+          collisionPadding: miniMenuContentDefaults.collisionPadding,
+          className: miniMenuContentClassName,
+          children: environments.map((env) => /* @__PURE__ */ jsxRuntime.jsxs(
+            DropdownMenuItem,
+            {
+              onClick: () => handleSelect(env),
+              className: cn(
+                "gap-2 cursor-pointer",
+                environment === env && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "span",
+                  {
+                    className: cn(
+                      "rounded-full shrink-0 ring-1 ring-background",
+                      sizes.dot,
+                      getEnvironmentDotClass(env)
+                    ),
+                    "aria-hidden": true
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: getEnvironmentLabel(env, labels) })
+              ]
+            },
+            env
+          ))
+        }
+      )
     ] });
   }
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -5860,6 +5880,52 @@ function UpcomingEvents({
     );
   }) });
 }
+function TooltipProvider({
+  delayDuration = 0,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TooltipPrimitive__namespace.Provider,
+    {
+      "data-slot": "tooltip-provider",
+      delayDuration,
+      ...props
+    }
+  );
+}
+function Tooltip({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { "data-slot": "tooltip", ...props }) });
+}
+function TooltipTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { "data-slot": "tooltip-trigger", ...props });
+}
+function TooltipContent({
+  className,
+  sideOffset = 0,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+    TooltipPrimitive__namespace.Content,
+    {
+      "data-slot": "tooltip-content",
+      sideOffset,
+      className: cn(
+        "bg-foreground text-background 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 px-3 py-1.5 text-xs text-balance",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
+      ]
+    }
+  ) });
+}
 function CalendarSubscribeButton({
   feedUrl,
   label
@@ -8180,15 +8246,18 @@ exports.DropdownMenuSub = DropdownMenuSub;
 exports.DropdownMenuSubContent = DropdownMenuSubContent;
 exports.DropdownMenuSubTrigger = DropdownMenuSubTrigger;
 exports.DropdownMenuTrigger = DropdownMenuTrigger;
+exports.EmptyState = EmptyState;
 exports.EnvironmentBanner = EnvironmentBanner;
 exports.EnvironmentContext = EnvironmentContext;
 exports.EnvironmentDot = EnvironmentDot;
 exports.EnvironmentMiniBadge = EnvironmentMiniBadge;
 exports.EnvironmentSwitcher = EnvironmentSwitcher;
+exports.ErrorState = ErrorState;
 exports.EventDialog = EventDialog;
 exports.EventRsvpBadge = EventRsvpBadge;
 exports.LanguageContext = LanguageContext;
 exports.LanguageSwitcher = LanguageSwitcher;
+exports.LoadingState = LoadingState;
 exports.MiniCalendar = MiniCalendar;
 exports.NotificationsContext = NotificationsContext;
 exports.NotificationsWidget = NotificationsWidget;