@mlw-packages/react-components 1.10.29 → 1.10.31

package/dist/index.js

@@ -9795,14 +9795,92 @@ function DroppableCellAgenda({
     }
   );
 }
+var PEEK_HEIGHT = 22;
+var PADDING = 6;
+function AllDayStack({
+  day,
+  events,
+  expandedDay,
+  onExpand,
+  onEventSelect,
+  noTime
+}) {
+  const isExpanded = expandedDay ? dateFns.isSameDay(expandedDay, day) : false;
+  const containerRef = React32.useRef(null);
+  React32.useEffect(() => {
+    if (!isExpanded) return;
+    const handler = (e) => {
+      if (containerRef.current && !containerRef.current.contains(e.target)) {
+        onExpand(null);
+      }
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [isExpanded, onExpand]);
+  if (events.length === 0) return null;
+  const single = events.length === 1;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: "absolute inset-0",
+      ref: containerRef,
+      style: { zIndex: isExpanded ? 50 : 10 },
+      children: events.map((event, i) => {
+        const top = PADDING + i * PEEK_HEIGHT;
+        const bottom = PADDING;
+        const zIndex = i + 1;
+        return /* @__PURE__ */ jsxRuntime.jsx(TooltipProviderBase, { delayDuration: 400, children: /* @__PURE__ */ jsxRuntime.jsxs(TooltipBase, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(TooltipTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: "absolute left-1.5 right-1.5 cursor-pointer",
+              style: { top, bottom, zIndex },
+              onClick: (e) => {
+                e.stopPropagation();
+                if (isExpanded || single) {
+                  onEventSelect(event, e);
+                } else {
+                  onExpand(day);
+                }
+              },
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                EventItemAgenda,
+                {
+                  event,
+                  isFirstDay: true,
+                  isLastDay: true,
+                  view: "day",
+                  noTime,
+                  className: "flex justify-start items-start rounded-sm py-1 h-full w-full pointer-events-none"
+                }
+              )
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(TooltipContentBase, { side: "top", sideOffset: 6, className: "max-w-[220px] space-y-0.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold text-sm leading-snug", children: event.title }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs opacity-90", children: formatDurationAgenda(event) }),
+            event.location && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ssr.MapPinIcon, { size: 15 }),
+              " ",
+              event.location
+            ] }),
+            event.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs opacity-75 line-clamp-2", children: event.description })
+          ] })
+        ] }) }, event.id);
+      })
+    }
+  );
+}
 function DayViewAgenda({
   currentDate,
   events,
   onEventSelect,
   showUndatedEvents,
   noTime = false,
-  onEventCreate
+  onEventCreate,
+  allDayCell = false
 }) {
+  const [expandedDay, setExpandedDay] = React32.useState(null);
   const hours = React32.useMemo(() => {
     const dayStart = dateFns.startOfDay(currentDate);
     return dateFns.eachHourOfInterval({
@@ -9915,7 +9993,7 @@ function DayViewAgenda({
   const showAllDaySection = allDayEvents.length > 0;
   const { currentTimePosition, currentTimeVisible } = useCurrentTimeIndicatorAgenda(currentDate, "day");
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "contents", "data-slot": "day-view", children: [
-    showAllDaySection && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-border/70 border-t bg-muted/50", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-[3rem_1fr] sm:grid-cols-[4rem_1fr]", children: [
+    showAllDaySection && !allDayCell && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-border/70 border-t bg-muted/50", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-[3rem_1fr] sm:grid-cols-[4rem_1fr]", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative border-border/70 border-r flex items-center justify-center p-1", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-center text-[10px] text-muted-foreground/70 sm:text-xs", children: "Todo Dia" }) }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative border-border/70 border-r p-1 last:border-r-0", children: allDayEvents.map((event) => {
         const eventStart = getEventStartDate(event);
@@ -9962,7 +10040,65 @@ function DayViewAgenda({
         },
         hour.toString()
       )) }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      showAllDaySection && allDayCell ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          AllDayStack,
+          {
+            day: currentDate,
+            events: allDayEvents,
+            expandedDay,
+            onExpand: setExpandedDay,
+            onEventSelect: handleEventClick,
+            noTime
+          }
+        ),
+        currentTimeVisible && /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: "pointer-events-none absolute right-0 left-0 z-20",
+            style: { top: `${currentTimePosition}%` },
+            children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "-left-1 absolute h-2 w-2 rounded-full bg-primary" }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[2px] w-full bg-primary" })
+            ] })
+          }
+        ),
+        hours.map((hour) => {
+          const hourValue = dateFns.getHours(hour);
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: "relative h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
+              children: [0, 1, 2, 3].map((quarter) => {
+                const quarterHourTime = hourValue + quarter * 0.25;
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  DroppableCellAgenda,
+                  {
+                    className: cn(
+                      "absolute h-[calc(var(--week-cells-height)/4)] w-full",
+                      quarter === 0 && "top-0",
+                      quarter === 1 && "top-[calc(var(--week-cells-height)/4)]",
+                      quarter === 2 && "top-[calc(var(--week-cells-height)/4*2)]",
+                      quarter === 3 && "top-[calc(var(--week-cells-height)/4*3)]"
+                    ),
+                    date: currentDate,
+                    id: `day-cell-${currentDate.toISOString()}-${quarterHourTime}`,
+                    onClick: () => {
+                      const startTime = new Date(currentDate);
+                      startTime.setHours(hourValue);
+                      startTime.setMinutes(quarter * 15);
+                      if (onEventCreate) onEventCreate(startTime);
+                    },
+                    time: quarterHourTime
+                  },
+                  `${hour.toString()}-${quarter}`
+                );
+              })
+            },
+            hour.toString()
+          );
+        })
+      ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
         positionedEvents.map((positionedEvent) => {
           const evt = positionedEvent.event;
           const eventStart = new Date(evt.start ?? evt.end ?? Date.now());
@@ -10316,7 +10452,8 @@ function EventAgenda({
   onlyWeek,
   onlyAgenda,
   onlyYear,
-  allowCellClick = true
+  allowCellClick = true,
+  allDayCell = false
 }) {
   const lockedView = onlyDay ? "day" : onlyMonth ? "month" : onlyWeek ? "week" : onlyAgenda ? "agenda" : onlyYear ? "year" : void 0;
   const [currentDate, setCurrentDate] = React32.useState(
@@ -10436,9 +10573,10 @@ function EventAgenda({
       },
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs(CalendarDndProviderAgenda, { onEventUpdate: handleEventUpdate, children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between p-2 sm:p-4", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 sm:gap-4 min-w-0", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center sm:gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 px-2 py-3 sm:flex-row sm:items-center sm:justify-between sm:px-4 sm:py-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-semibold text-base sm:text-lg md:text-xl lg:text-2xl truncate", children: viewTitle }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between sm:justify-end gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
                   ButtonBase,
                   {
@@ -10460,21 +10598,18 @@ function EventAgenda({
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-semibold text-sm sm:text-base md:text-lg lg:text-xl xl:text-2xl min-w-0 truncate sm:whitespace-normal", children: viewTitle })
-            ] }),
-            !lockedView && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(
-              Select,
-              {
-                selected: activeView,
-                onChange: (v) => {
-                  setView(v);
-                },
-                items: selectItems,
-                placeholder: viewLabel(activeView),
-                className: "min-w-24",
-                hideClear: true
-              }
-            ) })
+              !lockedView && /* @__PURE__ */ jsxRuntime.jsx(
+                Select,
+                {
+                  selected: activeView,
+                  onChange: (v) => setView(v),
+                  items: selectItems,
+                  placeholder: viewLabel(activeView),
+                  className: "min-w-24",
+                  hideClear: true
+                }
+              )
+            ] })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col transition-all duration-200 ease-in-out", children: [
             activeView === "month" && /* @__PURE__ */ jsxRuntime.jsx(
@@ -10499,6 +10634,7 @@ function EventAgenda({
                 events,
                 onEventSelect: handleEventSelect,
                 noTime,
+                allDayCell,
                 onEventCreate: allowCellClick ? (d) => onEventUpdate?.({
                   start: d,
                   end: d,
@@ -10514,6 +10650,7 @@ function EventAgenda({
                 events,
                 onEventSelect: handleEventSelect,
                 noTime,
+                allDayCell,
                 onEventCreate: allowCellClick ? (d) => onEventUpdate?.({
                   start: d,
                   end: d,
@@ -11220,10 +11357,12 @@ function WeekViewAgenda({
   currentDate,
   events,
   onEventSelect,
+  allDayCell = false,
   onEventCreate,
   showUndatedEvents,
   noTime = false
 }) {
+  const [expandedDay, setExpandedDay] = React32.useState(null);
   const days = React32.useMemo(() => {
     const weekStart = dateFns.startOfWeek(currentDate, { weekStartsOn: 0 });
     const weekEnd = dateFns.endOfWeek(currentDate, { weekStartsOn: 0 });
@@ -11270,11 +11409,6 @@ function WeekViewAgenda({
     [allDayEvents]
   );
   const rowH = EventHeightAgenda + EventGapAgenda;
-  const allDayBarData = React32.useMemo(() => {
-    const bars = computeMultiDayBars(trueAllDayEvents, days);
-    const maxSlot = bars.length > 0 ? Math.max(...bars.map((b) => b.slot)) : 0;
-    return { bars, sectionH: (maxSlot + 1) * rowH + EventGapAgenda * 2 };
-  }, [trueAllDayEvents, days, rowH]);
   const multiDayBarData = React32.useMemo(() => {
     const bars = computeMultiDayBars(multiDayTimedEvents, days);
     const maxSlot = bars.length > 0 ? Math.max(...bars.map((b) => b.slot)) : 0;
@@ -11395,78 +11529,33 @@ function WeekViewAgenda({
         ))
       ] }),
       showAllDaySection && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border/70 border-b bg-muted/50", children: [
-        trueAllDayEvents.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-8", children: [
+        trueAllDayEvents.length > 0 && !allDayCell && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-8", children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative border-border/70 border-r flex items-center justify-center p-1", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-center text-[10px] text-muted-foreground/70 sm:text-xs", children: "Todo dia" }) }),
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            "div",
-            {
-              className: "col-span-7 relative",
-              style: { height: allDayBarData.sectionH },
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 grid grid-cols-7 pointer-events-none", children: days.map((day) => /* @__PURE__ */ jsxRuntime.jsx(
-                  "div",
+          days.map((day) => {
+            const dayEvents = trueAllDayEvents.filter((event) => {
+              const start = getEventStartDate(event);
+              return start ? dateFns.isSameDay(day, start) : false;
+            });
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: "relative border-r last:border-r-0 border-border/70 overflow-visible py-0.5",
+                "data-today": dateFns.isToday(day) || void 0,
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  AllDayStack,
                   {
-                    className: "border-r last:border-r-0 border-border/70",
-                    "data-today": dateFns.isToday(day) || void 0
-                  },
-                  day.toString()
-                )) }),
-                allDayBarData.bars.map((bar) => {
-                  const {
-                    event,
-                    colStart,
-                    colSpan,
-                    isFirstDay,
-                    isLastDay,
-                    slot
-                  } = bar;
-                  const showTitle = isFirstDay || !isFirstDay && colStart === 0;
-                  return /* @__PURE__ */ jsxRuntime.jsx(TooltipProviderBase, { delayDuration: 400, children: /* @__PURE__ */ jsxRuntime.jsxs(TooltipBase, { children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(TooltipTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-                      "div",
-                      {
-                        className: "absolute px-0.5",
-                        style: {
-                          left: `calc(${colStart / 7 * 100}% + 2px)`,
-                          width: `calc(${colSpan / 7 * 100}% - 4px)`,
-                          top: EventGapAgenda + slot * rowH,
-                          height: EventHeightAgenda
-                        },
-                        children: /* @__PURE__ */ jsxRuntime.jsx(
-                          EventItemAgenda,
-                          {
-                            event,
-                            isFirstDay,
-                            isLastDay,
-                            onClick: (e) => {
-                              e.stopPropagation();
-                              handleEventClick(event, e);
-                            },
-                            view: "month",
-                            className: "h-full",
-                            children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1 min-w-0 w-full", children: [
-                              !isFirstDay && colStart === 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-[11px] font-bold opacity-60", children: /* @__PURE__ */ jsxRuntime.jsx(ssr.CaretLeftIcon, {}) }),
-                              showTitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-xs font-medium", children: event.title }),
-                              !isLastDay && colStart + colSpan === 7 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 ml-auto text-[11px] font-bold opacity-60", children: /* @__PURE__ */ jsxRuntime.jsx(ssr.CaretRightIcon, {}) })
-                            ] })
-                          }
-                        )
-                      }
-                    ) }),
-                    /* @__PURE__ */ jsxRuntime.jsxs(TooltipContentBase, { side: "top", children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold truncate max-w-[200px]", children: event.title }),
-                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "opacity-80 mt-0.5 leading-snug", children: formatDurationAgenda(event) }),
-                      event.location && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "opacity-60 mt-0.5 truncate text-[11px] max-w-[200px] flex items-center gap-1", children: [
-                        /* @__PURE__ */ jsxRuntime.jsx(ssr.MapPinIcon, { size: 14 }),
-                        " ",
-                        event.location
-                      ] })
-                    ] })
-                  ] }) }, event.id);
-                })
-              ]
-            }
-          )
+                    day,
+                    events: dayEvents,
+                    expandedDay,
+                    onExpand: setExpandedDay,
+                    onEventSelect: handleEventClick,
+                    noTime
+                  }
+                )
+              },
+              day.toString()
+            );
+          })
         ] }),
         multiDayTimedEvents.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
