@algenium/blocks 1.7.0 → 1.8.0

package/dist/index.d.cts

@@ -215,16 +215,16 @@ type ThemeSwitcherProps = {
     align?: "start" | "center" | "end";
     /** Dropdown side (for mini variant) */
     side?: "top" | "bottom" | "left" | "right";
-    /** Tooltip position relative to the mini trigger (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSide?: "top" | "right" | "bottom" | "left";
-    /** Tooltip alignment (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipAlign?: "start" | "center" | "end";
-    /** Tooltip offset from the trigger in px (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSideOffset?: number;
     /** Translation labels - consumers can pass their own t() values */
     labels?: ThemeSwitcherLabels;
 };
-declare function ThemeSwitcher({ className, size, shape, variant, align, side, tooltipSide, tooltipAlign, tooltipSideOffset, labels: userLabels, }: ThemeSwitcherProps): react_jsx_runtime.JSX.Element;
+declare function ThemeSwitcher({ className, size, shape, variant, align, side, labels: userLabels, }: ThemeSwitcherProps): react_jsx_runtime.JSX.Element;
 
 type Language = {
     /** Language key/code (e.g., "en", "es") */
@@ -274,14 +274,14 @@ type LanguageSwitcherProps = {
     align?: "start" | "center" | "end";
     /** Dropdown side */
     side?: "top" | "bottom" | "left" | "right";
-    /** Tooltip position relative to the mini trigger (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSide?: "top" | "right" | "bottom" | "left";
-    /** Tooltip alignment (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipAlign?: "start" | "center" | "end";
-    /** Tooltip offset from the trigger in px (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSideOffset?: number;
 };
-declare function LanguageSwitcher({ languages: propLanguages, currentLanguage: propCurrentLanguage, onLanguageChange: propOnLanguageChange, labels, className, size, shape, variant, showIcon, align, side, tooltipSide, tooltipAlign, tooltipSideOffset, }: LanguageSwitcherProps): react_jsx_runtime.JSX.Element;
+declare function LanguageSwitcher({ languages: propLanguages, currentLanguage: propCurrentLanguage, onLanguageChange: propOnLanguageChange, labels, className, size, shape, variant, showIcon, align, side, }: LanguageSwitcherProps): react_jsx_runtime.JSX.Element;
 
 type EnvironmentSwitcherLabels = {
     /** Tooltip / aria for the control */
@@ -336,11 +336,14 @@ type EnvironmentSwitcherProps = {
     variant?: "default" | "mini";
     align?: "start" | "center" | "end";
     side?: "top" | "bottom" | "left" | "right";
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSide?: "top" | "right" | "bottom" | "left";
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipAlign?: "start" | "center" | "end";
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSideOffset?: number;
 };
-declare function EnvironmentSwitcher({ className, environment: propEnvironment, onEnvironmentChange: propOnEnvironmentChange, environments: propEnvironments, labels: userLabels, size, shape, variant, align, side, tooltipSide, tooltipAlign, tooltipSideOffset, }: EnvironmentSwitcherProps): react_jsx_runtime.JSX.Element;
+declare function EnvironmentSwitcher({ className, environment: propEnvironment, onEnvironmentChange: propOnEnvironmentChange, environments: propEnvironments, labels: userLabels, size, shape, variant, align, side, }: EnvironmentSwitcherProps): react_jsx_runtime.JSX.Element;
 
 type EnvironmentBannerLabels = {
     stagingMessage?: string;

package/dist/index.d.ts

@@ -215,16 +215,16 @@ type ThemeSwitcherProps = {
     align?: "start" | "center" | "end";
     /** Dropdown side (for mini variant) */
     side?: "top" | "bottom" | "left" | "right";
-    /** Tooltip position relative to the mini trigger (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSide?: "top" | "right" | "bottom" | "left";
-    /** Tooltip alignment (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipAlign?: "start" | "center" | "end";
-    /** Tooltip offset from the trigger in px (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSideOffset?: number;
     /** Translation labels - consumers can pass their own t() values */
     labels?: ThemeSwitcherLabels;
 };
-declare function ThemeSwitcher({ className, size, shape, variant, align, side, tooltipSide, tooltipAlign, tooltipSideOffset, labels: userLabels, }: ThemeSwitcherProps): react_jsx_runtime.JSX.Element;
+declare function ThemeSwitcher({ className, size, shape, variant, align, side, labels: userLabels, }: ThemeSwitcherProps): react_jsx_runtime.JSX.Element;
 
 type Language = {
     /** Language key/code (e.g., "en", "es") */
@@ -274,14 +274,14 @@ type LanguageSwitcherProps = {
     align?: "start" | "center" | "end";
     /** Dropdown side */
     side?: "top" | "bottom" | "left" | "right";
-    /** Tooltip position relative to the mini trigger (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSide?: "top" | "right" | "bottom" | "left";
-    /** Tooltip alignment (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipAlign?: "start" | "center" | "end";
-    /** Tooltip offset from the trigger in px (mini variant only) */
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSideOffset?: number;
 };
-declare function LanguageSwitcher({ languages: propLanguages, currentLanguage: propCurrentLanguage, onLanguageChange: propOnLanguageChange, labels, className, size, shape, variant, showIcon, align, side, tooltipSide, tooltipAlign, tooltipSideOffset, }: LanguageSwitcherProps): react_jsx_runtime.JSX.Element;
+declare function LanguageSwitcher({ languages: propLanguages, currentLanguage: propCurrentLanguage, onLanguageChange: propOnLanguageChange, labels, className, size, shape, variant, showIcon, align, side, }: LanguageSwitcherProps): react_jsx_runtime.JSX.Element;
 
 type EnvironmentSwitcherLabels = {
     /** Tooltip / aria for the control */
@@ -336,11 +336,14 @@ type EnvironmentSwitcherProps = {
     variant?: "default" | "mini";
     align?: "start" | "center" | "end";
     side?: "top" | "bottom" | "left" | "right";
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSide?: "top" | "right" | "bottom" | "left";
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipAlign?: "start" | "center" | "end";
+    /** @deprecated No longer used; mini variant no longer renders a tooltip. */
     tooltipSideOffset?: number;
 };
-declare function EnvironmentSwitcher({ className, environment: propEnvironment, onEnvironmentChange: propOnEnvironmentChange, environments: propEnvironments, labels: userLabels, size, shape, variant, align, side, tooltipSide, tooltipAlign, tooltipSideOffset, }: EnvironmentSwitcherProps): react_jsx_runtime.JSX.Element;
+declare function EnvironmentSwitcher({ className, environment: propEnvironment, onEnvironmentChange: propOnEnvironmentChange, environments: propEnvironments, labels: userLabels, size, shape, variant, align, side, }: EnvironmentSwitcherProps): react_jsx_runtime.JSX.Element;
 
 type EnvironmentBannerLabels = {
     stagingMessage?: string;

package/dist/index.js

@@ -6,13 +6,13 @@ import { AnimatePresence, motion } from 'framer-motion';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
-import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import * as SliderPrimitive from '@radix-ui/react-slider';
 import * as TogglePrimitive from '@radix-ui/react-toggle';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { Drawer as Drawer$1 } from 'vaul';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { startOfMonth, endOfMonth, eachDayOfInterval, endOfWeek, startOfWeek, format, isSameDay, subMonths, addMonths } from 'date-fns';
 import { DayPicker } from 'react-day-picker';
 import valid from 'card-validator';
@@ -3084,6 +3084,11 @@ var twMerge = /* @__PURE__ */ createTailwindMerge(getDefaultConfig);
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+var miniMenuContentClassName = "max-h-none overflow-x-visible overflow-y-visible";
+var miniMenuContentDefaults = {
+  sideOffset: 8,
+  collisionPadding: 12
+};
 function DropdownMenu({
   ...props
 }) {
@@ -3382,52 +3387,6 @@ function Button({
     }
   );
 }
-function TooltipProvider({
-  delayDuration = 0,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    TooltipPrimitive.Provider,
-    {
-      "data-slot": "tooltip-provider",
-      delayDuration,
-      ...props
-    }
-  );
-}
-function Tooltip({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
-}
-function TooltipTrigger({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
-}
-function TooltipContent({
-  className,
-  sideOffset = 0,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
-    TooltipPrimitive.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__ */ jsx(TooltipPrimitive.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",
@@ -3471,11 +3430,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 } = useTheme();
@@ -3509,43 +3465,42 @@ function ThemeSwitcher({
   const CurrentIcon = themes.find((t) => t.key === currentTheme)?.icon || Monitor;
   if (variant === "mini") {
     return /* @__PURE__ */ jsxs(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ jsxs(Tooltip, { children: [
-        /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-          Button,
-          {
-            "data-testid": "theme-switcher",
-            variant: "ghost",
-            size: "icon",
-            "aria-label": labels.theme,
-            className: cn(sizes.buttonMini, shapeClass, className),
-            children: /* @__PURE__ */ jsx(CurrentIcon, { className: sizes.iconMini })
-          }
-        ) }) }),
-        /* @__PURE__ */ jsx(
-          TooltipContent,
-          {
-            side: tooltipSide,
-            align: tooltipAlign,
-            sideOffset: tooltipSideOffset,
-            children: labels.theme
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx(DropdownMenuContent, { side, align, sideOffset: 8, children: themes.map(({ key, icon: Icon }) => /* @__PURE__ */ jsxs(
-        DropdownMenuItem,
+      /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        Button,
         {
-          onClick: () => handleThemeClick(key),
-          className: cn(
-            "gap-2 cursor-pointer",
-            currentTheme === key && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
-          ),
-          children: [
-            /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }),
-            /* @__PURE__ */ 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__ */ jsx(CurrentIcon, { className: sizes.iconMini })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        DropdownMenuContent,
+        {
+          side,
+          align,
+          sideOffset: miniMenuContentDefaults.sideOffset,
+          collisionPadding: miniMenuContentDefaults.collisionPadding,
+          className: miniMenuContentClassName,
+          children: themes.map(({ key, icon: Icon }) => /* @__PURE__ */ jsxs(
+            DropdownMenuItem,
+            {
+              onClick: () => handleThemeClick(key),
+              className: cn(
+                "gap-2 cursor-pointer",
+                currentTheme === key && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }),
+                /* @__PURE__ */ jsx("span", { children: labels[key] })
+              ]
+            },
+            key
+          ))
+        }
+      )
     ] });
   }
   return /* @__PURE__ */ jsx(
@@ -3639,11 +3594,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) => ({
@@ -3661,34 +3613,24 @@ function LanguageSwitcher({
   };
   if (variant === "mini") {
     return /* @__PURE__ */ jsxs(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ jsxs(Tooltip, { children: [
-        /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "ghost",
-            size: "icon",
-            "aria-label": defaultLabels4.language,
-            className: cn(sizes.buttonMini, shapeClass, className),
-            children: /* @__PURE__ */ jsx(Languages, { className: sizes.iconMini })
-          }
-        ) }) }),
-        /* @__PURE__ */ jsx(
-          TooltipContent,
-          {
-            side: tooltipSide,
-            align: tooltipAlign,
-            sideOffset: tooltipSideOffset,
-            children: defaultLabels4.language
-          }
-        )
-      ] }),
+      /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          "aria-label": defaultLabels4.language,
+          className: cn(sizes.buttonMini, shapeClass, className),
+          children: /* @__PURE__ */ jsx(Languages, { className: sizes.iconMini })
+        }
+      ) }),
       /* @__PURE__ */ 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__ */ jsx(
             DropdownMenuItem,
             {
@@ -3888,10 +3830,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 };
@@ -3907,53 +3846,18 @@ function EnvironmentSwitcher({
   };
   if (variant === "mini") {
     return /* @__PURE__ */ jsxs(DropdownMenu, { modal: false, children: [
-      /* @__PURE__ */ jsxs(Tooltip, { children: [
-        /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ 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__ */ jsx(
-                "span",
-                {
-                  className: cn(
-                    "rounded-full shrink-0 ring-1 ring-background",
-                    sizes.dot,
-                    getEnvironmentDotClass(environment)
-                  ),
-                  "aria-hidden": true
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { className: "max-w-[5.5rem] truncate", children: getEnvironmentLabel(environment, labels) })
-            ]
-          }
-        ) }) }),
-        /* @__PURE__ */ jsx(
-          TooltipContent,
-          {
-            side: tooltipSide,
-            align: tooltipAlign,
-            sideOffset: tooltipSideOffset,
-            children: labels.environment
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx(DropdownMenuContent, { side, align, sideOffset: 8, children: environments.map((env) => /* @__PURE__ */ jsxs(
-        DropdownMenuItem,
+      /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ 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__ */ jsx(
@@ -3962,16 +3866,50 @@ function EnvironmentSwitcher({
                 className: cn(
                   "rounded-full shrink-0 ring-1 ring-background",
                   sizes.dot,
-                  getEnvironmentDotClass(env)
+                  getEnvironmentDotClass(environment)
                 ),
                 "aria-hidden": true
               }
             ),
-            /* @__PURE__ */ jsx("span", { children: getEnvironmentLabel(env, labels) })
+            /* @__PURE__ */ jsx("span", { className: "max-w-[5.5rem] truncate", children: getEnvironmentLabel(environment, labels) })
           ]
-        },
-        env
-      )) })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        DropdownMenuContent,
+        {
+          side,
+          align,
+          sideOffset: miniMenuContentDefaults.sideOffset,
+          collisionPadding: miniMenuContentDefaults.collisionPadding,
+          className: miniMenuContentClassName,
+          children: environments.map((env) => /* @__PURE__ */ jsxs(
+            DropdownMenuItem,
+            {
+              onClick: () => handleSelect(env),
+              className: cn(
+                "gap-2 cursor-pointer",
+                environment === env && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: cn(
+                      "rounded-full shrink-0 ring-1 ring-background",
+                      sizes.dot,
+                      getEnvironmentDotClass(env)
+                    ),
+                    "aria-hidden": true
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { children: getEnvironmentLabel(env, labels) })
+              ]
+            },
+            env
+          ))
+        }
+      )
     ] });
   }
   return /* @__PURE__ */ jsxs(
@@ -5829,6 +5767,52 @@ function UpcomingEvents({
     );
   }) });
 }
+function TooltipProvider({
+  delayDuration = 0,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    TooltipPrimitive.Provider,
+    {
+      "data-slot": "tooltip-provider",
+      delayDuration,
+      ...props
+    }
+  );
+}
+function Tooltip({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
+}
+function TooltipTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+}
+function TooltipContent({
+  className,
+  sideOffset = 0,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
+    TooltipPrimitive.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__ */ jsx(TooltipPrimitive.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
+      ]
+    }
+  ) });
+}
 function CalendarSubscribeButton({
   feedUrl,
   label