@refraction-ui/react 0.15.0 → 0.16.0

package/dist/index.d.cts

@@ -113,3 +113,6 @@ export * from './internal/react-marquee-strip/index.cjs';
 export * from './internal/react-browser-chrome-mock/index.cjs';
 export * from './internal/react-mastery-bar/index.cjs';
 export * from './internal/react-audience-feature-card/index.cjs';
+export * from './internal/react-sortable-list/index.cjs';
+export * from './internal/react-kanban-board/index.cjs';
+export * from './internal/react-slot-picker/index.cjs';

package/dist/index.d.ts

@@ -113,3 +113,6 @@ export * from './internal/react-marquee-strip/index.js';
 export * from './internal/react-browser-chrome-mock/index.js';
 export * from './internal/react-mastery-bar/index.js';
 export * from './internal/react-audience-feature-card/index.js';
+export * from './internal/react-sortable-list/index.js';
+export * from './internal/react-kanban-board/index.js';
+export * from './internal/react-slot-picker/index.js';

package/dist/index.js

@@ -21870,6 +21870,552 @@ var AudienceFeatureCard = React11.forwardRef(({ kicker, title, body, footer, cla
 });
 AudienceFeatureCard.displayName = "AudienceFeatureCard";
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AltHintState, AnalyticsProvider, AnimatedText, AppShell, AudienceFeatureCard, AudioRoom, AuthGuard, AuthProvider, Avatar2 as Avatar, AvatarFallback, AvatarGroup, AvatarImage, Badge, BadgeDisplay, BottomNav, BrandNetworkCell, Breadcrumbs, BrowserChromeMock, Button, CATEGORY_LABELS, CURSOR_COLORS, Calendar, CalendarHeader, CallControlButton, CallControls, Callout, CalloutContent, CalloutDescription, CalloutIcon, CalloutTitle, Card, CardContent, CardDescription, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselTrigger, Chat, Checkbox, Checklist, CodeBlock, CodeBlockContent, CodeBlockHeader, CodeEditor, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxList, ComboboxTrigger, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, Composer, ConfirmationCard, ContentProtection, CookieConsent, Cursor, DEFAULT_CATEGORIES, DEFAULT_VOICE_PILL_POSITION, DEFAULT_VOICE_PILL_SPEAKER, DEFAULT_WAVEFORM_BAR_COUNT, DEFAULT_WAVEFORM_COLOR, DEFAULT_WAVEFORM_HEIGHT, DEFAULT_WAVEFORM_INTENSITY, DEFAULT_WAVEFORM_SMOOTHING, DataTable, DatePicker, DeviceFrame, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EMOJI_CATEGORIES, EMOJI_DATA, EditorStatusBar, EditorTabs, EmojiPicker, EmptyState, FeedbackButton, FeedbackDialog, FileTree, FileUpload, FloatingReactions, FlowEditor, Footer, GraphView, IconSystem, InfiniteCanvas, InlineEditor, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InstallPrompt, KeyboardShortcut, LanguageSelector, LinkCard, LiveCaptions, LiveCursors, LiveTranscript, MarkdownRenderer, MarqueeStrip, MasteryBar, MiniMap, MobileNav, MobileNavContent, MobileNavLink, MobileNavTrigger, Navbar, NumberedSteps, OtpInput, STATUS_COLORS as PRESENCE_STATUS_COLORS, STATUS_LABELS as PRESENCE_STATUS_LABELS, Pagination, PasswordInput, Payment, Popover, PopoverClose, PopoverContent, PopoverTrigger, PreCallLobby, PresenceIndicator, PricingCard, ProgressBar, RadialGauge, RadioGroup, RadioItem, RatingScale, ReactionBar, ReactionBurst, ResizableDivider, ResizableLayout, ResizablePane, SANE_DEFAULTS, STATUS_INDICATOR_COLORS as STATUS_COLORS, STATUS_INDICATOR_LABELS as STATUS_LABELS, STICKY_NOTE_COLORS, SearchBar, SearchResultItem, SearchResults, SectionHead, SegmentedControl, SegmentedControlItem, Select, SelectContent, SelectItem, SelectTrigger, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetTitle, SheetTrigger, ShortcutBadge, ShortcutContext, ShortcutHint, ShortcutProvider, ShortcutRegistry, Sidebar, Skeleton, SkeletonText, SkipToContent, SlideViewer, SocialAuthButton, SocialAuthRow, SpeakingOrb, StatGrid, StatsGrid, StatusIndicator, Step, StepContent, StepDescription, StepIndicator, StepTitle, Steps, StickyNote, Switch, TableOfContents, Tabs, TabsContent, TabsList, TabsTrigger, TelemetryErrorBoundary, TelemetryProvider, Terminal, TestResults, Textarea, ThreadView, Timeline, TimelineItem, Toast, ToastProvider, Toaster, Tooltip, TooltipContent, TooltipTrigger, TypewriterText, VersionSelector, VideoGrid, VideoPlayer, VideoTile, VoicePill, Waveform, Wizard, altHintState, animatedTextVariants, assignCursorColor, avatarFallbackVariants, avatarImageVariants, avatarTokens, avatarVariants, badgeGridVariants, badgeItemVariants, badgeVariants, bottomNavTabVariants, bottomNavVariants, breadcrumbItemVariants, breadcrumbSeparatorStyles, breadcrumbsVariants, buttonTokens, buttonVariants, calendarVariants, canAccessAdmin, canAccessReviewer, cardContentVariants, cardDescriptionVariants, cardFooterVariants, cardHeaderVariants, cardTitleVariants, cardTokens, cardVariants, cellVariants, checkIconPath, checkboxTokens, checkboxVariants, clampVoicePillIntensity, codeEditorTokens, codeEditorVariants, collapsibleContentVariants, comboboxContentVariants, comboboxEmptyVariants, comboboxInputVariants, comboboxItemVariants, comboboxListVariants, comboboxTriggerVariants, commandGroupVariants, commandInputVariants, commandItemVariants, commandVariants, contentProtectionVariants, controlsVariants, createAnalytics, createAppInsightsSink, createConsoleSink, createConversation, createCookieConsent, createGA4ClientSdkSink, createGA4HttpSink, createGA4Sink, createIntensitySamples, createPostHogClientSdkSink, createPostHogHttpSink, createPostHogSink, createPreCallLobby, createSegmentedControl, createSilentSamples, createTelemetry, createVoicePill, createWaveform, dayVariants, deviceFrameVariants, dialogContentVariants, drawWaveform, editorVariants, emojiPickerContainerStyles, emojiPickerEmojiButtonStyles, emojiPickerGridStyles, feedbackDialogVariants, fileUploadDropZoneVariants, fileUploadFileItemStyles, fileUploadFileListStyles, findMessage, footerVariants, formatFileSize, formatRelativeTime, formatShortcut, formatTimestamp, getAssignableRoles, getDefaultPortal, getInitials, getNextSegmentIndex, getReplyCount, getVoicePillAriaLabel, getVoicePillInitials, getVoicePillPosition, getVoicePillPulseStyle, getVoicePillSpeakerKey, getVoicePillSpeakerLabel, getWaveformPeak, globalShortcutRegistry, hasAllRoles, hasAnyRole, hasRole, headerVariants, indeterminateIconPath, inputGroupAddonVariants, inputGroupButtonVariants, inputGroupTokens, inputGroupVariants, inputVariants, installPromptVariants, isWaveformSampleInput, latestBadgeVariants, markdownRendererTokens, menuContentVariants, menuItemVariants, micLevelToBars, mobileNavContentVariants, mobileNavLinkVariants, mobileNavTokens, mobileNavTriggerVariants, mobileNavVariants, navLinkVariants, navbarVariants, nextStickyColor, normalizeBarCount, normalizeIntensity, normalizeSmoothing, normalizeWaveformConfig, normalizeWaveformSamples, optionVariants, otpInputContainerVariants, otpInputSlotVariants, otpInputTokens, overlayStyles, overlayVariants, playerVariants, popoverContentVariants, prepareWaveformCanvas, previewVariants, progressBarVariants, proseVariants, radioCircleVariants, radioGroupVariants, radioItemVariants, reactionAddButtonStyles, reactionBarStyles, reactionCountStyles, reactionEmojiStyles, reactionPillVariants, resampleWaveformSamples, resizableDividerVariants, resizableLayoutTokens, resizableLayoutVariants, resizablePaneVariants, rootIdOf, rowVariants, scaleWaveformSamples, searchBarVariants, searchResultVariants, segmentedControlItemVariants, segmentedControlVariants, selectContentVariants, selectItemVariants, selectMainTimeline, selectReplies, selectRoots, selectThreadMessages, selectTimelineFromState, selectTokens, selectTriggerVariants, selectorVariants, sheetContentVariants, sheetOverlayStyles, shortcutBadgeStyles, shortcutKeyStyles, shortcutSeparatorStyles, sidebarItemVariants, sidebarVariants, skeletonVariants, slideTypeBadgeVariants, slideViewerProgressBarVariants, slideViewerTokens, slideViewerVariants, smoothWaveformSamples, startSessionReplay, statCardVariants, statColumns, statsGridVariants, statusContainerStyles, statusDotVariants, statusLabelStyles, statusPulseVariants, switchThumbVariants, switchTokens, switchVariants, tableVariants, tabsListVariants, tabsTriggerVariants, textareaVariants, threadAuthorStyles, threadAvatarStyles, threadBodyStyles, threadContainerStyles, threadContentStyles, threadMessageStyles, threadReactionsStyles, threadTimestampStyles, toCssDimension, toastVariants, toolbarVariants, tooltipContentVariants, typewriterVariants, useAnalytics, useAuth, useConversation, useCookieConsent, useFloatingReactions, useLogger, useShortcut, useSpan, useTelemetry, useToast, useTrackEvent, useWizard, versionSelectorOptionVariants, versionSelectorVariants, voicePillAvatarStyles, voicePillAvatarWrapStyles, voicePillLabelStyles, voicePillMuteButtonStyles, voicePillPositionVariants, voicePillPulseRingStyles, voicePillRootStyles, voicePillSpeakerStyles, voicePillSubStyles, voicePillTextStyles, voicePillTokens, watermarkVariants, waveformCanvasVariants, waveformVariants };
+// ../sortable-list/dist/index.js
+function reorder(items, from, to) {
+  const len = items.length;
+  if (len === 0 || from < 0 || from >= len || to < 0 || to >= len || from === to) {
+    return [...items];
+  }
+  const result = [...items];
+  const [moved] = result.splice(from, 1);
+  result.splice(to, 0, moved);
+  return result;
+}
+function getNextOrderIndex(current, key, count) {
+  if (count <= 0) return current;
+  const clamped = Math.max(0, Math.min(current, count - 1));
+  switch (key) {
+    case "ArrowUp":
+    case "ArrowLeft":
+      return Math.max(0, clamped - 1);
+    case "ArrowDown":
+    case "ArrowRight":
+      return Math.min(count - 1, clamped + 1);
+    case "Home":
+      return 0;
+    case "End":
+      return count - 1;
+    default:
+      return clamped;
+  }
+}
+function createSortableList() {
+  return {
+    ariaProps: {
+      role: "list"
+    },
+    dataAttributes: {
+      "data-component": "sortable-list"
+    }
+  };
+}
+var sortableListVariants = cva({
+  base: "flex flex-col gap-1 w-full",
+  variants: {
+    disabled: {
+      true: "opacity-50 pointer-events-none",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    disabled: "false"
+  }
+});
+var sortableListRowVariants = cva({
+  base: [
+    "flex items-center gap-3 rounded-md border border-border bg-card px-3 py-2",
+    "transition-opacity"
+  ].join(" "),
+  variants: {
+    dragging: {
+      true: "opacity-50 ring-2 ring-ring",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    dragging: "false"
+  }
+});
+var sortableListGripClass = "cursor-grab text-muted-foreground shrink-0 flex items-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background rounded";
+var sortableListContentClass = "flex-1 min-w-0";
+function SortableListInner({
+  items,
+  getKey,
+  renderItem,
+  onReorder,
+  disabled = false,
+  className,
+  ...props
+}, ref) {
+  const dragFromRef = React11.useRef(null);
+  const [draggingIndex, setDraggingIndex] = React11.useState(null);
+  const { ariaProps, dataAttributes } = createSortableList();
+  const handleDragStart = (index) => (event) => {
+    if (disabled) {
+      event.preventDefault();
+      return;
+    }
+    dragFromRef.current = index;
+    setDraggingIndex(index);
+    event.dataTransfer.effectAllowed = "move";
+    event.dataTransfer.setData("text/plain", String(index));
+  };
+  const handleDragOver = (event) => {
+    event.preventDefault();
+    event.dataTransfer.dropEffect = "move";
+  };
+  const handleDragEnter = (toIndex) => (event) => {
+    event.preventDefault();
+    if (disabled || dragFromRef.current === null || dragFromRef.current === toIndex) return;
+    const next = reorder(items, dragFromRef.current, toIndex);
+    dragFromRef.current = toIndex;
+    setDraggingIndex(toIndex);
+    onReorder?.(next);
+  };
+  const handleDrop = (event) => {
+    event.preventDefault();
+  };
+  const handleDragEnd = () => {
+    dragFromRef.current = null;
+    setDraggingIndex(null);
+  };
+  const handleGripKeyDown = (index) => (event) => {
+    if (disabled) return;
+    const next = getNextOrderIndex(index, event.key, items.length);
+    if (next !== index) {
+      event.preventDefault();
+      onReorder?.(reorder(items, index, next));
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(sortableListVariants({ disabled: disabled ? "true" : "false" }), className),
+      ...ariaProps,
+      ...dataAttributes,
+      ...props,
+      children: items.map((item, index) => {
+        const key = getKey(item, index);
+        const isDragging = draggingIndex === index;
+        const dragHandleProps = {
+          "aria-label": "Reorder item",
+          role: "button",
+          tabIndex: 0,
+          onKeyDown: handleGripKeyDown(index),
+          onDragStart: handleDragStart(index)
+        };
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            role: "listitem",
+            draggable: !disabled,
+            className: sortableListRowVariants({ dragging: isDragging ? "true" : "false" }),
+            onDragOver: handleDragOver,
+            onDragEnter: handleDragEnter(index),
+            onDrop: handleDrop,
+            onDragEnd: handleDragEnd,
+            children: [
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": dragHandleProps["aria-label"],
+                  role: dragHandleProps.role,
+                  tabIndex: dragHandleProps.tabIndex,
+                  onKeyDown: dragHandleProps.onKeyDown,
+                  onDragStart: dragHandleProps.onDragStart,
+                  className: sortableListGripClass,
+                  draggable: !disabled,
+                  disabled,
+                  children: /* @__PURE__ */ jsx(
+                    "svg",
+                    {
+                      width: "16",
+                      height: "16",
+                      viewBox: "0 0 16 16",
+                      fill: "none",
+                      "aria-hidden": "true",
+                      children: /* @__PURE__ */ jsx(
+                        "path",
+                        {
+                          d: `M2 4h12M2 8h12M2 12h12`,
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          strokeLinecap: "round"
+                        }
+                      )
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx("div", { className: sortableListContentClass, children: renderItem(item, { index, dragHandleProps }) })
+            ]
+          },
+          key
+        );
+      })
+    }
+  );
+}
+var SortableList = React11.forwardRef(SortableListInner);
+SortableList.displayName = "SortableList";
+
+// ../kanban-board/dist/index.js
+function createKanbanBoard() {
+  return {
+    ariaProps: {
+      role: "group",
+      "aria-label": "Board"
+    },
+    dataAttributes: {
+      "data-component": "kanban-board"
+    }
+  };
+}
+function cardsByColumn(cards, getColumnId, columns) {
+  const map = /* @__PURE__ */ new Map();
+  for (const col of columns) {
+    map.set(col.id, []);
+  }
+  for (const card of cards) {
+    const colId = getColumnId(card);
+    const bucket = map.get(colId);
+    if (bucket !== void 0) {
+      bucket.push(card);
+    }
+  }
+  return map;
+}
+function visibleAndOverflow(cards, cap = 5) {
+  if (cards.length <= cap) {
+    return { visible: cards, overflow: 0 };
+  }
+  return { visible: cards.slice(0, cap), overflow: cards.length - cap };
+}
+var kanbanBoardVariants = cva({
+  base: "flex flex-row gap-4 overflow-x-auto pb-4",
+  variants: {},
+  defaultVariants: {}
+});
+var kanbanColumnVariants = cva({
+  base: "flex flex-col min-w-[260px] max-w-[300px] flex-shrink-0 rounded-xl bg-muted/40",
+  variants: {},
+  defaultVariants: {}
+});
+var kanbanColumnHeaderClass = "flex items-center gap-2 px-4 pt-4 pb-2";
+var kanbanColumnTitleClass = "flex-1 text-sm font-semibold text-foreground truncate";
+var kanbanColumnCountClass = "ml-auto inline-flex items-center justify-center rounded-full bg-muted px-2 py-0.5 text-xs font-medium text-muted-foreground";
+var kanbanAccentBarClass = "h-0.5 w-full";
+var kanbanNoteBarClass = "mx-4 mb-2 rounded-md bg-muted px-3 py-1.5 text-xs text-muted-foreground";
+var kanbanColumnBodyClass = "flex flex-col gap-2 px-3 pb-3";
+var kanbanOverflowButtonClass = [
+  "mt-1 w-full rounded-lg border border-dashed border-border",
+  "py-1.5 text-center text-xs text-muted-foreground",
+  "transition-colors hover:bg-muted hover:text-foreground",
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+].join(" ");
+var kanbanCardVariants = cva({
+  base: "rounded-lg border border-border bg-card p-3 text-sm text-foreground",
+  variants: {
+    clickable: {
+      true: "cursor-pointer transition-colors hover:bg-muted/60",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    clickable: "false"
+  }
+});
+var KanbanCard = React11.forwardRef(
+  ({ accent, clickable = false, className, style, children, ...props }, ref) => {
+    const accentStyle = accent ? { borderTopColor: accent, borderTopWidth: "2px", ...style } : style ?? {};
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          kanbanCardVariants({ clickable: clickable ? "true" : "false" }),
+          className
+        ),
+        style: accentStyle,
+        ...props,
+        children
+      }
+    );
+  }
+);
+KanbanCard.displayName = "KanbanCard";
+var KanbanColumn = React11.forwardRef(
+  ({ def, count, className, children, style, ...props }, ref) => {
+    const derivedCount = count !== void 0 ? count : React11.Children.count(children);
+    const colStyle = def.accent ? { "--kanban-accent": def.accent, ...style } : style ?? {};
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(kanbanColumnVariants(), className),
+        style: colStyle,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: kanbanColumnHeaderClass, children: [
+            /* @__PURE__ */ jsx("span", { className: kanbanColumnTitleClass, children: def.title }),
+            /* @__PURE__ */ jsx("span", { className: kanbanColumnCountClass, children: derivedCount })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: kanbanAccentBarClass,
+              style: def.accent ? { backgroundColor: "var(--kanban-accent)" } : { backgroundColor: "transparent" },
+              "aria-hidden": "true"
+            }
+          ),
+          def.note && /* @__PURE__ */ jsx("p", { className: kanbanNoteBarClass, children: def.note }),
+          /* @__PURE__ */ jsx("div", { className: kanbanColumnBodyClass, children })
+        ]
+      }
+    );
+  }
+);
+KanbanColumn.displayName = "KanbanColumn";
+function KanbanBoard({
+  columns,
+  cards,
+  getCardColumnId,
+  getCardKey,
+  renderCard,
+  cardCap = 5,
+  onCardClick: _onCardClick,
+  columnHeader,
+  onShowMore,
+  className,
+  ...props
+}) {
+  const { ariaProps, dataAttributes } = createKanbanBoard();
+  const buckets = cardsByColumn(cards, getCardColumnId, columns);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(kanbanBoardVariants(), className),
+      ...ariaProps,
+      ...dataAttributes,
+      ...props,
+      children: columns.map((def) => {
+        const colCards = buckets.get(def.id) ?? [];
+        const { visible, overflow } = visibleAndOverflow(colCards, cardCap);
+        const count = colCards.length;
+        const header = columnHeader ? columnHeader(def, count) : null;
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: kanbanColumnVariants(),
+            style: def.accent ? { "--kanban-accent": def.accent } : void 0,
+            children: [
+              header ?? /* @__PURE__ */ jsxs("div", { className: kanbanColumnHeaderClass, children: [
+                /* @__PURE__ */ jsx("span", { className: kanbanColumnTitleClass, children: def.title }),
+                /* @__PURE__ */ jsx("span", { className: kanbanColumnCountClass, children: count })
+              ] }),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: kanbanAccentBarClass,
+                  style: def.accent ? { backgroundColor: "var(--kanban-accent)" } : { backgroundColor: "transparent" },
+                  "aria-hidden": "true"
+                }
+              ),
+              def.note && /* @__PURE__ */ jsx("p", { className: kanbanNoteBarClass, children: def.note }),
+              /* @__PURE__ */ jsxs("div", { className: kanbanColumnBodyClass, children: [
+                visible.map((card) => /* @__PURE__ */ jsx(React11.Fragment, { children: renderCard(card, def) }, getCardKey(card))),
+                overflow > 0 && /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    className: kanbanOverflowButtonClass,
+                    onClick: () => onShowMore?.(def.id),
+                    children: `+${overflow} more`
+                  }
+                )
+              ] })
+            ]
+          },
+          def.id
+        );
+      })
+    }
+  );
+}
+
+// ../slot-picker/dist/index.js
+function slotsForDay(slotsByDay, dayId) {
+  return slotsByDay[dayId] ?? [];
+}
+function isSlotSelected(value, dayId, slot) {
+  return value?.dayId === dayId && value?.slot === slot;
+}
+function createSlotPicker() {
+  return {
+    ariaProps: {
+      role: "group",
+      "aria-label": "Pick a time"
+    },
+    dataAttributes: {
+      "data-component": "slot-picker"
+    }
+  };
+}
+var slotPickerVariants = cva({
+  base: "flex flex-col gap-4",
+  variants: {},
+  defaultVariants: {}
+});
+var slotPickerDayRowClass = "flex items-center gap-2 overflow-x-auto pb-1";
+var slotPickerDayVariants = cva({
+  base: [
+    "inline-flex flex-col items-center justify-center rounded-lg px-3 py-2 min-w-[3.5rem]",
+    "text-sm font-medium cursor-pointer transition-colors",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ].join(" "),
+  variants: {
+    selected: {
+      true: "bg-primary text-primary-foreground",
+      false: "bg-card border border-input text-foreground hover:bg-muted"
+    }
+  },
+  defaultVariants: {
+    selected: "false"
+  }
+});
+var slotPickerGridClass = "grid grid-cols-3 gap-2 sm:grid-cols-4";
+var slotPickerSlotVariants = cva({
+  base: [
+    "inline-flex items-center justify-center rounded-md border px-3 py-2 text-sm font-medium",
+    "transition-colors cursor-pointer",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background"
+  ].join(" "),
+  variants: {
+    selected: {
+      true: "bg-primary text-primary-foreground border-primary",
+      false: "bg-card border-input text-foreground hover:bg-muted"
+    },
+    disabled: {
+      true: "opacity-40 pointer-events-none",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    selected: "false",
+    disabled: "false"
+  }
+});
+var slotPickerSectionLabelClass = "text-sm font-semibold text-foreground";
+var slotPickerTimezoneClass = "text-xs text-muted-foreground ml-2";
+var SlotPicker = React11.forwardRef(
+  ({
+    days,
+    slotsByDay,
+    value: valueProp,
+    defaultValue,
+    onChange,
+    timezoneLabel,
+    disabledSlots = [],
+    className,
+    ...props
+  }, ref) => {
+    const isControlled = valueProp !== void 0;
+    const [internal, setInternal] = React11.useState(
+      defaultValue
+    );
+    const value = isControlled ? valueProp : internal;
+    const selectedDayId = value?.dayId;
+    const handleDaySelect = React11.useCallback(
+      (dayId) => {
+        const slots = slotsForDay(slotsByDay, dayId);
+        const keepSlot = value?.slot && slots.includes(value.slot) ? value.slot : void 0;
+        const next = keepSlot ? { dayId, slot: keepSlot } : void 0;
+        if (!isControlled) setInternal(next);
+        if (next) onChange?.(next);
+      },
+      [isControlled, onChange, slotsByDay, value]
+    );
+    const handleSlotSelect = React11.useCallback(
+      (slot) => {
+        if (!selectedDayId) return;
+        const next = { dayId: selectedDayId, slot };
+        if (!isControlled) setInternal(next);
+        onChange?.(next);
+      },
+      [isControlled, onChange, selectedDayId]
+    );
+    const api = createSlotPicker();
+    const currentSlots = selectedDayId ? slotsForDay(slotsByDay, selectedDayId) : [];
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(slotPickerVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { className: slotPickerSectionLabelClass, children: "Pick a day" }),
+            /* @__PURE__ */ jsx("div", { role: "radiogroup", "aria-label": "Pick a day", className: cn(slotPickerDayRowClass, "mt-2"), children: days.map((day) => {
+              const isSelected = selectedDayId === day.id;
+              return /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  role: "radio",
+                  "aria-checked": isSelected,
+                  "data-state": isSelected ? "checked" : "unchecked",
+                  className: slotPickerDayVariants({
+                    selected: isSelected ? "true" : "false"
+                  }),
+                  onClick: () => handleDaySelect(day.id),
+                  children: [
+                    /* @__PURE__ */ jsx("span", { className: "text-xs", children: day.weekday }),
+                    /* @__PURE__ */ jsx("span", { className: "text-base font-bold leading-none", children: day.dayNum })
+                  ]
+                },
+                day.id
+              );
+            }) })
+          ] }),
+          selectedDayId && /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsxs("p", { className: slotPickerSectionLabelClass, children: [
+              "Pick a time",
+              timezoneLabel && /* @__PURE__ */ jsx("span", { className: slotPickerTimezoneClass, children: timezoneLabel })
+            ] }),
+            /* @__PURE__ */ jsx("div", { role: "radiogroup", "aria-label": "Pick a time", className: cn(slotPickerGridClass, "mt-2"), children: currentSlots.map((slot) => {
+              const isSelected = isSlotSelected(value, selectedDayId, slot);
+              const isDisabled = disabledSlots.includes(slot);
+              return /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  role: "radio",
+                  "aria-checked": isSelected,
+                  "aria-disabled": isDisabled || void 0,
+                  "data-state": isSelected ? "checked" : "unchecked",
+                  className: slotPickerSlotVariants({
+                    selected: isSelected ? "true" : "false",
+                    disabled: isDisabled ? "true" : "false"
+                  }),
+                  onClick: () => !isDisabled && handleSlotSelect(slot),
+                  children: slot
+                },
+                slot
+              );
+            }) })
+          ] })
+        ]
+      }
+    );
+  }
+);
+SlotPicker.displayName = "SlotPicker";
+
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AltHintState, AnalyticsProvider, AnimatedText, AppShell, AudienceFeatureCard, AudioRoom, AuthGuard, AuthProvider, Avatar2 as Avatar, AvatarFallback, AvatarGroup, AvatarImage, Badge, BadgeDisplay, BottomNav, BrandNetworkCell, Breadcrumbs, BrowserChromeMock, Button, CATEGORY_LABELS, CURSOR_COLORS, Calendar, CalendarHeader, CallControlButton, CallControls, Callout, CalloutContent, CalloutDescription, CalloutIcon, CalloutTitle, Card, CardContent, CardDescription, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselTrigger, Chat, Checkbox, Checklist, CodeBlock, CodeBlockContent, CodeBlockHeader, CodeEditor, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxList, ComboboxTrigger, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, Composer, ConfirmationCard, ContentProtection, CookieConsent, Cursor, DEFAULT_CATEGORIES, DEFAULT_VOICE_PILL_POSITION, DEFAULT_VOICE_PILL_SPEAKER, DEFAULT_WAVEFORM_BAR_COUNT, DEFAULT_WAVEFORM_COLOR, DEFAULT_WAVEFORM_HEIGHT, DEFAULT_WAVEFORM_INTENSITY, DEFAULT_WAVEFORM_SMOOTHING, DataTable, DatePicker, DeviceFrame, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EMOJI_CATEGORIES, EMOJI_DATA, EditorStatusBar, EditorTabs, EmojiPicker, EmptyState, FeedbackButton, FeedbackDialog, FileTree, FileUpload, FloatingReactions, FlowEditor, Footer, GraphView, IconSystem, InfiniteCanvas, InlineEditor, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InstallPrompt, KanbanBoard, KanbanCard, KanbanColumn, KeyboardShortcut, LanguageSelector, LinkCard, LiveCaptions, LiveCursors, LiveTranscript, MarkdownRenderer, MarqueeStrip, MasteryBar, MiniMap, MobileNav, MobileNavContent, MobileNavLink, MobileNavTrigger, Navbar, NumberedSteps, OtpInput, STATUS_COLORS as PRESENCE_STATUS_COLORS, STATUS_LABELS as PRESENCE_STATUS_LABELS, Pagination, PasswordInput, Payment, Popover, PopoverClose, PopoverContent, PopoverTrigger, PreCallLobby, PresenceIndicator, PricingCard, ProgressBar, RadialGauge, RadioGroup, RadioItem, RatingScale, ReactionBar, ReactionBurst, ResizableDivider, ResizableLayout, ResizablePane, SANE_DEFAULTS, STATUS_INDICATOR_COLORS as STATUS_COLORS, STATUS_INDICATOR_LABELS as STATUS_LABELS, STICKY_NOTE_COLORS, SearchBar, SearchResultItem, SearchResults, SectionHead, SegmentedControl, SegmentedControlItem, Select, SelectContent, SelectItem, SelectTrigger, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetTitle, SheetTrigger, ShortcutBadge, ShortcutContext, ShortcutHint, ShortcutProvider, ShortcutRegistry, Sidebar, Skeleton, SkeletonText, SkipToContent, SlideViewer, SlotPicker, SocialAuthButton, SocialAuthRow, SortableList, SpeakingOrb, StatGrid, StatsGrid, StatusIndicator, Step, StepContent, StepDescription, StepIndicator, StepTitle, Steps, StickyNote, Switch, TableOfContents, Tabs, TabsContent, TabsList, TabsTrigger, TelemetryErrorBoundary, TelemetryProvider, Terminal, TestResults, Textarea, ThreadView, Timeline, TimelineItem, Toast, ToastProvider, Toaster, Tooltip, TooltipContent, TooltipTrigger, TypewriterText, VersionSelector, VideoGrid, VideoPlayer, VideoTile, VoicePill, Waveform, Wizard, altHintState, animatedTextVariants, assignCursorColor, avatarFallbackVariants, avatarImageVariants, avatarTokens, avatarVariants, badgeGridVariants, badgeItemVariants, badgeVariants, bottomNavTabVariants, bottomNavVariants, breadcrumbItemVariants, breadcrumbSeparatorStyles, breadcrumbsVariants, buttonTokens, buttonVariants, calendarVariants, canAccessAdmin, canAccessReviewer, cardContentVariants, cardDescriptionVariants, cardFooterVariants, cardHeaderVariants, cardTitleVariants, cardTokens, cardVariants, cellVariants, checkIconPath, checkboxTokens, checkboxVariants, clampVoicePillIntensity, codeEditorTokens, codeEditorVariants, collapsibleContentVariants, comboboxContentVariants, comboboxEmptyVariants, comboboxInputVariants, comboboxItemVariants, comboboxListVariants, comboboxTriggerVariants, commandGroupVariants, commandInputVariants, commandItemVariants, commandVariants, contentProtectionVariants, controlsVariants, createAnalytics, createAppInsightsSink, createConsoleSink, createConversation, createCookieConsent, createGA4ClientSdkSink, createGA4HttpSink, createGA4Sink, createIntensitySamples, createPostHogClientSdkSink, createPostHogHttpSink, createPostHogSink, createPreCallLobby, createSegmentedControl, createSilentSamples, createTelemetry, createVoicePill, createWaveform, dayVariants, deviceFrameVariants, dialogContentVariants, drawWaveform, editorVariants, emojiPickerContainerStyles, emojiPickerEmojiButtonStyles, emojiPickerGridStyles, feedbackDialogVariants, fileUploadDropZoneVariants, fileUploadFileItemStyles, fileUploadFileListStyles, findMessage, footerVariants, formatFileSize, formatRelativeTime, formatShortcut, formatTimestamp, getAssignableRoles, getDefaultPortal, getInitials, getNextSegmentIndex, getReplyCount, getVoicePillAriaLabel, getVoicePillInitials, getVoicePillPosition, getVoicePillPulseStyle, getVoicePillSpeakerKey, getVoicePillSpeakerLabel, getWaveformPeak, globalShortcutRegistry, hasAllRoles, hasAnyRole, hasRole, headerVariants, indeterminateIconPath, inputGroupAddonVariants, inputGroupButtonVariants, inputGroupTokens, inputGroupVariants, inputVariants, installPromptVariants, isWaveformSampleInput, latestBadgeVariants, markdownRendererTokens, menuContentVariants, menuItemVariants, micLevelToBars, mobileNavContentVariants, mobileNavLinkVariants, mobileNavTokens, mobileNavTriggerVariants, mobileNavVariants, navLinkVariants, navbarVariants, nextStickyColor, normalizeBarCount, normalizeIntensity, normalizeSmoothing, normalizeWaveformConfig, normalizeWaveformSamples, optionVariants, otpInputContainerVariants, otpInputSlotVariants, otpInputTokens, overlayStyles, overlayVariants, playerVariants, popoverContentVariants, prepareWaveformCanvas, previewVariants, progressBarVariants, proseVariants, radioCircleVariants, radioGroupVariants, radioItemVariants, reactionAddButtonStyles, reactionBarStyles, reactionCountStyles, reactionEmojiStyles, reactionPillVariants, resampleWaveformSamples, resizableDividerVariants, resizableLayoutTokens, resizableLayoutVariants, resizablePaneVariants, rootIdOf, rowVariants, scaleWaveformSamples, searchBarVariants, searchResultVariants, segmentedControlItemVariants, segmentedControlVariants, selectContentVariants, selectItemVariants, selectMainTimeline, selectReplies, selectRoots, selectThreadMessages, selectTimelineFromState, selectTokens, selectTriggerVariants, selectorVariants, sheetContentVariants, sheetOverlayStyles, shortcutBadgeStyles, shortcutKeyStyles, shortcutSeparatorStyles, sidebarItemVariants, sidebarVariants, skeletonVariants, slideTypeBadgeVariants, slideViewerProgressBarVariants, slideViewerTokens, slideViewerVariants, smoothWaveformSamples, startSessionReplay, statCardVariants, statColumns, statsGridVariants, statusContainerStyles, statusDotVariants, statusLabelStyles, statusPulseVariants, switchThumbVariants, switchTokens, switchVariants, tableVariants, tabsListVariants, tabsTriggerVariants, textareaVariants, threadAuthorStyles, threadAvatarStyles, threadBodyStyles, threadContainerStyles, threadContentStyles, threadMessageStyles, threadReactionsStyles, threadTimestampStyles, toCssDimension, toastVariants, toolbarVariants, tooltipContentVariants, typewriterVariants, useAnalytics, useAuth, useConversation, useCookieConsent, useFloatingReactions, useLogger, useShortcut, useSpan, useTelemetry, useToast, useTrackEvent, useWizard, versionSelectorOptionVariants, versionSelectorVariants, voicePillAvatarStyles, voicePillAvatarWrapStyles, voicePillLabelStyles, voicePillMuteButtonStyles, voicePillPositionVariants, voicePillPulseRingStyles, voicePillRootStyles, voicePillSpeakerStyles, voicePillSubStyles, voicePillTextStyles, voicePillTokens, watermarkVariants, waveformCanvasVariants, waveformVariants };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map