@@ -11583,6 +11672,19 @@ function WeekViewAgenda({
             className: "relative grid auto-cols-fr border-border/70 border-r last:border-r-0",
             "data-today": dateFns.isToday(day) || void 0,
             children: [
+              trueAllDayEvents.length > 0 && allDayCell && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 overflow-visible", children: /* @__PURE__ */ jsxRuntime.jsx(
+                AllDayStack,
+                {
+                  day,
+                  events: trueAllDayEvents.filter(
+                    (event) => event.start?.toLocaleDateString() === new Date(day).toLocaleDateString()
+                  ),
+                  expandedDay,
+                  onExpand: setExpandedDay,
+                  onEventSelect: handleEventClick,
+                  noTime
+                }
+              ) }),
               (processedDayEvents[dayIndex] ?? []).map((positionedEvent) => {
                 const timeLabel = formatDurationAgenda(positionedEvent.event);
                 return /* @__PURE__ */ jsxRuntime.jsx(TooltipProviderBase, { children: /* @__PURE__ */ jsxRuntime.jsxs(TooltipBase, { delayDuration: 250, children: [
@@ -20944,6 +21046,102 @@ var TagInput = React32__namespace.forwardRef(
   }
 );
 TagInput.displayName = "TagInput";
+function MaskedInput({
+  value,
+  onChange,
+  mask,
+  label,
+  className,
+  error,
+  isLoading,
+  disabled,
+  hideConfirm = false
+}) {
+  const [internalValue, setInternalValue] = React32.useState(value);
+  React32.useEffect(() => {
+    setInternalValue(applyMask(value, mask));
+  }, [value, mask]);
+  const hasChanged = internalValue !== applyMask(value, mask);
+  const handleSave = () => {
+    if (!hasChanged || isLoading || disabled) return;
+    onChange(internalValue.replace(/\D/g, ""));
+  };
+  function applyMask(value2, type) {
+    let valueMasked = value2.replace(/\D/g, "");
+    switch (type) {
+      case "cpf":
+        valueMasked = valueMasked.replace(/(\d{3})(\d)/, "$1.$2");
+        valueMasked = valueMasked.replace(/(\d{3})(\d)/, "$1.$2");
+        valueMasked = valueMasked.replace(/(\d{3})(\d{1,2})$/, "$1-$2");
+        return valueMasked.substring(0, 14);
+      case "cnpj":
+        valueMasked = valueMasked.replace(/^(\d{2})(\d)/, "$1.$2");
+        valueMasked = valueMasked.replace(/^(\d{2})\.(\d{3})(\d)/, "$1.$2.$3");
+        valueMasked = valueMasked.replace(/\.(\d{3})(\d)/, ".$1/$2");
+        valueMasked = valueMasked.replace(/(\d{4})(\d)/, "$1-$2");
+        return valueMasked.substring(0, 18);
+      case "cep":
+        valueMasked = valueMasked.replace(/(\d{5})(\d)/, "$1-$2");
+        return valueMasked.substring(0, 9);
+      case "phone":
+        valueMasked = valueMasked.replace(/^(\d{2})(\d)/g, "($1) $2");
+        valueMasked = valueMasked.replace(/(\d)(\d{4})$/, "$1-$2");
+        return valueMasked.substring(0, 15);
+      case "rg":
+        valueMasked = valueMasked.replace(/(\d{2})(\d)/, "$1.$2");
+        valueMasked = valueMasked.replace(/(\d{3})(\d)/, "$1.$2");
+        valueMasked = valueMasked.replace(/(\d{3})(\d{1})$/, "$1-$2");
+        return valueMasked.substring(0, 12);
+      default:
+        return valueMasked;
+    }
+  }
+  function blurOnEnter(e) {
+    if (e.key === "Enter") {
+      e.currentTarget.blur();
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${className} flex flex-col`, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(LabelBase_default, { children: label }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        InputBase,
+        {
+          value: internalValue,
+          onChange: (e) => {
+            const masked = applyMask(e.currentTarget.value, mask);
+            setInternalValue(masked);
+          },
+          onBlur: handleSave,
+          onKeyDown: blurOnEnter,
+          rightIcon: /* @__PURE__ */ jsxRuntime.jsx(react.PencilSimpleIcon, { size: 12, className: "mr-2" }),
+          error,
+          disabled,
+          inputMode: "numeric"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: hasChanged && !hideConfirm && /* @__PURE__ */ jsxRuntime.jsx(
+        framerMotion.motion.div,
+        {
+          initial: { opacity: 0, scale: 0.8 },
+          animate: { opacity: 1, scale: 1 },
+          exit: { opacity: 0, scale: 0.8 },
+          transition: { type: "spring", stiffness: 500, damping: 30 },
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            ButtonBase,
+            {
+              onClick: handleSave,
+              className: "h-9 w-9 bg-green-600 text-white hover:bg-green-700 rounded-md flex items-center justify-center",
+              size: "icon",
+              isLoading,
+              children: /* @__PURE__ */ jsxRuntime.jsx(react.CheckIcon, { size: 14 })
+            }
+          )
+        }
+      ) })
+    ] })
+  ] });
+}
 function Leaderboard({
   items,
   order: initialOrder = "desc",
@@ -22598,23 +22796,28 @@ function useCommandPalette({
   React32.useEffect(() => {
     stateRef.current = { activeIndex, page, flatItems, query, selectedItems };
   }, [activeIndex, page, flatItems, query, selectedItems]);
-  const executeBulkAction = React32.useCallback(() => {
+  const executeBulkAction = React32__namespace.useCallback(() => {
     if (!onSelectMultiple || selectedItems.length === 0) return;
     onSelectMultiple(selectedItems);
     onOpenChange?.(false);
   }, [onSelectMultiple, selectedItems, onOpenChange]);
-  const handleSelect = React32.useCallback(
+  const handleCheckboxToggle = React32__namespace.useCallback(
+    (item) => {
+      toggleSelection(item.id);
+    },
+    [toggleSelection]
+  );
+  const handleSelect = React32__namespace.useCallback(
     (item, event) => {
       if (!item) return;
       if (multiSelect) {
-        const isCmdKey = event && ("ctrlKey" in event || "metaKey" in event || "shiftKey" in event) && (event.ctrlKey || event.metaKey || event.shiftKey);
-        if (isCmdKey) {
+        if (event && ("ctrlKey" in event || "metaKey" in event || "shiftKey" in event) && (event.ctrlKey || event.metaKey || event.shiftKey)) {
           toggleSelection(item.id);
           return;
         }
         if (selectedItems.length > 0) {
-          const finalItems = selectedItemIds.has(item.id) ? selectedItems : [...selectedItems, item];
-          onSelectMultiple?.(finalItems);
+          const itemsToSubmit = selectedItemIds.has(item.id) ? selectedItems : [...selectedItems, item];
+          onSelectMultiple?.(itemsToSubmit);
           onOpenChange?.(false);
           return;
         }
@@ -22633,12 +22836,12 @@ function useCommandPalette({
       multiSelect,
       selectedItems,
       selectedItemIds,
+      toggleSelection,
       onSelectMultiple,
       onOpenChange,
       onRecentItemsChange,
       recentItems,
-      maxRecentItems,
-      toggleSelection
+      maxRecentItems
     ]
   );
   React32.useEffect(() => {
@@ -22727,6 +22930,7 @@ function useCommandPalette({
     totalItems,
     totalPages,
     handleSelect,
+    handleCheckboxToggle,
     selectedItemIds,
     toggleSelection,
     selectedItems,
@@ -23319,6 +23523,7 @@ exports.Leaderboard = Leaderboard;
 exports.LikeButton = LikeButton;
 exports.LoadingBase = LoadingBase;
 exports.LockButton = LockButton;
+exports.MaskedInput = MaskedInput;
 exports.ModalBase = ModalBase;
 exports.ModalCloseBase = ModalCloseBase;
 exports.ModalContentBase = ModalContentBase;