marquee

1"use client";
2 
3import { cva, type VariantProps } from "class-variance-authority";
4import {
5  Direction as DirectionPrimitive,
6  Slot as SlotPrimitive,
7} from "radix-ui";
8import * as React from "react";
9import { useComposedRefs } from "@/lib/compose-refs";
10import { cn } from "@/lib/utils";
11 
12const ROOT_NAME = "Marquee";
13const CONTENT_NAME = "MarqueeContent";
14 
15type Side = "left" | "right" | "top" | "bottom";
16type Orientation = "horizontal" | "vertical";
17type Direction = "ltr" | "rtl";
18 
19type RootElement = React.ComponentRef<typeof Marquee>;
20type ContentElement = React.ComponentRef<typeof MarqueeContent>;
21 
22interface Dimensions {
23  width: number;
24  height: number;
25}
26 
27interface ElementDimensions {
28  rootSize: number;
29  contentSize: number;
30}
31 
32function createResizeObserverStore() {
33  const listeners = new Set<() => void>();
34  let observer: ResizeObserver | null = null;
35  const elements = new Map<Element, Dimensions>();
36  const refCounts = new Map<Element, number>();
37  const isSupported = typeof ResizeObserver !== "undefined";
38  let notificationScheduled = false;
39 
40  const snapshotCache = new WeakMap<
41    Element,
42    WeakMap<
43      Element,
44      { horizontal: ElementDimensions; vertical: ElementDimensions }
45    >
46  >();
47 
48  function notify() {
49    if (notificationScheduled) return;
50    notificationScheduled = true;
51    queueMicrotask(() => {
52      notificationScheduled = false;
53      for (const callback of listeners) {
54        callback();
55      }
56    });
57  }
58 
59  function cleanup() {
60    if (observer) {
61      observer.disconnect();
62      observer = null;
63    }
64    elements.clear();
65    refCounts.clear();
66  }
67 
68  function subscribe(callback: () => void) {
69    listeners.add(callback);
70    return () => {
71      listeners.delete(callback);
72      if (listeners.size === 0) {
73        cleanup();
74      }
75    };
76  }
77 
78  function getSnapshot(
79    rootElement: RootElement | null,
80    contentElement: ContentElement | null,
81    orientation: Orientation,
82  ): ElementDimensions | null {
83    if (!rootElement || !contentElement) return null;
84 
85    const rootDims = elements.get(rootElement);
86    const contentDims = elements.get(contentElement);
87 
88    if (!rootDims || !contentDims) return null;
89 
90    const rootSize =
91      orientation === "vertical" ? rootDims.height : rootDims.width;
92    const contentSize =
93      orientation === "vertical" ? contentDims.height : contentDims.width;
94 
95    let rootCache = snapshotCache.get(rootElement);
96    if (!rootCache) {
97      rootCache = new WeakMap();
98// … truncated