@proteos/ui 0.76.0 → 0.78.0

package/dist/index.js

@@ -1,10 +1,10 @@
 import { cn, Button, Skeleton } from './chunk-XRN5MNDX.js';
 export { Button, Skeleton, buttonStyles, cn, skeletonStyles } from './chunk-XRN5MNDX.js';
-import { icons, Contact, Paperclip, BookText, Banknote, UsersRound, User, Link2, Braces, Brackets, ToggleLeft, CircleDot, Calendar, Hash, Type, File, FileImage, FileText, FileSpreadsheet, FileArchive, Loader2, X, ChevronLeft, ChevronRight, Shapes, Search, Phone, AudioLines, Video, Mic, AtSign, MessagesSquare, Camera, Send, Linkedin, MessageCircle, Mail, Pipette, Pencil, ChevronDown, GripVertical, SendHorizontal, CircleX, Download, AlertCircle, Undo2, ArrowRight, Check, CircleCheck, CircleAlert, Info } from 'lucide-react';
+import { icons, Contact, Paperclip, BookText, Banknote, UsersRound, User, Link2, Braces, Brackets, ToggleLeft, CircleDot, Calendar, Hash, Type, File, FileImage, FileText, FileSpreadsheet, FileArchive, Loader2, X, ChevronLeft, ChevronRight, Shapes, Search, Phone, AudioLines, Video, Mic, AtSign, MessagesSquare, Camera, Send, Linkedin, MessageCircle, Mail, Pipette, Pencil, ChevronDown, GripVertical, SendHorizontal, CircleX, Download, Square, RotateCcw, Pause, Play, RotateCw, AlertCircle, Undo2, ArrowRight, Check, CircleCheck, CircleAlert, Info } from 'lucide-react';
 import { tv } from 'tailwind-variants';
