@streamplace/components 0.7.0 → 0.7.2

package/dist/lib/theme/theme.js

@@ -1,51 +1,59 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { PortalHost } from "@rn-primitives/portal";
-import { createContext, useContext, useMemo, useState, } from "react";
-import { Platform, useColorScheme } from "react-native";
-import { animations, borderRadius, colors, shadows, spacing, touchTargets, typography, } from "./tokens";
-import { GestureHandlerRootView } from "react-native-gesture-handler";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createThemeStyles = exports.createThemeIcons = exports.createThemeColors = exports.darkTheme = exports.lightTheme = void 0;
+exports.ThemeProvider = ThemeProvider;
+exports.useTheme = useTheme;
+exports.usePlatformTypography = usePlatformTypography;
+exports.createThemedStyles = createThemedStyles;
+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 tokens_1 = require("./tokens");
+const react_native_gesture_handler_1 = require("react-native-gesture-handler");
 // Create theme colors based on dark mode
 const createThemeColors = (isDark) => ({
-    background: isDark ? colors.gray[950] : colors.white,
-    foreground: isDark ? colors.gray[50] : colors.gray[950],
-    card: isDark ? colors.gray[900] : colors.white,
-    cardForeground: isDark ? colors.gray[50] : colors.gray[950],
-    popover: isDark ? colors.gray[900] : colors.white,
-    popoverForeground: isDark ? colors.gray[50] : colors.gray[950],
-    primary: Platform.OS === "ios" ? colors.ios.systemBlue : colors.primary[500],
-    primaryForeground: colors.white,
-    secondary: isDark ? colors.gray[800] : colors.gray[100],
-    secondaryForeground: isDark ? colors.gray[50] : colors.gray[900],
-    muted: isDark ? colors.gray[800] : colors.gray[100],
-    mutedForeground: isDark ? colors.gray[400] : colors.gray[500],
-    accent: isDark ? colors.gray[800] : colors.gray[100],
-    accentForeground: isDark ? colors.gray[50] : colors.gray[900],
-    destructive: Platform.OS === "ios" ? colors.ios.systemRed : colors.destructive[500],
-    destructiveForeground: colors.white,
-    success: Platform.OS === "ios" ? colors.ios.systemGreen : colors.success[500],
-    successForeground: colors.white,
-    warning: Platform.OS === "ios" ? colors.ios.systemOrange : colors.warning[500],
-    warningForeground: colors.white,
-    border: isDark ? colors.gray[500] + "30" : colors.gray[200] + "30",
-    input: isDark ? colors.gray[800] : colors.gray[200],
-    ring: Platform.OS === "ios" ? colors.ios.systemBlue : colors.primary[500],
-    text: isDark ? colors.gray[50] : colors.gray[950],
-    textMuted: isDark ? colors.gray[400] : colors.gray[500],
-    textDisabled: isDark ? colors.gray[600] : colors.gray[400],
+    background: isDark ? tokens_1.colors.gray[950] : tokens_1.colors.white,
+    foreground: isDark ? tokens_1.colors.gray[50] : tokens_1.colors.gray[950],
+    card: isDark ? tokens_1.colors.gray[900] : tokens_1.colors.white,
+    cardForeground: isDark ? tokens_1.colors.gray[50] : tokens_1.colors.gray[950],
+    popover: isDark ? tokens_1.colors.gray[900] : tokens_1.colors.white,
+    popoverForeground: isDark ? tokens_1.colors.gray[50] : tokens_1.colors.gray[950],
+    primary: react_native_1.Platform.OS === "ios" ? tokens_1.colors.ios.systemBlue : tokens_1.colors.primary[500],
+    primaryForeground: tokens_1.colors.white,
+    secondary: isDark ? tokens_1.colors.gray[800] : tokens_1.colors.gray[100],
+    secondaryForeground: isDark ? tokens_1.colors.gray[50] : tokens_1.colors.gray[900],
+    muted: isDark ? tokens_1.colors.gray[800] : tokens_1.colors.gray[100],
+    mutedForeground: isDark ? tokens_1.colors.gray[400] : tokens_1.colors.gray[500],
+    accent: isDark ? tokens_1.colors.gray[800] : tokens_1.colors.gray[100],
+    accentForeground: isDark ? tokens_1.colors.gray[50] : tokens_1.colors.gray[900],
+    destructive: react_native_1.Platform.OS === "ios" ? tokens_1.colors.ios.systemRed : tokens_1.colors.destructive[500],
+    destructiveForeground: tokens_1.colors.white,
+    success: react_native_1.Platform.OS === "ios" ? tokens_1.colors.ios.systemGreen : tokens_1.colors.success[500],
+    successForeground: tokens_1.colors.white,
+    warning: react_native_1.Platform.OS === "ios" ? tokens_1.colors.ios.systemOrange : tokens_1.colors.warning[500],
+    warningForeground: tokens_1.colors.white,
+    border: isDark ? tokens_1.colors.gray[500] + "30" : tokens_1.colors.gray[200] + "30",
+    input: isDark ? tokens_1.colors.gray[800] : tokens_1.colors.gray[200],
+    ring: react_native_1.Platform.OS === "ios" ? tokens_1.colors.ios.systemBlue : tokens_1.colors.primary[500],
+    text: isDark ? tokens_1.colors.gray[50] : tokens_1.colors.gray[950],
+    textMuted: isDark ? tokens_1.colors.gray[400] : tokens_1.colors.gray[500],
+    textDisabled: isDark ? tokens_1.colors.gray[600] : tokens_1.colors.gray[400],
 });
