@streamplace/components 0.7.14 → 0.7.17

package/dist/components/ui/text.js

@@ -1,177 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextPrimitive = exports.textVariants = exports.Span = exports.Code = exports.Label = exports.Caption = exports.Body = exports.Subtitle = exports.Heading = exports.Text = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const class_variance_authority_1 = require("class-variance-authority");
-const react_1 = tslib_1.__importStar(require("react"));
-const react_native_1 = require("react-native");
-const atoms_1 = require("../../lib/theme/atoms");
-const text_1 = require("./primitives/text");
-Object.defineProperty(exports, "TextPrimitive", { enumerable: true, get: function () { return text_1.TextPrimitive; } });
-// Text variants using class-variance-authority pattern
-const textVariants = (0, class_variance_authority_1.cva)("", {
-    variants: {
-        variant: {
-            h1: "h1",
-            h2: "h2",
-            h3: "h3",
-            h4: "h4",
-            h5: "h5",
-            h6: "h6",
-            subtitle1: "subtitle1",
-            subtitle2: "subtitle2",
-            body1: "body1",
-            body2: "body2",
-            caption: "caption",
-            overline: "overline",
-        },
-        size: {
-            xs: "xs",
-            sm: "sm",
-            base: "base",
-            lg: "lg",
-            xl: "xl",
-            "2xl": "2xl",
-            "3xl": "3xl",
-            "4xl": "4xl",
-        },
-        weight: {
-            thin: "thin",
-            light: "light",
-            normal: "normal",
-            medium: "medium",
-            semibold: "semibold",
-            bold: "bold",
-            extrabold: "extrabold",
-            black: "black",
-        },
-        color: {
-            default: "default",
-            muted: "muted",
-            primary: "primary",
-            secondary: "secondary",
-            destructive: "destructive",
-            success: "success",
-            warning: "warning",
-        },
-    },
-    defaultVariants: {
-        variant: "body1",
-        size: "base",
-        weight: "normal",
-        color: "default",
-    },
-});
-exports.textVariants = textVariants;
-exports.Text = (0, react_1.forwardRef)(({ variant = undefined, size = undefined, weight = undefined, color = undefined, muted = false, bold = false, italic = false, underline = false, strikethrough = false, uppercase = false, lowercase = false, capitalize = false, center = false, right = false, justify = false, customColor, style, children, ...props }, ref) => {
-    // Create dynamic styles based on atoms
-    const styles = react_1.default.useMemo(() => createStyles(), []);
-    // Override props based on convenience props
-    const finalColor = customColor ? customColor : muted ? "muted" : color;
-    const finalTransform = uppercase
-        ? "uppercase"
-        : lowercase
-            ? "lowercase"
-            : capitalize
-                ? "capitalize"
-                : "none";
-    const finalDecoration = underline && strikethrough
-        ? "underline line-through"
-        : underline
-            ? "underline"
-            : strikethrough
-                ? "line-through"
-                : "none";
-    const finalAlign = center
-        ? "center"
-        : right
-            ? "right"
-            : justify
-                ? "justify"
-                : "left";
-    // Get variant-specific styles
-    const variantStyle = styles[`${variant}Style`] || {};
-    const styleArr = (Array.isArray(style) ? style : [style || undefined]).filter((s) => s !== undefined);
-    return ((0, jsx_runtime_1.jsx)(text_1.TextPrimitive.Root, { ref: ref, variant: variant || "body1", size: size || "base", color: finalColor || "default", align: finalAlign, transform: finalTransform, decoration: finalDecoration, italic: italic, style: [variantStyle, ...styleArr], ...props, children: children }));
-});
-exports.Text.displayName = "Text";
-// Convenience components for common text elements
-exports.Heading = (0, react_1.forwardRef)(({ level = 1, ...props }, ref) => ((0, jsx_runtime_1.jsx)(exports.Text, { ref: ref, variant: `h${level}`, ...props })));
-exports.Heading.displayName = "Heading";
-exports.Subtitle = (0, react_1.forwardRef)(({ level = 1, ...props }, ref) => ((0, jsx_runtime_1.jsx)(exports.Text, { ref: ref, variant: level === 1 ? "subtitle1" : "subtitle2", ...props })));
-exports.Subtitle.displayName = "Subtitle";
-exports.Body = (0, react_1.forwardRef)(({ level = 1, ...props }, ref) => ((0, jsx_runtime_1.jsx)(exports.Text, { ref: ref, variant: level === 1 ? "body1" : "body2", ...props })));
-exports.Body.displayName = "Body";
-exports.Caption = (0, react_1.forwardRef)((props, ref) => (0, jsx_runtime_1.jsx)(exports.Text, { ref: ref, variant: "caption", ...props }));
-exports.Caption.displayName = "Caption";
-exports.Label = (0, react_1.forwardRef)((props, ref) => ((0, jsx_runtime_1.jsx)(exports.Text, { ref: ref, variant: "subtitle1", weight: "medium", ...props })));
-exports.Label.displayName = "Label";
-exports.Code = (0, react_1.forwardRef)(({ style, ...props }, ref) => {
-    const styles = react_1.default.useMemo(() => createStyles(), []);
-    // if style is not an array, convert it to an array
-    const styleArr = (Array.isArray(style) ? style : [style || undefined]).filter((s) => s !== undefined);
-    return (0, jsx_runtime_1.jsx)(exports.Text, { ref: ref, style: [styles.codeStyle, ...styleArr], ...props });
-});
-exports.Code.displayName = "Code";
-// Span component for inline text styling (inherits from parent)
-exports.Span = (0, react_1.forwardRef)(({ children, ...props }, ref) => ((0, jsx_runtime_1.jsx)(text_1.TextPrimitive.Span, { ref: ref, ...props, children: children })));
-exports.Span.displayName = "Span";
-// Create atom-based styles
-function createStyles() {
-    return react_native_1.StyleSheet.create({
-        // Variant-specific styles
-        h1Style: {
-            marginBottom: atoms_1.spacing[4],
-        },
-        h2Style: {
-            marginBottom: atoms_1.spacing[3],
-        },
-        h3Style: {
-            marginBottom: atoms_1.spacing[3],
-        },
-        h4Style: {
-            marginBottom: atoms_1.spacing[2],
-        },
-        h5Style: {
-            marginBottom: atoms_1.spacing[2],
-        },
-        h6Style: {
-            marginBottom: atoms_1.spacing[2],
-        },
-        subtitle1Style: {
-            marginBottom: atoms_1.spacing[2],
-        },
-        subtitle2Style: {
-            marginBottom: atoms_1.spacing[1],
-        },
-        body1Style: {
-            marginBottom: atoms_1.spacing[3],
-        },
-        body2Style: {
-            marginBottom: atoms_1.spacing[2],
-        },
-        captionStyle: {
-            marginBottom: atoms_1.spacing[1],
-        },
-        overlineStyle: {
-            marginBottom: atoms_1.spacing[1],
-            textTransform: "uppercase",
-            letterSpacing: 1,
-        },
-        labelStyle: {
-            marginBottom: atoms_1.spacing[1],
-        },
-        buttonStyle: {
-            textAlign: "center",
-        },
-        codeStyle: {
-            fontFamily: "monospace",
-            backgroundColor: atoms_1.colors["muted"],
-            paddingHorizontal: atoms_1.spacing[1],
-            paddingVertical: 2,
-            borderRadius: atoms_1.borderRadius.sm,
-            fontSize: 14,
-        },
-    });
-}

package/dist/components/ui/textarea.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Textarea = Textarea;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_native_1 = require("react-native");
-const atoms_1 = require("../../lib/theme/atoms");
-function Textarea({ style, multiline = true, numberOfLines = 4, ...props }) {
-    return ((0, jsx_runtime_1.jsx)(react_native_1.TextInput, { style: [
-            atoms_1.flex.values[1],
-            atoms_1.borders.width.thin,
-            atoms_1.borders.color.gray[400],
-            atoms_1.bg.gray[900],
-            atoms_1.p[3],
-            atoms_1.text.gray[200],
-            props.editable === false && { opacity: 0.5 },
-            { borderRadius: 10 },
-            style,
-        ], multiline: multiline, numberOfLines: numberOfLines, textAlignVertical: "top", ...props }));
-}

package/dist/components/ui/toast.js

@@ -1,175 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useToast = useToast;
-exports.Toast = Toast;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const portal_1 = require("@rn-primitives/portal");
-const react_1 = require("react");
-const react_native_1 = require("react-native");
-const react_native_safe_area_context_1 = require("react-native-safe-area-context");
-const theme_1 = require("../../lib/theme/theme");
-const react_2 = require("react");
-/**
- * useToast - a hook to manage Toast state and provide a toastController.
- * Returns a ready-to-render ToastComponent.
- */
-function useToast(initial = {}) {
-    const [open, setOpen] = (0, react_1.useState)(false);
-    const [title, setTitle] = (0, react_1.useState)(initial.title ?? "");
-    const [description, setDescription] = (0, react_1.useState)(initial.description ?? "");
-    const [duration, setDuration] = (0, react_1.useState)(initial.duration ?? 3);
-    const [actionLabel, setActionLabel] = (0, react_1.useState)(initial.actionLabel ?? "Action");
-    const [onAction, setOnAction] = (0, react_1.useState)(initial.onAction);
-    const show = (0, react_2.useCallback)((toastTitle, toastDescription, options) => {
-        setTitle(toastTitle);
-        setDescription(toastDescription ?? "");
-        setDuration(options?.duration ?? 3);
-        setActionLabel(options?.actionLabel ?? "Action");
-        setOnAction(options?.onAction);
-        setOpen(true);
-    }, []);
-    const hide = (0, react_2.useCallback)(() => {
-        setOpen(false);
-    }, []);
-    // Ready-to-render Toast component
-    const ToastComponent = ((0, jsx_runtime_1.jsx)(Toast, { open: open, onOpenChange: setOpen, title: title, description: description, actionLabel: actionLabel, onAction: onAction, duration: duration }));
-    return {
-        open,
-        title,
-        description,
-        actionLabel,
-        onAction,
-        duration,
-        setOpen,
-        setTitle,
-        setDescription,
-        setActionLabel,
-        setOnAction,
-        setDuration,
-        toastController: { show, hide },
-        ToastComponent,
-    };
-}
-function Toast({ open, onOpenChange, title, description, actionLabel = "Action", onAction, duration = 3, }) {
-    const [seconds, setSeconds] = (0, react_1.useState)(duration);
-    const insets = (0, react_native_safe_area_context_1.useSafeAreaInsets)();
-    const { theme } = (0, theme_1.useTheme)();
-    const [fadeAnim] = (0, react_1.useState)(new react_native_1.Animated.Value(0));
-    const { width } = (0, react_native_1.useWindowDimensions)();
-    const isWeb = react_native_1.Platform.OS === "web";
-    const isDesktop = isWeb && width >= 768;
-    const containerPosition = isDesktop
-        ? {
-            top: undefined,
-            bottom: theme.spacing[4],
-            right: theme.spacing[4], // <-- use spacing, not 1
-            alignItems: "flex-end",
-            minWidth: 400,
-            width: 400,
-            // Do NOT set left at all
-        }
-        : {
-            bottom: insets.bottom + theme.spacing[1],
-            left: 0,
-            right: 0,
-            alignItems: "center",
-            width: "100%",
-            maxWidth: undefined,
-        };
-    (0, react_1.useEffect)(() => {
-        let interval = null;
-        if (open) {
-            setSeconds(duration);
-            react_native_1.Animated.timing(fadeAnim, {
-                toValue: 1,
-                duration: 200,
-                useNativeDriver: true,
-            }).start();
-            interval = setInterval(() => {
-                setSeconds((prev) => {
-                    if (prev <= 1) {
-                        onOpenChange(false);
-                        if (interval)
-                            clearInterval(interval);
-                        return duration;
-                    }
-                    return prev - 1;
-                });
-            }, 1000);
-        }
-        else {
-            if (interval)
-                clearInterval(interval);
-            react_native_1.Animated.timing(fadeAnim, {
-                toValue: 0,
-                duration: 150,
-                useNativeDriver: true,
-            }).start();
-            setSeconds(duration);
-        }
-        return () => {
-            if (interval)
-                clearInterval(interval);
-        };
-        // eslint-disable-next-line
-    }, [open, duration]);
-    if (!open)
-        return null;
-    return ((0, jsx_runtime_1.jsx)(portal_1.Portal, { name: "toast", children: (0, jsx_runtime_1.jsx)(react_native_1.Animated.View, { style: [styles.container, containerPosition, { opacity: fadeAnim }], pointerEvents: "box-none", children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [
-                    styles.toast,
-                    {
-                        backgroundColor: theme.colors.secondary,
-                        borderColor: theme.colors.border,
-                        borderRadius: theme.borderRadius.xl,
-                        flexDirection: "column",
-                        justifyContent: "space-between",
-                        alignItems: "center",
-                        padding: theme.spacing[4],
-                        width: isDesktop ? "100%" : "95%",
-                    },
-                ], children: [(0, jsx_runtime_1.jsxs)(react_native_1.View, { style: { gap: theme.spacing[1], width: "100%" }, children: [(0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [
-                                    {
-                                        color: theme.colors.foreground,
-                                        fontSize: 16,
-                                        fontWeight: "500",
-                                    },
-                                ], children: title }), description ? ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [{ color: theme.colors.foreground, fontSize: 14 }], children: description })) : null] }), (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: {
-                            gap: theme.spacing[1],
-                            flexDirection: "row",
-                            justifyContent: "flex-end",
-                            width: "100%",
-                        }, children: [onAction && ((0, jsx_runtime_1.jsx)(react_native_1.Pressable, { style: [
-                                    styles.button,
-                                    {
-                                        borderColor: theme.colors.primary,
-                                        paddingHorizontal: theme.spacing[4],
-                                        paddingVertical: theme.spacing[2],
-                                    },
-                                ], onPress: onAction, children: (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: { color: theme.colors.foreground }, children: actionLabel }) })), (0, jsx_runtime_1.jsx)(react_native_1.Pressable, { style: [
-                                    styles.button,
-                                    {
-                                        borderColor: theme.colors.primary,
-                                        paddingHorizontal: theme.spacing[4],
-                                        paddingVertical: theme.spacing[2],
-                                    },
-                                ], onPress: () => onOpenChange(false), children: (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: { color: theme.colors.foreground }, children: "Close" }) })] })] }) }) }));
-}
-const styles = react_native_1.StyleSheet.create({
-    container: {
-        position: "absolute",
-        zIndex: 1000,
-        paddingHorizontal: 16,
-    },
-    toast: {
-        opacity: 0.95,
-        borderWidth: 1,
-        gap: 8,
-    },
-    button: {
-        borderWidth: 1,
-        borderRadius: 8,
-        alignItems: "center",
-        justifyContent: "center",
-        backgroundColor: "transparent",
-    },
-});