-import { Tabs as Tabs$1, TabPanel, Tab, TabList, MenuTrigger as MenuTrigger$1, SubmenuTrigger as SubmenuTrigger$1, DialogTrigger, Popover as Popover$1, Dialog, DropZone, Text, FileTrigger, Heading, Calendar as Calendar$1, Button as Button$1, CalendarGrid, CalendarGridHeader, CalendarHeaderCell, CalendarGridBody, CalendarCell, CalendarStateContext, Label, Input as Input$1, ListBox, ListBoxItem, TooltipTrigger as TooltipTrigger$1, Tooltip as Tooltip$1, Breadcrumbs as Breadcrumbs$1, Breadcrumb, Link, Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, FieldError, TextField, ComboBox, ComboBoxStateContext, Select as Select$1, SelectValue, ModalOverlay, Modal as Modal$1, DatePicker as DatePicker$1, Group, DateInput, DateSegment, Menu as Menu$1, MenuItem as MenuItem$1, Disclosure, DisclosurePanel, ProgressBar as ProgressBar$1, RadioGroup as RadioGroup$1, Radio as Radio$1, Separator as Separator$1, Switch as Switch$1, TextArea, TimeField as TimeField$1, ToggleButtonGroup, ToggleButton, UNSTABLE_ToastQueue, UNSTABLE_ToastRegion, UNSTABLE_Toast, UNSTABLE_ToastContent, DatePickerStateContext } from 'react-aria-components';
+import { Tabs as Tabs$1, TabPanel, Tab, TabList, MenuTrigger as MenuTrigger$1, SubmenuTrigger as SubmenuTrigger$1, DialogTrigger, Popover as Popover$1, Dialog, DropZone, Text, FileTrigger, Heading, Calendar as Calendar$1, Button as Button$1, CalendarGrid, CalendarGridHeader, CalendarHeaderCell, CalendarGridBody, CalendarCell, CalendarStateContext, Label, Input as Input$1, ListBox, ListBoxItem, TooltipTrigger as TooltipTrigger$1, Tooltip as Tooltip$1, Breadcrumbs as Breadcrumbs$1, Breadcrumb, Link, Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, FieldError, TextField, ComboBox, ComboBoxStateContext, Select as Select$1, SelectValue, ModalOverlay, Modal as Modal$1, DatePicker as DatePicker$1, Group, DateInput, DateSegment, ToggleButtonGroup, ToggleButton, Slider as Slider$1, SliderTrack, SliderThumb, Menu as Menu$1, MenuItem as MenuItem$1, Disclosure, DisclosurePanel, ProgressBar as ProgressBar$1, RadioGroup as RadioGroup$1, Radio as Radio$1, Separator as Separator$1, Switch as Switch$1, TextArea, TimeField as TimeField$1, UNSTABLE_ToastQueue, UNSTABLE_ToastRegion, UNSTABLE_Toast, UNSTABLE_ToastContent, DatePickerStateContext } from 'react-aria-components';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { lazy, createContext, useContext, useState, useRef, useMemo, Children, isValidElement, useLayoutEffect, useEffect, useSyncExternalStore, useCallback, Suspense, useId, Fragment as Fragment$1 } from 'react';
+import { lazy, createContext, memo, useRef, useEffect, useContext, useState, useMemo, Children, isValidElement, useLayoutEffect, useSyncExternalStore, useCallback, Suspense, useId, Fragment as Fragment$1 } from 'react';
 import { formatAmount, parseAmount } from '@proteos/sdk';
 import { draggable, dropTargetForElements, monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { extractClosestEdge, attachClosestEdge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';
@@ -125,12 +125,12 @@ function formatFileSize(bytes) {
   if (bytes < 1024) return `${bytes} B`;
   const units = ["KB", "MB", "GB", "TB"];
   let size = bytes / 1024;
-  let unit = 0;
-  while (size >= 1024 && unit < units.length - 1) {
+  let unit2 = 0;
+  while (size >= 1024 && unit2 < units.length - 1) {
     size /= 1024;
-    unit += 1;
+    unit2 += 1;
   }
-  return `${size < 10 ? size.toFixed(1) : Math.round(size)} ${units[unit]}`;
+  return `${size < 10 ? size.toFixed(1) : Math.round(size)} ${units[unit2]}`;
 }
 function FileField({
   value,
@@ -3997,13 +3997,35 @@ function DataTable({
     setListOffset((prev) => prev === top ? prev : top);
   });
   const headingHeight = groupHeaderHeight ?? rowHeight;
+  const [isScrollerAttached, setIsScrollerAttached] = useState(false);
+  useLayoutEffect(() => setIsScrollerAttached(true), []);
   const virtualizer = useVirtualizer({
+    enabled: initialScrollOffset === void 0 || isScrollerAttached,
     count: listItems.length,
     getScrollElement: () => scrollerRef.current,
     estimateSize: (index) => listItems[index]?.kind === "group" ? headingHeight : rowHeight,
     overscan,
     scrollMargin: listOffset,
-    ...initialScrollOffset !== void 0 ? { initialOffset: initialScrollOffset } : {}
+    // Read once, with the scroller attached (see `enabled`). Clamp the restored
+    // offset to what the scroller will be able to reach: while the skeleton
+    // shows, or when the list shrank since the visit, the browser clamps
+    // scrollTop WITHOUT firing a scroll event, and the virtualizer — which only
+    // re-reads its offset on scroll events — would sit past the rows and paint
+    // empty. The reach comes from the row data, not `scrollHeight`: the disabled
+    // first render committed an empty spacer, so the DOM can't report it yet.
+    ...initialScrollOffset !== void 0 ? {
+      initialOffset: () => {
+        const el = scrollerRef.current;
+        if (!el) return 0;
+        const estimatedSize = listItems.reduce(
+          (sum, item) => sum + (item.kind === "group" ? headingHeight : rowHeight),
+          0
+        );
+        const listTop = listRef.current?.offsetTop ?? 0;
+        const reachable = listTop + estimatedSize - el.clientHeight;
+        return Math.max(0, Math.min(initialScrollOffset, reachable));
+      }
+    } : {}
   });
   const sentinelRef = useInfiniteScrollSentinel({
     onIntersect: () => {
@@ -6028,6 +6050,103 @@ function FileViewer({
   const skeleton = /* @__PURE__ */ jsx(Skeleton, { "aria-label": `Loading preview of ${name}`, className: "h-full w-full rounded-none" });
   return /* @__PURE__ */ jsx("div", { className: cn(fileViewerStyles(), className), style: { height: heightPx }, children: !src ? skeleton : kind === "image" ? /* @__PURE__ */ jsx(ImageView, { name, src, ...onDownload ? { onDownload } : {} }) : kind === "video" ? /* @__PURE__ */ jsx(VideoView, { name, src }) : /* @__PURE__ */ jsx(Suspense, { fallback: skeleton, children: /* @__PURE__ */ jsx(PdfView, { name, src, ...onDownload ? { onDownload } : {} }) }) });
 }
+
+// src/components/media-player/media-time.ts
+var pad = (value) => String(value).padStart(2, "0");
+function formatMediaTime(seconds) {
+  const total = Math.max(0, Math.floor(Number.isFinite(seconds) ? seconds : 0));
+  const hours = Math.floor(total / 3600);
+  const minutes = Math.floor(total % 3600 / 60);
+  const rest = total % 60;
+  return hours > 0 ? `${hours}:${pad(minutes)}:${pad(rest)}` : `${pad(minutes)}:${pad(rest)}`;
+}
+var unit = (value, name) => `${value} ${name}${value === 1 ? "" : "s"}`;
+function spokenMediaTime(seconds) {
+  const total = Math.max(0, Math.floor(Number.isFinite(seconds) ? seconds : 0));
+  const hours = Math.floor(total / 3600);
+  const minutes = Math.floor(total % 3600 / 60);
+  const rest = total % 60;
+  return [
+    hours > 0 ? unit(hours, "hour") : "",
+    minutes > 0 ? unit(minutes, "minute") : "",
+    rest > 0 || total === 0 ? unit(rest, "second") : ""
+  ].filter(Boolean).join(" ");
+}
+var frameStripStyles = tv({
+  slots: {
+    root: "flex shrink-0 gap-2 overflow-x-auto overscroll-x-contain scroll-px-[18px] px-[18px] py-3",
+    item: [
+      "group flex w-[120px] shrink-0 cursor-pointer flex-col gap-1.5 rounded-md p-1 outline-none",
+      "transition-[background-color,box-shadow] duration-150",
+      "hovered:bg-surface-2",
+      "pressed:bg-surface-3",
+      "data-[focus-visible]:shadow-[var(--shadow-focus)]"
+    ],
+    thumbnail: [
+      "relative aspect-video w-full overflow-hidden rounded-sm border border-rule bg-surface-2",
+      "*:size-full *:object-cover",
+      "transition-[border-color,box-shadow] duration-150",
+      "group-data-[hovered]:border-rule-strong",
+      "group-data-[selected]:border-ink group-data-[selected]:shadow-[inset_0_0_0_1px_var(--color-ink)]"
+    ],
+    caption: "flex min-w-0 items-baseline gap-1.5 px-0.5",
+    label: [
+      "min-w-0 flex-1 truncate text-[12px] leading-4 text-ink-2",
+      "group-data-[selected]:font-medium group-data-[selected]:text-ink"
+    ],
+    time: "shrink-0 font-mono text-[11px] leading-4 tabular-nums text-ink-4"
+  }
+});
+function FrameStrip({ items, selectedKey, onSelect, className, ...props }) {
+  const styles4 = frameStripStyles();
+  const rootRef = useRef(null);
+  useEffect(() => {
+    const root = rootRef.current;
+    if (selectedKey === void 0 || !root) return;
+    for (const element of root.querySelectorAll("[data-frame-key]")) {
+      if (element.dataset.frameKey !== selectedKey) continue;
+      if (typeof element.scrollIntoView === "function")
+        element.scrollIntoView({ block: "nearest", inline: "nearest" });
+      break;
+    }
+  }, [selectedKey]);
+  if (items.length === 0) return null;
+  const isLabelled = props["aria-label"] !== void 0 || props["aria-labelledby"] !== void 0;
+  return /* @__PURE__ */ jsx(
+    ToggleButtonGroup,
+    {
+      ...isLabelled ? {} : { "aria-label": "Frames" },
+      ...props,
+      ref: rootRef,
+      orientation: "horizontal",
+      selectionMode: "single",
+      disallowEmptySelection: true,
+      selectedKeys: selectedKey === void 0 ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([selectedKey]),
+      onSelectionChange: (keys) => {
+        const [next] = Array.from(keys);
+        if (next !== void 0) onSelect(String(next));
+      },
+      className: cn(styles4.root(), className),
+      children: items.map((item) => /* @__PURE__ */ jsxs(
+        ToggleButton,
+        {
+          id: item.key,
+          "data-frame-key": item.key,
+          "aria-label": `${item.label}, at ${formatMediaTime(item.at)}`,
+          className: styles4.item(),
+          children: [
+            /* @__PURE__ */ jsx("span", { className: styles4.thumbnail(), children: item.thumbnail }),
+            /* @__PURE__ */ jsxs("span", { className: styles4.caption(), children: [
+              /* @__PURE__ */ jsx("span", { className: styles4.label(), children: item.label }),
+              /* @__PURE__ */ jsx("span", { className: styles4.time(), children: formatMediaTime(item.at) })
+            ] })
+          ]
+        },
+        item.key
+      ))
+    }
+  );
+}
 var glowFrameStyles = tv({
   slots: {
     room: "glow-room flex min-h-0 flex-col",
@@ -6232,6 +6351,847 @@ function Input({
     }
   );
 }
+var sliderStyles = tv({
+  slots: {
+    root: "flex w-full items-center",
+    track: "group relative h-[18px] w-full cursor-pointer data-[disabled]:cursor-default",
+    rail: "absolute inset-x-0 top-1/2 h-1 -translate-y-1/2 overflow-hidden rounded-pill bg-surface-3",
+    fill: "h-full bg-ink",
+    thumb: [
+      "top-1/2 size-3 rounded-pill bg-ink",
+      "shadow-[var(--shadow-rest)]",
+      "data-[focus-visible]:shadow-[var(--shadow-focus)]",
+      "data-[disabled]:hidden"
+    ]
+  }
+});
+function Slider({
+  value,
+  onChange,
+  onChangeEnd,
+  valueText,
+  className,
+  ...props
+}) {
+  const styles4 = sliderStyles();
+  const inputRef = useRef(null);
+  useLayoutEffect(() => {
+    if (valueText !== void 0) inputRef.current?.setAttribute("aria-valuetext", valueText);
+  });
+  return /* @__PURE__ */ jsx(
+    Slider$1,
+    {
+      ...props,
+      value,
+      ...onChange ? { onChange } : {},
+      ...onChangeEnd ? { onChangeEnd } : {},
+      className: (renderProps) => cn(styles4.root(), typeof className === "function" ? className(renderProps) : className),
+      children: /* @__PURE__ */ jsx(SliderTrack, { className: styles4.track(), children: ({ state }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { className: styles4.rail(), children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: styles4.fill(),
+            style: { width: `${state.getThumbPercent(0) * 100}%` }
+          }
+        ) }),
+        /* @__PURE__ */ jsx(SliderThumb, { inputRef, className: styles4.thumb() })
+      ] }) })
+    }
+  );
+}
+
+// src/components/media-player/media-peaks.ts
+var MAX_DECODE_BYTES = 50 * 1024 * 1024;
+var DECODE_SAMPLE_RATE = 8e3;
+var PEAK_BUCKETS = 4e3;
+var SAMPLES_PER_BUCKET = 256;
+function peaksFromChannels(channels, buckets = PEAK_BUCKETS) {
+  const length = channels[0]?.length ?? 0;
+  const peaks = new Float32Array(buckets);
+  if (length === 0) return peaks;
+  const stride = Math.max(1, Math.floor(length / buckets / SAMPLES_PER_BUCKET));
+  let loudest = 0;
+  for (let bucket = 0; bucket < buckets; bucket++) {
+    const start = Math.floor(bucket / buckets * length);
+    const end = Math.floor((bucket + 1) / buckets * length);
+    let sum = 0;
+    let count = 0;
+    for (let index = start; index < end; index += stride) {
+      let sample = 0;
+      for (const channel of channels) sample = Math.max(sample, Math.abs(channel[index] ?? 0));
+      sum += sample * sample;
+      count++;
+    }
+    const level = count > 0 ? Math.sqrt(sum / count) : 0;
+    peaks[bucket] = level;
+    if (level > loudest) loudest = level;
+  }
+  if (loudest > 0)
+    for (let bucket = 0; bucket < buckets; bucket++) peaks[bucket] = (peaks[bucket] ?? 0) / loudest;
+  return peaks;
+}
+function maskPeaks(peaks, duration, segments) {
+  const masked = new Float32Array(peaks.length);
+  if (duration <= 0) return masked;
+  for (const [start, end] of segments) {
+    const from = Math.max(0, Math.floor(start / duration * peaks.length));
+    const to = Math.min(peaks.length, Math.ceil(end / duration * peaks.length));
+    for (let bucket = from; bucket < to; bucket++) masked[bucket] = peaks[bucket] ?? 0;
+  }
+  return masked;
+}
+async function decodePeaks(blob) {
+  const context = new OfflineAudioContext(1, 1, DECODE_SAMPLE_RATE);
+  const buffer = await context.decodeAudioData(await blob.arrayBuffer());
+  const channels = Array.from(
+    { length: buffer.numberOfChannels },
+    (_, index) => buffer.getChannelData(index)
+  );
+  return { peaks: peaksFromChannels(channels), duration: buffer.duration };
+}
+var mediaPlayerStyles = tv({
+  slots: {
+    root: "flex min-h-0 flex-1 flex-col",
+    stage: "relative flex min-h-0 flex-1 flex-col"
+  }
+});
+var MediaPlayerContext = createContext(null);
+function useMediaPlayer() {
+  const context = useContext(MediaPlayerContext);
+  if (!context) throw new Error("useMediaPlayer must be used inside a MediaPlayer");
+  return context;
+}
+var HAVE_METADATA = 1;
+function MediaPlayer({
+  source,
+  label,
+  kind = "audio",
+  onError,
+  className,
+  children
+}) {
+  const [media, setMedia] = useState(null);
+  const [src, setSrc] = useState(null);
+  const [loaded, setLoaded] = useState(null);
+  const [isPlaying, setIsPlaying] = useState(false);
+  const [currentTime, setCurrentTime] = useState(0);
+  const [mediaDuration, setMediaDuration] = useState(0);
+  const [playbackRate, setPlaybackRateState] = useState(1);
+  const [waveformStatus, setWaveformStatus] = useState("decoding");
+  const [decoded, setDecoded] = useState(null);
+  const blob = "blob" in source ? source.blob : null;
+  const url = "url" in source ? source.url : null;
+  const givenPeaks = "url" in source ? source.peaks ?? null : null;
+  const givenDuration = source.duration ?? null;
+  useEffect(() => {
+    if (!blob) {
+      setSrc(url);
+      return;
+    }
+    const objectUrl = URL.createObjectURL(blob);
+    setSrc(objectUrl);
+    return () => URL.revokeObjectURL(objectUrl);
+  }, [blob, url]);
+  useEffect(() => {
+    if (!blob) {
+      if (givenPeaks && givenDuration !== null) {
+        setDecoded({ peaks: givenPeaks, duration: givenDuration });
+        setWaveformStatus("ready");
+      } else {
+        setDecoded(null);
+        setWaveformStatus("unavailable");
+      }
+      return;
+    }
+    setDecoded(null);
+    if (blob.size > MAX_DECODE_BYTES) {
+      setWaveformStatus("unavailable");
+      return;
+    }
+    setWaveformStatus("decoding");
+    let isCancelled = false;
+    decodePeaks(blob).then((result) => {
+      if (isCancelled) return;
+      setDecoded(result);
+      setWaveformStatus("ready");
+    }).catch(() => {
+      if (!isCancelled) setWaveformStatus("unavailable");
+    });
+    return () => {
+      isCancelled = true;
+    };
+  }, [blob, givenPeaks, givenDuration]);
+  useEffect(() => {
+    if (!media) return;
+    const syncTime = () => setCurrentTime(media.currentTime);
+    const syncDuration = () => setMediaDuration(Number.isFinite(media.duration) ? media.duration : 0);
+    const syncLoaded = () => {
+      setLoaded(media);
+      syncDuration();
+    };
+    const syncEmptied = () => {
+      setLoaded(null);
+      setMediaDuration(0);
+      setCurrentTime(0);
+    };
+    const syncPlaying = () => setIsPlaying(!media.paused && !media.ended);
+    const handleError = () => onError?.();
+    if (media.readyState >= HAVE_METADATA) syncLoaded();
+    const events = [
+      ["timeupdate", syncTime],
+      ["seeked", syncTime],
+      ["loadedmetadata", syncLoaded],
+      ["durationchange", syncDuration],
+      ["emptied", syncEmptied],
+      ["play", syncPlaying],
+      ["pause", syncPlaying],
+      ["ended", syncPlaying],
+      ["error", handleError]
+    ];
+    for (const [name, handler] of events) media.addEventListener(name, handler);
+    return () => {
+      for (const [name, handler] of events) media.removeEventListener(name, handler);
+      media.pause();
+    };
+  }, [media, onError]);
+  const duration = mediaDuration || givenDuration || decoded?.duration || 0;
+  const isReady = media !== null && loaded === media;
+  const toggle = useCallback(() => {
+    if (!media) return;
+    if (media.paused || media.ended) {
+      void media.play().catch(() => void 0);
+    } else {
+      media.pause();
+    }
+  }, [media]);
+  const seek = useCallback(
+    (seconds) => {
+      if (!media) return;
+      const limit = Number.isFinite(media.duration) ? media.duration : duration > 0 ? duration : seconds;
+      const next = Math.max(0, Math.min(limit, seconds));
+      media.currentTime = next;
+      setCurrentTime(next);
+    },
+    [media, duration]
+  );
+  const skip = useCallback(
+    (seconds) => {
+      if (media) seek(media.currentTime + seconds);
+    },
+    [media, seek]
+  );
+  const stop = useCallback(() => {
+    media?.pause();
+    seek(0);
+  }, [media, seek]);
+  const setPlaybackRate = useCallback(
+    (rate) => {
+      if (media) media.playbackRate = rate;
+      setPlaybackRateState(rate);
+    },
+    [media]
+  );
+  const value = useMemo(
+    () => ({
+      media,
+      mediaRef: setMedia,
+      src,
+      isReady,
+      isPlaying,
+      currentTime,
+      duration,
+      playbackRate,
+      waveformStatus,
+      decoded,
+      toggle,
+      stop,
+      seek,
+      skip,
+      setPlaybackRate
+    }),
+    [
+      media,
+      src,
+      isReady,
+      isPlaying,
+      currentTime,
+      duration,
+      playbackRate,
+      waveformStatus,
+      decoded,
+      toggle,
+      stop,
+      seek,
+      skip,
+      setPlaybackRate
+    ]
+  );
+  const handleKeyDown = (event) => {
+    if (event.code !== "Space") return;
+    if (event.target.closest("button, input")) return;
+    event.preventDefault();
+    toggle();
+  };
+  return /* @__PURE__ */ jsx(MediaPlayerContext.Provider, { value, children: /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "aria-label": label,
+      onKeyDown: handleKeyDown,
+      className: cn(mediaPlayerStyles().root(), className),
+      children: [
+        kind === "audio" ? /* @__PURE__ */ jsx("audio", { ref: setMedia, preload: "metadata", ...src ? { src } : {} }) : null,
+        children
+      ]
+    }
+  ) });
+}
+function MediaStage({
+  ref,
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsx("div", { ref, className: cn(mediaPlayerStyles().stage(), className), children });
+}
+var mediaControlsStyles = tv({
+  slots: {
+    root: "shrink-0 border-t border-rule-2 px-[18px] pt-3 pb-3.5",
+    seek: "grid grid-cols-[auto_1fr_auto] items-center gap-2.5",
+    elapsed: "font-mono text-[12.5px] leading-none tabular-nums text-ink-2",
+    total: "font-mono text-[12.5px] leading-none tabular-nums text-ink-4",
+    transport: "mt-2 grid grid-cols-[1fr_auto_1fr] items-center",
+    center: "flex items-center gap-1.5",
+    end: "justify-self-end",
+    text: "font-mono"
+  }
+});
+var SKIP_SECONDS = 10;
+var SPEEDS = [1, 1.25, 1.5, 2];
+function MediaControls({ describeTime, hasSeek = true, className }) {
+  const {
+    isReady,
+    isPlaying,
+    currentTime,
+    duration,
+    playbackRate,
+    toggle,
+    stop,
+    seek,
+    skip,
+    setPlaybackRate
+  } = useMediaPlayer();
+  const styles4 = mediaControlsStyles();
+  const description = describeTime?.(currentTime);
+  const valueText = `${spokenMediaTime(currentTime)} of ${spokenMediaTime(duration)}${description ? `, ${description}` : ""}`;
+  const nextSpeed = SPEEDS[(SPEEDS.indexOf(playbackRate) + 1) % SPEEDS.length] ?? 1;
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles4.root(), className), children: [
+    hasSeek ? /* @__PURE__ */ jsxs("div", { className: styles4.seek(), children: [
+      /* @__PURE__ */ jsx("span", { className: styles4.elapsed(), children: formatMediaTime(currentTime) }),
+      /* @__PURE__ */ jsx(
+        Slider,
+        {
+          "aria-label": "Seek",
+          value: currentTime,
+          minValue: 0,
+          maxValue: duration || 1,
+          step: 1,
+          isDisabled: !isReady,
+          valueText,
+          onChange: seek
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: styles4.total(), children: duration > 0 ? formatMediaTime(duration) : "--:--" })
+    ] }) : null,
+    /* @__PURE__ */ jsxs("div", { className: cn(styles4.transport(), !hasSeek && "mt-0"), children: [
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "icon-md",
+          "aria-label": "Stop",
+          isDisabled: !isReady,
+          onPress: stop,
+          children: /* @__PURE__ */ jsx(Square, {})
+        }
+      ) }),
+      /* @__PURE__ */ jsxs("div", { className: styles4.center(), children: [
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "ghost",
+            size: "sm",
+            "aria-label": `Back ${SKIP_SECONDS} seconds`,
+            isDisabled: !isReady,
+            onPress: () => skip(-SKIP_SECONDS),
+            className: styles4.text(),
+            children: [
+              /* @__PURE__ */ jsx(RotateCcw, {}),
+              SKIP_SECONDS
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "cta",
+            size: "icon-lg",
+            "aria-label": isPlaying ? "Pause" : "Play",
+            isDisabled: !isReady,
+            onPress: toggle,
+            children: isPlaying ? /* @__PURE__ */ jsx(Pause, { fill: "currentColor" }) : /* @__PURE__ */ jsx(Play, { fill: "currentColor" })
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "ghost",
+            size: "sm",
+            "aria-label": `Forward ${SKIP_SECONDS} seconds`,
+            isDisabled: !isReady,
+            onPress: () => skip(SKIP_SECONDS),
+            className: styles4.text(),
+            children: [
+              SKIP_SECONDS,
+              /* @__PURE__ */ jsx(RotateCw, {})
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: styles4.end(), children: /* @__PURE__ */ jsxs(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          "aria-label": `Playback speed ${playbackRate} times`,
+          isDisabled: !isReady,
+          onPress: () => setPlaybackRate(nextSpeed),
+          className: styles4.text(),
+          children: [
+            playbackRate,
+            "\xD7"
+          ]
+        }
+      ) })
+    ] })
+  ] });
+}
+var mediaMarkersStyles = tv({
+  slots: {
+    root: "flex shrink-0 flex-col gap-[3px]",
+    heading: "flex min-w-0 shrink-0 items-center gap-1.5 text-[12px] leading-4 text-ink-3",
+    dot: "size-[5px] shrink-0 rounded-pill",
+    current: "min-w-0 truncate font-medium text-ink",
+    count: "ml-auto shrink-0 font-mono text-[11px] text-ink-4",
+    track: "relative h-3",
+    marker: [
+      "absolute top-0.5 h-2 min-w-1.5 cursor-pointer rounded-sm border p-0 outline-none",
+      "border-[color-mix(in_oklab,var(--color-accent)_45%,var(--color-rule))]",
+      "bg-[color-mix(in_oklab,var(--color-accent)_14%,var(--color-surface))]",
+      "transition-colors duration-150",
+      "hovered:border-accent hovered:bg-accent",
+      "data-[current]:border-accent data-[current]:bg-accent",
+      "data-[focus-visible]:shadow-[var(--shadow-focus)]",
+      // The bar is thin; the press target isn't.
+      "after:absolute after:inset-x-0 after:-inset-y-2 after:content-['']"
+    ]
+  }
+});
+function currentMediaMarkers(markers, time) {
+  return markers.filter((marker) => time >= marker.start && time < marker.end);
+}
+function MediaMarkerTrack({
+  markers,
+  label = "Markers",
+  currentTime,
+  duration,
+  onSeek,
+  className
+}) {
+  const styles4 = mediaMarkersStyles();
+  const current = currentMediaMarkers(markers, currentTime);
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles4.root(), className), children: [
+    /* @__PURE__ */ jsxs("div", { className: styles4.heading(), children: [
+      /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: styles4.dot() }),
+      /* @__PURE__ */ jsx("span", { className: "shrink-0", children: label }),
+      /* @__PURE__ */ jsx("span", { className: styles4.current(), children: current.map((marker) => marker.label).join(" \xB7 ") }),
+      /* @__PURE__ */ jsx("span", { className: styles4.count(), children: markers.length })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: styles4.track(), children: markers.map((marker) => /* @__PURE__ */ jsx(
+      Button$1,
+      {
+        "data-media-marker": marker.key,
+        "data-current": current.includes(marker) || void 0,
+        "aria-label": `${marker.label}, at ${formatMediaTime(marker.start)}`,
+        onPress: () => onSeek(marker.start),
+        className: styles4.marker(),
+        style: duration > 0 ? {
+          left: `${marker.start / duration * 100}%`,
+          width: `${(marker.end - marker.start) / duration * 100}%`
+        } : { display: "none" }
+      },
+      marker.key
+    )) })
+  ] });
+}
+var mediaTimelineStyles = tv({
+  slots: {
+    root: "flex shrink-0 flex-col gap-1 px-[18px] pt-2 pb-3",
+    markers: "pt-1"
+  }
+});
+function MediaTimeline({
+  markers = [],
+  markersLabel = "Markers",
+  label = "Timeline",
+  durationOverride,
+  className
+}) {
+  const { currentTime, duration: playerDuration, isReady, seek } = useMediaPlayer();
+  const duration = durationOverride ?? playerDuration;
+  const max = duration > 0 ? duration : 1;
+  const styles4 = mediaTimelineStyles();
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles4.root(), className), children: [
+    /* @__PURE__ */ jsx(
+      Slider,
+      {
+        "aria-label": label,
+        value: Math.min(currentTime, max),
+        minValue: 0,
+        maxValue: max,
+        step: 1,
+        isDisabled: !isReady,
+        valueText: `${spokenMediaTime(currentTime)} of ${spokenMediaTime(duration)}`,
+        onChange: seek
+      }
+    ),
+    markers.length > 0 ? /* @__PURE__ */ jsx(
+      MediaMarkerTrack,
+      {
+        markers,
+        label: markersLabel,
+        currentTime,
+        duration,
+        onSeek: seek,
+        className: styles4.markers()
+      }
+    ) : null
+  ] });
+}
+var mediaVideoStageStyles = tv({
+  slots: {
+    root: "items-center justify-center overflow-hidden",
+    box: "relative shrink-0 bg-ink",
+    video: "block size-full",
+    overlay: "pointer-events-none absolute inset-0"
+  }
+});
+var DEFAULT_ASPECT = 16 / 9;
+function fitMediaBox(width, height, aspect) {
+  if (width <= 0 || aspect <= 0) return { width: 0, height: 0 };
+  if (height <= 0 || width / height <= aspect) return { width, height: width / aspect };
+  return { width: height * aspect, height };
+}
+function MediaVideoStage({ children, className }) {
+  const { src, mediaRef } = useMediaPlayer();
+  const styles4 = mediaVideoStageStyles();
+  const stageRef = useRef(null);
+  const [video, setVideo] = useState(null);
+  const [aspect, setAspect] = useState(DEFAULT_ASPECT);
+  const [box, setBox] = useState({ width: 0, height: 0 });
+  const registerVideo = useCallback(
+    (element) => {
+      setVideo(element);
+      mediaRef(element);
+    },
+    [mediaRef]
+  );
+  useEffect(() => {
+    if (!video) return;
+    const sync2 = () => {
+      if (video.videoWidth > 0 && video.videoHeight > 0)
+        setAspect(video.videoWidth / video.videoHeight);
+    };
+    sync2();
+    video.addEventListener("loadedmetadata", sync2);
+    video.addEventListener("resize", sync2);
+    return () => {
+      video.removeEventListener("loadedmetadata", sync2);
+      video.removeEventListener("resize", sync2);
+    };
+  }, [video]);
+  useEffect(() => {
+    const stage = stageRef.current;
+    if (!stage) return;
+    const observer = new ResizeObserver((entries) => {
+      const rect = entries[0]?.contentRect;
+      if (!rect) return;
+      const next = fitMediaBox(rect.width, rect.height, aspect);
+      setBox(
+        (previous) => previous.width === next.width && previous.height === next.height ? previous : next
+      );
+    });
+    observer.observe(stage);
+    return () => observer.disconnect();
+  }, [aspect]);
+  return /* @__PURE__ */ jsx(MediaStage, { ref: stageRef, className: cn(styles4.root(), className), children: /* @__PURE__ */ jsxs("div", { className: styles4.box(), style: { width: box.width, height: box.height }, children: [
+    /* @__PURE__ */ jsx(
+      "video",
+      {
+        ref: registerVideo,
+        playsInline: true,
+        preload: "metadata",
+        className: styles4.video(),
+        ...src ? { src } : {}
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: styles4.overlay(), children })
+  ] }) });
+}
+var mediaWaveformStyles = tv({
+  slots: {
+    root: "relative flex min-h-0 flex-1 cursor-pointer touch-none flex-col justify-center gap-2.5 px-[18px] py-3.5",
+    lane: "flex min-h-[34px] max-h-24 flex-1 basis-0 flex-col gap-0.5",
+    laneName: "flex min-w-0 shrink-0 items-center gap-1.5 text-[12px] leading-4 text-ink-3",
+    laneDot: "size-[5px] shrink-0 rounded-pill",
+    laneMeta: "ml-auto shrink-0 font-mono text-[11px] text-ink-4",
+    bars: [
+      "relative min-h-0 flex-1",
+      "before:absolute before:inset-x-0 before:top-1/2 before:h-px before:bg-rule-2 before:content-['']"
+    ],
+    canvas: "absolute inset-0",
+    playhead: "pointer-events-none absolute inset-y-0 z-10 w-px bg-ink",
+    hover: "pointer-events-none absolute inset-y-0 z-10 w-px bg-ink-4",
+    chip: [
+      "pointer-events-none absolute top-2 z-20 -translate-x-1/2 whitespace-nowrap rounded-sm bg-ink px-1.5 py-1",
+      "font-mono text-[11px] leading-none text-surface"
+    ],
+    status: "pointer-events-none px-[18px] pb-3 text-[12px] text-ink-3",
+    markers: "border-t border-rule-2 pt-2"
+  },
+  variants: {
+    isActive: {
+      true: { laneName: "font-medium text-ink", laneDot: "bg-ink" }
+    },
+    isSeekable: {
+      false: { root: "cursor-default" }
+    }
+  }
+});
+var WHOLE_RECORDING = [{ key: "all", label: null, segments: null }];
+var isWithin = (segments, time) => segments?.some(([start, end]) => time >= start && time < end) ?? false;
+function useWaveColors() {
+  const [colors, setColors] = useState(() => readColors());
+  useEffect(() => {
+    const observer = new MutationObserver(() => setColors(readColors()));
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["data-theme"]
+    });
+    return () => observer.disconnect();
+  }, []);
+  return colors;
+}
+function readColors() {
+  const style = getComputedStyle(document.documentElement);
+  return {
+    wave: style.getPropertyValue("--color-rule-strong").trim() || "gray",
+    progress: style.getPropertyValue("--color-ink").trim() || "black"
+  };
+}
+var LaneBars = memo(function LaneBars2({
+  media,
+  peaks,
+  duration,
+  wave,
+  progress,
+  onDrawFailed
+}) {
+  const containerRef = useRef(null);
+  const instanceRef = useRef(null);
+  const colorsRef = useRef({ wave, progress });
+  colorsRef.current = { wave, progress };
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    let isCancelled = false;
+    let instance = null;
+    let observer = null;
+    import('wavesurfer.js').then(({ default: WaveSurferClass }) => {
+      if (isCancelled) return;
+      instance = WaveSurferClass.create({
+        container,
+        media,
+        peaks: [peaks],
+        duration,
+        height: container.clientHeight || 1,
+        barWidth: 2,
+        barGap: 1,
+        barRadius: 1,
+        cursorWidth: 0,
+        interact: false,
+        normalize: false,
+        autoScroll: false,
+        hideScrollbar: true,
+        // A new instance otherwise resets the shared element to its own default.
+        audioRate: media.playbackRate,
+        waveColor: colorsRef.current.wave,
+        progressColor: colorsRef.current.progress
+      });
+      instanceRef.current = instance;
+      let lastHeight = container.clientHeight;
+      observer = new ResizeObserver(() => {
+        const height = container.clientHeight;
+        if (height > 0 && height !== lastHeight) {
+          lastHeight = height;
+          instance?.setOptions({ height });
+        }
+      });
+      observer.observe(container);
+    }).catch(() => {
+      if (!isCancelled) onDrawFailed();
+    });
+    return () => {
+      isCancelled = true;
+      observer?.disconnect();
+      instance?.destroy();
+      instanceRef.current = null;
+    };
+  }, [media, peaks, duration, onDrawFailed]);
+  useEffect(() => {
+    instanceRef.current?.setOptions({ waveColor: wave, progressColor: progress });
+  }, [wave, progress]);
+  return /* @__PURE__ */ jsx("div", { ref: containerRef, className: mediaWaveformStyles().canvas(), "aria-hidden": true });
+});
+function MediaWaveform({
+  lanes: lanesProp,
+  markers = [],
+  markersLabel = "Markers",
+  className
+}) {
+  const { media, decoded, duration, currentTime, waveformStatus, isReady, isPlaying, seek } = useMediaPlayer();
+  const lanes = lanesProp && lanesProp.length > 0 ? lanesProp : WHOLE_RECORDING;
+  const colors = useWaveColors();
+  const styles4 = mediaWaveformStyles({ isSeekable: isReady });
+  const rootRef = useRef(null);
+  const playheadRef = useRef(null);
+  const [hover, setHover] = useState(null);
+  const [isDrawFailed, setIsDrawFailed] = useState(false);
+  const handleDrawFailed = useCallback(() => setIsDrawFailed(true), []);
+  const lanePeaks = useMemo(
+    () => lanes.map(
+      (lane) => decoded && lane.segments ? maskPeaks(decoded.peaks, decoded.duration, lane.segments) : decoded?.peaks ?? null
+    ),
+    [lanes, decoded]
+  );
+  useEffect(() => {
+    const playhead = playheadRef.current;
+    if (!media || !playhead) return;
+    let frame = 0;
+    const place = () => {
+      const position = duration > 0 ? Math.min(1, media.currentTime / duration) : 0;
+      playhead.style.left = `calc(18px + (100% - 36px) * ${position})`;
+      playhead.style.visibility = position > 0 ? "visible" : "hidden";
+    };
+    const loop = () => {
+      place();
+      frame = requestAnimationFrame(loop);
+    };
+    place();
+    if (isPlaying) frame = requestAnimationFrame(loop);
+    media.addEventListener("seeked", place);
+    return () => {
+      cancelAnimationFrame(frame);
+      media.removeEventListener("seeked", place);
+    };
+  }, [media, duration, isPlaying]);
+  const timeAt = (clientX) => {
+    const rect = rootRef.current?.getBoundingClientRect();
+    if (!rect || duration <= 0) return 0;
+    return (Math.max(0, Math.min(1, (clientX - rect.left - 18) / (rect.width - 36))) || 0) * duration;
+  };
+  const handlePointerDown = (event) => {
+    if (!isReady || event.target.closest("[data-media-marker]")) return;
+    event.currentTarget.setPointerCapture(event.pointerId);
+    seek(timeAt(event.clientX));
+  };
+  const handlePointerMove = (event) => {
+    if (!isReady) return;
+    const time = timeAt(event.clientX);
+    if (event.buttons > 0 && event.currentTarget.hasPointerCapture(event.pointerId)) seek(time);
+    const target = event.target;
+    const markerKey = target.closest("[data-media-marker]")?.dataset.mediaMarker;
+    const laneKey = target.closest("[data-media-lane]")?.dataset.mediaLane;
+    const marker = markers.find((entry) => entry.key === markerKey);
+    const lane = lanes.find((entry) => entry.key === laneKey);
+    const name = marker?.label ?? (lane?.label && isWithin(lane.segments, time) ? lane.label : null);
+    const rect = event.currentTarget.getBoundingClientRect();
+    setHover({
+      x: event.clientX - rect.left,
+      text: name ? `${name} \xB7 ${formatMediaTime(time)}` : formatMediaTime(time)
+    });
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: rootRef,
+        onPointerDown: handlePointerDown,
+        onPointerMove: handlePointerMove,
+        onPointerLeave: () => setHover(null),
+        className: cn(styles4.root(), className),
+        children: [
+          lanes.map((lane, index) => {
+            const isActive = lane.segments !== null && isWithin(lane.segments, currentTime);
+            const peaks = lanePeaks[index];
+            const laneStyles = mediaWaveformStyles({ isActive });
+            return /* @__PURE__ */ jsxs("div", { "data-media-lane": lane.key, className: styles4.lane(), children: [
+              lane.label !== null ? /* @__PURE__ */ jsxs("div", { className: laneStyles.laneName(), "data-active": isActive || void 0, children: [
+                /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: laneStyles.laneDot() }),
+                /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate", children: lane.label }),
+                lane.meta ? /* @__PURE__ */ jsx("span", { className: styles4.laneMeta(), children: lane.meta }) : null
+              ] }) : null,
+              /* @__PURE__ */ jsx("div", { className: styles4.bars(), children: media && peaks && decoded ? /* @__PURE__ */ jsx(
+                LaneBars,
+                {
+                  media,
+                  peaks,
+                  duration: decoded.duration,
+                  wave: colors.wave,
+                  progress: colors.progress,
+                  onDrawFailed: handleDrawFailed
+                }
+              ) : null })
+            ] }, lane.key);
+          }),
+          markers.length > 0 ? /* @__PURE__ */ jsx(
+            MediaMarkerTrack,
+            {
+              markers,
+              label: markersLabel,
+              currentTime,
+              duration,
+              onSeek: seek,
+              className: styles4.markers()
+            }
+          ) : null,
+          /* @__PURE__ */ jsx("div", { ref: playheadRef, className: styles4.playhead() }),
+          hover ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("div", { className: styles4.hover(), style: { left: hover.x } }),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: styles4.chip(),
+                style: { left: `clamp(70px, ${hover.x}px, calc(100% - 70px))` },
+                children: hover.text
+              }
+            )
+          ] }) : null
+        ]
+      }
+    ),
+    waveformStatus === "decoding" ? /* @__PURE__ */ jsx("p", { className: styles4.status(), children: "Drawing waveform" }) : null,
+    waveformStatus === "unavailable" || isDrawFailed ? /* @__PURE__ */ jsx("p", { className: styles4.status(), children: "Waveform isn\u2019t available. Use the slider to seek." }) : null
+  ] });
+}
 var MenuTrigger = MenuTrigger$1;
 var SubmenuTrigger = SubmenuTrigger$1;
 function MenuPopover({ className, offset = 4, placement = "bottom start", ...props }) {
@@ -9387,6 +10347,6 @@ function ToastRegion({ queue, className }) {
   );
 }
 
