@100mslive/roomkit-react 0.3.22-alpha.2 → 0.3.22-alpha.4

package/dist/chunk-KF2YEUWU.js

@@ -1,254 +0,0 @@
-import {
-  Button,
-  HorizontalDivider,
-  Loading,
-  Popover,
-  Sheet,
-  _s
-} from "./chunk-4BQ3AMVG.js";
-import {
-  Text
-} from "./chunk-BXBPZGSP.js";
-import {
-  ToastManager,
-  useRecordingHandler
-} from "./chunk-USEEH3QW.js";
-import {
-  Box,
-  Flex
-} from "./chunk-4L5OKEIV.js";
-import {
-  Tooltip,
-  formatTime,
-  useRoomLayoutConferencingScreen
-} from "./chunk-6BX3VCVC.js";
-import {
-  __async,
-  config,
-  init_define_process_env
-} from "./chunk-YDIB6WKJ.js";
-
-// src/Prebuilt/components/Header/StreamActions.tsx
-init_define_process_env();
-import React, { useCallback, useEffect, useRef, useState } from "react";
-import { useMedia } from "react-use";
-import {
-  HMSRoomState,
-  selectHLSState,
-  selectIsConnectedToRoom,
-  selectPermissions,
-  selectRecordingState,
-  selectRoomState,
-  useHMSActions,
-  useHMSStore,
-  useRecordingStreaming
-} from "@100mslive/react-sdk";
-import { AlertTriangleIcon, CrossIcon, PauseCircleIcon, RecordIcon } from "@100mslive/react-icons";
-var getRecordingText = ({
-  isBrowserRecordingOn,
-  isServerRecordingOn,
-  isHLSRecordingOn
-}, delimiter = ", ") => {
-  if (!isBrowserRecordingOn && !isServerRecordingOn && !isHLSRecordingOn) {
-    return "";
-  }
-  const title = [];
-  if (isBrowserRecordingOn) {
-    title.push("Browser");
-  }
-  if (isServerRecordingOn) {
-    title.push("Server");
-  }
-  if (isHLSRecordingOn) {
-    title.push("HLS");
-  }
-  return title.join(delimiter);
-};
-var LiveStatus = () => {
-  var _a;
-  const { isHLSRunning, isRTMPRunning } = useRecordingStreaming();
-  const hlsState = useHMSStore(selectHLSState);
-  const isMobile = useMedia(config.media.md);
-  const intervalRef = useRef(null);
-  const { screenType } = useRoomLayoutConferencingScreen();
-  const [liveTime, setLiveTime] = useState(0);
-  const startTimer = useCallback(() => {
-    intervalRef.current = setInterval(() => {
-      var _a2;
-      const timeStamp = (_a2 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _a2[screenType === "hls_live_streaming" ? "startedAt" : "initialisedAt"];
-      if ((hlsState == null ? void 0 : hlsState.running) && timeStamp) {
-        setLiveTime(Date.now() - timeStamp.getTime());
-      }
-    }, 1e3);
-  }, [hlsState == null ? void 0 : hlsState.running, hlsState == null ? void 0 : hlsState.variants, screenType]);
-  useEffect(() => {
-    if (hlsState == null ? void 0 : hlsState.running) {
-      startTimer();
-    }
-    if (!(hlsState == null ? void 0 : hlsState.running) && intervalRef.current) {
-      clearInterval(intervalRef.current);
-    }
-    return () => {
-      if (intervalRef.current) {
-        clearInterval(intervalRef.current);
-      }
-    };
-  }, [hlsState.running, isMobile, startTimer]);
-  if (!isHLSRunning && !isRTMPRunning) {
-    return null;
-  }
-  return /* @__PURE__ */ React.createElement(
-    Flex,
-    {
-      align: "center",
-      gap: "1",
-      css: {
-        border: "1px solid $border_default",
-        padding: "$4 $6 $4 $6",
-        borderRadius: "$1"
-      }
-    },
-    /* @__PURE__ */ React.createElement(Box, { css: { w: "$4", h: "$4", r: "$round", bg: "$alert_error_default", mr: "$2" } }),
-    /* @__PURE__ */ React.createElement(Flex, { align: "center", gap: "2" }, /* @__PURE__ */ React.createElement(Text, { variant: !isMobile ? "button" : "body2" }, "LIVE"), /* @__PURE__ */ React.createElement(Text, { variant: "caption" }, ((_a = hlsState == null ? void 0 : hlsState.variants) == null ? void 0 : _a.length) > 0 && isHLSRunning ? formatTime(liveTime) : ""))
-  );
-};
-var RecordingStatus = () => {
-  const { isBrowserRecordingOn, isServerRecordingOn, isHLSRecordingOn, isRecordingOn } = useRecordingStreaming();
-  const permissions = useHMSStore(selectPermissions);
-  const isMobile = useMedia(config.media.md);
-  if (!isRecordingOn || // if only browser recording is enabled, stop recording is shown
-  // so no need to show this as it duplicates
-  [permissions == null ? void 0 : permissions.browserRecording, !isServerRecordingOn, !isHLSRecordingOn, isBrowserRecordingOn].every(
-    (value) => !!value
-  )) {
-    if (!(isMobile && isRecordingOn))
-      return null;
-  }
-  return /* @__PURE__ */ React.createElement(
-    Tooltip,
-    {
-      boxCss: { zIndex: 1 },
-      title: getRecordingText({
-        isBrowserRecordingOn,
-        isServerRecordingOn,
-        isHLSRecordingOn
-      })
-    },
-    /* @__PURE__ */ React.createElement(
-      Flex,
-      {
-        css: {
-          color: "$alert_error_default",
-          alignItems: "center"
-        }
-      },
-      /* @__PURE__ */ React.createElement(RecordIcon, { width: 24, height: 24 })
-    )
-  );
-};
-var RecordingPauseStatus = () => {
-  const recording = useHMSStore(selectRecordingState);
-  if (recording.hls && recording.hls.state === _s.PAUSED) {
-    return /* @__PURE__ */ React.createElement(
-      Tooltip,
-      {
-        boxCss: { zIndex: 1 },
-        title: getRecordingText({
-          isBrowserRecordingOn: false,
-          isServerRecordingOn: false,
-          isHLSRecordingOn: true
-        })
-      },
-      /* @__PURE__ */ React.createElement(
-        Flex,
-        {
-          css: {
-            color: "$on_surface_high",
-            alignItems: "center"
-          }
-        },
-        /* @__PURE__ */ React.createElement(PauseCircleIcon, { width: 24, height: 24 })
-      )
-    );
-  }
-  return null;
-};
-var StartRecording = () => {
-  const permissions = useHMSStore(selectPermissions);
-  const [open, setOpen] = useState(false);
-  const { startRecording, recordingStarted } = useRecordingHandler();
-  const { isBrowserRecordingOn, isStreamingOn, isHLSRunning } = useRecordingStreaming();
-  const hmsActions = useHMSActions();
-  if (!(permissions == null ? void 0 : permissions.browserRecording) || isHLSRunning) {
-    return null;
-  }
-  if (isBrowserRecordingOn) {
-    return /* @__PURE__ */ React.createElement(Popover.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ React.createElement(Popover.Trigger, { asChild: true }, /* @__PURE__ */ React.createElement(Button, { variant: "danger", "data-testid": "stop_recording", icon: true, outlined: true, onClick: () => setOpen(true) }, /* @__PURE__ */ React.createElement(RecordIcon, null), /* @__PURE__ */ React.createElement(Text, { as: "span", css: { "@md": { display: "none" }, color: "currentColor" } }, "Stop Recording"))), /* @__PURE__ */ React.createElement(Popover.Portal, null, /* @__PURE__ */ React.createElement(Popover.Content, { align: "end", sideOffset: 8, css: { w: "$64" } }, /* @__PURE__ */ React.createElement(Text, { variant: "body1", css: { color: "$on_surface_medium" } }, "Are you sure you want to end the recording?"), /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        "data-testid": "stop_recording_confirm",
-        variant: "danger",
-        icon: true,
-        css: { ml: "auto" },
-        onClick: () => __async(void 0, null, function* () {
-          try {
-            yield hmsActions.stopRTMPAndRecording();
-          } catch (error) {
-            const err = error;
-            ToastManager.addToast({
-              title: err.message,
-              variant: "error"
-            });
-          }
-          setOpen(false);
-        })
-      },
-      "Stop"
-    ))));
-  }
-  return /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      "data-testid": "start_recording",
-      variant: "standard",
-      icon: true,
-      disabled: recordingStarted || isStreamingOn,
-      onClick: () => __async(void 0, null, function* () {
-        yield startRecording();
-      })
-    },
-    recordingStarted ? /* @__PURE__ */ React.createElement(Loading, { size: 24, color: "currentColor" }) : /* @__PURE__ */ React.createElement(RecordIcon, null),
-    /* @__PURE__ */ React.createElement(Text, { as: "span", css: { "@md": { display: "none" }, color: "currentColor" } }, recordingStarted ? "Starting" : "Start", " Recording")
-  );
-};
-var StreamActions = () => {
-  const isConnected = useHMSStore(selectIsConnectedToRoom);
-  const isMobile = useMedia(config.media.md);
-  const roomState = useHMSStore(selectRoomState);
-  return /* @__PURE__ */ React.createElement(Flex, { align: "center", css: { gap: "$4" } }, !isMobile && /* @__PURE__ */ React.createElement(Flex, { align: "center", css: { gap: "$4" } }, /* @__PURE__ */ React.createElement(RecordingPauseStatus, null), /* @__PURE__ */ React.createElement(RecordingStatus, null), roomState !== HMSRoomState.Preview ? /* @__PURE__ */ React.createElement(LiveStatus, null) : null), isConnected && !isMobile ? /* @__PURE__ */ React.createElement(StartRecording, null) : null);
-};
-var StopRecordingInSheet = ({
-  onStopRecording,
-  onClose
-}) => {
-  return /* @__PURE__ */ React.createElement(Sheet.Root, { open: true }, /* @__PURE__ */ React.createElement(Sheet.Content, null, /* @__PURE__ */ React.createElement(Sheet.Title, { css: { p: "$10" } }, /* @__PURE__ */ React.createElement(Flex, { direction: "row", justify: "between", css: { w: "100%", c: "$alert_error_default" } }, /* @__PURE__ */ React.createElement(Flex, { justify: "start", align: "center", gap: "3" }, /* @__PURE__ */ React.createElement(AlertTriangleIcon, null), /* @__PURE__ */ React.createElement(Text, { variant: "h5", css: { c: "$alert_error_default" } }, "Stop Recording")), /* @__PURE__ */ React.createElement(Sheet.Close, { css: { color: "white" }, onClick: onClose }, /* @__PURE__ */ React.createElement(CrossIcon, null)))), /* @__PURE__ */ React.createElement(HorizontalDivider, null), /* @__PURE__ */ React.createElement(Box, { as: "div", css: { p: "$10", overflowY: "scroll", maxHeight: "70vh" } }, /* @__PURE__ */ React.createElement(Text, { variant: "caption", css: { c: "$on_surface_medium", pb: "$8" } }, "Are you sure you want to stop recording? You can\u2019t undo this action."), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "danger",
-      css: { width: "100%" },
-      type: "submit",
-      "data-testid": "popup_change_btn",
-      onClick: onStopRecording
-    },
-    "Stop"
-  ))));
-};
-
-export {
-  LiveStatus,
-  RecordingStatus,
-  RecordingPauseStatus,
-  StreamActions,
-  StopRecordingInSheet
-};
-//# sourceMappingURL=chunk-KF2YEUWU.js.map

package/dist/chunk-KF2YEUWU.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/Prebuilt/components/Header/StreamActions.tsx"],
-  "sourcesContent": ["import React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { useMedia } from 'react-use';\nimport { HMSRecordingState } from '@100mslive/hms-video-store';\nimport {\n  HMSRoomState,\n  selectHLSState,\n  selectIsConnectedToRoom,\n  selectPermissions,\n  selectRecordingState,\n  selectRoomState,\n  useHMSActions,\n  useHMSStore,\n  useRecordingStreaming,\n} from '@100mslive/react-sdk';\nimport { AlertTriangleIcon, CrossIcon, PauseCircleIcon, RecordIcon } from '@100mslive/react-icons';\nimport { Box, Button, config as cssConfig, Flex, HorizontalDivider, Loading, Popover, Text, Tooltip } from '../../..';\nimport { Sheet } from '../../../Sheet';\n// @ts-ignore\nimport { ToastManager } from '../Toast/ToastManager';\nimport { useRoomLayoutConferencingScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';\nimport { useRecordingHandler } from '../../common/hooks';\n// @ts-ignore\nimport { formatTime } from '../../common/utils';\n\nexport const getRecordingText = (\n  {\n    isBrowserRecordingOn,\n    isServerRecordingOn,\n    isHLSRecordingOn,\n  }: { isBrowserRecordingOn: boolean; isServerRecordingOn: boolean; isHLSRecordingOn: boolean },\n  delimiter = ', ',\n) => {\n  if (!isBrowserRecordingOn && !isServerRecordingOn && !isHLSRecordingOn) {\n    return '';\n  }\n  const title: string[] = [];\n  if (isBrowserRecordingOn) {\n    title.push('Browser');\n  }\n  if (isServerRecordingOn) {\n    title.push('Server');\n  }\n  if (isHLSRecordingOn) {\n    title.push('HLS');\n  }\n  return title.join(delimiter);\n};\n\nexport const LiveStatus = () => {\n  const { isHLSRunning, isRTMPRunning } = useRecordingStreaming();\n  const hlsState = useHMSStore(selectHLSState);\n  const isMobile = useMedia(cssConfig.media.md);\n  const intervalRef = useRef<NodeJS.Timeout | null>(null);\n  const { screenType } = useRoomLayoutConferencingScreen();\n  const [liveTime, setLiveTime] = useState(0);\n\n  const startTimer = useCallback(() => {\n    intervalRef.current = setInterval(() => {\n      const timeStamp = hlsState?.variants[0]?.[screenType === 'hls_live_streaming' ? 'startedAt' : 'initialisedAt'];\n      if (hlsState?.running && timeStamp) {\n        setLiveTime(Date.now() - timeStamp.getTime());\n      }\n    }, 1000);\n  }, [hlsState?.running, hlsState?.variants, screenType]);\n\n  useEffect(() => {\n    if (hlsState?.running) {\n      startTimer();\n    }\n    if (!hlsState?.running && intervalRef.current) {\n      clearInterval(intervalRef.current);\n    }\n    return () => {\n      if (intervalRef.current) {\n        clearInterval(intervalRef.current);\n      }\n    };\n  }, [hlsState.running, isMobile, startTimer]);\n\n  if (!isHLSRunning && !isRTMPRunning) {\n    return null;\n  }\n  return (\n    <Flex\n      align=\"center\"\n      gap=\"1\"\n      css={{\n        border: '1px solid $border_default',\n        padding: '$4 $6 $4 $6',\n        borderRadius: '$1',\n      }}\n    >\n      <Box css={{ w: '$4', h: '$4', r: '$round', bg: '$alert_error_default', mr: '$2' }} />\n      <Flex align=\"center\" gap=\"2\">\n        <Text variant={!isMobile ? 'button' : 'body2'}>LIVE</Text>\n        <Text variant=\"caption\">{hlsState?.variants?.length > 0 && isHLSRunning ? formatTime(liveTime) : ''}</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nexport const RecordingStatus = () => {\n  const { isBrowserRecordingOn, isServerRecordingOn, isHLSRecordingOn, isRecordingOn } = useRecordingStreaming();\n  const permissions = useHMSStore(selectPermissions);\n  const isMobile = useMedia(cssConfig.media.md);\n\n  if (\n    !isRecordingOn ||\n    // if only browser recording is enabled, stop recording is shown\n    // so no need to show this as it duplicates\n    [permissions?.browserRecording, !isServerRecordingOn, !isHLSRecordingOn, isBrowserRecordingOn].every(\n      value => !!value,\n    )\n  ) {\n    // show recording icon in mobile without popover\n    if (!(isMobile && isRecordingOn)) return null;\n  }\n\n  return (\n    <Tooltip\n      boxCss={{ zIndex: 1 }}\n      title={getRecordingText({\n        isBrowserRecordingOn,\n        isServerRecordingOn,\n        isHLSRecordingOn,\n      })}\n    >\n      <Flex\n        css={{\n          color: '$alert_error_default',\n          alignItems: 'center',\n        }}\n      >\n        <RecordIcon width={24} height={24} />\n      </Flex>\n    </Tooltip>\n  );\n};\n\nexport const RecordingPauseStatus = () => {\n  const recording = useHMSStore(selectRecordingState);\n  if (recording.hls && recording.hls.state === HMSRecordingState.PAUSED) {\n    return (\n      <Tooltip\n        boxCss={{ zIndex: 1 }}\n        title={getRecordingText({\n          isBrowserRecordingOn: false,\n          isServerRecordingOn: false,\n          isHLSRecordingOn: true,\n        })}\n      >\n        <Flex\n          css={{\n            color: '$on_surface_high',\n            alignItems: 'center',\n          }}\n        >\n          <PauseCircleIcon width={24} height={24} />\n        </Flex>\n      </Tooltip>\n    );\n  }\n  return null;\n};\n\nconst StartRecording = () => {\n  const permissions = useHMSStore(selectPermissions);\n  const [open, setOpen] = useState(false);\n  const { startRecording, recordingStarted } = useRecordingHandler();\n  const { isBrowserRecordingOn, isStreamingOn, isHLSRunning } = useRecordingStreaming();\n  const hmsActions = useHMSActions();\n  if (!permissions?.browserRecording || isHLSRunning) {\n    return null;\n  }\n  if (isBrowserRecordingOn) {\n    return (\n      <Popover.Root open={open} onOpenChange={setOpen}>\n        <Popover.Trigger asChild>\n          <Button variant=\"danger\" data-testid=\"stop_recording\" icon outlined onClick={() => setOpen(true)}>\n            <RecordIcon />\n            <Text as=\"span\" css={{ '@md': { display: 'none' }, color: 'currentColor' }}>\n              Stop Recording\n            </Text>\n          </Button>\n        </Popover.Trigger>\n        <Popover.Portal>\n          <Popover.Content align=\"end\" sideOffset={8} css={{ w: '$64' }}>\n            <Text variant=\"body1\" css={{ color: '$on_surface_medium' }}>\n              Are you sure you want to end the recording?\n            </Text>\n            <Button\n              data-testid=\"stop_recording_confirm\"\n              variant=\"danger\"\n              icon\n              css={{ ml: 'auto' }}\n              onClick={async () => {\n                try {\n                  await hmsActions.stopRTMPAndRecording();\n                } catch (error) {\n                  const err = error as Error;\n                  ToastManager.addToast({\n                    title: err.message,\n                    variant: 'error',\n                  });\n                }\n                setOpen(false);\n              }}\n            >\n              Stop\n            </Button>\n          </Popover.Content>\n        </Popover.Portal>\n      </Popover.Root>\n    );\n  }\n  return (\n    <Button\n      data-testid=\"start_recording\"\n      variant=\"standard\"\n      icon\n      disabled={recordingStarted || isStreamingOn}\n      onClick={async () => {\n        await startRecording();\n      }}\n    >\n      {recordingStarted ? <Loading size={24} color=\"currentColor\" /> : <RecordIcon />}\n      <Text as=\"span\" css={{ '@md': { display: 'none' }, color: 'currentColor' }}>\n        {recordingStarted ? 'Starting' : 'Start'} Recording\n      </Text>\n    </Button>\n  );\n};\n\n/**\n * @description only start recording button will be shown.\n */\nexport const StreamActions = () => {\n  const isConnected = useHMSStore(selectIsConnectedToRoom);\n  const isMobile = useMedia(cssConfig.media.md);\n  const roomState = useHMSStore(selectRoomState);\n\n  return (\n    <Flex align=\"center\" css={{ gap: '$4' }}>\n      {!isMobile && (\n        <Flex align=\"center\" css={{ gap: '$4' }}>\n          <RecordingPauseStatus />\n          <RecordingStatus />\n          {roomState !== HMSRoomState.Preview ? <LiveStatus /> : null}\n        </Flex>\n      )}\n      {isConnected && !isMobile ? <StartRecording /> : null}\n    </Flex>\n  );\n};\n\nexport const StopRecordingInSheet = ({\n  onStopRecording,\n  onClose,\n}: {\n  onStopRecording: () => void;\n  onClose: () => void;\n}) => {\n  return (\n    <Sheet.Root open={true}>\n      <Sheet.Content>\n        <Sheet.Title css={{ p: '$10' }}>\n          <Flex direction=\"row\" justify=\"between\" css={{ w: '100%', c: '$alert_error_default' }}>\n            <Flex justify=\"start\" align=\"center\" gap=\"3\">\n              <AlertTriangleIcon />\n              <Text variant=\"h5\" css={{ c: '$alert_error_default' }}>\n                Stop Recording\n              </Text>\n            </Flex>\n            <Sheet.Close css={{ color: 'white' }} onClick={onClose}>\n              <CrossIcon />\n            </Sheet.Close>\n          </Flex>\n        </Sheet.Title>\n        <HorizontalDivider />\n        <Box as=\"div\" css={{ p: '$10', overflowY: 'scroll', maxHeight: '70vh' }}>\n          <Text variant=\"caption\" css={{ c: '$on_surface_medium', pb: '$8' }}>\n            Are you sure you want to stop recording? You can\u2019t undo this action.\n          </Text>\n          <Button\n            variant=\"danger\"\n            css={{ width: '100%' }}\n            type=\"submit\"\n            data-testid=\"popup_change_btn\"\n            onClick={onStopRecording}\n          >\n            Stop\n          </Button>\n        </Box>\n      </Sheet.Content>\n    </Sheet.Root>\n  );\n};\n"],
-  "mappings": "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",
-  "names": ["_a"]
-}