package/dist/components/ui/view.js

@@ -1,252 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.viewVariants = exports.Center = exports.Column = exports.Row = exports.Overlay = exports.Surface = exports.Container = exports.Card = exports.View = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const class_variance_authority_1 = require("class-variance-authority");
-const react_1 = require("react");
-const react_native_1 = require("react-native");
-const atoms_1 = require("../../lib/theme/atoms");
-const theme_1 = require("../../lib/theme/theme");
-// View variants using class-variance-authority pattern
-const viewVariants = (0, class_variance_authority_1.cva)("", {
-    variants: {
-        variant: {
-            default: "default",
-            card: "card",
-            overlay: "overlay",
-            surface: "surface",
-            container: "container",
-        },
-        padding: {
-            none: "none",
-            xs: "xs",
-            sm: "sm",
-            md: "md",
-            lg: "lg",
-            xl: "xl",
-        },
-        margin: {
-            none: "none",
-            xs: "xs",
-            sm: "sm",
-            md: "md",
-            lg: "lg",
-            xl: "xl",
-        },
-        direction: {
-            row: "row",
-            column: "column",
-            "row-reverse": "row-reverse",
-            "column-reverse": "column-reverse",
-        },
-        align: {
-            start: "start",
-            center: "center",
-            end: "end",
-            stretch: "stretch",
-            baseline: "baseline",
-        },
-        justify: {
-            start: "start",
-            center: "center",
-            end: "end",
-            between: "between",
-            around: "around",
-            evenly: "evenly",
-        },
-        flex: {
-            none: "none",
-            auto: "auto",
-            initial: "initial",
-        },
-    },
-    defaultVariants: {
-        variant: "default",
-        padding: "none",
-        margin: "none",
-        direction: "column",
-        align: "stretch",
-        justify: "start",
-        flex: "none",
-    },
-});
-exports.viewVariants = viewVariants;
-exports.View = (0, react_1.forwardRef)(({ variant = "default", padding = "none", margin = "none", direction = "column", align = "stretch", justify = "start", flex = "none", fullWidth = false, fullHeight = false, centered = false, backgroundColor, borderColor, borderWidth, borderRadius, shadow = false, style, ...props }, ref) => {
-    const { theme } = (0, theme_1.useTheme)();
-    // Map variant to styles
-    const variantStyles = (() => {
-        switch (variant) {
-            case "card":
-                return {
-                    backgroundColor: theme.colors.card,
-                    borderRadius: atoms_1.borderRadius.lg,
-                    shadowColor: "#000",
-                    shadowOffset: { width: 0, height: 2 },
-                    shadowOpacity: 0.1,
-                    shadowRadius: 4,
-                    elevation: 3,
-                };
-            case "overlay":
-                return {
-                    backgroundColor: "rgba(0, 0, 0, 0.5)",
-                };
-            case "surface":
-                return {
-                    backgroundColor: theme.colors.background,
-                };
-            case "container":
-                return {
-                    backgroundColor: theme.colors.background,
-                    padding: atoms_1.spacing[4],
-                };
-            default:
-                return {};
-        }
-    })();
-    // Map padding to numeric values
-    const paddingValue = (() => {
-        switch (padding) {
-            case "xs":
-                return atoms_1.spacing[1];
-            case "sm":
-                return atoms_1.spacing[2];
-            case "md":
-                return atoms_1.spacing[3];
-            case "lg":
-                return atoms_1.spacing[4];
-            case "xl":
-                return atoms_1.spacing[5];
-            default:
-                return undefined;
-        }
-    })();
-    // Map margin to numeric values
-    const marginValue = (() => {
-        switch (margin) {
-            case "xs":
-                return atoms_1.spacing[1];
-            case "sm":
-                return atoms_1.spacing[2];
-            case "md":
-                return atoms_1.spacing[3];
-            case "lg":
-                return atoms_1.spacing[4];
-            case "xl":
-                return atoms_1.spacing[5];
-            default:
-                return undefined;
-        }
-    })();
-    // Map flex direction
-    const flexDirection = (() => {
-        switch (direction) {
-            case "row":
-                return "row";
-            case "column":
-                return "column";
-            case "row-reverse":
-                return "row-reverse";
-            case "column-reverse":
-                return "column-reverse";
-            default:
-                return "column";
-        }
-    })();
-    // Map align items
-    const alignItems = (() => {
-        switch (align) {
-            case "start":
-                return "flex-start";
-            case "center":
-                return "center";
-            case "end":
-                return "flex-end";
-            case "stretch":
-                return "stretch";
-            case "baseline":
-                return "baseline";
-            default:
-                return "stretch";
-        }
-    })();
-    // Map justify content
-    const justifyContent = (() => {
-        switch (justify) {
-            case "start":
-                return "flex-start";
-            case "center":
-                return "center";
-            case "end":
-                return "flex-end";
-            case "between":
-                return "space-between";
-            case "around":
-                return "space-around";
-            case "evenly":
-                return "space-evenly";
-            default:
-                return "flex-start";
-        }
-    })();
-    // Map flex value
-    const flexValue = (() => {
-        if (typeof flex === "number") {
-            return flex;
-        }
-        switch (flex) {
-            case "auto":
-                return undefined; // auto is default
-            case "initial":
-                return 0;
-            case "none":
-            default:
-                return undefined;
-        }
-    })();
-    const computedStyle = {
-        ...variantStyles,
-        ...(paddingValue !== undefined && { padding: paddingValue }),
-        ...(marginValue !== undefined && { margin: marginValue }),
-        flexDirection,
-        alignItems,
-        justifyContent,
-        ...(flexValue !== undefined && { flex: flexValue }),
-        ...(fullWidth && { width: "100%" }),
-        ...(fullHeight && { height: "100%" }),
-        ...(centered && {
-            alignItems: "center",
-            justifyContent: "center",
-        }),
-        ...(backgroundColor && { backgroundColor }),
-        ...(borderColor && { borderColor }),
-        ...(borderWidth !== undefined && { borderWidth }),
-        ...(borderRadius !== undefined && { borderRadius }),
-        ...(shadow && {
-            shadowColor: "#000",
-            shadowOffset: { width: 0, height: 2 },
-            shadowOpacity: 0.1,
-            shadowRadius: 4,
-            elevation: 3,
-        }),
-    };
-    const finalStyle = Array.isArray(style)
-        ? [computedStyle, ...style]
-        : [computedStyle, style];
-    return (0, jsx_runtime_1.jsx)(react_native_1.View, { ref: ref, style: finalStyle, ...props });
-});
-exports.View.displayName = "View";
-// Convenience components
-exports.Card = (0, react_1.forwardRef)((props, ref) => (0, jsx_runtime_1.jsx)(exports.View, { ref: ref, variant: "card", ...props }));
-exports.Card.displayName = "Card";
-exports.Container = (0, react_1.forwardRef)((props, ref) => (0, jsx_runtime_1.jsx)(exports.View, { ref: ref, variant: "container", ...props }));
-exports.Container.displayName = "Container";
-exports.Surface = (0, react_1.forwardRef)((props, ref) => (0, jsx_runtime_1.jsx)(exports.View, { ref: ref, variant: "surface", ...props }));
-exports.Surface.displayName = "Surface";
-exports.Overlay = (0, react_1.forwardRef)((props, ref) => (0, jsx_runtime_1.jsx)(exports.View, { ref: ref, variant: "overlay", ...props }));
-exports.Overlay.displayName = "Overlay";
-exports.Row = (0, react_1.forwardRef)((props, ref) => (0, jsx_runtime_1.jsx)(exports.View, { ref: ref, direction: "row", ...props }));
-exports.Row.displayName = "Row";
-exports.Column = (0, react_1.forwardRef)((props, ref) => (0, jsx_runtime_1.jsx)(exports.View, { ref: ref, direction: "column", ...props }));
-exports.Column.displayName = "Column";
-exports.Center = (0, react_1.forwardRef)((props, ref) => ((0, jsx_runtime_1.jsx)(exports.View, { ref: ref, centered: true, ...props })));
-exports.Center.displayName = "Center";