+exports.createThemeColors = createThemeColors;
 // Create theme styles based on colors
 const createThemeStyles = (themeColors) => ({
     shadow: {
-        sm: shadows.sm,
-        md: shadows.md,
-        lg: shadows.lg,
-        xl: shadows.xl,
+        sm: tokens_1.shadows.sm,
+        md: tokens_1.shadows.md,
+        lg: tokens_1.shadows.lg,
+        xl: tokens_1.shadows.xl,
     },
     button: {
         primary: {
             backgroundColor: themeColors.primary,
             borderWidth: 0,
-            ...shadows.sm,
+            ...tokens_1.shadows.sm,
         },
         secondary: {
             backgroundColor: themeColors.secondary,
@@ -77,10 +85,10 @@ const createThemeStyles = (themeColors) => ({
             backgroundColor: themeColors.background,
             borderWidth: 1,
             borderColor: themeColors.border,
-            borderRadius: borderRadius.md,
-            paddingHorizontal: spacing[3],
-            paddingVertical: spacing[3],
-            minHeight: touchTargets.minimum,
+            borderRadius: tokens_1.borderRadius.md,
+            paddingHorizontal: tokens_1.spacing[3],
+            paddingVertical: tokens_1.spacing[3],
+            minHeight: tokens_1.touchTargets.minimum,
         },
         focused: {
             borderColor: themeColors.ring,
@@ -94,11 +102,12 @@ const createThemeStyles = (themeColors) => ({
     card: {
         base: {
             backgroundColor: themeColors.card,
-            borderRadius: borderRadius.lg,
-            ...shadows.sm,
+            borderRadius: tokens_1.borderRadius.lg,
+            ...tokens_1.shadows.sm,
         },
     },
 });
+exports.createThemeStyles = createThemeStyles;
 // Create theme icons based on colors
 const createThemeIcons = (themeColors) => ({
     color: {
@@ -117,14 +126,15 @@ const createThemeIcons = (themeColors) => ({
         xl: 32,
     },
 });
+exports.createThemeIcons = createThemeIcons;
 // Create the theme context
-const ThemeContext = createContext(null);
+const ThemeContext = (0, react_1.createContext)(null);
 // Theme provider component
-export function ThemeProvider({ children, defaultTheme = "system", forcedTheme, }) {
-    const systemColorScheme = useColorScheme();
-    const [currentTheme, setCurrentTheme] = useState(defaultTheme);
+function ThemeProvider({ children, defaultTheme = "system", forcedTheme, }) {
+    const systemColorScheme = (0, react_native_1.useColorScheme)();
+    const [currentTheme, setCurrentTheme] = (0, react_1.useState)(defaultTheme);
     // Determine if dark mode should be active
-    const isDark = useMemo(() => {
+    const isDark = (0, react_1.useMemo)(() => {
         if (forcedTheme === "light")
             return false;
         if (forcedTheme === "dark")
@@ -138,24 +148,24 @@ export function ThemeProvider({ children, defaultTheme = "system", forcedTheme,
         return systemColorScheme === "dark";
     }, [forcedTheme, currentTheme, systemColorScheme]);
     // Create theme based on dark mode
-    const theme = useMemo(() => {
+    const theme = (0, react_1.useMemo)(() => {
         const themeColors = createThemeColors(isDark);
         return {
             colors: themeColors,
-            spacing,
-            borderRadius,
-            typography,
-            shadows,
-            touchTargets,
-            animations,
+            spacing: tokens_1.spacing,
+            borderRadius: tokens_1.borderRadius,
+            typography: tokens_1.typography,
+            shadows: tokens_1.shadows,
+            touchTargets: tokens_1.touchTargets,
+            animations: tokens_1.animations,
         };
     }, [isDark]);
     // Create utility styles
-    const styles = useMemo(() => {
+    const styles = (0, react_1.useMemo)(() => {
         return createThemeStyles(theme.colors);
     }, [theme.colors]);
     // Create icon utilities
-    const icons = useMemo(() => {
+    const icons = (0, react_1.useMemo)(() => {
         return createThemeIcons(theme.colors);
     }, [theme.colors]);
     // Theme controls
@@ -175,7 +185,7 @@ export function ThemeProvider({ children, defaultTheme = "system", forcedTheme,
             });
         }
     };
-    const value = useMemo(() => ({
+    const value = (0, react_1.useMemo)(() => ({
         theme,
         styles,
         icons,
@@ -195,54 +205,52 @@ export function ThemeProvider({ children, defaultTheme = "system", forcedTheme,
         setTheme,
         toggleTheme,
     ]);
-    return (_jsx(ThemeContext.Provider, { value: value, children: _jsxs(GestureHandlerRootView, { children: [children, _jsx(PortalHost, {})] }) }));
+    return ((0, jsx_runtime_1.jsx)(ThemeContext.Provider, { value: value, children: (0, jsx_runtime_1.jsxs)(react_native_gesture_handler_1.GestureHandlerRootView, { children: [children, (0, jsx_runtime_1.jsx)(portal_1.PortalHost, {})] }) }));
 }
 // Hook to use theme
-export function useTheme() {
-    const context = useContext(ThemeContext);
+function useTheme() {
+    const context = (0, react_1.useContext)(ThemeContext);
     if (!context) {
         throw new Error("useTheme must be used within a ThemeProvider");
     }
     return context;
 }
 // Hook to get current platform's typography
-export function usePlatformTypography() {
+function usePlatformTypography() {
     const { theme } = useTheme();
-    return useMemo(() => {
-        if (Platform.OS === "ios") {
+    return (0, react_1.useMemo)(() => {
+        if (react_native_1.Platform.OS === "ios") {
             return theme.typography.ios;
         }
-        else if (Platform.OS === "android") {
+        else if (react_native_1.Platform.OS === "android") {
             return theme.typography.android;
         }
         return theme.typography.universal;
     }, [theme.typography]);
 }
 // Utility function to create theme-aware styles
-export function createThemedStyles(styleCreator) {
+function createThemedStyles(styleCreator) {
     return function useThemedStyles() {
         const { theme, styles, icons } = useTheme();
-        return useMemo(() => styleCreator(theme, styles, icons), [theme, styles, icons]);
+        return (0, react_1.useMemo)(() => styleCreator(theme, styles, icons), [theme, styles, icons]);
     };
 }
 // Create light and dark theme instances for external use
-export const lightTheme = {
+exports.lightTheme = {
     colors: createThemeColors(false),
-    spacing,
-    borderRadius,
-    typography,
-    shadows,
-    touchTargets,
-    animations,
+    spacing: tokens_1.spacing,
+    borderRadius: tokens_1.borderRadius,
+    typography: tokens_1.typography,
+    shadows: tokens_1.shadows,
+    touchTargets: tokens_1.touchTargets,
+    animations: tokens_1.animations,
 };
-export const darkTheme = {
+exports.darkTheme = {
     colors: createThemeColors(true),
-    spacing,
-    borderRadius,
-    typography,
-    shadows,
-    touchTargets,
-    animations,
+    spacing: tokens_1.spacing,
+    borderRadius: tokens_1.borderRadius,
+    typography: tokens_1.typography,
+    shadows: tokens_1.shadows,
+    touchTargets: tokens_1.touchTargets,
+    animations: tokens_1.animations,
 };
-// Export individual theme utilities for convenience
-export { createThemeColors, createThemeIcons, createThemeStyles };

package/dist/lib/theme/tokens.js

@@ -1,8 +1,11 @@
+"use strict";
 /**
  * Design tokens for React Native components
  * Inspired by shadcn/ui but adapted for React Native styling
  */
-export const colors = {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.breakpoints = exports.animations = exports.touchTargets = exports.shadows = exports.typography = exports.borderRadius = exports.spacing = exports.colors = void 0;
+exports.colors = {
     // Primary colors
     primary: {
         50: "#eff6ff",
@@ -109,7 +112,7 @@ export const colors = {
     black: "#000000",
     white: "#FFFFFF",
 };
-export const spacing = {
+exports.spacing = {
     0: 0,
     1: 4,
     2: 8,
@@ -142,7 +145,7 @@ export const spacing = {
     96: 384,
     auto: "auto",
 };
-export const borderRadius = {
+exports.borderRadius = {
     none: 0,
     sm: 4,
     md: 8,
@@ -152,7 +155,7 @@ export const borderRadius = {
     "3xl": 24,
     full: 999,
 };
-export const typography = {
+exports.typography = {
     // iOS system font sizes
     ios: {
         largeTitle: {
@@ -323,7 +326,7 @@ export const typography = {
         },
     },
 };
-export const shadows = {
+exports.shadows = {
     none: {
         shadowColor: "transparent",
         shadowOffset: { width: 0, height: 0 },
@@ -332,28 +335,28 @@ export const shadows = {
         elevation: 0,
     },
     sm: {
-        shadowColor: colors.black,
+        shadowColor: exports.colors.black,
         shadowOffset: { width: 0, height: 1 },
         shadowOpacity: 0.05,
         shadowRadius: 2,
         elevation: 2,
     },
     md: {
-        shadowColor: colors.black,
+        shadowColor: exports.colors.black,
         shadowOffset: { width: 0, height: 2 },
         shadowOpacity: 0.1,
         shadowRadius: 4,
         elevation: 4,
     },
     lg: {
-        shadowColor: colors.black,
+        shadowColor: exports.colors.black,
         shadowOffset: { width: 0, height: 4 },
         shadowOpacity: 0.15,
         shadowRadius: 8,
         elevation: 8,
     },
     xl: {
-        shadowColor: colors.black,
+        shadowColor: exports.colors.black,
         shadowOffset: { width: 0, height: 8 },
         shadowOpacity: 0.2,
         shadowRadius: 16,
@@ -361,20 +364,20 @@ export const shadows = {
     },
 };
 // Touch targets (iOS Human Interface Guidelines)
-export const touchTargets = {
+exports.touchTargets = {
     minimum: 44, // Minimum touch target size
     comfortable: 48, // Comfortable touch target size
     large: 56, // Large touch target size
 };
 // Animation durations
-export const animations = {
+exports.animations = {
     fast: 150,
     normal: 200,
     slow: 300,
     slower: 500,
 };
 // Breakpoints for responsive design
-export const breakpoints = {
+exports.breakpoints = {
     sm: 640,
     md: 768,
     lg: 1024,

package/dist/lib/utils.js

@@ -1,17 +1,28 @@
-import { StyleSheet } from "react-native";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mergeStyles = mergeStyles;
+exports.createStyleMerger = createStyleMerger;
+exports.conditionalStyle = conditionalStyle;
+exports.responsiveValue = responsiveValue;
+exports.platformStyle = platformStyle;
+exports.hexToRgba = hexToRgba;
+exports.debounce = debounce;
+exports.throttle = throttle;
+exports.forwardProps = forwardProps;
+const react_native_1 = require("react-native");
 /**
  * Merges React Native styles similar to how cn() merges CSS classes
  * Handles arrays, objects, and falsy values
  */
-export function mergeStyles(...styles) {
+function mergeStyles(...styles) {
     const validStyles = styles.filter(Boolean).flat();
-    return StyleSheet.flatten(validStyles) || {};
+    return react_native_1.StyleSheet.flatten(validStyles) || {};
 }
 /**
  * Creates a style merger function that includes base styles
  * Useful for component variants
  */
-export function createStyleMerger(baseStyle) {
+function createStyleMerger(baseStyle) {
     return (...styles) => {
         return mergeStyles(baseStyle, ...styles);
     };
@@ -19,13 +30,13 @@ export function createStyleMerger(baseStyle) {
 /**
  * Conditionally applies styles based on boolean conditions
  */
-export function conditionalStyle(condition, trueStyle, falseStyle) {
+function conditionalStyle(condition, trueStyle, falseStyle) {
     return condition ? trueStyle : falseStyle;
 }
 /**
  * Creates responsive values based on screen dimensions
  */
-export function responsiveValue(values, screenWidth) {
+function responsiveValue(values, screenWidth) {
     if (screenWidth >= 1280 && values.xl !== undefined)
         return values.xl;
     if (screenWidth >= 1024 && values.lg !== undefined)
@@ -39,7 +50,7 @@ export function responsiveValue(values, screenWidth) {
 /**
  * Creates platform-specific styles
  */
-export function platformStyle(styles) {
+function platformStyle(styles) {
     const Platform = require("react-native").Platform;
     if (Platform.OS === "ios" && styles.ios)
         return styles.ios;
@@ -52,7 +63,7 @@ export function platformStyle(styles) {
 /**
  * Converts hex color to rgba
  */
-export function hexToRgba(hex, alpha = 1) {
+function hexToRgba(hex, alpha = 1) {
     const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
     if (!result)
         return hex;
@@ -64,7 +75,7 @@ export function hexToRgba(hex, alpha = 1) {
 /**
  * Creates a debounced function for performance
  */
-export function debounce(func, delay) {
+function debounce(func, delay) {
     let timeoutId;
     return (...args) => {
         clearTimeout(timeoutId);
@@ -74,7 +85,7 @@ export function debounce(func, delay) {
 /**
  * Creates a throttled function for performance
  */
-export function throttle(func, delay) {
+function throttle(func, delay) {
     let lastCall = 0;
     return (...args) => {
         const now = Date.now();
@@ -87,7 +98,7 @@ export function throttle(func, delay) {
 /**
  * Type-safe component prop forwarding
  */
-export function forwardProps(props, omit) {
+function forwardProps(props, omit) {
     const result = { ...props };
     omit.forEach((key) => delete result[key]);
     return result;

package/dist/livestream-provider/index.js

@@ -1,25 +1,30 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useContext, useRef } from "react";
-import { LivestreamContext, makeLivestreamStore } from "../livestream-store";
-import { useLivestreamWebsocket } from "./websocket";
-export function LivestreamProvider({ children, src, }) {
-    const context = useContext(LivestreamContext);
-    const store = useRef(makeLivestreamStore()).current;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LivestreamProvider = LivestreamProvider;
+exports.WebsocketWatcher = WebsocketWatcher;
+exports.LivestreamPoller = LivestreamPoller;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const livestream_store_1 = require("../livestream-store");
+const websocket_1 = require("./websocket");
+function LivestreamProvider({ children, src, }) {
+    const context = (0, react_1.useContext)(livestream_store_1.LivestreamContext);
+    const store = (0, react_1.useRef)((0, livestream_store_1.makeLivestreamStore)()).current;
     if (context) {
         // this is ok, there's use cases for having one in another
         // like having a player component that's independently usable
         // but can also be embedded within an entire livestream page
-        return _jsx(_Fragment, { children: children });
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
     }
     window.livestreamStore = store;
-    return (_jsx(LivestreamContext.Provider, { value: { store: store }, children: _jsx(LivestreamPoller, { src: src, children: children }) }));
+    return ((0, jsx_runtime_1.jsx)(livestream_store_1.LivestreamContext.Provider, { value: { store: store }, children: (0, jsx_runtime_1.jsx)(LivestreamPoller, { src: src, children: children }) }));
 }
-export function WebsocketWatcher({ src }) {
-    useLivestreamWebsocket(src);
-    return _jsx(_Fragment, {});
+function WebsocketWatcher({ src }) {
+    (0, websocket_1.useLivestreamWebsocket)(src);
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
 }
-export function LivestreamPoller({ children, src, }) {
+function LivestreamPoller({ children, src, }) {
     // Websocket watcher is a sibling instead of a parent to avoid
     // re-rendering when the websocket does stuff
-    return (_jsxs(_Fragment, { children: [_jsx(WebsocketWatcher, { src: src }), children] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(WebsocketWatcher, { src: src }), children] }));
 }

package/dist/livestream-provider/websocket.js

@@ -1,15 +1,19 @@
-import { useRef } from "react";
-import useWebSocket from "react-use-websocket";
-import { useHandleWebsocketMessages } from "../livestream-store";
-import { useUrl } from "../streamplace-store";
-export function useLivestreamWebsocket(src) {
-    const url = useUrl();
-    const handleWebSocketMessages = useHandleWebsocketMessages();
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLivestreamWebsocket = useLivestreamWebsocket;
+const tslib_1 = require("tslib");
+const react_1 = require("react");
+const react_use_websocket_1 = tslib_1.__importDefault(require("react-use-websocket"));
+const livestream_store_1 = require("../livestream-store");
+const streamplace_store_1 = require("../streamplace-store");
+function useLivestreamWebsocket(src) {
+    const url = (0, streamplace_store_1.useUrl)();
+    const handleWebSocketMessages = (0, livestream_store_1.useHandleWebsocketMessages)();
     let wsUrl = url.replace(/^http\:/, "ws:");
     wsUrl = wsUrl.replace(/^https\:/, "wss:");
-    const ref = useRef([]);
-    const handle = useRef(null);
-    const { readyState } = useWebSocket(`${wsUrl}/api/websocket/${src}`, {
+    const ref = (0, react_1.useRef)([]);
+    const handle = (0, react_1.useRef)(null);
+    const { readyState } = (0, react_use_websocket_1.default)(`${wsUrl}/api/websocket/${src}`, {
         reconnectInterval: 1000,
         shouldReconnect: () => true,
         onOpen: () => {

package/dist/livestream-store/chat.js

@@ -1,21 +1,26 @@
-import { RichText } from "@atproto/api";
-import { useCallback } from "react";
-import { useChatProfile, useDID, useHandle } from "../streamplace-store";
-import { usePDSAgent } from "../streamplace-store/xrpc";
-import { getStoreFromContext, useLivestreamStore } from "./livestream-store";
-export const useReplyToMessage = () => useLivestreamStore((state) => state.replyToMessage);
-export const useSetReplyToMessage = () => {
-    const store = getStoreFromContext();
-    return useCallback((message) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.reduceChat = exports.reduceChatIncremental = exports.useCreateChatMessage = exports.useSetReplyToMessage = exports.useReplyToMessage = void 0;
+const api_1 = require("@atproto/api");
+const react_1 = require("react");
+const streamplace_store_1 = require("../streamplace-store");
+const xrpc_1 = require("../streamplace-store/xrpc");
+const livestream_store_1 = require("./livestream-store");
+const useReplyToMessage = () => (0, livestream_store_1.useLivestreamStore)((state) => state.replyToMessage);
+exports.useReplyToMessage = useReplyToMessage;
+const useSetReplyToMessage = () => {
+    const store = (0, livestream_store_1.getStoreFromContext)();
+    return (0, react_1.useCallback)((message) => {
         store.setState({ replyToMessage: message });
     }, [store]);
 };
-export const useCreateChatMessage = () => {
-    const pdsAgent = usePDSAgent();
-    const store = getStoreFromContext();
-    const userDID = useDID();
-    const userHandle = useHandle();
-    const chatProfile = useChatProfile();
+exports.useSetReplyToMessage = useSetReplyToMessage;
+const useCreateChatMessage = () => {
+    const pdsAgent = (0, xrpc_1.usePDSAgent)();
+    const store = (0, livestream_store_1.getStoreFromContext)();
+    const userDID = (0, streamplace_store_1.useDID)();
+    const userHandle = (0, streamplace_store_1.useHandle)();
+    const chatProfile = (0, streamplace_store_1.useChatProfile)();
     return async (msg) => {
         if (!pdsAgent || !userDID) {
             throw new Error("No PDS agent or user DID found");
@@ -25,7 +30,7 @@ export const useCreateChatMessage = () => {
         if (!streamerProfile) {
             throw new Error("Profile not found");
         }
-        const rt = new RichText({ text: msg.text });
+        const rt = new api_1.RichText({ text: msg.text });
         await rt.detectFacets(pdsAgent);
         const record = {
             text: msg.text,
@@ -58,7 +63,7 @@ export const useCreateChatMessage = () => {
             indexedAt: new Date().toISOString(),
             chatProfile: chatProfile || undefined,
         };
-        state = reduceChat(state, [localChat], []);
+        state = (0, exports.reduceChat)(state, [localChat], []);
         store.setState(state);
         await pdsAgent.com.atproto.repo.createRecord({
             repo: userDID,
@@ -67,6 +72,7 @@ export const useCreateChatMessage = () => {
         });
     };
 };
+exports.useCreateChatMessage = useCreateChatMessage;
 const buildSortedChatList = (chatIndex, existingChatList, newMessages, removedKeys) => {
     const sortedKeys = Object.keys(chatIndex).sort((a, b) => {
         const aTime = parseInt(a.split("-")[0], 10);
@@ -93,7 +99,7 @@ const profileIsDifferent = (newProfile, oldProfile) => {
     const { red: oldRed, green: oldGreen, blue: oldBlue } = oldProfile.color;
     return newRed !== oldRed || newGreen !== oldGreen || newBlue !== oldBlue;
 };
-export const reduceChatIncremental = (state, newMessages, blocks) => {
+const reduceChatIncremental = (state, newMessages, blocks) => {
     if (newMessages.length === 0 && blocks.length === 0) {
         return state;
     }
@@ -183,4 +189,5 @@ export const reduceChatIncremental = (state, newMessages, blocks) => {
         chat: newChatList,
     };
 };
-export const reduceChat = reduceChatIncremental;
+exports.reduceChatIncremental = reduceChatIncremental;
+exports.reduceChat = exports.reduceChatIncremental;

package/dist/livestream-store/context.js

@@ -1,2 +1,5 @@
-import { createContext } from "react";
-export const LivestreamContext = createContext(null);
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LivestreamContext = void 0;
+const react_1 = require("react");
+exports.LivestreamContext = (0, react_1.createContext)(null);

package/dist/livestream-store/index.js

@@ -1,4 +1,7 @@
-export * from "./chat";
-export * from "./context";
-export * from "./livestream-store";
-export * from "./stream-key";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./chat"), exports);
+tslib_1.__exportStar(require("./context"), exports);
+tslib_1.__exportStar(require("./livestream-store"), exports);
+tslib_1.__exportStar(require("./stream-key"), exports);

package/dist/livestream-store/livestream-state.js

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });