@algenium/blocks 1.7.0 → 1.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -7,13 +7,13 @@ var framerMotion = require('framer-motion');
7
7
  var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
8
8
  var jsxRuntime = require('react/jsx-runtime');
9
9
  var reactSlot = require('@radix-ui/react-slot');
10
- var TooltipPrimitive = require('@radix-ui/react-tooltip');
11
10
  var SliderPrimitive = require('@radix-ui/react-slider');
12
11
  var TogglePrimitive = require('@radix-ui/react-toggle');
13
12
  var DialogPrimitive = require('@radix-ui/react-dialog');
14
13
  var vaul = require('vaul');
15
14
  var PopoverPrimitive = require('@radix-ui/react-popover');
16
15
  var ScrollAreaPrimitive = require('@radix-ui/react-scroll-area');
16
+ var TooltipPrimitive = require('@radix-ui/react-tooltip');
17
17
  var dateFns = require('date-fns');
18
18
  var reactDayPicker = require('react-day-picker');
19
19
  var valid = require('card-validator');
@@ -40,12 +40,12 @@ function _interopNamespace(e) {
40
40
 
41
41
  var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
42
42
  var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(DropdownMenuPrimitive);
43
- var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
44
43
  var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
45
44
  var TogglePrimitive__namespace = /*#__PURE__*/_interopNamespace(TogglePrimitive);
46
45
  var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
47
46
  var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
48
47
  var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPrimitive);
48
+ var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
49
49
  var valid__default = /*#__PURE__*/_interopDefault(valid);
50
50
 
51
51
  var CalendarContext = React2.createContext(null);
@@ -3115,6 +3115,11 @@ var twMerge = /* @__PURE__ */ createTailwindMerge(getDefaultConfig);
3115
3115
  function cn(...inputs) {
3116
3116
  return twMerge(clsx(inputs));
3117
3117
  }
3118
+ var miniMenuContentClassName = "max-h-none overflow-x-visible overflow-y-visible";
3119
+ var miniMenuContentDefaults = {
3120
+ sideOffset: 8,
3121
+ collisionPadding: 12
3122
+ };
3118
3123
  function DropdownMenu({
3119
3124
  ...props
3120
3125
  }) {
@@ -3413,52 +3418,6 @@ function Button({
3413
3418
  }
3414
3419
  );
3415
3420
  }
3416
- function TooltipProvider({
3417
- delayDuration = 0,
3418
- ...props
3419
- }) {
3420
- return /* @__PURE__ */ jsxRuntime.jsx(
3421
- TooltipPrimitive__namespace.Provider,
3422
- {
3423
- "data-slot": "tooltip-provider",
3424
- delayDuration,
3425
- ...props
3426
- }
3427
- );
3428
- }
3429
- function Tooltip({
3430
- ...props
3431
- }) {
3432
- return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { "data-slot": "tooltip", ...props }) });
3433
- }
3434
- function TooltipTrigger({
3435
- ...props
3436
- }) {
3437
- return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { "data-slot": "tooltip-trigger", ...props });
3438
- }
3439
- function TooltipContent({
3440
- className,
3441
- sideOffset = 0,
3442
- children,
3443
- ...props
3444
- }) {
3445
- return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
3446
- TooltipPrimitive__namespace.Content,
3447
- {
3448
- "data-slot": "tooltip-content",
3449
- sideOffset,
3450
- className: cn(
3451
- "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",
3452
- className
3453
- ),
3454
- ...props,
3455
- children: [
3456
- children,
3457
- /* @__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]" })
3458
- ]
3459
- }
3460
- ) });
3461
- }
3462
3421
  var defaultLabels = {
3463
3422
  theme: "Theme",
3464
3423
  system: "System",
@@ -3502,11 +3461,8 @@ function ThemeSwitcher({
3502
3461
  size = "sm",
3503
3462
  shape = "rounded",
3504
3463
  variant = "default",
3505
- align = "center",
3506
- side = "top",
3507
- tooltipSide = "bottom",
3508
- tooltipAlign = "center",
3509
- tooltipSideOffset = 8,
3464
+ align = "end",
3465
+ side = "bottom",
3510
3466
  labels: userLabels
3511
3467
  }) {
3512
3468
  const { theme, setTheme } = nextThemes.useTheme();
@@ -3540,43 +3496,42 @@ function ThemeSwitcher({
3540
3496
  const CurrentIcon = themes.find((t) => t.key === currentTheme)?.icon || lucideReact.Monitor;
3541
3497
  if (variant === "mini") {
3542
3498
  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { modal: false, children: [
3543
- /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
3544
- /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
3545
- Button,
3546
- {
3547
- "data-testid": "theme-switcher",
3548
- variant: "ghost",
3549
- size: "icon",
3550
- "aria-label": labels.theme,
3551
- className: cn(sizes.buttonMini, shapeClass, className),
3552
- children: /* @__PURE__ */ jsxRuntime.jsx(CurrentIcon, { className: sizes.iconMini })
3553
- }
3554
- ) }) }),
3555
- /* @__PURE__ */ jsxRuntime.jsx(
3556
- TooltipContent,
3557
- {
3558
- side: tooltipSide,
3559
- align: tooltipAlign,
3560
- sideOffset: tooltipSideOffset,
3561
- children: labels.theme
3562
- }
3563
- )
3564
- ] }),
3565
- /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuContent, { side, align, sideOffset: 8, children: themes.map(({ key, icon: Icon }) => /* @__PURE__ */ jsxRuntime.jsxs(
3566
- DropdownMenuItem,
3499
+ /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
3500
+ Button,
3567
3501
  {
3568
- onClick: () => handleThemeClick(key),
3569
- className: cn(
3570
- "gap-2 cursor-pointer",
3571
- currentTheme === key && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
3572
- ),
3573
- children: [
3574
- /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-4 w-4" }),
3575
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: labels[key] })
3576
- ]
3577
- },
3578
- key
3579
- )) })
3502
+ "data-testid": "theme-switcher",
3503
+ variant: "ghost",
3504
+ size: "icon",
3505
+ "aria-label": labels.theme,
3506
+ className: cn(sizes.buttonMini, shapeClass, className),
3507
+ children: /* @__PURE__ */ jsxRuntime.jsx(CurrentIcon, { className: sizes.iconMini })
3508
+ }
3509
+ ) }),
3510
+ /* @__PURE__ */ jsxRuntime.jsx(
3511
+ DropdownMenuContent,
3512
+ {
3513
+ side,
3514
+ align,
3515
+ sideOffset: miniMenuContentDefaults.sideOffset,
3516
+ collisionPadding: miniMenuContentDefaults.collisionPadding,
3517
+ className: miniMenuContentClassName,
3518
+ children: themes.map(({ key, icon: Icon }) => /* @__PURE__ */ jsxRuntime.jsxs(
3519
+ DropdownMenuItem,
3520
+ {
3521
+ onClick: () => handleThemeClick(key),
3522
+ className: cn(
3523
+ "gap-2 cursor-pointer",
3524
+ currentTheme === key && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
3525
+ ),
3526
+ children: [
3527
+ /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-4 w-4" }),
3528
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: labels[key] })
3529
+ ]
3530
+ },
3531
+ key
3532
+ ))
3533
+ }
3534
+ )
3580
3535
  ] });
3581
3536
  }
3582
3537
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -3670,11 +3625,8 @@ function LanguageSwitcher({
3670
3625
  shape = "rounded",
3671
3626
  variant = "default",
3672
3627
  showIcon = true,
3673
- align = "center",
3674
- side = "top",
3675
- tooltipSide = "bottom",
3676
- tooltipAlign = "center",
3677
- tooltipSideOffset = 8
3628
+ align = "end",
3629
+ side = "bottom"
3678
3630
  }) {
3679
3631
  const context = useLanguageContext();
3680
3632
  const contextLanguages = context?.languages?.map((lang) => ({
@@ -3692,34 +3644,24 @@ function LanguageSwitcher({
3692
3644
  };
3693
3645
  if (variant === "mini") {
3694
3646
  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { modal: false, children: [
3695
- /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
3696
- /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
3697
- Button,
3698
- {
3699
- variant: "ghost",
3700
- size: "icon",
3701
- "aria-label": defaultLabels4.language,
3702
- className: cn(sizes.buttonMini, shapeClass, className),
3703
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Languages, { className: sizes.iconMini })
3704
- }
3705
- ) }) }),
3706
- /* @__PURE__ */ jsxRuntime.jsx(
3707
- TooltipContent,
3708
- {
3709
- side: tooltipSide,
3710
- align: tooltipAlign,
3711
- sideOffset: tooltipSideOffset,
3712
- children: defaultLabels4.language
3713
- }
3714
- )
3715
- ] }),
3647
+ /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
3648
+ Button,
3649
+ {
3650
+ variant: "ghost",
3651
+ size: "icon",
3652
+ "aria-label": defaultLabels4.language,
3653
+ className: cn(sizes.buttonMini, shapeClass, className),
3654
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Languages, { className: sizes.iconMini })
3655
+ }
3656
+ ) }),
3716
3657
  /* @__PURE__ */ jsxRuntime.jsx(
3717
3658
  DropdownMenuContent,
3718
3659
  {
3719
3660
  side,
3720
3661
  align,
3721
- sideOffset: 8,
3722
- className: "min-w-0 w-auto",
3662
+ sideOffset: miniMenuContentDefaults.sideOffset,
3663
+ collisionPadding: miniMenuContentDefaults.collisionPadding,
3664
+ className: cn(miniMenuContentClassName, "min-w-0 w-auto"),
3723
3665
  children: languages.map(({ key, nativeName }) => /* @__PURE__ */ jsxRuntime.jsx(
3724
3666
  DropdownMenuItem,
3725
3667
  {
@@ -3919,10 +3861,7 @@ function EnvironmentSwitcher({
3919
3861
  shape = "rounded",
3920
3862
  variant = "mini",
3921
3863
  align = "end",
3922
- side = "bottom",
3923
- tooltipSide = "bottom",
3924
- tooltipAlign = "center",
3925
- tooltipSideOffset = 8
3864
+ side = "bottom"
3926
3865
  }) {
3927
3866
  const ctx = useEnvironmentContext();
3928
3867
  const labels = { ...defaultLabels2, ...userLabels };
@@ -3938,53 +3877,18 @@ function EnvironmentSwitcher({
3938
3877
  };
3939
3878
  if (variant === "mini") {
3940
3879
  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { modal: false, children: [
3941
- /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
3942
- /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
3943
- Button,
3944
- {
3945
- "data-testid": "environment-switcher",
3946
- variant: "outline",
3947
- size: "sm",
3948
- "aria-label": labels.environment,
3949
- className: cn(
3950
- sizes.buttonMini,
3951
- shapeClass,
3952
- "font-medium tabular-nums border-border bg-background",
3953
- className
3954
- ),
3955
- children: [
3956
- /* @__PURE__ */ jsxRuntime.jsx(
3957
- "span",
3958
- {
3959
- className: cn(
3960
- "rounded-full shrink-0 ring-1 ring-background",
3961
- sizes.dot,
3962
- getEnvironmentDotClass(environment)
3963
- ),
3964
- "aria-hidden": true
3965
- }
3966
- ),
3967
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-[5.5rem] truncate", children: getEnvironmentLabel(environment, labels) })
3968
- ]
3969
- }
3970
- ) }) }),
3971
- /* @__PURE__ */ jsxRuntime.jsx(
3972
- TooltipContent,
3973
- {
3974
- side: tooltipSide,
3975
- align: tooltipAlign,
3976
- sideOffset: tooltipSideOffset,
3977
- children: labels.environment
3978
- }
3979
- )
3980
- ] }),
3981
- /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuContent, { side, align, sideOffset: 8, children: environments.map((env) => /* @__PURE__ */ jsxRuntime.jsxs(
3982
- DropdownMenuItem,
3880
+ /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
3881
+ Button,
3983
3882
  {
3984
- onClick: () => handleSelect(env),
3883
+ "data-testid": "environment-switcher",
3884
+ variant: "outline",
3885
+ size: "sm",
3886
+ "aria-label": labels.environment,
3985
3887
  className: cn(
3986
- "gap-2 cursor-pointer",
3987
- environment === env && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
3888
+ sizes.buttonMini,
3889
+ shapeClass,
3890
+ "font-medium tabular-nums border-border bg-background",
3891
+ className
3988
3892
  ),
3989
3893
  children: [
3990
3894
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -3993,16 +3897,50 @@ function EnvironmentSwitcher({
3993
3897
  className: cn(
3994
3898
  "rounded-full shrink-0 ring-1 ring-background",
3995
3899
  sizes.dot,
3996
- getEnvironmentDotClass(env)
3900
+ getEnvironmentDotClass(environment)
3997
3901
  ),
3998
3902
  "aria-hidden": true
3999
3903
  }
4000
3904
  ),
4001
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: getEnvironmentLabel(env, labels) })
3905
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-[5.5rem] truncate", children: getEnvironmentLabel(environment, labels) })
4002
3906
  ]
4003
- },
4004
- env
4005
- )) })
3907
+ }
3908
+ ) }),
3909
+ /* @__PURE__ */ jsxRuntime.jsx(
3910
+ DropdownMenuContent,
3911
+ {
3912
+ side,
3913
+ align,
3914
+ sideOffset: miniMenuContentDefaults.sideOffset,
3915
+ collisionPadding: miniMenuContentDefaults.collisionPadding,
3916
+ className: miniMenuContentClassName,
3917
+ children: environments.map((env) => /* @__PURE__ */ jsxRuntime.jsxs(
3918
+ DropdownMenuItem,
3919
+ {
3920
+ onClick: () => handleSelect(env),
3921
+ className: cn(
3922
+ "gap-2 cursor-pointer",
3923
+ environment === env && "bg-accent text-accent-foreground [&_svg]:text-accent-foreground"
3924
+ ),
3925
+ children: [
3926
+ /* @__PURE__ */ jsxRuntime.jsx(
3927
+ "span",
3928
+ {
3929
+ className: cn(
3930
+ "rounded-full shrink-0 ring-1 ring-background",
3931
+ sizes.dot,
3932
+ getEnvironmentDotClass(env)
3933
+ ),
3934
+ "aria-hidden": true
3935
+ }
3936
+ ),
3937
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: getEnvironmentLabel(env, labels) })
3938
+ ]
3939
+ },
3940
+ env
3941
+ ))
3942
+ }
3943
+ )
4006
3944
  ] });