package/dist/chunk-KQXTIHI6.js

@@ -1,59 +0,0 @@
-import {
-  useVideoTileContext
-} from "./chunk-B3HHL3ND.js";
-import {
-  VideoTile_default
-} from "./chunk-4BQ3AMVG.js";
-import {
-  Box
-} from "./chunk-4L5OKEIV.js";
-import {
-  __spreadValues,
-  init_define_process_env
-} from "./chunk-YDIB6WKJ.js";
-
-// src/Prebuilt/components/VideoLayouts/Grid.tsx
-init_define_process_env();
-import React from "react";
-var Grid = React.forwardRef(
-  ({ tiles, edgeToEdge }, ref) => {
-    const videoTileProps = useVideoTileContext();
-    return /* @__PURE__ */ React.createElement(
-      Box,
-      {
-        ref,
-        css: {
-          flex: "1 1 0",
-          gap: "$4",
-          display: "flex",
-          placeContent: "center",
-          alignItems: "center",
-          justifyContent: "center",
-          flexFlow: "row wrap",
-          minHeight: 0,
-          "@md": { gap: edgeToEdge ? 0 : "$4" }
-        }
-      },
-      tiles == null ? void 0 : tiles.map((tile) => {
-        var _a, _b, _c, _d;
-        return /* @__PURE__ */ React.createElement(
-          VideoTile_default,
-          __spreadValues({
-            key: ((_a = tile.track) == null ? void 0 : _a.id) || ((_b = tile.peer) == null ? void 0 : _b.id),
-            width: tile.width,
-            height: tile.height,
-            peerId: (_c = tile.peer) == null ? void 0 : _c.id,
-            trackId: (_d = tile.track) == null ? void 0 : _d.id,
-            rootCSS: { padding: 0 },
-            objectFit: "contain"
-          }, videoTileProps)
-        );
-      })
-    );
-  }
-);
-
-export {
-  Grid
-};
-//# sourceMappingURL=chunk-KQXTIHI6.js.map

