@algenium/blocks 1.14.0 → 1.15.0

package/dist/index.js

@@ -1,7 +1,7 @@
 "use client";
 import * as React7 from 'react';
 import { createContext, useContext, useState, useCallback, useEffect, useRef, useMemo, useId } from 'react';
-import { Loader2, AlertTriangle, Inbox, CheckIcon, CircleIcon, ChevronRightIcon, Monitor, Sun, Moon, Building2, ChevronsUpDown, Check, Plus, Languages, FlaskConical, X, Upload, Move, ZoomOut, ZoomIn, RotateCcw, RotateCw, Grid3X3, RefreshCw, XIcon, User, Pencil, Bell, CheckCheck, XCircle, CheckCircle, Info, Trash2, Clock, MapPin, Link, CalendarDays, ExternalLink, ChevronLeft, ChevronRight, HelpCircle, MessageSquare, Wifi, WifiOff, FileIcon, Download, Paperclip, Send, ArrowLeft, Search, Flag, Hash, Lightbulb, Trophy, Plane, Apple, Leaf, Hand, Smile, Play, AlertCircle, VolumeX, Pause, Volume1, Volume2, Settings, PictureInPicture2, Minimize, Maximize, CreditCard, CheckCircle2, BadgeCheck } from 'lucide-react';
+import { Loader2, AlertTriangle, Inbox, CheckIcon, CircleIcon, ChevronRightIcon, Monitor, Sun, Moon, Building2, ChevronsUpDown, Check, Plus, Languages, FlaskConical, X, Upload, Move, ZoomOut, ZoomIn, RotateCcw, RotateCw, Grid3X3, RefreshCw, XIcon, User, Pencil, Bell, CheckCheck, XCircle, CheckCircle, Info, Trash2, Clock, MapPin, Link, CalendarDays, ExternalLink, ChevronLeft, ChevronRight, HelpCircle, MessageSquare, Wifi, WifiOff, FileIcon, Download, Paperclip, Send, ArrowLeft, Search, Flag, Hash, Lightbulb, Trophy, Plane, Apple, Leaf, Hand, Smile, Play, AlertCircle, VolumeX, Pause, Volume1, Volume2, Settings, PictureInPicture2, Minimize, Maximize, SearchIcon, CreditCard, CheckCircle2, BadgeCheck } from 'lucide-react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useTheme } from 'next-themes';
 import { AnimatePresence, motion } from 'framer-motion';
@@ -16,6 +16,7 @@ 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 { Command as Command$1 } from 'cmdk';
 import valid from 'card-validator';
 
 var CalendarContext = createContext(null);
