@streamplace/components 0.7.0 → 0.7.2

package/dist/hooks/useCameraToggle.js

@@ -1,7 +1,10 @@
-import { usePlayerStore } from "../player-store";
-export function useCameraToggle() {
-    const ingestCamera = usePlayerStore((x) => x.ingestCamera);
-    const setIngestCamera = usePlayerStore((x) => x.setIngestCamera);
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCameraToggle = useCameraToggle;
+const player_store_1 = require("../player-store");
+function useCameraToggle() {
+    const ingestCamera = (0, player_store_1.usePlayerStore)((x) => x.ingestCamera);
+    const setIngestCamera = (0, player_store_1.usePlayerStore)((x) => x.setIngestCamera);
     const doSetIngestCamera = () => {
         setIngestCamera(ingestCamera === "user" ? "environment" : "user");
     };

package/dist/hooks/useKeyboard.js

@@ -1,25 +1,28 @@
-import { useEffect, useState } from "react";
-import { Keyboard } from "react-native";
-export function useKeyboard() {
-    const [isKeyboardVisible, setIsKeyboardVisible] = useState(false);
-    const [keyboardHeight, setKeyboardHeight] = useState(0);
-    useEffect(() => {
-        const willShowSubscription = Keyboard.addListener("keyboardWillShow", (e) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useKeyboard = useKeyboard;
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+function useKeyboard() {
+    const [isKeyboardVisible, setIsKeyboardVisible] = (0, react_1.useState)(false);
+    const [keyboardHeight, setKeyboardHeight] = (0, react_1.useState)(0);
+    (0, react_1.useEffect)(() => {
+        const willShowSubscription = react_native_1.Keyboard.addListener("keyboardWillShow", (e) => {
             // setIsKeyboardVisible(true);
             setKeyboardHeight(e.endCoordinates.height);
             console.log("keyboardWillShow", e.endCoordinates.height);
         });
-        const willHideSubscription = Keyboard.addListener("keyboardWillHide", (e) => {
+        const willHideSubscription = react_native_1.Keyboard.addListener("keyboardWillHide", (e) => {
             // setIsKeyboardVisible(false);
             setKeyboardHeight(0);
             console.log("keyboardWillHide", e.endCoordinates.height);
         });
-        const showSubscription = Keyboard.addListener("keyboardDidShow", (e) => {
+        const showSubscription = react_native_1.Keyboard.addListener("keyboardDidShow", (e) => {
             setIsKeyboardVisible(true);
             setKeyboardHeight(e.endCoordinates.height);
             console.log("keyboardDidShow", e.endCoordinates.height);
         });
-        const hideSubscription = Keyboard.addListener("keyboardDidHide", () => {
+        const hideSubscription = react_native_1.Keyboard.addListener("keyboardDidHide", () => {
             setIsKeyboardVisible(false);
             setKeyboardHeight(0);
         });

package/dist/hooks/useKeyboardSlide.js

@@ -1,8 +1,11 @@
-import { useKeyboard } from "../hooks/useKeyboard";
-import { useOuterAndInnerDimensions } from "../hooks/useOuterAndInnerDimensions";
-export function useKeyboardSlide() {
-    const { keyboardHeight } = useKeyboard();
-    const { outerHeight, innerHeight } = useOuterAndInnerDimensions();
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useKeyboardSlide = useKeyboardSlide;
+const useKeyboard_1 = require("../hooks/useKeyboard");
+const useOuterAndInnerDimensions_1 = require("../hooks/useOuterAndInnerDimensions");
+function useKeyboardSlide() {
+    const { keyboardHeight } = (0, useKeyboard_1.useKeyboard)();
+    const { outerHeight, innerHeight } = (0, useOuterAndInnerDimensions_1.useOuterAndInnerDimensions)();
     let slideKeyboard = 0;
     if (keyboardHeight > 0) {
         slideKeyboard = -keyboardHeight + (outerHeight - innerHeight);

package/dist/hooks/useLivestreamInfo.js

@@ -1,17 +1,20 @@
-import { useState } from "react";
-import { useLivestreamStore } from "../livestream-store";
-import { usePlayerStore } from "../player-store";
-import { useCreateStreamRecord } from "../streamplace-store";
-export function useLivestreamInfo() {
-    const ingest = usePlayerStore((x) => x.ingestConnectionState);
-    const profile = useLivestreamStore((x) => x.profile);
-    const ingestStarting = usePlayerStore((x) => x.ingestStarting);
-    const setIngestStarting = usePlayerStore((x) => x.setIngestStarting);
-    const setIngestLive = usePlayerStore((x) => x.setIngestLive);
-    const createStreamRecord = useCreateStreamRecord();
-    const [title, setTitle] = useState("");
-    const [showCountdown, setShowCountdown] = useState(false);
-    const [recordSubmitted, setRecordSubmitted] = useState(false);
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLivestreamInfo = useLivestreamInfo;
+const react_1 = require("react");
+const livestream_store_1 = require("../livestream-store");
+const player_store_1 = require("../player-store");
+const streamplace_store_1 = require("../streamplace-store");
+function useLivestreamInfo() {
+    const ingest = (0, player_store_1.usePlayerStore)((x) => x.ingestConnectionState);
+    const profile = (0, livestream_store_1.useLivestreamStore)((x) => x.profile);
+    const ingestStarting = (0, player_store_1.usePlayerStore)((x) => x.ingestStarting);
+    const setIngestStarting = (0, player_store_1.usePlayerStore)((x) => x.setIngestStarting);
+    const setIngestLive = (0, player_store_1.usePlayerStore)((x) => x.setIngestLive);
+    const createStreamRecord = (0, streamplace_store_1.useCreateStreamRecord)();
+    const [title, setTitle] = (0, react_1.useState)("");
+    const [showCountdown, setShowCountdown] = (0, react_1.useState)(false);
+    const [recordSubmitted, setRecordSubmitted] = (0, react_1.useState)(false);
     const handleSubmit = async () => {
         try {
             if (title !== "") {

package/dist/hooks/useOuterAndInnerDimensions.js

@@ -1,18 +1,21 @@
-import { useCallback, useState } from "react";
-export function useOuterAndInnerDimensions() {
-    const [outerDimensions, setOuterDimensions] = useState({
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useOuterAndInnerDimensions = useOuterAndInnerDimensions;
+const react_1 = require("react");
+function useOuterAndInnerDimensions() {
+    const [outerDimensions, setOuterDimensions] = (0, react_1.useState)({
         width: 0,
         height: 0,
     });
-    const [innerDimensions, setInnerDimensions] = useState({
+    const [innerDimensions, setInnerDimensions] = (0, react_1.useState)({
         width: 0,
         height: 0,
     });
-    const onOuterLayout = useCallback((event) => {
+    const onOuterLayout = (0, react_1.useCallback)((event) => {
         const { width, height } = event.nativeEvent.layout;
         setOuterDimensions({ width, height });
     }, []);
-    const onInnerLayout = useCallback((event) => {
+    const onInnerLayout = (0, react_1.useCallback)((event) => {
         const { width, height } = event.nativeEvent.layout;
         setInnerDimensions({ width, height });
     }, []);

package/dist/hooks/usePlayerDimensions.js

@@ -1,13 +1,16 @@
-import { Dimensions } from "react-native";
-import { usePlayerStore } from "../player-store";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePlayerDimensions = usePlayerDimensions;
+const react_native_1 = require("react-native");
+const player_store_1 = require("../player-store");
 /**
  * usePlayerDimensions
  * Returns player and device dimensions, and whether the player aspect ratio is greater than the device's.
  */
-export function usePlayerDimensions() {
-    const { width, height } = Dimensions.get("window");
-    const pHeight = Number(usePlayerStore((x) => x.playerHeight)) || 0;
-    const pWidth = Number(usePlayerStore((x) => x.playerWidth)) || 0;
+function usePlayerDimensions() {
+    const { width, height } = react_native_1.Dimensions.get("window");
+    const pHeight = Number((0, player_store_1.usePlayerStore)((x) => x.playerHeight)) || 0;
+    const pWidth = Number((0, player_store_1.usePlayerStore)((x) => x.playerWidth)) || 0;
     const isPlayerRatioGreater = pHeight > 0 && pWidth > 0 ? pWidth / pHeight > width / height : false;
     return {
         width,

package/dist/hooks/useSegmentDimensions.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSegmentDimensions = useSegmentDimensions;
+const livestream_store_1 = require("../livestream-store");
+function useSegmentDimensions() {
+    const latestSegment = (0, livestream_store_1.useLivestreamStore)((x) => x.segment);
+    let seg = latestSegment?.video && latestSegment.video[0];
+    let ratio = {
+        height: seg?.height || 0,
+        width: seg?.width || 0,
+    };
+    return {
+        isPlayerRatioGreater: ratio.width > ratio.height,
+        height: ratio.height,
+        width: ratio.width,
+    };
+}

package/dist/hooks/useSegmentTiming.js

@@ -1,5 +1,8 @@
-import { useEffect, useRef, useState } from "react";
-import { useLivestreamStore } from "../livestream-store";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSegmentTiming = useSegmentTiming;
+const react_1 = require("react");
+const livestream_store_1 = require("../livestream-store");
 function getLiveConnectionQuality(timeBetweenSegments, range, numOfSegments = 1) {
     if (timeBetweenSegments === null || range === null)
         return "poor";
@@ -11,20 +14,20 @@ function getLiveConnectionQuality(timeBetweenSegments, range, numOfSegments = 1)
     }
     return "poor";
 }
-export function useSegmentTiming() {
-    const latestSegment = useLivestreamStore((x) => x.segment);
-    const [segmentDeltas, setSegmentDeltas] = useState([]);
-    const prevSegmentRef = useRef();
-    const prevTimestampRef = useRef(null);
+function useSegmentTiming() {
+    const latestSegment = (0, livestream_store_1.useLivestreamStore)((x) => x.segment);
+    const [segmentDeltas, setSegmentDeltas] = (0, react_1.useState)([]);
+    const prevSegmentRef = (0, react_1.useRef)();
+    const prevTimestampRef = (0, react_1.useRef)(null);
     // Dummy state to force update every second
-    const [, setNow] = useState(Date.now());
-    useEffect(() => {
+    const [, setNow] = (0, react_1.useState)(Date.now());
+    (0, react_1.useEffect)(() => {
         const interval = setInterval(() => {
             setNow(Date.now());
         }, 1000);
         return () => clearInterval(interval);
     }, []);
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (latestSegment && prevSegmentRef.current !== latestSegment) {
             const now = Date.now();
             if (prevTimestampRef.current !== null) {

package/dist/index.js

@@ -1,16 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.atoms = exports.theme = exports.ui = exports.PlayerUI = exports.Player = exports.usePlayerContext = exports.withPlayerProvider = exports.PlayerProvider = void 0;
+const tslib_1 = require("tslib");
 // barrel file :)
-export * from "./livestream-provider";
-export * from "./livestream-store";
-export * from "./player-store";
-export * from "./streamplace-provider";
-export * from "./streamplace-store";
-export { PlayerProvider, withPlayerProvider, } from "./player-store/player-provider";
-export { usePlayerContext } from "./player-store/player-store";
-export { Player, PlayerUI } from "./components/mobile-player/player";
-export * as ui from "./components/ui";
-export * from "./components/ui";
-export * as theme from "./lib/theme";
-export * as atoms from "./lib/theme/atoms";
-export * from "./hooks";
-export * from "./components/chat/chat";
-export * from "./components/chat/chat-box";
+tslib_1.__exportStar(require("./livestream-provider"), exports);
+tslib_1.__exportStar(require("./livestream-store"), exports);
+tslib_1.__exportStar(require("./player-store"), exports);
+tslib_1.__exportStar(require("./streamplace-provider"), exports);
+tslib_1.__exportStar(require("./streamplace-store"), exports);
+var player_provider_1 = require("./player-store/player-provider");
+Object.defineProperty(exports, "PlayerProvider", { enumerable: true, get: function () { return player_provider_1.PlayerProvider; } });
+Object.defineProperty(exports, "withPlayerProvider", { enumerable: true, get: function () { return player_provider_1.withPlayerProvider; } });
+var player_store_1 = require("./player-store/player-store");
+Object.defineProperty(exports, "usePlayerContext", { enumerable: true, get: function () { return player_store_1.usePlayerContext; } });
+var player_1 = require("./components/mobile-player/player");
+Object.defineProperty(exports, "Player", { enumerable: true, get: function () { return player_1.Player; } });
+Object.defineProperty(exports, "PlayerUI", { enumerable: true, get: function () { return player_1.PlayerUI; } });
+exports.ui = tslib_1.__importStar(require("./components/ui"));
+tslib_1.__exportStar(require("./components/ui"), exports);
+exports.theme = tslib_1.__importStar(require("./lib/theme"));
+exports.atoms = tslib_1.__importStar(require("./lib/theme/atoms"));
+tslib_1.__exportStar(require("./hooks"), exports);
+tslib_1.__exportStar(require("./components/chat/chat"), exports);
+tslib_1.__exportStar(require("./components/chat/chat-box"), exports);

package/dist/lib/facet.js

@@ -1,7 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.segmentize = void 0;
 const segment = (text, features) => {
     return { text, features: text.length > 0 ? features : undefined };
 };
-export const segmentize = (text, facets) => {
+const segmentize = (text, facets) => {
     if (facets === undefined || facets.length === 0) {
         return [segment(text, undefined)];
     }
@@ -86,3 +89,4 @@ export const segmentize = (text, facets) => {
     }
     return segments;
 };
+exports.segmentize = segmentize;