@refraction-ui/react 0.13.0 → 0.15.0

package/dist/index.js

@@ -134,13 +134,13 @@ function createAnimatedText(props) {
     if (words.length === 0) return "";
     return words[state.currentIndex];
   }
-  function getNextIndex() {
+  function getNextIndex2() {
     if (words.length === 0) return 0;
     return (state.currentIndex + 1) % words.length;
   }
   return {
     getCurrentWord,
-    getNextIndex,
+    getNextIndex: getNextIndex2,
     state
   };
 }
@@ -13556,6 +13556,164 @@ function RadioItem({ value, children, disabled = false, className }) {
 RadioGroup.displayName = "RadioGroup";
 RadioItem.displayName = "RadioItem";
 
+// ../rating-scale/dist/index.js
+function createRatingScale(props = {}) {
+  const { value, size = "md" } = props;
+  const ariaProps = {
+    role: "radiogroup"
+  };
+  const dataAttributes = {
+    "data-size": size
+  };
+  if (value !== void 0) {
+    dataAttributes["data-value"] = String(value);
+  }
+  return { ariaProps, dataAttributes };
+}
+function resolveRatingPoints(points, count = 5) {
+  if (points && points.length > 0) return points;
+  return Array.from({ length: Math.max(0, count) }, (_, i) => ({ value: i + 1 }));
+}
+function getNextRatingIndex(current, key, count) {
+  if (count <= 0) return current;
+  switch (key) {
+    case "ArrowRight":
+    case "ArrowUp":
+      return Math.min(current + 1, count - 1);
+    case "ArrowLeft":
+    case "ArrowDown":
+      return Math.max(current - 1, 0);
+    case "Home":
+      return 0;
+    case "End":
+      return count - 1;
+    default:
+      return current;
+  }
+}
+var ratingScaleVariants = cva({
+  base: "inline-flex items-center gap-3",
+  variants: {
+    size: {
+      sm: "",
+      md: ""
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var ratingScaleTrackClass = "inline-flex items-center gap-1.5";
+var ratingScaleItemVariants = cva({
+  base: [
+    "inline-flex items-center justify-center rounded-md border font-medium tabular-nums",
+    "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: {
+    size: {
+      sm: "size-8 text-xs",
+      md: "size-10 text-sm"
+    },
+    state: {
+      checked: "border-primary bg-primary text-primary-foreground",
+      unchecked: "border-input bg-background text-foreground hover:bg-accent hover:text-accent-foreground"
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    state: "unchecked"
+  }
+});
+var ratingScaleLabelClass = "text-xs text-muted-foreground";
+var RatingScale = React11.forwardRef(
+  ({
+    value: valueProp,
+    defaultValue,
+    onValueChange,
+    count = 5,
+    points,
+    minLabel,
+    maxLabel,
+    size = "md",
+    disabled = false,
+    className,
+    ...props
+  }, ref) => {
+    const resolved = React11.useMemo(
+      () => resolveRatingPoints(points, count),
+      [points, count]
+    );
+    const isControlled = valueProp !== void 0;
+    const [internal, setInternal] = React11.useState(
+      defaultValue
+    );
+    const value = isControlled ? valueProp : internal;
+    const btnRefs = React11.useRef([]);
+    const select = React11.useCallback(
+      (next) => {
+        if (!isControlled) setInternal(next);
+        onValueChange?.(next);
+      },
+      [isControlled, onValueChange]
+    );
+    const selectedIndex = resolved.findIndex((p) => p.value === value);
+    const tabbableIndex = selectedIndex === -1 ? 0 : selectedIndex;
+    const handleKeyDown = (event, index) => {
+      const target = getNextRatingIndex(index, event.key, resolved.length);
+      if (target !== index) {
+        event.preventDefault();
+        select(resolved[target].value);
+        btnRefs.current[target]?.focus();
+      }
+    };
+    const api = createRatingScale({ value, size });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(ratingScaleVariants({ size }), className),
+        "aria-disabled": disabled || void 0,
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          minLabel != null && /* @__PURE__ */ jsx("span", { className: ratingScaleLabelClass, children: minLabel }),
+          /* @__PURE__ */ jsx("div", { className: ratingScaleTrackClass, children: resolved.map((point, index) => {
+            const checked = point.value === value;
+            return /* @__PURE__ */ jsx(
+              "button",
+              {
+                ref: (node) => {
+                  btnRefs.current[index] = node;
+                },
+                type: "button",
+                role: "radio",
+                "aria-checked": checked,
+                "aria-label": point.label ?? String(point.value),
+                tabIndex: index === tabbableIndex ? 0 : -1,
+                disabled,
+                "data-state": checked ? "checked" : "unchecked",
+                className: ratingScaleItemVariants({
+                  size,
+                  state: checked ? "checked" : "unchecked"
+                }),
+                onClick: () => select(point.value),
+                onKeyDown: (e) => handleKeyDown(e, index),
+                children: point.label ?? point.value
+              },
+              point.value
+            );
+          }) }),
+          maxLabel != null && /* @__PURE__ */ jsx("span", { className: ratingScaleLabelClass, children: maxLabel })
+        ]
+      }
+    );
+  }
+);
+RatingScale.displayName = "RatingScale";
+
 // ../reaction-bar/dist/index.js
 function createReactionBar(props) {
   const { reactions, onToggle, onAdd } = props;
@@ -17674,6 +17832,4044 @@ EmptyState.displayName = "EmptyState";
 var ConfirmationCard = React11.forwardRef(({ bordered = true, ...props }, ref) => /* @__PURE__ */ jsx(EmptyState, { ref, bordered, ...props }));
 ConfirmationCard.displayName = "ConfirmationCard";
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AltHintState, AnalyticsProvider, AnimatedText, AppShell, AuthGuard, AuthProvider, Avatar2 as Avatar, AvatarFallback, AvatarGroup, AvatarImage, Badge, BadgeDisplay, BottomNav, Breadcrumbs, Button, CATEGORY_LABELS, Calendar, CalendarHeader, Callout, CalloutContent, CalloutDescription, CalloutIcon, CalloutTitle, Card, CardContent, CardDescription, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselTrigger, Chat, Checkbox, 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, 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, EmojiPicker, EmptyState, FeedbackButton, FeedbackDialog, FileTree, FileUpload, Footer, IconSystem, InlineEditor, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InstallPrompt, KeyboardShortcut, LanguageSelector, LinkCard, MarkdownRenderer, MobileNav, MobileNavContent, MobileNavLink, MobileNavTrigger, Navbar, OtpInput, STATUS_COLORS as PRESENCE_STATUS_COLORS, STATUS_LABELS as PRESENCE_STATUS_LABELS, Pagination, PasswordInput, Payment, Popover, PopoverClose, PopoverContent, PopoverTrigger, PresenceIndicator, ProgressBar, RadioGroup, RadioItem, ReactionBar, ResizableDivider, ResizableLayout, ResizablePane, SANE_DEFAULTS, STATUS_INDICATOR_COLORS as STATUS_COLORS, STATUS_INDICATOR_LABELS as STATUS_LABELS, SearchBar, SearchResultItem, SearchResults, 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, StatsGrid, StatusIndicator, Step, StepContent, StepDescription, StepIndicator, StepTitle, Steps, Switch, TableOfContents, Tabs, TabsContent, TabsList, TabsTrigger, TelemetryErrorBoundary, TelemetryProvider, Textarea, ThreadView, Toast, ToastProvider, Toaster, Tooltip, TooltipContent, TooltipTrigger, TypewriterText, VersionSelector, VideoPlayer, VoicePill, Waveform, altHintState, animatedTextVariants, 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, 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, mobileNavContentVariants, mobileNavLinkVariants, mobileNavTokens, mobileNavTriggerVariants, mobileNavVariants, navLinkVariants, navbarVariants, 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, 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, useLogger, useShortcut, useSpan, useTelemetry, useToast, useTrackEvent, versionSelectorOptionVariants, versionSelectorVariants, voicePillAvatarStyles, voicePillAvatarWrapStyles, voicePillLabelStyles, voicePillMuteButtonStyles, voicePillPositionVariants, voicePillPulseRingStyles, voicePillRootStyles, voicePillSpeakerStyles, voicePillSubStyles, voicePillTextStyles, voicePillTokens, watermarkVariants, waveformCanvasVariants, waveformVariants };
+// ../wizard/dist/index.js
+function getStepState(steps, currentIndex) {
+  return steps.map((step, index) => {
+    let status;
+    if (index < currentIndex) {
+      status = "complete";
+    } else if (index === currentIndex) {
+      status = "current";
+    } else {
+      status = "upcoming";
+    }
+    return { step, status, index };
+  });
+}
+function getNextIndex(currentIndex, count) {
+  if (count <= 0) return currentIndex;
+  return Math.min(currentIndex + 1, count - 1);
+}
+function getPrevIndex(currentIndex) {
+  return Math.max(currentIndex - 1, 0);
+}
+function canAdvance(currentIndex, count) {
+  if (count <= 0) return false;
+  return currentIndex < count - 1;
+}
+function createWizard(props = {}) {
+  const { currentIndex = 0, count = 0, orientation = "vertical" } = props;
+  const ariaProps = {
+    role: "group"
+  };
+  const dataAttributes = {
+    "data-step": String(currentIndex),
+    "data-orientation": orientation
+  };
+  if (count > 0) {
+    dataAttributes["data-count"] = String(count);
+  }
+  return { ariaProps, dataAttributes };
+}
+var wizardVariants = cva({
+  base: "flex gap-8",
+  variants: {
+    orientation: {
+      vertical: "flex-row",
+      horizontal: "flex-col"
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical"
+  }
+});
+var wizardRailVariants = cva({
+  base: "flex shrink-0",
+  variants: {
+    orientation: {
+      vertical: "flex-col gap-0",
+      horizontal: "flex-row items-center gap-0"
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical"
+  }
+});
+var wizardStepItemVariants = cva({
+  base: "flex items-center gap-3 relative",
+  variants: {
+    orientation: {
+      vertical: "flex-row",
+      horizontal: "flex-col"
+    },
+    status: {
+      complete: "",
+      current: "",
+      upcoming: ""
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical",
+    status: "upcoming"
+  }
+});
+var wizardStepIndicatorVariants = cva({
+  base: [
+    "relative z-10 flex size-8 shrink-0 items-center justify-center",
+    "rounded-full border-2 text-xs font-semibold transition-colors"
+  ].join(" "),
+  variants: {
+    status: {
+      complete: "border-primary bg-primary text-primary-foreground",
+      current: "border-primary bg-background text-primary",
+      upcoming: "border-border bg-background text-muted-foreground"
+    }
+  },
+  defaultVariants: {
+    status: "upcoming"
+  }
+});
+var wizardStepLabelVariants = cva({
+  base: "text-sm font-medium transition-colors",
+  variants: {
+    status: {
+      complete: "text-foreground",
+      current: "text-foreground",
+      upcoming: "text-muted-foreground"
+    }
+  },
+  defaultVariants: {
+    status: "upcoming"
+  }
+});
+var wizardStepOptionalClass = "text-xs text-muted-foreground";
+var wizardConnectorVariants = cva({
+  base: "shrink-0 transition-colors",
+  variants: {
+    orientation: {
+      vertical: "mx-4 w-0.5 flex-1 min-h-[1.5rem]",
+      horizontal: "my-4 h-0.5 flex-1 min-w-[1.5rem]"
+    },
+    complete: {
+      true: "bg-primary",
+      false: "bg-border"
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical",
+    complete: "false"
+  }
+});
+var wizardContentClass = "flex min-w-0 flex-1 flex-col";
+var wizardFooterClass = "mt-6 flex items-center gap-3";
+var wizardPrimaryButtonVariants = cva({
+  base: [
+    "inline-flex items-center justify-center rounded-md px-4 py-2 text-sm font-medium",
+    "bg-primary text-primary-foreground transition-colors",
+    "hover:bg-primary/90 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(" ")
+});
+var wizardSecondaryButtonVariants = cva({
+  base: [
+    "inline-flex items-center justify-center rounded-md px-4 py-2 text-sm font-medium",
+    "border border-input bg-background text-foreground transition-colors",
+    "hover:bg-accent hover:text-accent-foreground 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(" ")
+});
+var WizardContext = React11.createContext(null);
+function useWizardContext() {
+  const ctx = React11.useContext(WizardContext);
+  if (!ctx) throw new Error("useWizardContext must be used inside <Wizard>");
+  return ctx;
+}
+var Wizard = React11.forwardRef(
+  ({
+    steps,
+    step: stepProp,
+    defaultStep = 0,
+    onStepChange,
+    onComplete,
+    orientation = "vertical",
+    nextLabel = "Next",
+    backLabel = "Back",
+    completeLabel = "Complete",
+    skipLabel = "Skip",
+    children,
+    className,
+    ...props
+  }, ref) => {
+    const isControlled = stepProp !== void 0;
+    const [internal, setInternal] = React11.useState(defaultStep);
+    const currentIndex = isControlled ? stepProp : internal;
+    const advance = React11.useCallback(() => {
+      if (!canAdvance(currentIndex, steps.length)) {
+        onComplete?.();
+        return;
+      }
+      const next = getNextIndex(currentIndex, steps.length);
+      if (!isControlled) setInternal(next);
+      onStepChange?.(next);
+    }, [currentIndex, steps.length, isControlled, onStepChange, onComplete]);
+    const back = React11.useCallback(() => {
+      if (currentIndex === 0) return;
+      const prev = getPrevIndex(currentIndex);
+      if (!isControlled) setInternal(prev);
+      onStepChange?.(prev);
+    }, [currentIndex, isControlled, onStepChange]);
+    const skip = React11.useCallback(() => {
+      advance();
+    }, [advance]);
+    const stepStates = React11.useMemo(
+      () => getStepState(steps, currentIndex),
+      [steps, currentIndex]
+    );
+    const isLastStep = currentIndex === steps.length - 1;
+    const currentStep = steps[currentIndex];
+    const isOptional = currentStep?.optional ?? false;
+    const api = createWizard({
+      currentIndex,
+      count: steps.length,
+      orientation
+    });
+    return /* @__PURE__ */ jsx(WizardContext.Provider, { value: { currentIndex, steps, orientation }, children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(wizardVariants({ orientation }), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(
+            "nav",
+            {
+              "aria-label": "Progress",
+              className: wizardRailVariants({ orientation }),
+              children: stepStates.map((state, i) => {
+                const isLast = i === stepStates.length - 1;
+                return /* @__PURE__ */ jsxs(React11.Fragment, { children: [
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: wizardStepItemVariants({
+                        orientation,
+                        status: state.status
+                      }),
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          "span",
+                          {
+                            "aria-current": state.status === "current" ? "step" : void 0,
+                            className: wizardStepIndicatorVariants({ status: state.status }),
+                            children: state.status === "complete" ? /* @__PURE__ */ jsx(CheckIcon2, {}) : /* @__PURE__ */ jsx("span", { children: state.index + 1 })
+                          }
+                        ),
+                        /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                          /* @__PURE__ */ jsx(
+                            "span",
+                            {
+                              className: wizardStepLabelVariants({ status: state.status }),
+                              children: state.step.label
+                            }
+                          ),
+                          state.step.optional && /* @__PURE__ */ jsx("span", { className: wizardStepOptionalClass, children: "(Optional)" })
+                        ] })
+                      ]
+                    }
+                  ),
+                  !isLast && /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      "aria-hidden": "true",
+                      className: wizardConnectorVariants({
+                        orientation,
+                        complete: state.status === "complete" ? "true" : "false"
+                      })
+                    }
+                  )
+                ] }, state.step.id);
+              })
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: wizardContentClass, children: [
+            /* @__PURE__ */ jsx("div", { className: "flex-1", children: typeof children === "function" ? children(currentIndex) : children }),
+            /* @__PURE__ */ jsxs("div", { className: wizardFooterClass, children: [
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  disabled: currentIndex === 0,
+                  className: wizardSecondaryButtonVariants(),
+                  onClick: back,
+                  children: backLabel
+                }
+              ),
+              isOptional && /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  className: wizardSecondaryButtonVariants(),
+                  onClick: skip,
+                  children: skipLabel
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  className: wizardPrimaryButtonVariants(),
+                  onClick: advance,
+                  children: isLastStep ? completeLabel : nextLabel
+                }
+              )
+            ] })
+          ] })
+        ]
+      }
+    ) });
+  }
+);
+Wizard.displayName = "Wizard";
+function useWizard() {
+  return useWizardContext();
+}
+function CheckIcon2() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2.5,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: "size-4",
+      children: /* @__PURE__ */ jsx("polyline", { points: "20 6 9 17 4 12" })
+    }
+  );
+}
+
+// ../radial-gauge/dist/index.js
+var GAUGE_SIZE_PX = {
+  sm: 80,
+  md: 120,
+  lg: 160
+};
+function clampValue(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function valueToFraction(value, min, max) {
+  if (max === min) return 0;
+  return clampValue((value - min) / (max - min), 0, 1);
+}
+function gaugeStrokeDashoffset(fraction, circumference) {
+  return circumference * (1 - fraction);
+}
+function resolveZoneTone(value, zones, _max) {
+  if (!zones || zones.length === 0) return "default";
+  const sorted = [...zones].sort((a, b) => a.upTo - b.upTo);
+  for (const zone of sorted) {
+    if (value <= zone.upTo) return zone.tone;
+  }
+  return sorted[sorted.length - 1].tone;
+}
+function createRadialGauge(props) {
+  const { value, min = 0, max = 100, size = "md" } = props;
+  const clamped = clampValue(value, min, max);
+  const ariaProps = {
+    role: "meter",
+    "aria-valuenow": clamped,
+    "aria-valuemin": min,
+    "aria-valuemax": max
+  };
+  const dataAttributes = {
+    "data-size": size,
+    "data-value": String(clamped)
+  };
+  return { ariaProps, dataAttributes };
+}
+var radialGaugeRootVariants = cva({
+  base: "inline-block shrink-0",
+  variants: {
+    size: {
+      sm: "",
+      md: "",
+      lg: ""
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var gaugeTrackClass = "fill-none stroke-muted-foreground/20";
+var gaugeArcClass = "fill-none stroke-current transition-[stroke-dashoffset] duration-300 ease-out";
+var gaugeArcToneVariants = cva({
+  base: "",
+  variants: {
+    tone: {
+      default: "text-foreground",
+      success: "text-emerald-500",
+      warning: "text-amber-500",
+      danger: "text-destructive"
+    }
+  },
+  defaultVariants: {
+    tone: "default"
+  }
+});
+var gaugeLabelClass = "fill-foreground text-center font-semibold";
+var gaugeSublabelClass = "fill-muted-foreground";
+var GAUGE_LABEL_FONT_SIZE = {
+  sm: 14,
+  md: 20,
+  lg: 26
+};
+var GAUGE_SUBLABEL_FONT_SIZE = {
+  sm: 9,
+  md: 11,
+  lg: 13
+};
+var RadialGauge = React11.forwardRef(
+  ({
+    value,
+    min = 0,
+    max = 100,
+    size = "md",
+    thickness = 8,
+    label,
+    sublabel,
+    zones,
+    showValue = true,
+    className,
+    ...props
+  }, ref) => {
+    const diameter = GAUGE_SIZE_PX[size];
+    const cx = diameter / 2;
+    const cy = diameter / 2;
+    const r = cx - thickness / 2;
+    const clamped = clampValue(value, min, max);
+    const fraction = valueToFraction(clamped, min, max);
+    const circumference = 2 * Math.PI * r;
+    const dashoffset = gaugeStrokeDashoffset(fraction, circumference);
+    const tone = zones && zones.length > 0 ? resolveZoneTone(clamped, zones) : "default";
+    const api = createRadialGauge({ value, min, max, size });
+    const centerLabel = label ?? (showValue ? String(clamped) : null);
+    const labelFontSize = GAUGE_LABEL_FONT_SIZE[size];
+    const sublabelFontSize = GAUGE_SUBLABEL_FONT_SIZE[size];
+    const labelDy = sublabel ? -sublabelFontSize * 0.8 : 0;
+    return /* @__PURE__ */ jsxs(
+      "svg",
+      {
+        ref,
+        width: diameter,
+        height: diameter,
+        viewBox: `0 0 ${diameter} ${diameter}`,
+        role: "meter",
+        "aria-valuenow": Number(api.ariaProps["aria-valuenow"]),
+        "aria-valuemin": Number(api.ariaProps["aria-valuemin"]),
+        "aria-valuemax": Number(api.ariaProps["aria-valuemax"]),
+        className: cn(radialGaugeRootVariants({ size }), className),
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(
+            "circle",
+            {
+              cx,
+              cy,
+              r,
+              strokeWidth: thickness,
+              className: gaugeTrackClass
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "circle",
+            {
+              cx,
+              cy,
+              r,
+              strokeWidth: thickness,
+              strokeDasharray: `${circumference} ${circumference}`,
+              strokeDashoffset: dashoffset,
+              strokeLinecap: "round",
+              transform: `rotate(-90 ${cx} ${cy})`,
+              className: cn(gaugeArcClass, gaugeArcToneVariants({ tone }))
+            }
+          ),
+          centerLabel != null && /* @__PURE__ */ jsx(
+            "text",
+            {
+              x: cx,
+              y: cy,
+              textAnchor: "middle",
+              dominantBaseline: "central",
+              fontSize: labelFontSize,
+              dy: labelDy,
+              className: gaugeLabelClass,
+              children: centerLabel
+            }
+          ),
+          sublabel != null && /* @__PURE__ */ jsx(
+            "text",
+            {
+              x: cx,
+              y: cy,
+              textAnchor: "middle",
+              dominantBaseline: "central",
+              fontSize: sublabelFontSize,
+              dy: labelDy + labelFontSize * 1.1,
+              className: gaugeSublabelClass,
+              children: sublabel
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+RadialGauge.displayName = "RadialGauge";
+
+// ../timeline/dist/index.js
+function createTimeline(props = {}) {
+  const { orientation = "vertical" } = props;
+  const ariaProps = {
+    role: "list"
+  };
+  const dataAttributes = {
+    "data-orientation": orientation
+  };
+  return { ariaProps, dataAttributes };
+}
+function getTimelineItemAria() {
+  return { role: "listitem" };
+}
+function resolveTimelineItems(items) {
+  return items.map((item) => ({
+    ...item,
+    status: item.status ?? "default",
+    time: item.time ?? "",
+    description: item.description ?? ""
+  }));
+}
+var timelineVariants = cva({
+  base: "relative",
+  variants: {
+    orientation: {
+      vertical: "flex flex-col",
+      horizontal: "flex flex-row items-start overflow-x-auto"
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical"
+  }
+});
+var timelineItemVariants = cva({
+  base: "relative flex gap-4",
+  variants: {
+    orientation: {
+      vertical: "flex-row pb-8 last:pb-0",
+      horizontal: "flex-col items-center flex-1 px-2"
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical"
+  }
+});
+var timelineMarkerVariants = cva({
+  base: [
+    "relative z-10 flex shrink-0 items-center justify-center",
+    "size-3 rounded-full border-2",
+    "transition-colors"
+  ].join(" "),
+  variants: {
+    status: {
+      done: "bg-primary border-primary",
+      current: "bg-background border-primary ring-2 ring-primary ring-offset-2 ring-offset-background",
+      upcoming: "bg-muted border-muted-foreground/30",
+      default: "bg-background border-border"
+    }
+  },
+  defaultVariants: {
+    status: "default"
+  }
+});
+var timelineConnectorVariants = cva({
+  base: "absolute bg-border",
+  variants: {
+    orientation: {
+      vertical: "left-[5px] top-3 w-0.5 h-full",
+      horizontal: "top-[5px] left-1/2 w-full h-0.5"
+    }
+  },
+  defaultVariants: {
+    orientation: "vertical"
+  }
+});
+var timelineGutterClass = "relative flex flex-col items-center";
+var timelineTimeClass = "text-xs text-muted-foreground tabular-nums";
+var timelineTitleClass = "text-sm font-medium text-foreground leading-snug";
+var timelineDescriptionClass = "mt-0.5 text-xs text-muted-foreground leading-relaxed";
+var timelineContentClass = "flex flex-col min-w-0";
+var TimelineItem = React11.forwardRef(
+  ({ item, orientation, isLast }, ref) => {
+    const itemAria = getTimelineItemAria();
+    return /* @__PURE__ */ jsxs(
+      "li",
+      {
+        ref,
+        ...itemAria,
+        className: timelineItemVariants({ orientation }),
+        "data-status": item.status,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: timelineGutterClass, children: [
+            /* @__PURE__ */ jsx("div", { className: timelineMarkerVariants({ status: item.status }) }),
+            !isLast && /* @__PURE__ */ jsx("div", { className: timelineConnectorVariants({ orientation }) })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: timelineContentClass, children: [
+            item.time && /* @__PURE__ */ jsx("span", { className: timelineTimeClass, children: item.time }),
+            /* @__PURE__ */ jsx("span", { className: timelineTitleClass, children: item.title }),
+            item.description && /* @__PURE__ */ jsx("p", { className: timelineDescriptionClass, children: item.description })
+          ] })
+        ]
+      }
+    );
+  }
+);
+TimelineItem.displayName = "TimelineItem";
+var Timeline = React11.forwardRef(
+  ({ items, orientation = "vertical", renderItem, className, ...props }, ref) => {
+    const resolved = React11.useMemo(() => resolveTimelineItems(items), [items]);
+    const api = createTimeline({ orientation });
+    return /* @__PURE__ */ jsx(
+      "ul",
+      {
+        ref,
+        className: cn(timelineVariants({ orientation }), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: resolved.map((item, index) => {
+          const isLast = index === resolved.length - 1;
+          if (renderItem) {
+            return /* @__PURE__ */ jsx(React11.Fragment, { children: renderItem(item, index, isLast) }, item.id);
+          }
+          return /* @__PURE__ */ jsx(
+            TimelineItem,
+            {
+              item,
+              orientation,
+              isLast
+            },
+            item.id
+          );
+        })
+      }
+    );
+  }
+);
+Timeline.displayName = "Timeline";
+
+// ../checklist/dist/index.js
+function createChecklist() {
+  return {
+    ariaProps: { role: "list" },
+    dataAttributes: { "data-component": "checklist" }
+  };
+}
+function checklistProgress(items) {
+  const total = items.length;
+  const completed = items.filter((item) => item.checked).length;
+  const fraction = total === 0 ? 0 : completed / total;
+  return { completed, total, fraction };
+}
+function toggleChecklistItem(items, id) {
+  return items.map(
+    (item) => item.id === id ? { ...item, checked: !item.checked } : item
+  );
+}
+var checklistContainerClass = "flex flex-col gap-2";
+var checklistListClass = "flex flex-col gap-1";
+var checklistItemVariants = cva({
+  base: [
+    "flex items-start gap-3 rounded-md px-2 py-2 text-left",
+    "transition-colors hover:bg-accent",
+    "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: {
+    checked: {
+      true: "text-muted-foreground",
+      false: "text-foreground"
+    }
+  },
+  defaultVariants: {
+    checked: "false"
+  }
+});
+var checklistBoxVariants = cva({
+  base: [
+    "mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded",
+    "border transition-colors"
+  ].join(" "),
+  variants: {
+    checked: {
+      true: "border-primary bg-primary text-primary-foreground",
+      false: "border-input bg-background"
+    }
+  },
+  defaultVariants: {
+    checked: "false"
+  }
+});
+var checklistLabelWrapClass = "flex flex-col gap-0.5 min-w-0";
+var checklistLabelVariants = cva({
+  base: "text-sm font-medium leading-none transition-colors",
+  variants: {
+    checked: {
+      true: "line-through text-muted-foreground",
+      false: "text-foreground"
+    }
+  },
+  defaultVariants: {
+    checked: "false"
+  }
+});
+var checklistDescriptionClass = "text-xs text-muted-foreground";
+var checklistProgressClass = "text-xs text-muted-foreground tabular-nums";
+var Checklist = React11.forwardRef(
+  ({
+    items: itemsProp,
+    defaultItems,
+    onChange,
+    onItemToggle,
+    showProgress = false,
+    className,
+    ...props
+  }, ref) => {
+    const isControlled = itemsProp !== void 0;
+    const [internal, setInternal] = React11.useState(
+      defaultItems ?? []
+    );
+    const items = isControlled ? itemsProp : internal;
+    const handleToggle = React11.useCallback(
+      (id) => {
+        const next = toggleChecklistItem(items, id);
+        if (!isControlled) setInternal(next);
+        onChange?.(next);
+        onItemToggle?.(id);
+      },
+      [items, isControlled, onChange, onItemToggle]
+    );
+    const { ariaProps, dataAttributes } = createChecklist();
+    const progress = showProgress ? checklistProgress(items) : null;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(checklistContainerClass, className),
+        ...dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("ul", { className: checklistListClass, ...ariaProps, children: items.map((item) => {
+            const checked = Boolean(item.checked);
+            return /* @__PURE__ */ jsx("li", { role: "presentation", children: /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                role: "checkbox",
+                "aria-checked": checked,
+                "data-state": checked ? "checked" : "unchecked",
+                className: checklistItemVariants({ checked: checked ? "true" : "false" }),
+                onClick: () => handleToggle(item.id),
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      className: checklistBoxVariants({ checked: checked ? "true" : "false" }),
+                      children: checked && /* @__PURE__ */ jsx(
+                        "svg",
+                        {
+                          viewBox: "0 0 12 12",
+                          fill: "none",
+                          className: "h-3 w-3",
+                          "aria-hidden": "true",
+                          children: /* @__PURE__ */ jsx(
+                            "path",
+                            {
+                              d: "M2 6l3 3 5-5",
+                              stroke: "currentColor",
+                              strokeWidth: "1.5",
+                              strokeLinecap: "round",
+                              strokeLinejoin: "round"
+                            }
+                          )
+                        }
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("span", { className: checklistLabelWrapClass, children: [
+                    /* @__PURE__ */ jsx("span", { className: checklistLabelVariants({ checked: checked ? "true" : "false" }), children: item.label }),
+                    item.description && /* @__PURE__ */ jsx("span", { className: checklistDescriptionClass, children: item.description })
+                  ] })
+                ]
+              }
+            ) }, item.id);
+          }) }),
+          progress !== null && /* @__PURE__ */ jsx("p", { className: checklistProgressClass, children: `${progress.completed}/${progress.total} completed` })
+        ]
+      }
+    );
+  }
+);
+Checklist.displayName = "Checklist";
+
+// ../editor-tabs/dist/index.js
+function createEditorTabs(props = {}) {
+  const { activeId } = props;
+  const ariaProps = {
+    role: "tablist"
+  };
+  const dataAttributes = {};
+  if (activeId !== void 0) {
+    dataAttributes["data-active-id"] = activeId;
+  }
+  return { ariaProps, dataAttributes };
+}
+function getNextTabIndex(currentIndex, key, count) {
+  if (count <= 0) return currentIndex;
+  switch (key) {
+    case "ArrowRight":
+      return (currentIndex + 1) % count;
+    case "ArrowLeft":
+      return (currentIndex - 1 + count) % count;
+    case "Home":
+      return 0;
+    case "End":
+      return count - 1;
+    default:
+      return currentIndex;
+  }
+}
+var editorTabsVariants = cva({
+  base: "inline-flex items-end gap-0 border-b border-border bg-muted/40 overflow-x-auto",
+  variants: {},
+  defaultVariants: {}
+});
+var editorTabVariants = cva({
+  base: [
+    "group inline-flex items-center gap-1.5 px-3 py-2 text-sm font-medium",
+    "border-b-2 transition-colors select-none whitespace-nowrap",
+    "focus-visible:outline-none focus-visible:ring-2",
+    "focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background"
+  ].join(" "),
+  variants: {
+    state: {
+      active: [
+        "border-primary text-foreground bg-background",
+        "border-t border-l border-r border-border border-b-background -mb-px"
+      ].join(" "),
+      inactive: [
+        "border-transparent text-muted-foreground",
+        "hover:text-foreground hover:bg-background/60"
+      ].join(" ")
+    }
+  },
+  defaultVariants: {
+    state: "inactive"
+  }
+});
+var editorTabDirtyDotClass = "size-1.5 rounded-full bg-amber-400 shrink-0";
+var editorTabCloseButtonClass = [
+  "ml-1 inline-flex items-center justify-center rounded-sm size-4 shrink-0",
+  "text-muted-foreground opacity-0 transition-opacity",
+  "group-hover:opacity-100 focus-visible:opacity-100",
+  "hover:bg-accent hover:text-foreground",
+  "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
+].join(" ");
+var editorTabIconClass = "shrink-0 text-[0.85em] leading-none";
+var EditorTabs = React11.forwardRef(
+  ({ tabs, activeId, onSelect, onClose, className, ...props }, ref) => {
+    const tabRefs = React11.useRef([]);
+    const activeIndex = tabs.findIndex((t) => t.id === activeId);
+    const tabbableIndex = activeIndex === -1 ? 0 : activeIndex;
+    const handleKeyDown = (event, index) => {
+      const next = getNextTabIndex(index, event.key, tabs.length);
+      if (next !== index) {
+        event.preventDefault();
+        onSelect(tabs[next].id);
+        tabRefs.current[next]?.focus();
+      }
+    };
+    const api = createEditorTabs({ activeId });
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(editorTabsVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: tabs.map((tab, index) => {
+          const isActive = tab.id === activeId;
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              ref: (node) => {
+                tabRefs.current[index] = node;
+              },
+              type: "button",
+              role: "tab",
+              "aria-selected": isActive,
+              "aria-controls": `tabpanel-${tab.id}`,
+              id: `tab-${tab.id}`,
+              tabIndex: index === tabbableIndex ? 0 : -1,
+              "data-state": isActive ? "active" : "inactive",
+              className: editorTabVariants({ state: isActive ? "active" : "inactive" }),
+              onClick: () => onSelect(tab.id),
+              onKeyDown: (e) => handleKeyDown(e, index),
+              children: [
+                tab.icon && /* @__PURE__ */ jsx("span", { className: editorTabIconClass, "aria-hidden": "true", children: tab.icon }),
+                /* @__PURE__ */ jsx("span", { children: tab.label }),
+                tab.dirty && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: editorTabDirtyDotClass,
+                    "aria-label": "unsaved changes",
+                    role: "status"
+                  }
+                ),
+                tab.closable && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    role: "button",
+                    "aria-label": `Close ${tab.label}`,
+                    tabIndex: -1,
+                    className: editorTabCloseButtonClass,
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      onClose?.(tab.id);
+                    },
+                    onKeyDown: (e) => {
+                      if (e.key === "Enter" || e.key === " ") {
+                        e.stopPropagation();
+                        onClose?.(tab.id);
+                      }
+                    },
+                    children: "\xD7"
+                  }
+                )
+              ]
+            },
+            tab.id
+          );
+        })
+      }
+    );
+  }
+);
+EditorTabs.displayName = "EditorTabs";
+
+// ../terminal/dist/index.js
+function createTerminal(options = {}) {
+  const ariaProps = {
+    role: "log",
+    "aria-live": "polite"
+  };
+  if (options.label) {
+    ariaProps["aria-label"] = options.label;
+  }
+  const dataAttributes = {
+    "data-component": "terminal"
+  };
+  return { ariaProps, dataAttributes };
+}
+var terminalVariants = cva({
+  base: [
+    "relative rounded-lg border border-border bg-card font-mono text-sm",
+    "overflow-y-auto overflow-x-auto",
+    "p-4 space-y-0.5"
+  ].join(" "),
+  variants: {
+    maxHeight: {
+      sm: "max-h-48",
+      md: "max-h-80",
+      lg: "max-h-[32rem]",
+      none: ""
+    }
+  },
+  defaultVariants: {
+    maxHeight: "md"
+  }
+});
+var terminalLineVariants = cva({
+  base: "block whitespace-pre-wrap break-all leading-relaxed",
+  variants: {
+    kind: {
+      /** The user-typed command: full foreground, bold weight. */
+      command: "text-foreground font-semibold",
+      /** Normal program output. */
+      stdout: "text-foreground",
+      /** Error / stderr output — uses the destructive semantic token. */
+      stderr: "text-destructive",
+      /** Informational summary lines — muted, visually de-emphasised. */
+      info: "text-muted-foreground",
+      /**
+       * Success / passing lines — green-family.
+       * Maps to `text-emerald-500` via the Tailwind semantic alias used
+       * across the design system; downstream themes can override this token.
+       */
+      success: "text-emerald-500 dark:text-emerald-400"
+    }
+  },
+  defaultVariants: {
+    kind: "stdout"
+  }
+});
+var terminalPromptClass = "select-none mr-2 text-muted-foreground";
+var Terminal = React11.forwardRef(
+  ({
+    lines,
+    promptSymbol = "$",
+    maxHeight = "md",
+    className,
+    "aria-label": ariaLabel,
+    ...props
+  }, ref) => {
+    const api = createTerminal({ label: ariaLabel });
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(terminalVariants({ maxHeight }), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: lines.map((line, index) => {
+          const key = line.id ?? index;
+          return /* @__PURE__ */ jsx("span", { className: terminalLineVariants({ kind: line.kind }), children: line.kind === "command" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("span", { className: terminalPromptClass, children: promptSymbol }),
+            line.text
+          ] }) : line.text }, key);
+        })
+      }
+    );
+  }
+);
+Terminal.displayName = "Terminal";
+
+// ../test-results/dist/index.js
+function summarizeTests(results) {
+  let passed = 0;
+  let failed = 0;
+  let skipped = 0;
+  for (const r of results) {
+    if (r.status === "pass") passed++;
+    else if (r.status === "fail") failed++;
+    else skipped++;
+  }
+  return {
+    total: results.length,
+    passed,
+    failed,
+    skipped,
+    allPassed: failed === 0 && skipped === 0 && results.length > 0
+  };
+}
+function createTestResults() {
+  const ariaProps = {
+    role: "list"
+  };
+  const dataAttributes = {
+    "data-component": "test-results"
+  };
+  return { ariaProps, dataAttributes };
+}
+var testResultsContainerVariants = cva({
+  base: "flex flex-col gap-3 w-full",
+  variants: {},
+  defaultVariants: {}
+});
+var testResultsSummaryVariants = cva({
+  base: [
+    "flex items-center gap-2 rounded-md px-3 py-2 text-sm font-medium",
+    "border"
+  ].join(" "),
+  variants: {
+    outcome: {
+      pass: "border-success/30 bg-success/10 text-success",
+      fail: "border-destructive/30 bg-destructive/10 text-destructive",
+      skip: "border-muted/30 bg-muted/10 text-muted-foreground"
+    }
+  },
+  defaultVariants: {
+    outcome: "pass"
+  }
+});
+var testRowVariants = cva({
+  base: [
+    "flex flex-col gap-1.5 rounded-md border px-3 py-2.5 text-sm"
+  ].join(" "),
+  variants: {
+    status: {
+      pass: "border-success/20 bg-success/5",
+      fail: "border-destructive/20 bg-destructive/5",
+      skip: "border-muted/20 bg-muted/5"
+    }
+  },
+  defaultVariants: {
+    status: "pass"
+  }
+});
+var testStatusBadgeVariants = cva({
+  base: "inline-flex items-center rounded px-1.5 py-0.5 text-xs font-semibold uppercase tracking-wide",
+  variants: {
+    status: {
+      pass: "bg-success/20 text-success",
+      fail: "bg-destructive/20 text-destructive",
+      skip: "bg-muted text-muted-foreground"
+    }
+  },
+  defaultVariants: {
+    status: "pass"
+  }
+});
+var testNameClass = "font-medium text-foreground";
+var testDurationClass = "text-xs text-muted-foreground";
+var testDiffBlockVariants = cva({
+  base: [
+    "rounded border-l-2 bg-muted/30 px-3 py-2 font-mono text-xs text-foreground"
+  ].join(" "),
+  variants: {
+    side: {
+      expected: "border-l-success text-success",
+      actual: "border-l-destructive text-destructive"
+    }
+  },
+  defaultVariants: {
+    side: "actual"
+  }
+});
+var testMessageClass = "text-xs text-muted-foreground italic";
+var TestResults = React11.forwardRef(
+  ({ results, showSummary = true, className, ...props }, ref) => {
+    const summary = React11.useMemo(() => summarizeTests(results), [results]);
+    const { ariaProps, dataAttributes } = createTestResults();
+    const summaryOutcome = summary.failed > 0 ? "fail" : summary.skipped > 0 ? "skip" : "pass";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(testResultsContainerVariants(), className),
+        ...dataAttributes,
+        ...props,
+        children: [
+          showSummary && results.length > 0 && /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: testResultsSummaryVariants({ outcome: summaryOutcome }),
+              "aria-live": "polite",
+              children: [
+                /* @__PURE__ */ jsx("span", { children: `${summary.passed}/${summary.total} passed` }),
+                summary.failed > 0 && /* @__PURE__ */ jsx("span", { children: `\xB7 ${summary.failed} failed` }),
+                summary.skipped > 0 && /* @__PURE__ */ jsx("span", { children: `\xB7 ${summary.skipped} skipped` })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("ul", { ...ariaProps, className: "flex flex-col gap-2", children: results.map((result) => /* @__PURE__ */ jsxs("li", { role: "listitem", className: testRowVariants({ status: result.status }), children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
+                /* @__PURE__ */ jsx("span", { className: testStatusBadgeVariants({ status: result.status }), children: result.status }),
+                /* @__PURE__ */ jsx("span", { className: cn(testNameClass, "truncate"), children: result.name })
+              ] }),
+              result.durationMs !== void 0 && /* @__PURE__ */ jsx("span", { className: testDurationClass, children: `${result.durationMs} ms` })
+            ] }),
+            result.status === "fail" && result.expected !== void 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 mt-1", children: [
+              /* @__PURE__ */ jsxs("div", { className: testDiffBlockVariants({ side: "expected" }), children: [
+                /* @__PURE__ */ jsx("span", { className: "opacity-60 mr-1 select-none", children: "expected" }),
+                result.expected
+              ] }),
+              result.actual !== void 0 && /* @__PURE__ */ jsxs("div", { className: testDiffBlockVariants({ side: "actual" }), children: [
+                /* @__PURE__ */ jsx("span", { className: "opacity-60 mr-1 select-none", children: "actual" }),
+                result.actual
+              ] })
+            ] }),
+            result.message && /* @__PURE__ */ jsx("p", { className: testMessageClass, children: result.message })
+          ] }, result.id)) })
+        ]
+      }
+    );
+  }
+);
+TestResults.displayName = "TestResults";
+
+// ../editor-status-bar/dist/index.js
+function formatCursorPosition(line, col) {
+  return `Ln ${line}, Col ${col}`;
+}
+function partitionSegments(segments) {
+  const left = [];
+  const right = [];
+  for (const seg of segments) {
+    if (seg.align === "right") {
+      right.push(seg);
+    } else {
+      left.push(seg);
+    }
+  }
+  return { left, right };
+}
+function createEditorStatusBar() {
+  const ariaProps = {
+    role: "status",
+    "aria-live": "polite"
+  };
+  const dataAttributes = {
+    "data-component": "editor-status-bar"
+  };
+  return { ariaProps, dataAttributes };
+}
+var editorStatusBarVariants = cva({
+  base: [
+    "flex items-center justify-between",
+    "w-full h-6 px-2 gap-4",
+    "text-xs font-mono",
+    "bg-muted text-muted-foreground",
+    "border-t border-border",
+    "select-none"
+  ].join(" "),
+  variants: {},
+  defaultVariants: {}
+});
+var statusBarGroupClass = "flex items-center gap-3 overflow-hidden";
+var statusBarSegmentVariants = cva({
+  base: "inline-flex items-center whitespace-nowrap truncate leading-none",
+  variants: {
+    tone: {
+      default: "text-muted-foreground",
+      muted: "text-muted-foreground/60",
+      accent: "text-primary"
+    }
+  },
+  defaultVariants: {
+    tone: "default"
+  }
+});
+function buildSegmentsFromConvenienceProps(props) {
+  const segs = [];
+  if (props.line !== void 0 && props.col !== void 0) {
+    segs.push({
+      id: "cursor",
+      label: formatCursorPosition(props.line, props.col),
+      align: "left",
+      tone: "default"
+    });
+  }
+  if (props.indentation) {
+    segs.push({ id: "indentation", label: props.indentation, align: "left", tone: "muted" });
+  }
+  if (props.language) {
+    segs.push({ id: "language", label: props.language, align: "right", tone: "accent" });
+  }
+  if (props.encoding) {
+    segs.push({ id: "encoding", label: props.encoding, align: "right", tone: "muted" });
+  }
+  if (props.eol) {
+    segs.push({ id: "eol", label: props.eol, align: "right", tone: "muted" });
+  }
+  if (props.status) {
+    segs.push({ id: "status", label: props.status, align: "right", tone: "muted" });
+  }
+  return segs;
+}
+var EditorStatusBar = React11.forwardRef(
+  ({
+    segments: segmentsProp,
+    line,
+    col,
+    indentation,
+    language,
+    encoding,
+    eol,
+    status,
+    className,
+    ...props
+  }, ref) => {
+    const segments = segmentsProp ?? buildSegmentsFromConvenienceProps({
+      line,
+      col,
+      indentation,
+      language,
+      encoding,
+      eol,
+      status
+    });
+    const { left, right } = partitionSegments(segments);
+    const api = createEditorStatusBar();
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(editorStatusBarVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: statusBarGroupClass, children: left.map((seg) => /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: statusBarSegmentVariants({ tone: seg.tone ?? "default" }),
+              children: seg.label
+            },
+            seg.id
+          )) }),
+          /* @__PURE__ */ jsx("div", { className: statusBarGroupClass, children: right.map((seg) => /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: statusBarSegmentVariants({ tone: seg.tone ?? "default" }),
+              children: seg.label
+            },
+            seg.id
+          )) })
+        ]
+      }
+    );
+  }
+);
+EditorStatusBar.displayName = "EditorStatusBar";
+
+// ../video-tile/dist/index.js
+function createVideoTile(props = {}) {
+  const { speaking = false, pinned = false } = props;
+  return {
+    dataAttributes: {
+      "data-speaking": speaking ? "true" : "false",
+      "data-pinned": pinned ? "true" : "false"
+    },
+    ariaProps: {
+      role: "group"
+    }
+  };
+}
+function getInitials3(name) {
+  const words = name.trim().split(/\s+/).filter(Boolean);
+  return words.slice(0, 2).map((w) => w[0].toUpperCase()).join("");
+}
+var videoTileVariants = cva({
+  base: [
+    "relative aspect-video overflow-hidden rounded-lg bg-muted",
+    "transition-shadow duration-200"
+  ].join(" "),
+  variants: {
+    speaking: {
+      "true": "ring-2 ring-emerald-500 dark:ring-emerald-400 ring-offset-2 ring-offset-background",
+      "false": ""
+    },
+    pinned: {
+      "true": "ring-2 ring-primary ring-offset-2 ring-offset-background",
+      "false": ""
+    }
+  },
+  defaultVariants: {
+    speaking: "false",
+    pinned: "false"
+  }
+});
+var videoTileNameChipClass = "absolute bottom-2 left-2 flex items-center gap-1.5 rounded-md bg-background/70 px-2 py-0.5 text-xs font-medium text-foreground backdrop-blur-sm";
+var videoTileMicIconClass = "text-destructive";
+var videoTileAvatarFallbackClass = "absolute inset-0 flex items-center justify-center";
+var videoTileAvatarCircleClass = "flex size-16 items-center justify-center rounded-full bg-card text-foreground text-xl font-semibold select-none";
+var videoTileReactionBadgeClass = "absolute right-2 top-2 flex items-center justify-center rounded-full bg-background/70 px-1.5 py-0.5 text-sm backdrop-blur-sm";
+var VideoTile = React11.forwardRef(
+  ({
+    name,
+    micState = "on",
+    speaking = false,
+    pinned = false,
+    avatarUrl,
+    mediaSlot,
+    reaction,
+    className,
+    ...props
+  }, ref) => {
+    const api = createVideoTile({ speaking, pinned });
+    const initials = getInitials3(name);
+    const isMuted = micState === "muted";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          videoTileVariants({
+            speaking: speaking ? "true" : "false",
+            pinned: pinned ? "true" : "false"
+          }),
+          className
+        ),
+        "aria-label": name,
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          mediaSlot != null ? /* @__PURE__ */ jsx("div", { className: "absolute inset-0 h-full w-full object-cover", children: mediaSlot }) : (
+            /* Avatar fallback */
+            /* @__PURE__ */ jsx("div", { className: videoTileAvatarFallbackClass, children: avatarUrl ? /* @__PURE__ */ jsx(
+              "img",
+              {
+                src: avatarUrl,
+                alt: name,
+                className: videoTileAvatarCircleClass
+              }
+            ) : /* @__PURE__ */ jsx("div", { className: videoTileAvatarCircleClass, "aria-hidden": "true", children: initials }) })
+          ),
+          reaction != null && /* @__PURE__ */ jsx("div", { className: videoTileReactionBadgeClass, "aria-hidden": "true", children: reaction }),
+          /* @__PURE__ */ jsxs("div", { className: videoTileNameChipClass, children: [
+            /* @__PURE__ */ jsx("span", { children: `${name}${isMuted ? "" : ""}` }),
+            isMuted && /* @__PURE__ */ jsx("span", { className: videoTileMicIconClass, "aria-label": "Microphone muted", children: /* @__PURE__ */ jsxs(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "12",
+                height: "12",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                "aria-hidden": "true",
+                children: [
+                  /* @__PURE__ */ jsx("line", { x1: "2", y1: "2", x2: "22", y2: "22" }),
+                  /* @__PURE__ */ jsx("path", { d: "M18.89 13.23A7.12 7.12 0 0 0 19 12v-2" }),
+                  /* @__PURE__ */ jsx("path", { d: "M5 10v2a7 7 0 0 0 12 5" }),
+                  /* @__PURE__ */ jsx("path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33" }),
+                  /* @__PURE__ */ jsx("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12" }),
+                  /* @__PURE__ */ jsx("line", { x1: "12", y1: "19", x2: "12", y2: "22" })
+                ]
+              }
+            ) })
+          ] })
+        ]
+      }
+    );
+  }
+);
+VideoTile.displayName = "VideoTile";
+
+// ../video-grid/dist/index.js
+function computeGridColumns(count) {
+  if (count <= 1) return 1;
+  if (count <= 4) return 2;
+  if (count <= 9) return 3;
+  if (count <= 16) return 4;
+  if (count <= 25) return 5;
+  return 6;
+}
+function createVideoGrid(props = {}) {
+  const { layout = "auto" } = props;
+  return {
+    ariaProps: {
+      role: "group"
+    },
+    dataAttributes: {
+      "data-layout": layout
+    }
+  };
+}
+var videoGridVariants = cva({
+  base: "w-full h-full gap-2",
+  variants: {
+    layout: {
+      grid: "grid",
+      speaker: "flex flex-col",
+      auto: "grid"
+    }
+  },
+  defaultVariants: {
+    layout: "auto"
+  }
+});
+var videoGridSpotlightClass = "relative flex-1 min-h-0 rounded-xl overflow-hidden bg-muted";
+var videoGridFilmstripClass = "flex flex-row gap-2 overflow-x-auto py-1 shrink-0";
+var videoGridFilmstripTileClass = "w-36 shrink-0";
+var VideoGrid = React11.forwardRef(
+  ({
+    participants,
+    layout = "auto",
+    spotlightId,
+    className,
+    style,
+    ...props
+  }, ref) => {
+    const count = participants.length;
+    const effectiveLayout = layout === "auto" ? count <= 1 ? "speaker" : "grid" : layout;
+    const api = createVideoGrid({ layout: effectiveLayout });
+    const columns = computeGridColumns(count);
+    const gridStyle = effectiveLayout !== "speaker" ? { gridTemplateColumns: `repeat(${columns}, 1fr)`, ...style } : { ...style };
+    if (effectiveLayout === "speaker") {
+      const spotlightParticipant = participants.find((p) => p.id === spotlightId) ?? participants[0];
+      const filmstrip = participants.filter(
+        (p) => p.id !== spotlightParticipant?.id
+      );
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ref,
+          className: cn(videoGridVariants({ layout: "speaker" }), className),
+          style,
+          ...api.ariaProps,
+          ...api.dataAttributes,
+          ...props,
+          children: [
+            /* @__PURE__ */ jsx("div", { className: videoGridSpotlightClass, children: spotlightParticipant && /* @__PURE__ */ jsx(
+              VideoTile,
+              {
+                name: spotlightParticipant.name,
+                micState: spotlightParticipant.micState ?? "on",
+                speaking: spotlightParticipant.speaking,
+                pinned: spotlightParticipant.pinned
+              },
+              spotlightParticipant.id
+            ) }),
+            filmstrip.length > 0 && /* @__PURE__ */ jsx("div", { className: videoGridFilmstripClass, children: filmstrip.map((p) => /* @__PURE__ */ jsx("div", { className: videoGridFilmstripTileClass, children: /* @__PURE__ */ jsx(
+              VideoTile,
+              {
+                name: p.name,
+                micState: p.micState ?? "on",
+                speaking: p.speaking,
+                pinned: p.pinned
+              }
+            ) }, p.id)) })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(videoGridVariants({ layout: effectiveLayout }), className),
+        style: gridStyle,
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: participants.map((p) => /* @__PURE__ */ jsx(
+          VideoTile,
+          {
+            name: p.name,
+            micState: p.micState ?? "on",
+            speaking: p.speaking,
+            pinned: p.pinned
+          },
+          p.id
+        ))
+      }
+    );
+  }
+);
+VideoGrid.displayName = "VideoGrid";
+
+// ../call-controls/dist/index.js
+function createCallControls(_props = {}) {
+  const ariaProps = {
+    role: "toolbar",
+    "aria-label": "Call controls"
+  };
+  const dataAttributes = {
+    "data-component": "call-controls"
+  };
+  return { ariaProps, dataAttributes };
+}
+var callControlsVariants = cva({
+  base: [
+    "inline-flex items-center justify-center gap-2",
+    "rounded-xl bg-card px-4 py-3",
+    "shadow-sm border border-border"
+  ].join(" "),
+  variants: {
+    size: {
+      sm: "gap-1.5 px-3 py-2",
+      md: "gap-2 px-4 py-3"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var callControlButtonVariants = cva({
+  base: [
+    "inline-flex flex-col items-center justify-center rounded-full",
+    "font-medium 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",
+    "cursor-pointer"
+  ].join(" "),
+  variants: {
+    size: {
+      sm: "size-9 text-xs",
+      md: "size-11 text-xs"
+    },
+    tone: {
+      default: "bg-muted text-foreground hover:bg-muted/80",
+      active: "bg-primary text-primary-foreground hover:bg-primary/90",
+      destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90"
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    tone: "default"
+  }
+});
+var callControlLabelClass = "sr-only text-[10px] leading-none mt-0.5";
+var CallControlButton = React11.forwardRef(
+  ({
+    label,
+    icon,
+    tone = "default",
+    pressed,
+    size = "md",
+    className,
+    ...props
+  }, ref) => {
+    const ariaPressedProps = pressed !== void 0 ? { "aria-pressed": pressed } : {};
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref,
+        type: "button",
+        "aria-label": label,
+        ...ariaPressedProps,
+        className: cn(callControlButtonVariants({ tone, size }), className),
+        ...props,
+        children: [
+          icon,
+          /* @__PURE__ */ jsx("span", { className: callControlLabelClass, children: label })
+        ]
+      }
+    );
+  }
+);
+CallControlButton.displayName = "CallControlButton";
+var CallControls = React11.forwardRef(
+  ({ size = "md", className, children, ...props }, ref) => {
+    const api = createCallControls();
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(callControlsVariants({ size }), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children
+      }
+    );
+  }
+);
+CallControls.displayName = "CallControls";
+
+// ../live-captions/dist/index.js
+function visibleCues(cues, maxLines = 2) {
+  if (maxLines <= 0) return [];
+  return cues.slice(-maxLines);
+}
+function createLiveCaptions() {
+  const ariaProps = {
+    role: "log",
+    "aria-live": "polite",
+    "aria-atomic": false
+  };
+  const dataAttributes = {
+    "data-component": "live-captions"
+  };
+  return { ariaProps, dataAttributes };
+}
+var liveCaptionsVariants = cva({
+  base: [
+    "relative mx-auto w-full max-w-2xl rounded-xl",
+    "bg-card/80 backdrop-blur-sm",
+    "px-4 py-3 space-y-1"
+  ].join(" "),
+  variants: {
+    /** Controls how the container is positioned in the layout. */
+    position: {
+      /** Sits in normal document flow (default). */
+      static: "",
+      /** Absolutely positioned — consumer places it with inset utilities. */
+      absolute: "absolute"
+    }
+  },
+  defaultVariants: {
+    position: "static"
+  }
+});
+var liveCaptionsCueVariants = cva({
+  base: "text-sm leading-snug text-foreground",
+  variants: {
+    interim: {
+      true: "opacity-60 italic",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    interim: "false"
+  }
+});
+var liveCaptionsSpeakerClass = "font-medium text-muted-foreground";
+var LiveCaptions = React11.forwardRef(
+  ({ cues, maxLines = 2, position = "static", className, ...props }, ref) => {
+    const { ariaProps, dataAttributes } = createLiveCaptions();
+    const shown = visibleCues(cues, maxLines);
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(liveCaptionsVariants({ position }), className),
+        ...ariaProps,
+        ...dataAttributes,
+        ...props,
+        children: shown.map((cue) => /* @__PURE__ */ jsx(
+          "p",
+          {
+            className: liveCaptionsCueVariants({
+              interim: cue.final === false ? "true" : "false"
+            }),
+            children: cue.speaker ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("span", { className: liveCaptionsSpeakerClass, children: cue.speaker }),
+              `: ${cue.text}`
+            ] }) : cue.text
+          },
+          cue.id
+        ))
+      }
+    );
+  }
+);
+LiveCaptions.displayName = "LiveCaptions";
+
+// ../live-transcript/dist/index.js
+function groupConsecutiveBySpeaker(entries) {
+  const blocks = [];
+  for (const entry of entries) {
+    const last = blocks[blocks.length - 1];
+    if (last && last.speaker === entry.speaker) {
+      last.texts.push(entry.text);
+    } else {
+      blocks.push({
+        speaker: entry.speaker,
+        timestamp: entry.timestamp,
+        speakerColor: entry.speakerColor,
+        texts: [entry.text]
+      });
+    }
+  }
+  return blocks;
+}
+function createLiveTranscript() {
+  const ariaProps = {
+    role: "log",
+    "aria-live": "polite"
+  };
+  const dataAttributes = {
+    "data-component": "live-transcript"
+  };
+  return { ariaProps, dataAttributes };
+}
+var liveTranscriptVariants = cva({
+  base: "flex flex-col overflow-y-auto p-4 gap-4",
+  variants: {
+    compact: {
+      true: "gap-2 p-3",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    compact: "false"
+  }
+});
+var transcriptBlockVariants = cva({
+  base: "flex flex-col gap-1",
+  variants: {
+    compact: {
+      true: "gap-0.5",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    compact: "false"
+  }
+});
+var transcriptSpeakerRowClass = "flex items-baseline gap-2";
+var transcriptSpeakerNameClass = "text-sm font-semibold text-foreground leading-snug";
+var transcriptTimestampClass = "text-xs text-muted-foreground tabular-nums";
+var transcriptTextLineClass = "text-sm text-foreground/80 leading-relaxed";
+var LiveTranscript = React11.forwardRef(({ entries, compact = false, className, ...props }, ref) => {
+  const api = createLiveTranscript();
+  const blocks = React11.useMemo(
+    () => groupConsecutiveBySpeaker(entries),
+    [entries]
+  );
+  const compactVariant = compact ? "true" : "false";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(liveTranscriptVariants({ compact: compactVariant }), className),
+      ...api.ariaProps,
+      ...api.dataAttributes,
+      ...props,
+      children: blocks.map((block, blockIndex) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: transcriptBlockVariants({ compact: compactVariant }),
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: transcriptSpeakerRowClass, children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: transcriptSpeakerNameClass,
+                  style: block.speakerColor ? { color: block.speakerColor } : void 0,
+                  children: block.speaker
+                }
+              ),
+              block.timestamp && /* @__PURE__ */ jsx("span", { className: transcriptTimestampClass, children: block.timestamp })
+            ] }),
+            block.texts.map((text, textIndex) => /* @__PURE__ */ jsx(
+              "p",
+              {
+                className: transcriptTextLineClass,
+                children: text
+              },
+              textIndex
+            ))
+          ]
+        },
+        `${block.speaker}-${blockIndex}`
+      ))
+    }
+  );
+});
+LiveTranscript.displayName = "LiveTranscript";
+
+// ../audio-room/dist/index.js
+function getInitials4(name) {
+  const words = name.trim().split(/\s+/).filter((w) => /[A-Za-z]/.test(w));
+  if (words.length === 0) return "";
+  if (words.length === 1) return words[0][0].toUpperCase();
+  return (words[0][0] + words[words.length - 1][0]).toUpperCase();
+}
+function orbColumns(count) {
+  if (count <= 1) return 1;
+  if (count <= 4) return 2;
+  if (count <= 9) return 3;
+  return 4;
+}
+function createAudioRoom() {
+  return {
+    ariaProps: { role: "group" },
+    dataAttributes: {
+      "data-component": "audio-room"
+    }
+  };
+}
+var audioRoomVariants = cva({
+  base: "grid place-items-center gap-6 p-6 w-full",
+  variants: {},
+  defaultVariants: {}
+});
+var audioRoomOrbCellVariants = cva({
+  base: "flex flex-col items-center gap-2",
+  variants: {},
+  defaultVariants: {}
+});
+var speakingOrbVariants = cva({
+  base: [
+    "relative inline-flex items-center justify-center",
+    "size-20 rounded-full",
+    "bg-muted text-muted-foreground font-semibold text-xl select-none",
+    "overflow-hidden",
+    "transition-shadow duration-300"
+  ].join(" "),
+  variants: {
+    speaking: {
+      true: [
+        "ring-4 ring-primary ring-offset-2 ring-offset-background",
+        "shadow-[0_0_0_4px_hsl(var(--primary)/0.25),0_0_16px_4px_hsl(var(--primary)/0.35)]"
+      ].join(" "),
+      false: "ring-2 ring-border"
+    },
+    muted: {
+      true: "opacity-60",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    speaking: "false",
+    muted: "false"
+  }
+});
+var audioRoomNameLabelClass = "text-sm font-medium text-foreground text-center max-w-[6rem] truncate";
+var audioRoomMutedBadgeClass = [
+  "absolute bottom-0 right-0",
+  "inline-flex items-center justify-center",
+  "size-6 rounded-full",
+  "bg-destructive text-destructive-foreground",
+  "text-[10px] leading-none",
+  "border-2 border-background",
+  "translate-x-1 translate-y-1"
+].join(" ");
+var audioRoomHandBadgeClass = [
+  "absolute top-0 right-0",
+  "inline-flex items-center justify-center",
+  "size-6 rounded-full",
+  "bg-warning text-warning-foreground",
+  "text-[12px] leading-none",
+  "border-2 border-background",
+  "translate-x-1 -translate-y-1"
+].join(" ");
+var SpeakingOrb = React11.forwardRef(
+  ({
+    name,
+    avatarUrl,
+    speaking = false,
+    muted = false,
+    handRaised = false,
+    className,
+    ...props
+  }, ref) => {
+    const initials = getInitials4(name);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        role: "img",
+        "aria-label": name,
+        "data-speaking": speaking ? "true" : "false",
+        "data-muted": muted ? "true" : "false",
+        "data-hand-raised": handRaised ? "true" : "false",
+        className: cn(
+          speakingOrbVariants({
+            speaking: speaking ? "true" : "false",
+            muted: muted ? "true" : "false"
+          }),
+          className
+        ),
+        ...props,
+        children: [
+          avatarUrl ? /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: avatarUrl,
+              alt: name,
+              className: "absolute inset-0 size-full object-cover"
+            }
+          ) : /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: initials }),
+          muted && /* @__PURE__ */ jsx("span", { className: audioRoomMutedBadgeClass, "aria-label": "Muted", children: "\u{1F507}" }),
+          handRaised && /* @__PURE__ */ jsx("span", { className: audioRoomHandBadgeClass, "aria-label": "Hand raised", children: "\u270B" })
+        ]
+      }
+    );
+  }
+);
+SpeakingOrb.displayName = "SpeakingOrb";
+var AudioRoom = React11.forwardRef(
+  ({ participants, className, ...props }, ref) => {
+    const cols = orbColumns(participants.length);
+    const { ariaProps, dataAttributes } = createAudioRoom();
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(audioRoomVariants(), className),
+        style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` },
+        ...ariaProps,
+        ...dataAttributes,
+        ...props,
+        children: participants.map((participant) => /* @__PURE__ */ jsxs("div", { className: audioRoomOrbCellVariants(), children: [
+          /* @__PURE__ */ jsx(
+            SpeakingOrb,
+            {
+              name: participant.name,
+              avatarUrl: participant.avatarUrl,
+              speaking: participant.speaking,
+              muted: participant.muted,
+              handRaised: participant.handRaised
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: audioRoomNameLabelClass, children: participant.name })
+        ] }, participant.id))
+      }
+    );
+  }
+);
+AudioRoom.displayName = "AudioRoom";
+
+// ../floating-reactions/dist/index.js
+var REACTION_LIFETIME_MS = 3e3;
+function laneOffsetPercent(lane = 0, lanes = 5) {
+  if (lanes <= 0) return 50;
+  const clamped = Math.max(0, Math.min(lane, lanes - 1));
+  const step = 100 / lanes;
+  return step * clamped + step / 2;
+}
+function createFloatingReactions() {
+  const ariaProps = {
+    role: "status",
+    "aria-live": "polite",
+    "aria-label": "Reactions"
+  };
+  const dataAttributes = {
+    "data-component": "floating-reactions"
+  };
+  return { ariaProps, dataAttributes };
+}
+var floatingReactionsVariants = cva({
+  base: "absolute inset-0 pointer-events-none overflow-hidden",
+  variants: {
+    /**
+     * Whether the overlay is currently active (has reactions). The parent may
+     * toggle visibility, but we keep the node mounted to preserve live-region
+     * semantics.
+     */
+    active: {
+      true: "",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    active: "false"
+  }
+});
+var floatingReactionItemClass = [
+  "absolute bottom-4",
+  "text-3xl leading-none select-none",
+  "animate-[float-up_3s_ease-out_forwards]"
+].join(" ");
+var floatingReactionLabelClass = "sr-only";
+var FloatingReactions = React11.forwardRef(({ reactions, lanes = 5, className, ...props }, ref) => {
+  const { ariaProps, dataAttributes } = createFloatingReactions();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(floatingReactionsVariants({ active: reactions.length > 0 ? "true" : "false" }), className),
+      ...ariaProps,
+      ...dataAttributes,
+      ...props,
+      children: reactions.map((reaction) => {
+        const left = laneOffsetPercent(reaction.lane ?? 0, lanes);
+        return /* @__PURE__ */ jsxs(
+          "span",
+          {
+            className: floatingReactionItemClass,
+            style: { left: `${left}%` },
+            "aria-hidden": "true",
+            children: [
+              reaction.emoji,
+              /* @__PURE__ */ jsx("span", { className: floatingReactionLabelClass, children: reaction.emoji })
+            ]
+          },
+          reaction.id
+        );
+      })
+    }
+  );
+});
+FloatingReactions.displayName = "FloatingReactions";
+function ReactionBurst({ emoji, lane = 0, lanes = 5 }) {
+  const left = laneOffsetPercent(lane, lanes);
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: floatingReactionItemClass,
+      style: { left: `${left}%` },
+      "aria-hidden": "true",
+      children: [
+        emoji,
+        /* @__PURE__ */ jsx("span", { className: floatingReactionLabelClass, children: emoji })
+      ]
+    }
+  );
+}
+function useFloatingReactions() {
+  const [reactions, setReactions] = React11.useState([]);
+  const counter = React11.useRef(0);
+  const emit = React11.useCallback(
+    (emoji, options = {}) => {
+      counter.current += 1;
+      const id = options.id ?? `fr-${counter.current}`;
+      const lane = options.lane;
+      const reaction = { id, emoji, lane };
+      setReactions((prev) => [...prev, reaction]);
+      setTimeout(() => {
+        setReactions((prev) => prev.filter((r) => r.id !== id));
+      }, REACTION_LIFETIME_MS);
+    },
+    []
+  );
+  const clear = React11.useCallback(() => {
+    setReactions([]);
+  }, []);
+  return { reactions, emit, clear };
+}
+
+// ../pre-call-lobby/dist/index.js
+function createPreCallLobby(props) {
+  const { cameraOn, micOn } = props;
+  return {
+    ariaProps: {
+      role: "group",
+      "aria-label": "Device setup"
+    },
+    dataAttributes: {
+      "data-camera": cameraOn ? "on" : "off",
+      "data-mic": micOn ? "on" : "off"
+    }
+  };
+}
+function micLevelToBars(level, barCount) {
+  if (barCount <= 0) return 0;
+  const clamped = Math.min(1, Math.max(0, level));
+  return Math.round(clamped * barCount);
+}
+var preCallLobbyVariants = cva({
+  base: [
+    "flex flex-col gap-6 rounded-2xl border border-border bg-card p-6 shadow-sm",
+    "w-full max-w-lg mx-auto"
+  ].join(" "),
+  variants: {},
+  defaultVariants: {}
+});
+var preCallCameraVariants = cva({
+  base: [
+    "relative flex items-center justify-center overflow-hidden rounded-xl",
+    "aspect-video w-full bg-muted"
+  ].join(" "),
+  variants: {
+    camera: {
+      on: "",
+      off: "bg-muted"
+    }
+  },
+  defaultVariants: {
+    camera: "on"
+  }
+});
+var preCallCameraPlaceholderClass = [
+  "flex flex-col items-center justify-center gap-2",
+  "text-muted-foreground select-none"
+].join(" ");
+var preCallDeviceRowClass = "flex flex-col gap-1";
+var preCallDeviceLabelClass = "text-xs font-medium text-muted-foreground";
+var preCallDeviceSelectClass = [
+  "flex h-9 w-full rounded-md border border-input bg-background px-3 py-1",
+  "text-sm text-foreground shadow-sm",
+  "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  "disabled:cursor-not-allowed disabled:opacity-50"
+].join(" ");
+var preCallMicMeterClass = "flex items-end gap-0.5 h-5";
+var preCallMicBarVariants = cva({
+  base: "w-1.5 rounded-sm transition-colors",
+  variants: {
+    lit: {
+      true: "bg-primary",
+      false: "bg-muted-foreground/30"
+    }
+  },
+  defaultVariants: {
+    lit: "false"
+  }
+});
+var preCallControlsRowClass = "flex items-center gap-3";
+var preCallToggleVariants = cva({
+  base: [
+    "inline-flex items-center justify-center rounded-full p-2.5",
+    "transition-colors focus-visible:outline-none focus-visible:ring-2",
+    "focus-visible:ring-ring focus-visible:ring-offset-2"
+  ].join(" "),
+  variants: {
+    active: {
+      true: "bg-primary text-primary-foreground hover:bg-primary/90",
+      false: "bg-destructive/10 text-destructive hover:bg-destructive/20"
+    }
+  },
+  defaultVariants: {
+    active: "false"
+  }
+});
+var preCallJoinButtonClass = [
+  "inline-flex w-full items-center justify-center rounded-lg px-4 py-2.5",
+  "bg-primary text-primary-foreground text-sm font-semibold",
+  "shadow transition-colors hover:bg-primary/90",
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+  "disabled:pointer-events-none disabled:opacity-50"
+].join(" ");
+var MIC_BAR_COUNT = 8;
+var PreCallLobby = React11.forwardRef(
+  ({
+    cameraOn,
+    micOn,
+    onToggleCamera,
+    onToggleMic,
+    micLevel = 0,
+    cameras = [],
+    microphones = [],
+    speakers = [],
+    selectedCamera,
+    selectedMicrophone,
+    selectedSpeaker,
+    onDeviceChange,
+    previewSlot,
+    joinLabel = "Join",
+    onJoin,
+    className,
+    ...props
+  }, ref) => {
+    const api = createPreCallLobby({ cameraOn, micOn });
+    const litBars = micLevelToBars(micLevel, MIC_BAR_COUNT);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(preCallLobbyVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: preCallCameraVariants({ camera: cameraOn ? "on" : "off" }), children: cameraOn && previewSlot ? previewSlot : /* @__PURE__ */ jsxs("div", { className: preCallCameraPlaceholderClass, "data-testid": "camera-off-placeholder", children: [
+            /* @__PURE__ */ jsxs(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "40",
+                height: "40",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "1.5",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                "aria-hidden": "true",
+                children: [
+                  /* @__PURE__ */ jsx("path", { d: "M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" }),
+                  /* @__PURE__ */ jsx("circle", { cx: "9", cy: "7", r: "4" }),
+                  /* @__PURE__ */ jsx("line", { x1: "2", y1: "2", x2: "22", y2: "22" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "text-xs", children: "Camera is off" })
+          ] }) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "Mic" }),
+            /* @__PURE__ */ jsx("div", { className: preCallMicMeterClass, "aria-label": `Mic level: ${litBars} of ${MIC_BAR_COUNT}`, children: Array.from({ length: MIC_BAR_COUNT }, (_, i) => /* @__PURE__ */ jsx(
+              "div",
+              {
+                "data-testid": `mic-bar-${i}`,
+                "data-lit": i < litBars ? "true" : "false",
+                className: `${preCallMicBarVariants({ lit: i < litBars ? "true" : "false" })} ${/* Staggered heights for a visual meter effect */
+                i < 2 ? "h-2" : i < 4 ? "h-3" : i < 6 ? "h-4" : "h-5"}`
+              },
+              i
+            )) })
+          ] }),
+          cameras.length > 0 && /* @__PURE__ */ jsxs("div", { className: preCallDeviceRowClass, children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: "pcl-camera-select", className: preCallDeviceLabelClass, children: "Camera" }),
+            /* @__PURE__ */ jsx(
+              "select",
+              {
+                id: "pcl-camera-select",
+                className: preCallDeviceSelectClass,
+                value: selectedCamera,
+                onChange: (e) => onDeviceChange?.("camera", e.target.value),
+                "data-testid": "camera-select",
+                children: cameras.map((d) => /* @__PURE__ */ jsx("option", { value: d.id, children: d.label }, d.id))
+              }
+            )
+          ] }),
+          microphones.length > 0 && /* @__PURE__ */ jsxs("div", { className: preCallDeviceRowClass, children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: "pcl-mic-select", className: preCallDeviceLabelClass, children: "Microphone" }),
+            /* @__PURE__ */ jsx(
+              "select",
+              {
+                id: "pcl-mic-select",
+                className: preCallDeviceSelectClass,
+                value: selectedMicrophone,
+                onChange: (e) => onDeviceChange?.("microphone", e.target.value),
+                "data-testid": "microphone-select",
+                children: microphones.map((d) => /* @__PURE__ */ jsx("option", { value: d.id, children: d.label }, d.id))
+              }
+            )
+          ] }),
+          speakers.length > 0 && /* @__PURE__ */ jsxs("div", { className: preCallDeviceRowClass, children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: "pcl-speaker-select", className: preCallDeviceLabelClass, children: "Speaker" }),
+            /* @__PURE__ */ jsx(
+              "select",
+              {
+                id: "pcl-speaker-select",
+                className: preCallDeviceSelectClass,
+                value: selectedSpeaker,
+                onChange: (e) => onDeviceChange?.("speaker", e.target.value),
+                "data-testid": "speaker-select",
+                children: speakers.map((d) => /* @__PURE__ */ jsx("option", { value: d.id, children: d.label }, d.id))
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: preCallControlsRowClass, children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "aria-label": cameraOn ? "Turn camera off" : "Turn camera on",
+                "aria-pressed": cameraOn,
+                className: preCallToggleVariants({ active: cameraOn ? "true" : "false" }),
+                onClick: onToggleCamera,
+                "data-testid": "camera-toggle",
+                children: /* @__PURE__ */ jsx(
+                  "svg",
+                  {
+                    xmlns: "http://www.w3.org/2000/svg",
+                    width: "18",
+                    height: "18",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    "aria-hidden": "true",
+                    children: cameraOn ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx("path", { d: "M23 7l-7 5 7 5V7z" }),
+                      /* @__PURE__ */ jsx("rect", { x: "1", y: "5", width: "15", height: "14", rx: "2", ry: "2" })
+                    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx("line", { x1: "2", y1: "2", x2: "22", y2: "22" }),
+                      /* @__PURE__ */ jsx("path", { d: "M10.66 6H14a2 2 0 0 1 2 2v2.34l1 1L23 7v10" }),
+                      /* @__PURE__ */ jsx("path", { d: "M16 16a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h2l10 10z" })
+                    ] })
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "aria-label": micOn ? "Mute microphone" : "Unmute microphone",
+                "aria-pressed": micOn,
+                className: preCallToggleVariants({ active: micOn ? "true" : "false" }),
+                onClick: onToggleMic,
+                "data-testid": "mic-toggle",
+                children: /* @__PURE__ */ jsx(
+                  "svg",
+                  {
+                    xmlns: "http://www.w3.org/2000/svg",
+                    width: "18",
+                    height: "18",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    "aria-hidden": "true",
+                    children: micOn ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx("path", { d: "M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z" }),
+                      /* @__PURE__ */ jsx("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
+                      /* @__PURE__ */ jsx("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
+                      /* @__PURE__ */ jsx("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
+                    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx("line", { x1: "2", y1: "2", x2: "22", y2: "22" }),
+                      /* @__PURE__ */ jsx("path", { d: "M18.89 13.23A7.12 7.12 0 0 0 19 12v-2" }),
+                      /* @__PURE__ */ jsx("path", { d: "M5 10v2a7 7 0 0 0 12 5" }),
+                      /* @__PURE__ */ jsx("path", { d: "M15 9.34V4a3 3 0 0 0-5.68-1.33" }),
+                      /* @__PURE__ */ jsx("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12" }),
+                      /* @__PURE__ */ jsx("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
+                      /* @__PURE__ */ jsx("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
+                    ] })
+                  }
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: preCallJoinButtonClass,
+              onClick: onJoin,
+              "data-testid": "join-button",
+              children: joinLabel
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+PreCallLobby.displayName = "PreCallLobby";
+
+// ../infinite-canvas/dist/index.js
+function clampZoom(zoom, min = 0.25, max = 4) {
+  return Math.min(Math.max(zoom, min), max);
+}
+function fitTransform(bounds, viewportW, viewportH, padding = 32) {
+  const contentW = bounds.maxX - bounds.minX;
+  const contentH = bounds.maxY - bounds.minY;
+  if (contentW <= 0 || contentH <= 0 || viewportW <= 0 || viewportH <= 0) {
+    return { zoom: 1, x: 0, y: 0 };
+  }
+  const availW = viewportW - padding * 2;
+  const availH = viewportH - padding * 2;
+  const rawZoom = Math.min(availW / contentW, availH / contentH);
+  const zoom = clampZoom(rawZoom);
+  const scaledW = contentW * zoom;
+  const scaledH = contentH * zoom;
+  const x = (viewportW - scaledW) / 2 - bounds.minX * zoom;
+  const y = (viewportH - scaledH) / 2 - bounds.minY * zoom;
+  return { zoom, x, y };
+}
+function transformToCss(t) {
+  return `translate(${t.x}px, ${t.y}px) scale(${t.zoom})`;
+}
+function createInfiniteCanvas(options = {}) {
+  const { zoom = 1 } = options;
+  return {
+    ariaProps: {
+      role: "group",
+      "aria-label": "Canvas"
+    },
+    dataAttributes: {
+      "data-zoom": zoom
+    }
+  };
+}
+var infiniteCanvasVariants = cva({
+  base: "relative overflow-hidden bg-background",
+  variants: {
+    grid: {
+      "true": [
+        "bg-[radial-gradient(circle,hsl(var(--border))_1px,transparent_1px)]",
+        "[background-size:24px_24px]"
+      ].join(" "),
+      "false": ""
+    }
+  },
+  defaultVariants: {
+    grid: "false"
+  }
+});
+var canvasContentClass = "absolute inset-0 origin-top-left will-change-transform";
+var canvasControlsClass = "absolute bottom-4 right-4 z-10 flex items-center gap-1";
+var canvasZoomButtonVariants = cva({
+  base: [
+    "inline-flex h-8 w-8 items-center justify-center rounded-md border border-border",
+    "bg-card text-foreground text-sm font-medium",
+    "hover:bg-muted 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: {},
+  defaultVariants: {}
+});
+var InfiniteCanvas = React11.forwardRef(
+  ({
+    zoom: zoomProp,
+    x: xProp,
+    y: yProp,
+    pan = true,
+    minZoom = 0.25,
+    maxZoom = 4,
+    showGrid = false,
+    showControls = false,
+    onTransformChange,
+    contentBounds: contentBounds2,
+    className,
+    children,
+    ...props
+  }, ref) => {
+    const isControlled = zoomProp !== void 0 || xProp !== void 0 || yProp !== void 0;
+    const [internal, setInternal] = React11.useState({
+      zoom: 1,
+      x: 0,
+      y: 0
+    });
+    const transform = isControlled ? { zoom: zoomProp ?? 1, x: xProp ?? 0, y: yProp ?? 0 } : internal;
+    const containerRef = React11.useRef(null);
+    const dragging = React11.useRef(false);
+    const dragStart = React11.useRef({ px: 0, py: 0, tx: 0, ty: 0 });
+    const applyTransform = React11.useCallback(
+      (next) => {
+        if (!isControlled) setInternal(next);
+        onTransformChange?.(next);
+      },
+      [isControlled, onTransformChange]
+    );
+    React11.useEffect(() => {
+      const el = containerRef.current;
+      if (!el) return;
+      const onWheel = (e) => {
+        e.preventDefault();
+        setInternal((prev) => {
+          const delta = -e.deltaY * 1e-3;
+          const next = {
+            ...prev,
+            zoom: clampZoom(prev.zoom + prev.zoom * delta, minZoom, maxZoom)
+          };
+          onTransformChange?.(next);
+          return next;
+        });
+      };
+      el.addEventListener("wheel", onWheel, { passive: false });
+      return () => el.removeEventListener("wheel", onWheel);
+    }, [minZoom, maxZoom, onTransformChange]);
+    React11.useEffect(() => {
+      if (!pan || isControlled) return;
+      const el = containerRef.current;
+      if (!el) return;
+      const onPointerDown = (e) => {
+        dragging.current = true;
+        dragStart.current = {
+          px: e.clientX,
+          py: e.clientY,
+          tx: internal.x,
+          ty: internal.y
+        };
+        el.setPointerCapture(e.pointerId);
+      };
+      const onPointerMove = (e) => {
+        if (!dragging.current) return;
+        const dx = e.clientX - dragStart.current.px;
+        const dy = e.clientY - dragStart.current.py;
+        setInternal((prev) => {
+          const next = {
+            ...prev,
+            x: dragStart.current.tx + dx,
+            y: dragStart.current.ty + dy
+          };
+          onTransformChange?.(next);
+          return next;
+        });
+      };
+      const onPointerUp = () => {
+        dragging.current = false;
+      };
+      el.addEventListener("pointerdown", onPointerDown);
+      el.addEventListener("pointermove", onPointerMove);
+      el.addEventListener("pointerup", onPointerUp);
+      el.addEventListener("pointercancel", onPointerUp);
+      return () => {
+        el.removeEventListener("pointerdown", onPointerDown);
+        el.removeEventListener("pointermove", onPointerMove);
+        el.removeEventListener("pointerup", onPointerUp);
+        el.removeEventListener("pointercancel", onPointerUp);
+      };
+    }, [pan, isControlled, onTransformChange, internal.x, internal.y]);
+    const handleZoomIn = () => {
+      const next = { ...transform, zoom: clampZoom(transform.zoom * 1.25, minZoom, maxZoom) };
+      applyTransform(next);
+    };
+    const handleZoomOut = () => {
+      const next = { ...transform, zoom: clampZoom(transform.zoom / 1.25, minZoom, maxZoom) };
+      applyTransform(next);
+    };
+    const handleFit = () => {
+      const el = containerRef.current;
+      if (!el) return;
+      const { width, height } = el.getBoundingClientRect();
+      const bounds = contentBounds2 ?? { minX: 0, minY: 0, maxX: width, maxY: height };
+      applyTransform(fitTransform(bounds, width, height));
+    };
+    const api = createInfiniteCanvas({ zoom: transform.zoom });
+    const setRefs = (node) => {
+      containerRef.current = node;
+      if (typeof ref === "function") ref(node);
+      else if (ref) ref.current = node;
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: setRefs,
+        className: cn(
+          infiniteCanvasVariants({ grid: showGrid ? "true" : "false" }),
+          className
+        ),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: canvasContentClass,
+              style: { transform: transformToCss(transform), transformOrigin: "0 0" },
+              children
+            }
+          ),
+          showControls && /* @__PURE__ */ jsxs("div", { className: canvasControlsClass, "aria-label": "Zoom controls", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: canvasZoomButtonVariants(),
+                "aria-label": "Zoom in",
+                onClick: handleZoomIn,
+                children: "+"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: canvasZoomButtonVariants(),
+                "aria-label": "Zoom out",
+                onClick: handleZoomOut,
+                children: "\u2212"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: canvasZoomButtonVariants(),
+                "aria-label": "Fit to content",
+                onClick: handleFit,
+                children: "\u229E"
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+);
+InfiniteCanvas.displayName = "InfiniteCanvas";
+
+// ../sticky-note/dist/index.js
+var STICKY_NOTE_COLORS = [
+  "yellow",
+  "pink",
+  "blue",
+  "green",
+  "purple",
+  "orange"
+];
+function nextStickyColor(color) {
+  const index = STICKY_NOTE_COLORS.indexOf(color);
+  const next = (index + 1) % STICKY_NOTE_COLORS.length;
+  return STICKY_NOTE_COLORS[next];
+}
+function createStickyNote(options) {
+  return {
+    dataAttributes: { "data-color": options.color },
+    ariaProps: { role: "group" }
+  };
+}
+var stickyNoteVariants = cva({
+  base: [
+    "relative inline-flex flex-col gap-2 rounded-md p-4",
+    "shadow-md",
+    "min-w-[160px] min-h-[120px]"
+  ].join(" "),
+  variants: {
+    color: {
+      yellow: "bg-yellow-100 text-yellow-900",
+      pink: "bg-pink-100 text-pink-900",
+      blue: "bg-blue-100 text-blue-900",
+      green: "bg-green-100 text-green-900",
+      purple: "bg-purple-100 text-purple-900",
+      orange: "bg-orange-100 text-orange-900"
+    }
+  },
+  defaultVariants: {
+    color: "yellow"
+  }
+});
+var stickyNoteTextClass = "flex-1 w-full resize-none bg-transparent text-sm leading-relaxed placeholder:opacity-60 outline-none";
+var stickyNoteAuthorClass = "mt-auto text-xs font-medium opacity-70 truncate";
+var StickyNote = React11.forwardRef(
+  ({
+    color = "yellow",
+    text,
+    onTextChange,
+    author,
+    x,
+    y,
+    draggable = false,
+    onMove,
+    className,
+    style,
+    children,
+    ...props
+  }, ref) => {
+    const { ariaProps, dataAttributes } = createStickyNote({ color });
+    const dragOrigin = React11.useRef(null);
+    const positionStyle = x !== void 0 && y !== void 0 ? { position: "absolute", left: x, top: y } : {};
+    const handlePointerDown = React11.useCallback(
+      (e) => {
+        if (!draggable || !onMove) return;
+        if (e.button !== 0) return;
+        e.currentTarget.setPointerCapture(e.pointerId);
+        dragOrigin.current = {
+          pointerX: e.clientX,
+          pointerY: e.clientY,
+          noteX: x ?? 0,
+          noteY: y ?? 0
+        };
+      },
+      [draggable, onMove, x, y]
+    );
+    const handlePointerMove = React11.useCallback(
+      (e) => {
+        if (!dragOrigin.current || !onMove) return;
+        const dx = e.clientX - dragOrigin.current.pointerX;
+        const dy = e.clientY - dragOrigin.current.pointerY;
+        onMove({ x: dragOrigin.current.noteX + dx, y: dragOrigin.current.noteY + dy });
+      },
+      [onMove]
+    );
+    const handlePointerUp = React11.useCallback(() => {
+      dragOrigin.current = null;
+    }, []);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(stickyNoteVariants({ color }), className),
+        style: { ...positionStyle, ...style },
+        ...ariaProps,
+        ...dataAttributes,
+        onPointerDown: draggable && onMove ? handlePointerDown : void 0,
+        onPointerMove: draggable && onMove ? handlePointerMove : void 0,
+        onPointerUp: draggable && onMove ? handlePointerUp : void 0,
+        ...props,
+        children: [
+          onTextChange != null ? /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              className: stickyNoteTextClass,
+              value: text ?? "",
+              onChange: (e) => onTextChange(e.target.value),
+              placeholder: "Type a note\u2026"
+            }
+          ) : /* @__PURE__ */ jsx("p", { className: `${stickyNoteTextClass} whitespace-pre-wrap`, children: text ?? children }),
+          author != null && /* @__PURE__ */ jsx("span", { className: stickyNoteAuthorClass, children: author })
+        ]
+      }
+    );
+  }
+);
+StickyNote.displayName = "StickyNote";
+
+// ../flow-editor/dist/index.js
+var DEFAULT_NODE_WIDTH = 160;
+var DEFAULT_NODE_HEIGHT = 48;
+function nodeById(nodes, id) {
+  return nodes.find((n) => n.id === id);
+}
+function edgePath(source, target) {
+  const sw = source.width ?? DEFAULT_NODE_WIDTH;
+  const sh = source.height ?? DEFAULT_NODE_HEIGHT;
+  const th = target.height ?? DEFAULT_NODE_HEIGHT;
+  const x1 = source.x + sw;
+  const y1 = source.y + sh / 2;
+  const x2 = target.x;
+  const y2 = target.y + th / 2;
+  const dx = Math.abs(x2 - x1);
+  const handleLen = Math.max(dx * 0.5, 40);
+  const cx1 = x1 + handleLen;
+  const cy1 = y1;
+  const cx2 = x2 - handleLen;
+  const cy2 = y2;
+  return `M ${x1} ${y1} C ${cx1} ${cy1}, ${cx2} ${cy2}, ${x2} ${y2}`;
+}
+function createFlowEditor() {
+  return {
+    ariaProps: {
+      role: "group",
+      "aria-label": "Flow editor"
+    },
+    dataAttributes: {
+      "data-flow-editor": "true"
+    }
+  };
+}
+var flowEditorVariants = cva({
+  base: "relative w-full overflow-hidden bg-background border border-border rounded-lg",
+  variants: {
+    size: {
+      sm: "h-64",
+      md: "h-96",
+      lg: "h-[32rem]"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var flowNodeVariants = cva({
+  base: [
+    "absolute flex items-center justify-center rounded-md border",
+    "bg-card border-border text-card-foreground text-sm font-medium",
+    "cursor-pointer select-none transition-shadow",
+    "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: "ring-2 ring-ring ring-primary shadow-md",
+      false: "hover:border-primary/50 hover:shadow-sm"
+    }
+  },
+  defaultVariants: {
+    selected: "false"
+  }
+});
+var flowNodeLabelClass = "px-3 py-2 truncate pointer-events-none";
+var flowEdgePathClass = "fill-none stroke-current stroke-2 transition-opacity";
+var flowEdgeLabelClass = "text-xs fill-muted-foreground select-none pointer-events-none";
+var FlowEditor = React11.forwardRef(
+  ({
+    nodes,
+    edges,
+    onNodeClick,
+    onNodeMove,
+    renderNode,
+    selectedId,
+    showGrid = true,
+    showControls = true,
+    className,
+    ...props
+  }, ref) => {
+    const api = createFlowEditor();
+    const dragRef = React11.useRef(null);
+    const handlePointerDown = React11.useCallback(
+      (event, node) => {
+        if (!onNodeMove) return;
+        event.currentTarget.setPointerCapture(event.pointerId);
+        dragRef.current = {
+          id: node.id,
+          startPointerX: event.clientX,
+          startPointerY: event.clientY,
+          startNodeX: node.x,
+          startNodeY: node.y
+        };
+      },
+      [onNodeMove]
+    );
+    const handlePointerMove = React11.useCallback(
+      (event) => {
+        const drag = dragRef.current;
+        if (!drag || !onNodeMove) return;
+        const dx = event.clientX - drag.startPointerX;
+        const dy = event.clientY - drag.startPointerY;
+        onNodeMove(drag.id, drag.startNodeX + dx, drag.startNodeY + dy);
+      },
+      [onNodeMove]
+    );
+    const handlePointerUp = React11.useCallback(() => {
+      dragRef.current = null;
+    }, []);
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(flowEditorVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: /* @__PURE__ */ jsxs(InfiniteCanvas, { showGrid, showControls, children: [
+          /* @__PURE__ */ jsx(
+            "svg",
+            {
+              className: "absolute inset-0 w-full h-full overflow-visible text-muted-foreground pointer-events-none",
+              "aria-hidden": "true",
+              children: edges.map((edge) => {
+                const src = nodeById(nodes, edge.source);
+                const tgt = nodeById(nodes, edge.target);
+                if (!src || !tgt) return null;
+                const d = edgePath(src, tgt);
+                const midX = (src.x + (src.width ?? 160) + tgt.x) / 2;
+                const midY = (src.y + (src.height ?? 48) / 2 + tgt.y + (tgt.height ?? 48) / 2) / 2;
+                return /* @__PURE__ */ jsxs("g", { children: [
+                  /* @__PURE__ */ jsx("path", { d, className: flowEdgePathClass }),
+                  edge.label != null && /* @__PURE__ */ jsx(
+                    "text",
+                    {
+                      x: midX,
+                      y: midY - 4,
+                      textAnchor: "middle",
+                      className: flowEdgeLabelClass,
+                      children: edge.label
+                    }
+                  )
+                ] }, edge.id);
+              })
+            }
+          ),
+          nodes.map((node) => {
+            const isSelected = node.selected || node.id === selectedId;
+            const w = node.width ?? 160;
+            const h4 = node.height ?? 48;
+            return /* @__PURE__ */ jsx(
+              "div",
+              {
+                role: "button",
+                tabIndex: 0,
+                "aria-pressed": isSelected,
+                "aria-label": node.label,
+                className: flowNodeVariants({
+                  selected: isSelected ? "true" : "false"
+                }),
+                style: { left: node.x, top: node.y, width: w, height: h4 },
+                onClick: () => onNodeClick?.(node.id),
+                onKeyDown: (e) => {
+                  if (e.key === "Enter" || e.key === " ") {
+                    e.preventDefault();
+                    onNodeClick?.(node.id);
+                  }
+                },
+                onPointerDown: (e) => handlePointerDown(e, node),
+                onPointerMove: handlePointerMove,
+                onPointerUp: handlePointerUp,
+                children: renderNode ? renderNode(node) : /* @__PURE__ */ jsx("span", { className: flowNodeLabelClass, children: node.label })
+              },
+              node.id
+            );
+          })
+        ] })
+      }
+    );
+  }
+);
+FlowEditor.displayName = "FlowEditor";
+
+// ../graph-view/dist/index.js
+function createGraphView() {
+  return {
+    ariaProps: {
+      role: "group",
+      "aria-label": "Knowledge graph"
+    },
+    dataAttributes: {}
+  };
+}
+function nodeById2(nodes, id) {
+  return nodes.find((n) => n.id === id);
+}
+function graphEdgePath(source, target) {
+  const sx = source.x;
+  const sy = source.y;
+  const tx = target.x;
+  const ty = target.y;
+  const dy = Math.abs(ty - sy);
+  const offset = Math.max(dy * 0.5, 40);
+  return `M ${sx} ${sy} C ${sx} ${sy + offset}, ${tx} ${ty - offset}, ${tx} ${ty}`;
+}
+function summarizeStates(nodes) {
+  const counts = {
+    mastered: 0,
+    "in-progress": 0,
+    "not-started": 0,
+    highlight: 0
+  };
+  for (const n of nodes) {
+    const s = n.state ?? "not-started";
+    counts[s] += 1;
+  }
+  return counts;
+}
+var graphViewVariants = cva({
+  base: "relative w-full overflow-hidden rounded-lg border border-border bg-background",
+  variants: {},
+  defaultVariants: {}
+});
+var graphNodeVariants = cva({
+  base: [
+    "absolute inline-flex items-center justify-center rounded-md border px-2 py-1",
+    "text-xs font-medium leading-none -translate-x-1/2 -translate-y-1/2",
+    "transition-colors focus-visible:outline-none focus-visible:ring-2",
+    "focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+    "cursor-default select-none"
+  ].join(" "),
+  variants: {
+    state: {
+      mastered: "border-transparent bg-primary text-primary-foreground",
+      "in-progress": "border-transparent bg-accent text-accent-foreground ring-2 ring-ring",
+      "not-started": "border-transparent bg-muted text-muted-foreground",
+      highlight: "border-primary bg-background text-foreground"
+    },
+    interactive: {
+      true: "cursor-pointer hover:opacity-90",
+      false: "cursor-default"
+    }
+  },
+  defaultVariants: {
+    state: "not-started",
+    interactive: "false"
+  }
+});
+var graphNodeLabelClass = "pointer-events-none whitespace-nowrap";
+var graphEdgeClass = "fill-none stroke-border stroke-[1.5] opacity-60";
+var graphLegendChipVariants = cva({
+  base: "inline-flex items-center gap-1.5 rounded-md border px-2 py-0.5 text-xs font-medium",
+  variants: {
+    state: {
+      mastered: "border-transparent bg-primary text-primary-foreground",
+      "in-progress": "border-transparent bg-accent text-accent-foreground ring-1 ring-ring",
+      "not-started": "border-transparent bg-muted text-muted-foreground",
+      highlight: "border-primary bg-background text-foreground"
+    }
+  },
+  defaultVariants: {
+    state: "not-started"
+  }
+});
+var STATE_LABELS = {
+  mastered: "Mastered",
+  "in-progress": "In Progress",
+  "not-started": "Not Started",
+  highlight: "Highlight"
+};
+var LEGEND_ORDER = ["mastered", "in-progress", "not-started", "highlight"];
+var GraphView = React11.forwardRef(
+  ({ nodes, edges, onNodeClick, showLegend = false, className, ...props }, ref) => {
+    const api = createGraphView();
+    const summary = React11.useMemo(() => summarizeStates(nodes), [nodes]);
+    const nodeMap = React11.useMemo(() => {
+      const m = /* @__PURE__ */ new Map();
+      for (const n of nodes) m.set(n.id, n);
+      return m;
+    }, [nodes]);
+    const padding = 80;
+    const xs = nodes.map((n) => n.x);
+    const ys = nodes.map((n) => n.y);
+    const svgWidth = nodes.length === 0 ? 400 : Math.max(...xs) + padding * 2;
+    const svgHeight = nodes.length === 0 ? 300 : Math.max(...ys) + padding * 2;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(graphViewVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs(InfiniteCanvas, { showGrid: true, showControls: true, children: [
+            /* @__PURE__ */ jsx(
+              "svg",
+              {
+                width: svgWidth,
+                height: svgHeight,
+                "aria-hidden": "true",
+                style: { position: "absolute", top: 0, left: 0, pointerEvents: "none" },
+                children: edges.map((edge) => {
+                  const source = nodeMap.get(edge.source) ?? nodeById2(nodes, edge.source);
+                  const target = nodeMap.get(edge.target) ?? nodeById2(nodes, edge.target);
+                  if (!source || !target) return null;
+                  return /* @__PURE__ */ jsx(
+                    "path",
+                    {
+                      d: graphEdgePath(source, target),
+                      className: graphEdgeClass
+                    },
+                    edge.id
+                  );
+                })
+              }
+            ),
+            nodes.map((node) => {
+              const state = node.state ?? "not-started";
+              const interactive = onNodeClick !== void 0;
+              return /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": node.label,
+                  "data-state": state,
+                  className: cn(
+                    graphNodeVariants({ state, interactive: interactive ? "true" : "false" })
+                  ),
+                  style: { left: node.x, top: node.y },
+                  onClick: onNodeClick ? () => onNodeClick(node) : void 0,
+                  children: /* @__PURE__ */ jsx("span", { className: graphNodeLabelClass, children: node.label })
+                },
+                node.id
+              );
+            })
+          ] }),
+          showLegend && /* @__PURE__ */ jsx(
+            "div",
+            {
+              role: "list",
+              "aria-label": "Graph legend",
+              className: "absolute bottom-3 left-3 flex flex-wrap gap-1.5",
+              children: LEGEND_ORDER.filter((s) => summary[s] > 0).map((s) => /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  role: "listitem",
+                  className: graphLegendChipVariants({ state: s }),
+                  children: [
+                    STATE_LABELS[s],
+                    /* @__PURE__ */ jsx("span", { className: "opacity-70", children: summary[s] })
+                  ]
+                },
+                s
+              ))
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+GraphView.displayName = "GraphView";
+
+// ../live-cursors/dist/index.js
+var CURSOR_COLORS = [
+  "#E94560",
+  // red
+  "#F57C00",
+  // orange
+  "#F9C840",
+  // yellow
+  "#4CAF50",
+  // green
+  "#00ACC1",
+  // cyan
+  "#5C6BC0",
+  // indigo
+  "#AB47BC",
+  // purple
+  "#EC407A"
+  // pink
+];
+function assignCursorColor(id, index) {
+  if (index !== void 0) {
+    return CURSOR_COLORS[index % CURSOR_COLORS.length];
+  }
+  let hash = 5381;
+  for (let i = 0; i < id.length; i++) {
+    hash = (hash << 5) + hash ^ id.charCodeAt(i);
+    hash = hash >>> 0;
+  }
+  return CURSOR_COLORS[hash % CURSOR_COLORS.length];
+}
+function createLiveCursors() {
+  const ariaProps = {
+    role: "group",
+    "aria-label": "Collaborators",
+    "aria-hidden": true
+  };
+  const dataAttributes = {
+    "data-live-cursors": ""
+  };
+  return { ariaProps, dataAttributes };
+}
+var liveCursorsVariants = cva({
+  base: "absolute inset-0 overflow-hidden pointer-events-none",
+  variants: {
+    /** Future variant hook — reserved for theming overrides. */
+    hidden: {
+      true: "invisible",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    hidden: "false"
+  }
+});
+var cursorWrapperClass = "absolute flex flex-col items-start transition-[left,top] duration-100 ease-linear";
+var cursorArrowClass = "h-5 w-5 drop-shadow-sm";
+var cursorLabelClass = "mt-0.5 ml-2 rounded px-1.5 py-0.5 text-xs font-medium text-white shadow-sm whitespace-nowrap";
+var Cursor = React11.memo(function Cursor2({
+  name,
+  x,
+  y,
+  color
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cursorWrapperClass,
+      style: { left: `${x}px`, top: `${y}px` },
+      "data-cursor-name": name,
+      children: [
+        /* @__PURE__ */ jsx(
+          "svg",
+          {
+            className: cursorArrowClass,
+            viewBox: "0 0 20 20",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg",
+            "aria-hidden": "true",
+            style: { fill: color },
+            children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                d: "M3 2L17 9.5L10.5 11.5L8 18L3 2Z",
+                stroke: "white",
+                strokeWidth: "1.5",
+                strokeLinejoin: "round"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cursorLabelClass,
+            style: { backgroundColor: color },
+            children: name
+          }
+        )
+      ]
+    }
+  );
+});
+var LiveCursors = React11.forwardRef(
+  ({ cursors, className, ...props }, ref) => {
+    const api = createLiveCursors();
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(liveCursorsVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: cursors.map((cursor, index) => /* @__PURE__ */ jsx(
+          Cursor,
+          {
+            name: cursor.name,
+            x: cursor.x,
+            y: cursor.y,
+            color: cursor.color ?? assignCursorColor(cursor.id, index)
+          },
+          cursor.id
+        ))
+      }
+    );
+  }
+);
+LiveCursors.displayName = "LiveCursors";
+
+// ../mini-map/dist/index.js
+function contentBounds(items) {
+  if (items.length === 0) return { x: 0, y: 0, width: 0, height: 0 };
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (const item of items) {
+    const right = item.x + (item.width ?? 0);
+    const bottom = item.y + (item.height ?? 0);
+    if (item.x < minX) minX = item.x;
+    if (item.y < minY) minY = item.y;
+    if (right > maxX) maxX = right;
+    if (bottom > maxY) maxY = bottom;
+  }
+  return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
+}
+function miniScale(contentRect, miniW, miniH, padding = 8) {
+  const availW = miniW - padding * 2;
+  const availH = miniH - padding * 2;
+  if (availW <= 0 || availH <= 0) return 1;
+  if (contentRect.width === 0 || contentRect.height === 0) return 1;
+  return Math.min(availW / contentRect.width, availH / contentRect.height);
+}
+function worldToMini(point, contentRect, scale, padding = 8) {
+  return {
+    x: (point.x - contentRect.x) * scale + padding,
+    y: (point.y - contentRect.y) * scale + padding
+  };
+}
+function viewportRectInMini(viewport, contentRect, scale, padding = 8) {
+  const { x, y } = worldToMini(
+    { x: viewport.x, y: viewport.y },
+    contentRect,
+    scale,
+    padding
+  );
+  return {
+    x,
+    y,
+    width: viewport.width * scale,
+    height: viewport.height * scale
+  };
+}
+function createMiniMap() {
+  return {
+    ariaProps: { role: "img", "aria-label": "Minimap" },
+    dataAttributes: { "data-component": "mini-map" }
+  };
+}
+var miniMapVariants = cva({
+  base: [
+    "relative overflow-hidden rounded-md border border-border bg-card",
+    "select-none"
+  ].join(" "),
+  variants: {
+    interactive: {
+      true: "cursor-grab active:cursor-grabbing",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    interactive: "false"
+  }
+});
+var miniMapDotClass = "absolute rounded-sm bg-muted";
+var miniMapViewportClass = "absolute rounded-sm border border-primary ring-1 ring-primary bg-primary/10";
+var MiniMap = React11.forwardRef(
+  ({
+    items,
+    viewport,
+    width = 200,
+    height = 140,
+    padding = 8,
+    onViewportChange,
+    className,
+    ...props
+  }, ref) => {
+    const containerRef = React11.useRef(null);
+    const isDragging = React11.useRef(false);
+    const bounds = React11.useMemo(() => contentBounds(items), [items]);
+    const scale = React11.useMemo(
+      () => miniScale(bounds, width, height, padding),
+      [bounds, width, height, padding]
+    );
+    const viewportRect = React11.useMemo(
+      () => viewport != null ? viewportRectInMini(viewport, bounds, scale, padding) : null,
+      [viewport, bounds, scale, padding]
+    );
+    const { ariaProps, dataAttributes } = createMiniMap();
+    const miniToWorld = React11.useCallback(
+      (miniX, miniY) => {
+        return {
+          x: (miniX - padding) / scale + bounds.x,
+          y: (miniY - padding) / scale + bounds.y
+        };
+      },
+      [scale, bounds, padding]
+    );
+    const handlePointerEvent = React11.useCallback(
+      (e) => {
+        if (!onViewportChange) return;
+        const el = containerRef.current;
+        if (!el) return;
+        const rect = el.getBoundingClientRect();
+        const miniX = e.clientX - rect.left;
+        const miniY = e.clientY - rect.top;
+        onViewportChange(miniToWorld(miniX, miniY));
+      },
+      [onViewportChange, miniToWorld]
+    );
+    const handlePointerDown = React11.useCallback(
+      (e) => {
+        if (!onViewportChange) return;
+        isDragging.current = true;
+        e.currentTarget.setPointerCapture(e.pointerId);
+        handlePointerEvent(e);
+      },
+      [onViewportChange, handlePointerEvent]
+    );
+    const handlePointerMove = React11.useCallback(
+      (e) => {
+        if (!isDragging.current) return;
+        handlePointerEvent(e);
+      },
+      [handlePointerEvent]
+    );
+    const handlePointerUp = React11.useCallback(() => {
+      isDragging.current = false;
+    }, []);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: (node) => {
+          containerRef.current = node;
+          if (typeof ref === "function") {
+            ref(node);
+          } else if (ref) {
+            ref.current = node;
+          }
+        },
+        className: cn(
+          miniMapVariants({ interactive: onViewportChange ? "true" : "false" }),
+          className
+        ),
+        style: { width, height, position: "relative" },
+        ...ariaProps,
+        ...dataAttributes,
+        onPointerDown: onViewportChange ? handlePointerDown : void 0,
+        onPointerMove: onViewportChange ? handlePointerMove : void 0,
+        onPointerUp: onViewportChange ? handlePointerUp : void 0,
+        ...props,
+        children: [
+          items.map((item) => {
+            const pos = worldToMini(item, bounds, scale, padding);
+            const w = (item.width ?? 8) * scale;
+            const h4 = (item.height ?? 8) * scale;
+            return /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: miniMapDotClass,
+                style: {
+                  position: "absolute",
+                  left: `${pos.x}px`,
+                  top: `${pos.y}px`,
+                  width: `${Math.max(4, w)}px`,
+                  height: `${Math.max(4, h4)}px`
+                },
+                "aria-hidden": "true"
+              },
+              item.id
+            );
+          }),
+          viewportRect != null && /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: miniMapViewportClass,
+              style: {
+                position: "absolute",
+                left: `${viewportRect.x}px`,
+                top: `${viewportRect.y}px`,
+                width: `${viewportRect.width}px`,
+                height: `${viewportRect.height}px`
+              },
+              "aria-hidden": "true"
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+MiniMap.displayName = "MiniMap";
+
+// ../section-head/dist/index.js
+function createSectionHead(props = {}) {
+  const { align = "center" } = props;
+  const dataAttributes = {
+    "data-align": align
+  };
+  return { dataAttributes };
+}
+var sectionHeadVariants = cva({
+  base: "flex flex-col",
+  variants: {
+    align: {
+      center: "mx-auto text-center max-w-2xl",
+      left: "text-left"
+    }
+  },
+  defaultVariants: {
+    align: "center"
+  }
+});
+var sectionHeadKickerClass = "text-[11px] uppercase tracking-widest text-primary font-semibold";
+var sectionHeadTitleClass = "text-3xl sm:text-4xl font-bold tracking-tight text-foreground";
+var sectionHeadLedeClass = "mt-3 text-muted-foreground leading-relaxed";
+var SectionHead = React11.forwardRef(
+  ({
+    kicker,
+    title,
+    lede,
+    align = "center",
+    as: Tag = "h2",
+    className,
+    ...props
+  }, ref) => {
+    const { dataAttributes } = createSectionHead({ align });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(sectionHeadVariants({ align }), className),
+        ...dataAttributes,
+        ...props,
+        children: [
+          kicker != null && /* @__PURE__ */ jsx("p", { className: sectionHeadKickerClass, children: kicker }),
+          /* @__PURE__ */ jsx(Tag, { className: sectionHeadTitleClass, children: title }),
+          lede != null && /* @__PURE__ */ jsx("p", { className: sectionHeadLedeClass, children: lede })
+        ]
+      }
+    );
+  }
+);
+SectionHead.displayName = "SectionHead";
+
+// ../stat-grid/dist/index.js
+function statColumns(count, max = 3) {
+  if (count <= 0) return 1;
+  if (count === 1) return 1;
+  if (count === 2) return 2;
+  return Math.min(count, max);
+}
+function createStatGrid() {
+  return {
+    ariaProps: { role: "list" },
+    dataAttributes: {}
+  };
+}
+var statGridVariants = cva({
+  base: "grid gap-8",
+  variants: {
+    columns: {
+      "1": "grid-cols-1",
+      "2": "grid-cols-2",
+      "3": "grid-cols-3"
+    }
+  },
+  defaultVariants: {
+    columns: "3"
+  }
+});
+var statItemClass = "flex flex-col";
+var statValueClass = "text-xl sm:text-2xl font-bold text-primary";
+var statLabelClass = "mt-1 text-sm text-muted-foreground leading-snug";
+var StatGrid = React11.forwardRef(
+  ({ items, columns, className, ...props }, ref) => {
+    const cols = columns ?? statColumns(items.length);
+    const { ariaProps, dataAttributes } = createStatGrid();
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          statGridVariants({ columns: String(cols) }),
+          className
+        ),
+        style: { gridTemplateColumns: `repeat(${cols}, 1fr)` },
+        ...ariaProps,
+        ...dataAttributes,
+        ...props,
+        children: items.map((item, index) => /* @__PURE__ */ jsxs("div", { role: "listitem", className: statItemClass, children: [
+          /* @__PURE__ */ jsx("span", { className: statValueClass, children: item.value }),
+          /* @__PURE__ */ jsx("span", { className: statLabelClass, children: item.label })
+        ] }, index))
+      }
+    );
+  }
+);
+StatGrid.displayName = "StatGrid";
+
+// ../numbered-steps/dist/index.js
+function padOrdinal(n) {
+  return String(n).padStart(2, "0");
+}
+function stepColumns(count) {
+  return Math.min(5, Math.max(2, count));
+}
+function createNumberedSteps() {
+  const ariaProps = { role: "list" };
+  const dataAttributes = {
+    "data-component": "numbered-steps"
+  };
+  return { ariaProps, dataAttributes };
+}
+var numberedStepsVariants = cva({
+  base: "grid gap-6",
+  variants: {
+    columns: {
+      "2": "grid-cols-2",
+      "3": "grid-cols-3",
+      "4": "grid-cols-4",
+      "5": "grid-cols-5"
+    }
+  },
+  defaultVariants: {
+    columns: "3"
+  }
+});
+var numberedStepsItemClass = "rounded-xl border border-border bg-card p-5";
+var numberedStepsOrdinalClass = "font-mono text-sm text-primary";
+var numberedStepsTitleClass = "mt-2 text-sm font-bold text-foreground";
+var numberedStepsBodyClass = "mt-1 text-xs text-muted-foreground leading-relaxed";
+var NumberedSteps = React11.forwardRef(({ items, columns, className, ...props }, ref) => {
+  const cols = columns ?? stepColumns(items.length);
+  const { ariaProps, dataAttributes } = createNumberedSteps();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(numberedStepsVariants(), className),
+      style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` },
+      ...ariaProps,
+      ...dataAttributes,
+      ...props,
+      children: items.map((item, index) => /* @__PURE__ */ jsxs("div", { role: "listitem", className: numberedStepsItemClass, children: [
+        /* @__PURE__ */ jsx("span", { className: numberedStepsOrdinalClass, children: padOrdinal(index + 1) }),
+        /* @__PURE__ */ jsx("p", { className: numberedStepsTitleClass, children: item.title }),
+        /* @__PURE__ */ jsx("p", { className: numberedStepsBodyClass, children: item.body })
+      ] }, index))
+    }
+  );
+});
+NumberedSteps.displayName = "NumberedSteps";
+
+// ../pricing-card/dist/index.js
+function createPricingCard(options = {}) {
+  const { featured = false } = options;
+  const ariaProps = {
+    role: "group"
+  };
+  const dataAttributes = {
+    "data-featured": String(featured)
+  };
+  return { ariaProps, dataAttributes };
+}
+var pricingCardVariants = cva({
+  base: [
+    "relative flex flex-col rounded-2xl border border-border bg-card p-6",
+    "transition-shadow"
+  ].join(" "),
+  variants: {
+    featured: {
+      true: "ring-1 ring-primary",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    featured: "false"
+  }
+});
+var pricingCardBadgeClass = "mb-3 inline-flex items-center rounded-full bg-primary/10 px-2.5 py-0.5 text-xs font-medium text-primary";
+var pricingCardNameClass = "text-lg font-bold text-foreground";
+var pricingCardPriceClass = "text-3xl font-bold text-foreground";
+var pricingCardPeriodClass = "text-sm text-muted-foreground";
+var pricingCardDescriptionClass = "text-sm text-muted-foreground";
+var pricingCardFeatureListClass = "flex flex-col gap-2";
+var pricingCardFeatureRowClass = "flex items-start gap-2 text-sm text-foreground";
+var pricingCardFeatureTickClass = "mt-0.5 size-4 shrink-0 text-primary";
+var pricingCtaVariants = cva({
+  base: [
+    "mt-auto inline-flex w-full items-center justify-center rounded-lg px-4 py-2",
+    "text-sm font-medium transition-colors",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ].join(" "),
+  variants: {
+    variant: {
+      default: "bg-primary text-primary-foreground hover:bg-primary/90",
+      outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+var PricingCard = React11.forwardRef(
+  ({
+    badge,
+    name,
+    price,
+    period,
+    description,
+    features,
+    cta,
+    ctaVariant = "default",
+    ctaHref,
+    onCtaClick,
+    featured = false,
+    className,
+    ...props
+  }, ref) => {
+    const { ariaProps, dataAttributes } = createPricingCard({ featured });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(pricingCardVariants({ featured: featured ? "true" : "false" }), className),
+        ...ariaProps,
+        ...dataAttributes,
+        ...props,
+        children: [
+          badge != null && /* @__PURE__ */ jsx("span", { className: pricingCardBadgeClass, children: badge }),
+          /* @__PURE__ */ jsx("p", { className: pricingCardNameClass, children: name }),
+          /* @__PURE__ */ jsxs("div", { className: "mt-4 flex items-baseline gap-1", children: [
+            /* @__PURE__ */ jsx("span", { className: pricingCardPriceClass, children: price }),
+            period != null && /* @__PURE__ */ jsx("span", { className: pricingCardPeriodClass, children: period })
+          ] }),
+          description != null && /* @__PURE__ */ jsx("p", { className: `mt-2 ${pricingCardDescriptionClass}`, children: description }),
+          /* @__PURE__ */ jsx("ul", { className: `mt-6 ${pricingCardFeatureListClass}`, children: features.map((feature) => /* @__PURE__ */ jsxs("li", { className: pricingCardFeatureRowClass, children: [
+            /* @__PURE__ */ jsx(
+              "svg",
+              {
+                className: pricingCardFeatureTickClass,
+                viewBox: "0 0 16 16",
+                fill: "none",
+                "aria-hidden": "true",
+                children: /* @__PURE__ */ jsx(
+                  "path",
+                  {
+                    d: "M3 8l3.5 3.5L13 4.5",
+                    stroke: "currentColor",
+                    strokeWidth: "1.75",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round"
+                  }
+                )
+              }
+            ),
+            feature
+          ] }, feature)) }),
+          /* @__PURE__ */ jsx("div", { className: "mt-6", children: ctaHref != null ? /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: ctaHref,
+              className: pricingCtaVariants({ variant: ctaVariant }),
+              children: cta
+            }
+          ) : /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: pricingCtaVariants({ variant: ctaVariant }),
+              onClick: onCtaClick,
+              children: cta
+            }
+          ) })
+        ]
+      }
+    );
+  }
+);
+PricingCard.displayName = "PricingCard";
+
+// ../brand-network-cell/dist/index.js
+function createBrandNetworkCell(props = {}) {
+  const { current = false } = props;
+  const ariaProps = {
+    role: "group"
+  };
+  const dataAttributes = {
+    "data-current": String(current)
+  };
+  return { ariaProps, dataAttributes };
+}
+var brandNetworkCellVariants = cva({
+  base: [
+    "relative rounded-xl border border-border bg-card p-4",
+    "flex flex-col gap-3 transition-shadow"
+  ].join(" "),
+  variants: {
+    current: {
+      true: "ring-1 ring-primary",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    current: "false"
+  }
+});
+var brandNetworkCellGlyphClass = "flex size-10 items-center justify-center rounded-lg text-sm font-bold";
+var brandNetworkCellDomainClass = "font-semibold text-foreground";
+var brandNetworkCellCurrentBadgeClass = "inline-flex items-center rounded-md bg-primary/10 px-2 py-0.5 text-xs font-medium text-primary";
+var brandNetworkCellBodyClass = "text-sm text-muted-foreground";
+var brandNetworkCellLinkClass = "text-sm text-primary";
+var BrandNetworkCell = React11.forwardRef(
+  ({
+    glyph,
+    glyphBg,
+    glyphColor,
+    domain,
+    body,
+    href,
+    linkLabel,
+    current = false,
+    className,
+    ...props
+  }, ref) => {
+    const api = createBrandNetworkCell({ current });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          brandNetworkCellVariants({ current: current ? "true" : "false" }),
+          className
+        ),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: brandNetworkCellGlyphClass,
+              style: { background: glyphBg, color: glyphColor },
+              "aria-hidden": "true",
+              children: glyph
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx("span", { className: brandNetworkCellDomainClass, children: domain }),
+            current && /* @__PURE__ */ jsx("span", { className: brandNetworkCellCurrentBadgeClass, children: "You are here" })
+          ] }),
+          /* @__PURE__ */ jsx("p", { className: brandNetworkCellBodyClass, children: body }),
+          href != null && /* @__PURE__ */ jsx("a", { href, className: brandNetworkCellLinkClass, children: linkLabel ?? "Visit \u2192" })
+        ]
+      }
+    );
+  }
+);
+BrandNetworkCell.displayName = "BrandNetworkCell";
+
+// ../marquee-strip/dist/index.js
+function createMarqueeStrip(props = {}) {
+  const { scroll = false } = props;
+  const ariaProps = {
+    role: "group"
+  };
+  const dataAttributes = {
+    "data-scroll": String(scroll)
+  };
+  return { ariaProps, dataAttributes };
+}
+var marqueeStripVariants = cva({
+  base: "w-full bg-muted/30 border-y border-border py-3",
+  variants: {
+    scroll: {
+      true: "",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    scroll: "false"
+  }
+});
+var marqueeStripInnerClass = "flex flex-wrap items-center gap-3 px-4";
+var marqueeStripScrollOuterClass = "overflow-hidden px-4";
+var marqueeStripScrollTrackClass = "flex items-center gap-3 w-max animate-[marquee_30s_linear_infinite]";
+var marqueeStripLabelClass = "text-xs font-semibold uppercase tracking-widest text-muted-foreground shrink-0";
+var marqueeStripItemClass = "text-sm text-foreground";
+var MarqueeStrip = React11.forwardRef(
+  ({ label, items, scroll = false, className, ...props }, ref) => {
+    const api = createMarqueeStrip({ scroll });
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(marqueeStripVariants({ scroll: scroll ? "true" : "false" }), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: scroll ? /* @__PURE__ */ jsx("div", { className: marqueeStripScrollOuterClass, children: /* @__PURE__ */ jsx("div", { className: marqueeStripScrollTrackClass, children: [...items, ...items].map((item, index) => /* @__PURE__ */ jsx("span", { className: marqueeStripItemClass, children: item }, index)) }) }) : /* @__PURE__ */ jsxs("div", { className: marqueeStripInnerClass, children: [
+          label != null && /* @__PURE__ */ jsx("span", { className: marqueeStripLabelClass, children: label }),
+          items.map((item, index) => /* @__PURE__ */ jsx("span", { className: marqueeStripItemClass, children: item }, index))
+        ] })
+      }
+    );
+  }
+);
+MarqueeStrip.displayName = "MarqueeStrip";
+
+// ../browser-chrome-mock/dist/index.js
+function splitUrl(url) {
+  const slashIndex = url.indexOf("/");
+  if (slashIndex === -1) {
+    return { domain: url, path: "" };
+  }
+  return {
+    domain: url.slice(0, slashIndex),
+    path: url.slice(slashIndex)
+  };
+}
+function createBrowserChromeMock(props = {}) {
+  const { status } = props;
+  const ariaProps = {
+    role: "group",
+    "aria-label": "Browser preview"
+  };
+  const dataAttributes = {};
+  if (status !== void 0) {
+    dataAttributes["data-status"] = status;
+  }
+  return { ariaProps, dataAttributes };
+}
+var browserChromeMockVariants = cva({
+  base: "rounded-xl border border-border overflow-hidden bg-card",
+  variants: {},
+  defaultVariants: {}
+});
+var chromeBarClass = "flex items-center gap-2 bg-muted/40 border-b border-border px-3 py-2";
+var trafficDotClass = "size-2.5 rounded-full border border-border";
+var urlBarClass = "flex-1 text-center font-mono text-[11px] text-muted-foreground";
+var urlDomainClass = "font-semibold text-foreground";
+var statusBadgeVariants = cva({
+  base: "inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide",
+  variants: {
+    status: {
+      live: "text-emerald-500 bg-emerald-500/10",
+      rec: "text-destructive bg-destructive/10"
+    }
+  },
+  defaultVariants: {
+    status: "live"
+  }
+});
+var contentAreaClass = "p-0";
+var TRAFFIC_DOTS = ["bg-red-400", "bg-yellow-400", "bg-green-400"];
+var BrowserChromeMock = React11.forwardRef(({ url, status, className, children, ...props }, ref) => {
+  const { ariaProps, dataAttributes } = createBrowserChromeMock({ status });
+  const { domain, path } = splitUrl(url);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(browserChromeMockVariants(), className),
+      ...ariaProps,
+      ...dataAttributes,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: chromeBarClass, children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5 shrink-0", children: TRAFFIC_DOTS.map((color) => /* @__PURE__ */ jsx("span", { className: cn(trafficDotClass, color) }, color)) }),
+          /* @__PURE__ */ jsxs("div", { className: urlBarClass, children: [
+            /* @__PURE__ */ jsx("span", { className: urlDomainClass, children: domain }),
+            path && /* @__PURE__ */ jsx("span", { children: path })
+          ] }),
+          status && /* @__PURE__ */ jsxs("div", { className: statusBadgeVariants({ status }), children: [
+            status === "rec" && /* @__PURE__ */ jsx("span", { className: "size-1.5 rounded-full bg-destructive animate-pulse" }),
+            status
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: contentAreaClass, children })
+      ]
+    }
+  );
+});
+BrowserChromeMock.displayName = "BrowserChromeMock";
+
+// ../mastery-bar/dist/index.js
+function clampPercent(value) {
+  if (Number.isNaN(value)) return 0;
+  return Math.min(100, Math.max(0, value));
+}
+function createMasteryBar({ value }) {
+  const clamped = clampPercent(value);
+  const ariaProps = {
+    role: "progressbar",
+    "aria-valuenow": clamped,
+    "aria-valuemin": 0,
+    "aria-valuemax": 100
+  };
+  const dataAttributes = {
+    "data-value": String(clamped)
+  };
+  return { ariaProps, dataAttributes };
+}
+var masteryBarVariants = cva({
+  base: "w-full overflow-hidden rounded-full bg-muted",
+  variants: {
+    size: {
+      sm: "h-1.5",
+      md: "h-2",
+      lg: "h-3"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var masteryBarFillVariants = cva({
+  base: "h-full rounded-full bg-primary",
+  variants: {
+    muted: {
+      true: "bg-primary/70",
+      false: "bg-primary"
+    }
+  },
+  defaultVariants: {
+    muted: "false"
+  }
+});
+var masteryBarLabelClass = "text-xs text-muted-foreground";
+var masteryBarLeadingLabelClass = "text-xs text-muted-foreground";
+var masteryBarHeaderClass = "flex justify-between items-baseline mb-1";
+var MasteryBar = React11.forwardRef(
+  ({
+    value,
+    label,
+    leadingLabel,
+    size = "md",
+    muted = false,
+    className,
+    ...props
+  }, ref) => {
+    const clamped = clampPercent(value);
+    const { ariaProps, dataAttributes } = createMasteryBar({ value });
+    const hasHeader = leadingLabel != null || label != null;
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("w-full", className), ...props, children: [
+      hasHeader && /* @__PURE__ */ jsxs("div", { className: masteryBarHeaderClass, children: [
+        leadingLabel != null && /* @__PURE__ */ jsx("span", { className: masteryBarLeadingLabelClass, children: leadingLabel }),
+        label != null && /* @__PURE__ */ jsx("span", { className: masteryBarLabelClass, children: label })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: masteryBarVariants({ size }),
+          ...ariaProps,
+          ...dataAttributes,
+          children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: masteryBarFillVariants({ muted: muted ? "true" : "false" }),
+              style: { width: `${clamped}%` }
+            }
+          )
+        }
+      )
+    ] });
+  }
+);
+MasteryBar.displayName = "MasteryBar";
+
+// ../audience-feature-card/dist/index.js
+function createAudienceFeatureCard(_props = {}) {
+  const ariaProps = {
+    role: "group"
+  };
+  const dataAttributes = {
+    "data-component": "audience-feature-card"
+  };
+  return { ariaProps, dataAttributes };
+}
+var audienceFeatureCardVariants = cva({
+  base: "flex h-full flex-col rounded-xl border border-border bg-card p-5",
+  variants: {},
+  defaultVariants: {}
+});
+var audienceFeatureCardKickerClass = "text-[10px] uppercase tracking-widest text-primary font-semibold";
+var audienceFeatureCardTitleClass = "mt-2 text-lg font-bold text-foreground";
+var audienceFeatureCardBodyClass = "mt-1 text-sm text-muted-foreground leading-relaxed";
+var audienceFeatureCardFooterClass = "mt-auto pt-4 text-xs";
+var AudienceFeatureCard = React11.forwardRef(({ kicker, title, body, footer, className, ...props }, ref) => {
+  const { ariaProps, dataAttributes } = createAudienceFeatureCard();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(audienceFeatureCardVariants(), className),
+      ...ariaProps,
+      ...dataAttributes,
+      ...props,
+      children: [
+        kicker != null && /* @__PURE__ */ jsx("p", { className: audienceFeatureCardKickerClass, children: kicker }),
+        /* @__PURE__ */ jsx("p", { className: audienceFeatureCardTitleClass, children: title }),
+        /* @__PURE__ */ jsx("p", { className: audienceFeatureCardBodyClass, children: body }),
+        footer != null && /* @__PURE__ */ jsx("div", { className: audienceFeatureCardFooterClass, children: footer })
+      ]
+    }
+  );
+});
+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 };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map