@@ -3871,7 +3872,7 @@ function LanguageSwitcher({
   const onLanguageChange = propOnLanguageChange ?? context?.setLanguage;
   const sizes = sizeClasses2[size];
   const shapeClass = shapeClasses2[shape];
-  const defaultLabels5 = {
+  const defaultLabels6 = {
     language: labels.language ?? "Language"
   };
   if (variant === "mini") {
@@ -3881,7 +3882,7 @@ function LanguageSwitcher({
         {
           variant: "ghost",
           size: "icon",
-          "aria-label": defaultLabels5.language,
+          "aria-label": defaultLabels6.language,
           className: cn(sizes.buttonMini, shapeClass, className),
           children: /* @__PURE__ */ jsx(Languages, { className: sizes.iconMini })
         }
@@ -7958,20 +7959,25 @@ function EmojiPicker({
                     sectionRefs.current.set(section.key, el);
                   },
                   className: "mb-2",
-                  style: {
-                    contentVisibility: "auto",
-                    containIntrinsicSize: "auto 200px"
-                  },
                   children: [
                     /* @__PURE__ */ jsx("h3", { className: "text-muted-foreground bg-popover sticky top-0 z-[1] px-1 py-1 text-xs font-medium", children: section.title }),
                     /* @__PURE__ */ jsx(
-                      EmojiGrid,
+                      "div",
                       {
-                        emojis: section.emojis,
-                        startIndex,
-                        activeIndex: focusIndex,
-                        skinTone,
-                        onSelect: handleSelect
+                        style: {
+                          contentVisibility: "auto",
+                          containIntrinsicSize: "auto 200px"
+                        },
+                        children: /* @__PURE__ */ jsx(
+                          EmojiGrid,
+                          {
+                            emojis: section.emojis,
+                            startIndex,
+                            activeIndex: focusIndex,
+                            skinTone,
+                            onSelect: handleSelect
+                          }
+                        )
                       }
                     )
                   ]
@@ -9156,6 +9162,342 @@ function useDebouncedValueStrict(value, delayMs) {
   }, [value, delayMs]);
   return debounced;
 }
+function Command({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Command$1,
+    {
+      "data-slot": "command",
+      className: cn(
+        "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CommandDialog({
+  title = "Command Palette",
+  description = "Search for a command to run...",
+  children,
+  className,
+  showCloseButton = true,
+  commandProps,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(Dialog, { ...props, children: [
+    /* @__PURE__ */ jsxs(DialogHeader, { className: "sr-only", children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: title }),
+      /* @__PURE__ */ jsx(DialogDescription, { children: description })
+    ] }),
+    /* @__PURE__ */ jsx(
+      DialogContent,
+      {
+        className: cn("overflow-hidden p-0", className),
+        showCloseButton,
+        children: /* @__PURE__ */ jsx(
+          Command,
+          {
+            className: "**:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5",
+            ...commandProps,
+            children
+          }
+        )
+      }
+    )
+  ] });
+}
+function CommandInput({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "command-input-wrapper",
+      className: "flex h-9 items-center gap-2 border-b px-3",
+      children: [
+        /* @__PURE__ */ jsx(SearchIcon, { className: "size-4 shrink-0 opacity-50" }),
+        /* @__PURE__ */ jsx(
+          Command$1.Input,
+          {
+            "data-slot": "command-input",
+            className: cn(
+              "flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
+              className
+            ),
+            ...props
+          }
+        )
+      ]
+    }
+  );
+}
+function CommandList({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Command$1.List,
+    {
+      "data-slot": "command-list",
+      className: cn(
+        "max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CommandEmpty({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Command$1.Empty,
+    {
+      "data-slot": "command-empty",
+      className: "py-6 text-center text-sm",
+      ...props
+    }
+  );
+}
+function CommandGroup({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Command$1.Group,
+    {
+      "data-slot": "command-group",
+      className: cn(
+        "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CommandSeparator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Command$1.Separator,
+    {
+      "data-slot": "command-separator",
+      className: cn("-mx-1 h-px bg-border", className),
+      ...props
+    }
+  );
+}
+function CommandItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Command$1.Item,
+    {
+      "data-slot": "command-item",
+      className: cn(
+        "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CommandShortcut({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "data-slot": "command-shortcut",
+      className: cn(
+        "ml-auto text-xs tracking-widest text-muted-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/components/search/fuzzy.ts
+function normalize(value) {
+  return value.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "");
+}
+function fuzzyMatch(query, target) {
+  const q = normalize(query.trim());
+  if (!q) return true;
+  const t = normalize(target);
+  if (t.includes(q)) return true;
+  let qi = 0;
+  for (let ti = 0; ti < t.length && qi < q.length; ti++) {
+    if (t[ti] === q[qi]) qi++;
+  }
+  return qi === q.length;
+}
+var defaultLabels5 = {
+  placeholder: "Buscar en toda la plataforma\u2026",
+  dialogTitle: "Buscar",
+  dialogDescription: "Busca funcionalidades, eventos, documentos y m\xE1s",
+  loading: "Buscando\u2026",
+  empty: "No se encontraron resultados",
+  error: "No se pudo completar la b\xFAsqueda",
+  featuresGroup: "Funcionalidades",
+  defaultResultsGroup: "Resultados"
+};
+function groupHitsByType(hits) {
+  const order = [];
+  const byType = /* @__PURE__ */ new Map();
+  for (const hit of hits) {
+    if (!byType.has(hit.type)) {
+      byType.set(hit.type, []);
+      order.push(hit.type);
+    }
+    byType.get(hit.type)?.push(hit);
+  }
+  return order.map((type) => [type, byType.get(type) ?? []]);
+}
+function SearchCommand({
+  open,
+  onOpenChange,
+  fetchResults,
+  onSelect,
+  features = [],
+  typeLabels,
+  labels: userLabels,
+  minQueryLength = 2,
+  debounceMs = 200,
+  className
+}) {
+  const labels = { ...defaultLabels5, ...userLabels };
+  const [query, setQuery] = useState("");
+  const [hits, setHits] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [hasError, setHasError] = useState(false);
+  const debouncedQuery = useDebouncedValue(query, debounceMs);
+  const requestIdRef = useRef(0);
+  useEffect(() => {
+    if (!open) {
+      setQuery("");
+      setHits([]);
+      setHasError(false);
+    }
+  }, [open]);
+  useEffect(() => {
+    const trimmed = debouncedQuery.trim();
+    if (trimmed.length < minQueryLength) {
+      setHits([]);
+      setHasError(false);
+      setIsLoading(false);
+      return;
+    }
+    const requestId = ++requestIdRef.current;
+    setIsLoading(true);
+    setHasError(false);
+    fetchResults(trimmed).then((result) => {
+      if (requestIdRef.current !== requestId) return;
+      setHits(result);
+    }).catch(() => {
+      if (requestIdRef.current !== requestId) return;
+      setHits([]);
+      setHasError(true);
+    }).finally(() => {
+      if (requestIdRef.current !== requestId) return;
+      setIsLoading(false);
+    });
+  }, [debouncedQuery, minQueryLength, fetchResults]);
+  const filteredFeatures = useMemo(() => {
+    if (!query.trim()) return features;
+    return features.filter(
+      (feature) => fuzzyMatch(query, feature.label) || feature.keywords?.some((keyword) => fuzzyMatch(query, keyword))
+    );
+  }, [features, query]);
+  const groupedHits = useMemo(() => groupHitsByType(hits), [hits]);
+  function handleSelect(selection) {
+    onSelect(selection);
+    onOpenChange(false);
+  }
+  const hasAnyResults = filteredFeatures.length > 0 || hits.length > 0;
+  return /* @__PURE__ */ jsxs(
+    CommandDialog,
+    {
+      open,
+      onOpenChange,
+      title: labels.dialogTitle,
+      description: labels.dialogDescription,
+      className,
+      commandProps: { shouldFilter: false },
+      children: [
+        /* @__PURE__ */ jsx(
+          CommandInput,
+          {
+            placeholder: labels.placeholder,
+            value: query,
+            onValueChange: setQuery
+          }
+        ),
+        /* @__PURE__ */ jsxs(CommandList, { children: [
+          isLoading ? /* @__PURE__ */ jsx("div", { className: "py-6 text-center text-sm text-muted-foreground", children: labels.loading }) : null,
+          hasError && !isLoading ? /* @__PURE__ */ jsx("div", { className: "py-6 text-center text-sm text-destructive", children: labels.error }) : null,
+          !isLoading && !hasError && !hasAnyResults ? /* @__PURE__ */ jsx(CommandEmpty, { children: labels.empty }) : null,
+          filteredFeatures.length > 0 ? /* @__PURE__ */ jsx(CommandGroup, { heading: labels.featuresGroup, children: filteredFeatures.map((feature) => /* @__PURE__ */ jsxs(
+            CommandItem,
+            {
+              value: feature.id,
+              onSelect: () => handleSelect({ kind: "feature", feature }),
+              children: [
+                feature.icon,
+                /* @__PURE__ */ jsx("span", { children: feature.label })
+              ]
+            },
+            feature.id
+          )) }) : null,
+          !isLoading && groupedHits.map(([type, typeHits]) => /* @__PURE__ */ jsx(
+            CommandGroup,
+            {
+              heading: typeLabels?.[type] ?? labels.defaultResultsGroup,
+              children: typeHits.map((hit) => /* @__PURE__ */ jsx(
+                CommandItem,
+                {
+                  value: hit.id,
+                  onSelect: () => handleSelect({ kind: "hit", hit }),
+                  children: /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+                    /* @__PURE__ */ jsx("span", { className: "truncate", children: hit.title }),
+                    hit.snippet ? /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-muted-foreground", children: hit.snippet }) : null
+                  ] })
+                },
+                hit.id
+              ))
+            },
+            type
+          ))
+        ] })
+      ]
+    }
+  );
+}
+function useSearchHotkey(options = {}) {
+  const { defaultOpen = false, disabled = false } = options;
+  const [open, setOpen] = useState(defaultOpen);
+  const toggle = useCallback(() => setOpen((prev) => !prev), []);
+  useEffect(() => {
+    if (disabled) return;
+    function handleKeyDown(event) {
+      if (event.key.toLowerCase() !== "k") return;
+      if (!event.metaKey && !event.ctrlKey) return;
+      event.preventDefault();
+      setOpen((prev) => !prev);
+    }
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [disabled]);
+  return { open, setOpen, toggle };
+}
 function onlyDigits(s, max) {
   return s.replace(/\D/g, "").slice(0, max);
 }
@@ -10096,6 +10438,6 @@ function VerifiedProfessionalBadge({
   );
 }
 
-export { AvatarEditor, AvatarEditorDialog, BLOCKS_DATA_ENVIRONMENTS, Button, CalendarContext, CalendarSubscribeButton, CalendarView, CalendarWidget, CardInput, ChatRoomView, ChatSidebar, ChatSidebarContext, ChatSidebarProvider, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmojiPicker, EmojiPickerPopover, EmptyState, EnvironmentBanner, EnvironmentContext, EnvironmentDot, EnvironmentMiniBadge, EnvironmentSwitcher, ErrorState, EventDialog, EventRsvpBadge, LanguageContext, LanguageSwitcher, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, MexicoMap, MiniCalendar, NotificationsContext, NotificationsWidget, OrgSwitcher, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ScrollArea, ScrollBar, Slider, ThemeSwitcher, Toggle, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, USAddressInput, UpcomingEvents, VerifiedProfessionalBadge, VideoPlayer, buttonVariants, cn, createLiveHlsConfig, createVodHlsConfig, defaultLanguages, describePlaybackError, getEnvironmentDotClass, getEnvironmentLabel, isBlocksDataEnvironment, normalizeEmojiQuery, shouldRetryLiveEdge404, toggleVariants, useCalendarContext, useChatRoom, useChatSidebar, useDebouncedValue, useDebouncedValueStrict, useEnvironmentContext, useHlsPlayback, useLanguageContext, useNotificationsContext, usePlaybackStats };
+export { AvatarEditor, AvatarEditorDialog, BLOCKS_DATA_ENVIRONMENTS, Button, CalendarContext, CalendarSubscribeButton, CalendarView, CalendarWidget, CardInput, ChatRoomView, ChatSidebar, ChatSidebarContext, ChatSidebarProvider, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmojiPicker, EmojiPickerPopover, EmptyState, EnvironmentBanner, EnvironmentContext, EnvironmentDot, EnvironmentMiniBadge, EnvironmentSwitcher, ErrorState, EventDialog, EventRsvpBadge, LanguageContext, LanguageSwitcher, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, MexicoMap, MiniCalendar, NotificationsContext, NotificationsWidget, OrgSwitcher, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ScrollArea, ScrollBar, SearchCommand, Slider, ThemeSwitcher, Toggle, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, USAddressInput, UpcomingEvents, VerifiedProfessionalBadge, VideoPlayer, buttonVariants, cn, createLiveHlsConfig, createVodHlsConfig, defaultLanguages, describePlaybackError, fuzzyMatch, getEnvironmentDotClass, getEnvironmentLabel, isBlocksDataEnvironment, normalizeEmojiQuery, shouldRetryLiveEdge404, toggleVariants, useCalendarContext, useChatRoom, useChatSidebar, useDebouncedValue, useDebouncedValueStrict, useEnvironmentContext, useHlsPlayback, useLanguageContext, useNotificationsContext, usePlaybackStats, useSearchHotkey };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map