@xhub-short/ui 0.1.0-beta.1 → 0.1.0-beta.11

package/dist/chunk-ZZDQKP4R.js

@@ -1,418 +0,0 @@
-import { cn } from './chunk-WKX2WBVO.js';
-import { injectComponentCSS } from './chunk-UXMA4KJZ.js';
-import { createContext, useContext, useMemo, useInsertionEffect, useRef, useState, useEffect, useCallback } from 'react';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-// src/components/VideoFeed/VideoFeed.css.ts
-var VIDEO_FEED_CSS = `
-/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
- * VideoFeed Styles
- * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */
-
-.sv-video-feed {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  background: var(--sv-bg-primary, #000);
-  touch-action: pan-y;
-  user-select: none;
-  -webkit-user-select: none;
-}
-
-/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
- * Feed Container (holds all slots)
- * \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
-
-.sv-video-feed__container {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  will-change: transform;
-}
-
-/* Smooth transition when not swiping */
-.sv-video-feed__container--snapping {
-  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
-}
-
-/* No transition during swipe for immediate feedback */
-.sv-video-feed__container--swiping {
-  transition: none;
-}
-
-/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
- * Video Slot Wrapper
- * \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
-
-.sv-video-feed__slot {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  will-change: transform, opacity;
-  backface-visibility: hidden;
-  -webkit-backface-visibility: hidden;
-}
-
-/* Active slot */
-.sv-video-feed__slot--active {
-  z-index: 2;
-}
-
-/* Adjacent slots (for preview) */
-.sv-video-feed__slot--adjacent {
-  z-index: 1;
-  pointer-events: none;
-}
-
-/* Transition for smooth snap animations (when not swiping) */
-.sv-video-feed__slot--transitioning {
-  transition: transform 0.175s cubic-bezier(0.25, 0.46, 0.45, 0.94),
-              opacity 0.2s ease;
-}
-
-/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
- * Loading State
- * \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
-
-.sv-video-feed__loading {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: var(--sv-spacing-md, 16px);
-  color: var(--sv-text-secondary, #999);
-}
-
-.sv-video-feed__loading-spinner {
-  width: 32px;
-  height: 32px;
-  border: 3px solid rgba(255, 255, 255, 0.2);
-  border-top-color: var(--sv-color-primary, #fe2c55);
-  border-radius: 50%;
-  animation: sv-feed-spinner 0.8s linear infinite;
-}
-
-@keyframes sv-feed-spinner {
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-.sv-video-feed__loading-text {
-  font-size: var(--sv-font-size-sm, 13px);
-  font-family: var(--sv-font-family, 'Urbanist', sans-serif);
-}
-
-/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
- * Empty State
- * \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
-
-.sv-video-feed__empty {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  text-align: center;
-  color: var(--sv-text-secondary, #999);
-  font-family: var(--sv-font-family, 'Urbanist', sans-serif);
-}
-
-.sv-video-feed__empty-icon {
-  font-size: 48px;
-  margin-bottom: var(--sv-spacing-md, 16px);
-}
-
-.sv-video-feed__empty-text {
-  font-size: var(--sv-font-size-md, 14px);
-}
-
-/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
- * End of Feed
- * Note: Positioned outside container but above slots. Uses safe-area-inset
- * to avoid being covered by device notch/home indicator.
- * \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
-
-.sv-video-feed__end {
-  position: absolute;
-  /* Safe bottom positioning - accounts for device UI */
-  bottom: calc(var(--sv-spacing-xl, 32px) + env(safe-area-inset-bottom, 0px));
-  left: 50%;
-  transform: translateX(-50%);
-  z-index: 10; /* Above slots (z-index 1-2) */
-  padding: var(--sv-spacing-sm, 8px) var(--sv-spacing-md, 16px);
-  background: rgba(0, 0, 0, 0.7);
-  backdrop-filter: blur(8px);
-  -webkit-backdrop-filter: blur(8px);
-  border-radius: var(--sv-border-radius-md, 8px);
-  color: var(--sv-text-secondary, #999);
-  font-size: var(--sv-font-size-sm, 13px);
-  font-family: var(--sv-font-family, 'Urbanist', sans-serif);
-  pointer-events: none; /* Don't block interactions */
-  animation: sv-feed-end-fade-in 0.3s ease-out;
-}
-
-@keyframes sv-feed-end-fade-in {
-  from {
-    opacity: 0;
-    transform: translateX(-50%) translateY(10px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(-50%) translateY(0);
-  }
-}
-
-/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
- * Reduced Motion
- * \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
-
-@media (prefers-reduced-motion: reduce) {
-  .sv-video-feed__container--snapping {
-    transition: none;
-  }
-  
-  .sv-video-feed__loading-spinner {
-    animation: none;
-  }
-}
-`;
-var VideoFeedContext = createContext(null);
-function useVideoFeedContext() {
-  const context = useContext(VideoFeedContext);
-  if (!context) {
-    throw new Error("useVideoFeedContext must be used within a VideoFeed");
-  }
-  return context;
-}
-function useOptionalVideoFeedContext() {
-  return useContext(VideoFeedContext);
-}
-function useVideoFeedPosition(options) {
-  const {
-    totalCount,
-    activeIndex,
-    containerHeight,
-    dragOffset,
-    isSwiping,
-    isResizing = false,
-    bufferSize = 1
-  } = options;
-  return useMemo(() => {
-    if (totalCount === 0) {
-      return {
-        slots: [],
-        scrollOffset: 0,
-        isAtStart: true,
-        isAtLastIndex: true,
-        clampedActiveIndex: 0
-      };
-    }
-    const clampedActiveIndex = Math.max(0, Math.min(totalCount - 1, activeIndex));
-    const slots = [];
-    const startIndex = Math.max(0, clampedActiveIndex - bufferSize);
-    const endIndex = Math.min(totalCount - 1, clampedActiveIndex + bufferSize);
-    const baseOffset = -clampedActiveIndex * containerHeight;
-    const scrollOffset = baseOffset + dragOffset;
-    for (let i = startIndex; i <= endIndex; i++) {
-      const signedDistance = i - clampedActiveIndex;
-      const distance = Math.abs(signedDistance);
-      const isActive = i === clampedActiveIndex;
-      const top = i * containerHeight;
-      const transform = `translateY(${top + scrollOffset}px)`;
-      let opacity = 1;
-      if (!isActive && !isResizing) {
-        opacity = isSwiping ? 0.7 : 0.3;
-      }
-      slots.push({
-        index: i,
-        top,
-        isActive,
-        distance,
-        signedDistance,
-        transform,
-        opacity
-      });
-    }
-    return {
-      slots,
-      scrollOffset,
-      isAtStart: clampedActiveIndex === 0,
-      isAtLastIndex: clampedActiveIndex >= totalCount - 1,
-      clampedActiveIndex
-    };
-  }, [totalCount, activeIndex, containerHeight, dragOffset, isSwiping, isResizing, bufferSize]);
-}
-function getSlotIndexFromPosition(yPosition, containerHeight, totalCount) {
-  if (totalCount === 0 || containerHeight === 0) {
-    return 0;
-  }
-  const rawIndex = Math.round(-yPosition / containerHeight);
-  return Math.max(0, Math.min(totalCount - 1, rawIndex));
-}
-function VideoFeedHeadless({
-  feedState,
-  swipeState,
-  height,
-  className,
-  renderSlot,
-  onIndexChange,
-  onEndReached,
-  endReachedThreshold = 2,
-  bufferSize = 1,
-  loadingText = "Loading...",
-  emptyText = "No videos",
-  endText = "You've reached the end",
-  disableInlineTransforms = false
-}) {
-  useInsertionEffect(() => {
-    return injectComponentCSS("sv-video-feed", VIDEO_FEED_CSS);
-  }, []);
-  const containerRef = useRef(null);
-  const [containerHeight, setContainerHeight] = useState(0);
-  const [isResizing, setIsResizing] = useState(false);
-  const resizeTimeoutRef = useRef(null);
-  const prevHeightRef = useRef(0);
-  useEffect(() => {
-    const container = containerRef.current;
-    if (!container) return;
-    const updateHeight = () => {
-      const newHeight = container.clientHeight;
-      const heightChanged = newHeight !== prevHeightRef.current && prevHeightRef.current !== 0;
-      if (heightChanged) {
-        setIsResizing(true);
-        if (resizeTimeoutRef.current) {
-          clearTimeout(resizeTimeoutRef.current);
-        }
-        resizeTimeoutRef.current = setTimeout(() => {
-          setIsResizing(false);
-        }, 150);
-      }
-      prevHeightRef.current = newHeight;
-      setContainerHeight(newHeight);
-    };
-    updateHeight();
-    let cleanup;
-    if (typeof ResizeObserver !== "undefined") {
-      const observer = new ResizeObserver(updateHeight);
-      observer.observe(container);
-      cleanup = () => observer.disconnect();
-    } else {
-      window.addEventListener("resize", updateHeight);
-      cleanup = () => window.removeEventListener("resize", updateHeight);
-    }
-    return () => {
-      cleanup();
-      if (resizeTimeoutRef.current) {
-        clearTimeout(resizeTimeoutRef.current);
-      }
-    };
-  }, []);
-  const { videos, isLoading, hasMore } = feedState;
-  const { activeIndex, isSwiping, dragOffset, goToIndex } = swipeState;
-  const prevActiveIndexRef = useRef(activeIndex);
-  useEffect(() => {
-    if (prevActiveIndexRef.current !== activeIndex) {
-      onIndexChange?.(activeIndex);
-      prevActiveIndexRef.current = activeIndex;
-    }
-  }, [activeIndex, onIndexChange]);
-  useEffect(() => {
-    if (videos.length === 0) return;
-    if (!hasMore || isLoading) return;
-    const distanceToEnd = videos.length - 1 - activeIndex;
-    if (distanceToEnd <= endReachedThreshold) {
-      onEndReached?.();
-    }
-  }, [activeIndex, videos.length, hasMore, isLoading, endReachedThreshold, onEndReached]);
-  const { slots, isAtLastIndex, clampedActiveIndex } = useVideoFeedPosition({
-    totalCount: videos.length,
-    activeIndex,
-    containerHeight,
-    dragOffset,
-    isSwiping,
-    isResizing,
-    bufferSize
-  });
-  const contextValue = useMemo(
-    () => ({
-      videos,
-      activeIndex: clampedActiveIndex,
-      isSwiping,
-      dragOffset,
-      containerHeight,
-      goToIndex,
-      totalCount: videos.length
-    }),
-    [videos, clampedActiveIndex, isSwiping, dragOffset, containerHeight, goToIndex]
-  );
-  const renderSlots = useCallback(() => {
-    return slots.map((slot) => {
-      const video = videos[slot.index];
-      if (!video) return null;
-      const slotStyle = disableInlineTransforms ? { opacity: slot.opacity } : { transform: slot.transform, opacity: slot.opacity };
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: cn(
-            "sv-video-feed__slot",
-            slot.isActive && "sv-video-feed__slot--active",
-            !slot.isActive && "sv-video-feed__slot--adjacent",
-            !isSwiping && "sv-video-feed__slot--transitioning"
-          ),
-          style: slotStyle,
-          "data-slot-index": slot.index,
-          "data-slot-active": slot.isActive,
-          children: renderSlot(video, slot.index)
-        },
-        video.id
-      );
-    });
-  }, [slots, videos, isSwiping, renderSlot, disableInlineTransforms]);
-  const containerStyle = useMemo(() => {
-    const style = {};
-    if (height !== void 0) {
-      style.height = typeof height === "number" ? `${height}px` : height;
-    }
-    return style;
-  }, [height]);
-  if (isLoading && videos.length === 0) {
-    return /* @__PURE__ */ jsx("div", { ref: containerRef, className: cn("sv-video-feed", className), style: containerStyle, children: /* @__PURE__ */ jsxs("div", { className: "sv-video-feed__loading", children: [
-      /* @__PURE__ */ jsx("div", { className: "sv-video-feed__loading-spinner" }),
-      /* @__PURE__ */ jsx("div", { className: "sv-video-feed__loading-text", children: loadingText })
-    ] }) });
-  }
-  if (!isLoading && videos.length === 0) {
-    return /* @__PURE__ */ jsx("div", { ref: containerRef, className: cn("sv-video-feed", className), style: containerStyle, children: /* @__PURE__ */ jsxs("div", { className: "sv-video-feed__empty", children: [
-      /* @__PURE__ */ jsx("div", { className: "sv-video-feed__empty-icon", children: "\u{1F4ED}" }),
-      /* @__PURE__ */ jsx("div", { className: "sv-video-feed__empty-text", children: emptyText })
-    ] }) });
-  }
-  return /* @__PURE__ */ jsx(VideoFeedContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs("div", { ref: containerRef, className: cn("sv-video-feed", className), style: containerStyle, children: [
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: cn(
-          "sv-video-feed__container",
-          isSwiping ? "sv-video-feed__container--swiping" : "sv-video-feed__container--snapping"
-        ),
-        children: renderSlots()
-      }
-    ),
-    isAtLastIndex && !hasMore && /* @__PURE__ */ jsx("div", { className: "sv-video-feed__end", "aria-live": "polite", children: endText })
-  ] }) });
-}
-
-// src/components/VideoFeed/constants.ts
-var SLOT_INDEX_ATTR = "data-slot-index";
-var SLOT_ACTIVE_ATTR = "data-slot-active";
-var SLOT_INDEX_DATASET_KEY = "slotIndex";
-var SLOT_ACTIVE_DATASET_KEY = "slotActive";
-var VIDEO_FEED_CLASS_PREFIX = "sv-video-feed";
-
-export { SLOT_ACTIVE_ATTR, SLOT_ACTIVE_DATASET_KEY, SLOT_INDEX_ATTR, SLOT_INDEX_DATASET_KEY, VIDEO_FEED_CLASS_PREFIX, VIDEO_FEED_CSS, VideoFeedContext, VideoFeedHeadless, getSlotIndexFromPosition, useOptionalVideoFeedContext, useVideoFeedContext, useVideoFeedPosition };