-export { ATTRIBUTE_TYPES, ATTRIBUTE_TYPE_ICONS, AttachmentChip, AttributePicker, AttributeType, AttributeTypeIcon, AvailabilityCalendar, Avatar, AvatarGroup, Badge, BadgeAction, BadgeGroup, BadgeMultiSelect, BooleanCell, Breadcrumbs, COLUMN_DRAG_KIND, CONVERSATION_BRIEF_OUTCOME_LABEL, Card, CardBody, CardContent, CardEyebrow, CardFeatureTitle, CardFooter, CardHeader, CardTitle, ChannelIcon, Checkbox, CheckboxGroup, ChipValue, ColorInput, Combobox, Command, CommandHint, ConversationBriefCard, ConversationBriefPreview, ConversationBriefReview, CurrencyInput, DRAFT_OUTCOME_LABEL, DataTable, DataTableEmpty, DataTableError, DataTableSkeleton, DateCell, DatePicker, DateTimeCell, DateTimePicker, DraftMessageCard, DraftMessageComposer, DraftMessageReview, EmptyState, ErrorAnimation, FIELD_LABEL_SEPARATOR, FieldCaret, FileField, FileViewer, FileViewerFallbackCard, FilterRow, FilterValueInput, GlowFrame, IconPicker, ImageAttachment, ImageLightbox, Input, Kbd, LinkCell, MAX_COMPOSER_ATTACHMENT_BYTES, Menu, MenuItem, MenuPopover, MenuTrigger, MessageComposer, Modal, ModalBody, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalTitle, MultiSelect, NavGroup, NavItem, NavSection, OPERATORS, OperatorPicker, Orb, PROTECTED_COMBOS, Popover, PopoverContent, PopoverPanelBody, PopoverPanelFooter, PopoverPanelHeader, PressableCard, ProgressBar, ProgressRing, Radio, RadioGroup, RecipientSelect, RecordFilterBuilderPanel, RecordFilterButton, RecordFilterChips, RecordFilterEditor, RecordUpdate, RecordUpdateErrors, RecordUpdateFooter, RecordUpdateRow, RecordUpdateRows, RecordUpdateSummary, RenderChipItemProvider, RenderValueInputProvider, SELECTION_COLUMN_ID, SegmentedControl, Select, Separator, Stepper, StepperStep, SubmenuTrigger, SuccessAnimation, Switch, Table, TableBody, TableCell, TableHeader, TableHeaderCell, TableHeaderSpacer, TableRow, TableScroller, Tabs, TagInput, TextShimmer, Textarea, TimeField, TimeSlotList, ToastRegion, Tooltip, TooltipTrigger, TruncateCell, __resetDraftMessageActions, __resetDraftMessageOutcomes, addLeaf as addFilterLeaf, addPendingLeaf, addSubgroup, arityOf, attachmentChipStyles, availabilityCalendarStyles, avatarGroupStyles, avatarStyles, badgeGroupOverflowStyles, badgeGroupStyles, badgeStyles, cardStyles2 as cardStyles, channelIcon, contactPhoneNumbers, conversationBriefCardStyles, conversationBriefOutcomeFor, countLeaves, createConversationBriefClient, createDraftMessageClient, createToastQueue, defaultValueFor, draftMessageCardStyles, draftMessageComposerStyles, draftOutcomeFor, emptyStateStyles, fieldControlStyles, fieldErrorStyles, fieldHintStyles, fieldLabelStyles, fileViewerFallbackCardStyles, fileViewerStyles, fitBadgeCount, formatFileSize, formatValue, getPlatform, glowFrameStyles, iconForContentType, imageAttachmentStyles, imageLightboxStyles, isColumnDragData, isDialableConversationBrief, isDraftReviewOutcome, isEditableTarget, isPreviewableImageName, joinFieldLabel, makeActionsColumn, messageComposerStyles, namesOf, navItemStyles, normalizeHexColor, operatorById, operatorsForType, parseCombo, progressBarStyles, progressRingStyles, publishDraftMessageOutcome, rebaseRowOnFieldChange, rebaseRowOnOperatorChange, recordUpdateRowStyles, recordUpdateStyles, registerDraftMessageActions, removeLeaf, removeSubgroup, replaceLeaf, resolveLucideIcon, resolveLucideIconName, segmentedControlStyles, setJoiner, stepperStyles, subscribeDraftMessageOutcome, summaryFor, tableCellStyles, tableHeaderCellStyles, tabsStyles, terminalKindFor, textShimmerStyles, timeSlotListStyles, toastStyles, updateLeaf, updateSubgroup, useActiveCommands, useAttributeTypeIcon, useCommand, useDiscoveryActive, useDraftMessageActions, useDraftMessageOutcome, useEscapeKey, useInfiniteScrollSentinel, useRenderChipItem, useRenderValueInput, useShowDetails, viewerKindForContentType, wrapLeafInGroup };
+export { ATTRIBUTE_TYPES, ATTRIBUTE_TYPE_ICONS, AttachmentChip, AttributePicker, AttributeType, AttributeTypeIcon, AvailabilityCalendar, Avatar, AvatarGroup, Badge, BadgeAction, BadgeGroup, BadgeMultiSelect, BooleanCell, Breadcrumbs, COLUMN_DRAG_KIND, CONVERSATION_BRIEF_OUTCOME_LABEL, Card, CardBody, CardContent, CardEyebrow, CardFeatureTitle, CardFooter, CardHeader, CardTitle, ChannelIcon, Checkbox, CheckboxGroup, ChipValue, ColorInput, Combobox, Command, CommandHint, ConversationBriefCard, ConversationBriefPreview, ConversationBriefReview, CurrencyInput, DRAFT_OUTCOME_LABEL, DataTable, DataTableEmpty, DataTableError, DataTableSkeleton, DateCell, DatePicker, DateTimeCell, DateTimePicker, DraftMessageCard, DraftMessageComposer, DraftMessageReview, EmptyState, ErrorAnimation, FIELD_LABEL_SEPARATOR, FieldCaret, FileField, FileViewer, FileViewerFallbackCard, FilterRow, FilterValueInput, FrameStrip, GlowFrame, IconPicker, ImageAttachment, ImageLightbox, Input, Kbd, LinkCell, MAX_COMPOSER_ATTACHMENT_BYTES, MAX_DECODE_BYTES, MediaControls, MediaMarkerTrack, MediaPlayer, MediaStage, MediaTimeline, MediaVideoStage, MediaWaveform, Menu, MenuItem, MenuPopover, MenuTrigger, MessageComposer, Modal, ModalBody, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalTitle, MultiSelect, NavGroup, NavItem, NavSection, OPERATORS, OperatorPicker, Orb, PROTECTED_COMBOS, Popover, PopoverContent, PopoverPanelBody, PopoverPanelFooter, PopoverPanelHeader, PressableCard, ProgressBar, ProgressRing, Radio, RadioGroup, RecipientSelect, RecordFilterBuilderPanel, RecordFilterButton, RecordFilterChips, RecordFilterEditor, RecordUpdate, RecordUpdateErrors, RecordUpdateFooter, RecordUpdateRow, RecordUpdateRows, RecordUpdateSummary, RenderChipItemProvider, RenderValueInputProvider, SELECTION_COLUMN_ID, SegmentedControl, Select, Separator, Slider, Stepper, StepperStep, SubmenuTrigger, SuccessAnimation, Switch, Table, TableBody, TableCell, TableHeader, TableHeaderCell, TableHeaderSpacer, TableRow, TableScroller, Tabs, TagInput, TextShimmer, Textarea, TimeField, TimeSlotList, ToastRegion, Tooltip, TooltipTrigger, TruncateCell, __resetDraftMessageActions, __resetDraftMessageOutcomes, addLeaf as addFilterLeaf, addPendingLeaf, addSubgroup, arityOf, attachmentChipStyles, availabilityCalendarStyles, avatarGroupStyles, avatarStyles, badgeGroupOverflowStyles, badgeGroupStyles, badgeStyles, cardStyles2 as cardStyles, channelIcon, contactPhoneNumbers, conversationBriefCardStyles, conversationBriefOutcomeFor, countLeaves, createConversationBriefClient, createDraftMessageClient, createToastQueue, currentMediaMarkers, decodePeaks, defaultValueFor, draftMessageCardStyles, draftMessageComposerStyles, draftOutcomeFor, emptyStateStyles, fieldControlStyles, fieldErrorStyles, fieldHintStyles, fieldLabelStyles, fileViewerFallbackCardStyles, fileViewerStyles, fitBadgeCount, fitMediaBox, formatFileSize, formatMediaTime, formatValue, frameStripStyles, getPlatform, glowFrameStyles, iconForContentType, imageAttachmentStyles, imageLightboxStyles, isColumnDragData, isDialableConversationBrief, isDraftReviewOutcome, isEditableTarget, isPreviewableImageName, joinFieldLabel, makeActionsColumn, maskPeaks, mediaControlsStyles, mediaMarkersStyles, mediaPlayerStyles, mediaTimelineStyles, mediaVideoStageStyles, mediaWaveformStyles, messageComposerStyles, namesOf, navItemStyles, normalizeHexColor, operatorById, operatorsForType, parseCombo, peaksFromChannels, progressBarStyles, progressRingStyles, publishDraftMessageOutcome, rebaseRowOnFieldChange, rebaseRowOnOperatorChange, recordUpdateRowStyles, recordUpdateStyles, registerDraftMessageActions, removeLeaf, removeSubgroup, replaceLeaf, resolveLucideIcon, resolveLucideIconName, segmentedControlStyles, setJoiner, sliderStyles, spokenMediaTime, stepperStyles, subscribeDraftMessageOutcome, summaryFor, tableCellStyles, tableHeaderCellStyles, tabsStyles, terminalKindFor, textShimmerStyles, timeSlotListStyles, toastStyles, updateLeaf, updateSubgroup, useActiveCommands, useAttributeTypeIcon, useCommand, useDiscoveryActive, useDraftMessageActions, useDraftMessageOutcome, useEscapeKey, useInfiniteScrollSentinel, useMediaPlayer, useRenderChipItem, useRenderValueInput, useShowDetails, viewerKindForContentType, wrapLeafInGroup };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map