@pos-360/horizon 0.31.5 → 0.32.0

package/dist/{chunk-NYK4ZRT4.mjs → chunk-3MHQL6O7.mjs}

@@ -1017,11 +1017,18 @@ var SelectBar = React11.forwardRef(({
               if (multiple) {
                 const checked = activeMulti.includes(option.value);
                 return /* @__PURE__ */ jsxs(
-                  "button",
+                  "div",
                   {
-                    type: "button",
-                    disabled: option.disabled,
-                    onClick: () => handleMultiToggle(option.value),
+                    role: "option",
+                    "aria-selected": checked,
+                    onClick: () => !option.disabled && handleMultiToggle(option.value),
+                    onKeyDown: (e) => {
+                      if (e.key === "Enter" || e.key === " ") {
+                        e.preventDefault();
+                        if (!option.disabled) handleMultiToggle(option.value);
+                      }
+                    },
+                    tabIndex: option.disabled ? -1 : 0,
                     className: cn(
                       "relative flex w-full cursor-default select-none items-center gap-2 rounded-hz-md py-1.5 px-2 text-sm outline-none transition-colors",
                       "hover:bg-black/5 dark:hover:bg-white/10",
@@ -1029,23 +1036,16 @@ var SelectBar = React11.forwardRef(({
                     ),
                     children: [
                       /* @__PURE__ */ jsx(
-                        CheckboxPrimitive.Root,
+                        "div",
                         {
-                          checked,
-                          tabIndex: -1,
                           className: cn(
-                            "peer h-4 w-4 shrink-0 rounded-hz-sm border border-gray-300 bg-transparent shadow focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-blue-600 data-[state=checked]:border-blue-600 data-[state=checked]:text-white dark:border-neutral-600 dark:data-[state=checked]:bg-blue-600"
+                            "h-4 w-4 shrink-0 rounded-sm border shadow flex items-center justify-center",
+                            checked ? "bg-blue-600 border-blue-600 text-white dark:bg-blue-600" : "border-gray-300 bg-transparent dark:border-neutral-600"
                           ),
-                          style: { pointerEvents: "none" },
-                          children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ jsx(
-                            Check,
-                            {
-                              className: "h-3.5 w-3.5",
-                              strokeWidth: 3
-                            }
-                          ) })
+                          children: checked && /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5", strokeWidth: 3 })
                         }
                       ),
+                      option.icon && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: option.icon }),
                       /* @__PURE__ */ jsx("span", { className: "truncate", children: option.label })
                     ]
                   },
@@ -1060,13 +1060,17 @@ var SelectBar = React11.forwardRef(({
                   disabled: option.disabled,
                   onClick: () => handleSingleSelect(option.value),
                   className: cn(
-                    "relative flex w-full cursor-default select-none items-center rounded-hz-md py-1.5 pl-2 pr-8 text-sm outline-none transition-colors",
+                    "relative flex w-full cursor-default select-none items-center gap-2 rounded-hz-md py-1.5 px-2 text-sm outline-none transition-colors",
                     "hover:bg-black/5 dark:hover:bg-white/10",
                     option.disabled && "pointer-events-none opacity-50"
                   ),
                   children: [
-                    /* @__PURE__ */ jsx("span", { className: "truncate", children: option.label }),
-                    selected && /* @__PURE__ */ jsx("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) })
+                    /* @__PURE__ */ jsx("span", { className: cn(
+                      "h-4 w-4 shrink-0 flex items-center justify-center",
+                      selected ? "text-blue-600 dark:text-blue-400" : "text-transparent"
+                    ), children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }),
+                    option.icon && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: option.icon }),
+                    /* @__PURE__ */ jsx("span", { className: "truncate", children: option.label })
                   ]
                 },
                 option.value
@@ -3662,5 +3666,5 @@ function PeriodComparisonSelector({
 }
 
 export { Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColumnSelection, DEFAULT_COMPARISON_PERIODS, DEFAULT_PRESETS, DEFAULT_TIME_RANGE, DateRangePicker, DateRangePickerMobile, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormLabel, FormMessage, MobileDataCard, PeriodComparisonSelector, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, SegmentedControl, Select, SelectBar, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, Skeleton, SkeletonAvatar, SkeletonBadge, SkeletonButton, SkeletonCard, SkeletonIcon, SkeletonInput, SkeletonSubtitle, SkeletonTableRow, SkeletonTableRows, SkeletonText, SkeletonTitle, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, TableRowCheckbox, TableSelectAll, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toggle, buttonVariants, segmentedControlItemVariants, segmentedControlVariants, separatorVariants, switchLabelVariants, switchThumbVariants, switchTrackVariants, toggleGroupVariants, toggleItemVariants, useColumnVisibility, useFormContext, useFormFieldContext, useTableSelection };
-//# sourceMappingURL=chunk-NYK4ZRT4.mjs.map
-//# sourceMappingURL=chunk-NYK4ZRT4.mjs.map
+//# sourceMappingURL=chunk-3MHQL6O7.mjs.map
+//# sourceMappingURL=chunk-3MHQL6O7.mjs.map