package/dist/chunk-KQXTIHI6.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/Prebuilt/components/VideoLayouts/Grid.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport { TrackWithPeerAndDimensions } from '@100mslive/react-sdk';\nimport { Box } from '../../../Layout';\n// @ts-ignore: No implicit Any\nimport VideoTile from '../VideoTile';\nimport { useVideoTileContext } from '../hooks/useVideoTileLayout';\n\nexport const Grid = React.forwardRef<HTMLDivElement, { tiles: TrackWithPeerAndDimensions[]; edgeToEdge?: boolean }>(\n  ({ tiles, edgeToEdge }, ref) => {\n    const videoTileProps = useVideoTileContext();\n    return (\n      <Box\n        ref={ref}\n        css={{\n          flex: '1 1 0',\n          gap: '$4',\n          display: 'flex',\n          placeContent: 'center',\n          alignItems: 'center',\n          justifyContent: 'center',\n          flexFlow: 'row wrap',\n          minHeight: 0,\n          '@md': { gap: edgeToEdge ? 0 : '$4' },\n        }}\n      >\n        {tiles?.map(tile => {\n          return (\n            <VideoTile\n              key={tile.track?.id || tile.peer?.id}\n              width={tile.width}\n              height={tile.height}\n              peerId={tile.peer?.id}\n              trackId={tile.track?.id}\n              rootCSS={{ padding: 0 }}\n              objectFit=\"contain\"\n              {...videoTileProps}\n            />\n          );\n        })}\n      </Box>\n    );\n  },\n);\n"],
-  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA,OAAO,WAAW;AAOX,IAAM,OAAO,MAAM;AAAA,EACxB,CAAC,EAAE,OAAO,WAAW,GAAG,QAAQ;AAC9B,UAAM,iBAAiB,oBAAoB;AAC3C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,KAAK;AAAA,UACH,MAAM;AAAA,UACN,KAAK;AAAA,UACL,SAAS;AAAA,UACT,cAAc;AAAA,UACd,YAAY;AAAA,UACZ,gBAAgB;AAAA,UAChB,UAAU;AAAA,UACV,WAAW;AAAA,UACX,OAAO,EAAE,KAAK,aAAa,IAAI,KAAK;AAAA,QACtC;AAAA;AAAA,MAEC,+BAAO,IAAI,UAAQ;AAzB5B;AA0BU,eACE;AAAA,UAAC;AAAA;AAAA,YACC,OAAK,UAAK,UAAL,mBAAY,SAAM,UAAK,SAAL,mBAAW;AAAA,YAClC,OAAO,KAAK;AAAA,YACZ,QAAQ,KAAK;AAAA,YACb,SAAQ,UAAK,SAAL,mBAAW;AAAA,YACnB,UAAS,UAAK,UAAL,mBAAY;AAAA,YACrB,SAAS,EAAE,SAAS,EAAE;AAAA,YACtB,WAAU;AAAA,aACN;AAAA,QACN;AAAA,MAEJ;AAAA,IACF;AAAA,EAEJ;AACF;",
-  "names": []
-}