package/dist/hooks/index.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-// barrel file :)
-tslib_1.__exportStar(require("./useAvatars"), exports);
-tslib_1.__exportStar(require("./useCameraToggle"), exports);
-tslib_1.__exportStar(require("./useKeyboard"), exports);
-tslib_1.__exportStar(require("./useKeyboardSlide"), exports);
-tslib_1.__exportStar(require("./useLivestreamInfo"), exports);
-tslib_1.__exportStar(require("./useOuterAndInnerDimensions"), exports);
-tslib_1.__exportStar(require("./usePlayerDimensions"), exports);
-tslib_1.__exportStar(require("./usePointerDevice"), exports);
-tslib_1.__exportStar(require("./useSegmentDimensions"), exports);
-tslib_1.__exportStar(require("./useSegmentTiming"), exports);

package/dist/hooks/useAvatars.js

@@ -1,35 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useAvatars = useAvatars;
-const react_1 = require("react");
-const xrpc_1 = require("../streamplace-store/xrpc");
-function useAvatars(dids) {
-    let agent = (0, xrpc_1.usePDSAgent)();
-    const [profiles, setProfiles] = (0, react_1.useState)({});
-    const inFlight = (0, react_1.useRef)(new Set());
-    const missingDids = (0, react_1.useMemo)(() => dids.filter((did) => !(did in profiles) && !inFlight.current.has(did)), [dids, profiles]);
-    (0, react_1.useEffect)(() => {
-        if (missingDids.length === 0 || !agent)
-            return;
-        const toFetch = missingDids.slice(0, 25);
-        toFetch.forEach((did) => inFlight.current.add(did));
-        const fetchProfiles = async () => {
-            try {
-                const result = await agent.getProfiles({ actors: toFetch });
-                const newProfiles = {};
-                result.data.profiles.forEach((p) => {
-                    newProfiles[p.did] = p;
-                });
-                setProfiles((prev) => ({ ...prev, ...newProfiles }));
-            }
-            catch (e) {
-                console.error("Failed to fetch profiles", e);
-            }
-            finally {
-                toFetch.forEach((did) => inFlight.current.delete(did));
-            }
-        };
-        fetchProfiles();
-    }, [missingDids, agent]);
-    return profiles;
-}