4007
3945
  }
4008
3946
  return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -5860,6 +5798,52 @@ function UpcomingEvents({
5860
5798
  );
5861
5799
  }) });
5862
5800
  }
5801
+ function TooltipProvider({
5802
+ delayDuration = 0,
5803
+ ...props
5804
+ }) {
5805
+ return /* @__PURE__ */ jsxRuntime.jsx(
5806
+ TooltipPrimitive__namespace.Provider,
5807
+ {
5808
+ "data-slot": "tooltip-provider",
5809
+ delayDuration,
5810
+ ...props
5811
+ }
5812
+ );
5813
+ }
5814
+ function Tooltip({
5815
+ ...props
5816
+ }) {
5817
+ return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { "data-slot": "tooltip", ...props }) });
5818
+ }
5819
+ function TooltipTrigger({
5820
+ ...props
5821
+ }) {
5822
+ return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { "data-slot": "tooltip-trigger", ...props });
5823
+ }
5824
+ function TooltipContent({
5825
+ className,
5826
+ sideOffset = 0,
5827
+ children,
5828
+ ...props
5829
+ }) {
5830
+ return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
5831
+ TooltipPrimitive__namespace.Content,
5832
+ {
5833
+ "data-slot": "tooltip-content",
5834
+ sideOffset,
5835
+ className: cn(
5836
+ "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",
5837
+ className
5838
+ ),
5839
+ ...props,
5840
+ children: [
5841
+ children,
5842
+ /* @__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]" })
5843
+ ]
5844
+ }
5845
+ ) });
5846
+ }
5863
5847
  function CalendarSubscribeButton({
5864
5848
  feedUrl,
5865
5849
  label