@100mslive/roomkit-react 0.3.23-alpha.0 → 0.3.24-alpha.0

package/dist/WaitingView-NZIUOXBI.js

@@ -0,0 +1,10 @@
+import {
+  WaitingView
+} from "./chunk-REL3HBSD.js";
+import "./chunk-MUKUP7JU.js";
+import "./chunk-GOXRTCTY.js";
+import "./chunk-GLAJUP3O.js";
+export {
+  WaitingView
+};
+//# sourceMappingURL=WaitingView-NZIUOXBI.js.map

package/dist/WaitingView-NZIUOXBI.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/WhiteboardLayout-4YLFM3EY.js

@@ -0,0 +1,96 @@
+import {
+  InsetTile
+} from "./chunk-YEL5ZTFU.js";
+import {
+  ProminenceLayout,
+  SecondaryTiles
+} from "./chunk-HVYTC3PX.js";
+import "./chunk-P6NV2XO4.js";
+import {
+  LayoutMode
+} from "./chunk-MG3UGW66.js";
+import "./chunk-MUKUP7JU.js";
+import "./chunk-DANANDDE.js";
+import {
+  Box
+} from "./chunk-GOXRTCTY.js";
+import {
+  useSetUiSettings
+} from "./chunk-BGSYLCVD.js";
+import {
+  UI_SETTINGS,
+  config,
+  init_define_process_env
+} from "./chunk-GLAJUP3O.js";
+
+// src/Prebuilt/components/VideoLayouts/WhiteboardLayout.tsx
+init_define_process_env();
+import React, { useEffect, useMemo } from "react";
+import { useMedia } from "react-use";
+import { Whiteboard } from "@100mslive/hms-whiteboard";
+import { selectPeerByCondition, selectWhiteboard, useHMSStore, useWhiteboard } from "@100mslive/react-sdk";
+var WhiteboardEmbed = () => {
+  const isMobile = useMedia(config.media.md);
+  const { token, endpoint, zoomToContent } = useWhiteboard(isMobile);
+  if (!token) {
+    return null;
+  }
+  return /* @__PURE__ */ React.createElement(
+    Box,
+    {
+      css: {
+        mx: "$8",
+        flex: "3 1 0",
+        "@lg": {
+          flex: "2 1 0",
+          display: "flex",
+          alignItems: "center"
+        }
+      }
+    },
+    /* @__PURE__ */ React.createElement(Box, { css: { size: "100%" } }, /* @__PURE__ */ React.createElement(Whiteboard, { token, endpoint: `https://${endpoint}`, zoomToContent }))
+  );
+};
+var WhiteboardLayout = ({ peers, onPageChange, onPageSize, edgeToEdge }) => {
+  const whiteboard = useHMSStore(selectWhiteboard);
+  const whiteboardOwner = useHMSStore(selectPeerByCondition((peer) => peer.customerUserId === (whiteboard == null ? void 0 : whiteboard.owner)));
+  const [layoutMode, setLayoutMode] = useSetUiSettings(UI_SETTINGS.layoutMode);
+  const isMobile = useMedia(config.media.md);
+  const hasSidebar = !isMobile && layoutMode === LayoutMode.SIDEBAR;
+  const secondaryPeers = useMemo(() => {
+    if (layoutMode === LayoutMode.SPOTLIGHT) {
+      return [];
+    }
+    if (isMobile || layoutMode === LayoutMode.SIDEBAR) {
+      return whiteboardOwner ? [whiteboardOwner, ...peers.filter((p) => p.id !== (whiteboardOwner == null ? void 0 : whiteboardOwner.id))] : peers;
+    }
+    return peers.filter((p) => p.id !== (whiteboardOwner == null ? void 0 : whiteboardOwner.id));
+  }, [whiteboardOwner, peers, isMobile, layoutMode]);
+  useEffect(() => {
+    if (isMobile) {
+      setLayoutMode(LayoutMode.GALLERY);
+      return;
+    }
+    if (layoutMode === LayoutMode.SIDEBAR) {
+      return;
+    }
+    setLayoutMode(LayoutMode.SIDEBAR);
+    return () => {
+      setLayoutMode(LayoutMode.GALLERY);
+    };
+  }, [isMobile]);
+  return /* @__PURE__ */ React.createElement(ProminenceLayout.Root, { edgeToEdge, hasSidebar }, /* @__PURE__ */ React.createElement(ProminenceLayout.ProminentSection, null, /* @__PURE__ */ React.createElement(WhiteboardEmbed, null)), /* @__PURE__ */ React.createElement(
+    SecondaryTiles,
+    {
+      peers: secondaryPeers,
+      onPageChange,
+      onPageSize,
+      edgeToEdge,
+      hasSidebar
+    }
+  ), layoutMode === LayoutMode.SPOTLIGHT && whiteboardOwner && /* @__PURE__ */ React.createElement(InsetTile, { peerId: whiteboardOwner == null ? void 0 : whiteboardOwner.id }));
+};
+export {
+  WhiteboardLayout
+};
+//# sourceMappingURL=WhiteboardLayout-4YLFM3EY.js.map

package/dist/WhiteboardLayout-4YLFM3EY.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/Prebuilt/components/VideoLayouts/WhiteboardLayout.tsx"],
+  "sourcesContent": ["import React, { useEffect, useMemo } from 'react';\nimport { useMedia } from 'react-use';\nimport { Whiteboard } from '@100mslive/hms-whiteboard';\nimport { selectPeerByCondition, selectWhiteboard, useHMSStore, useWhiteboard } from '@100mslive/react-sdk';\nimport { Box } from '../../../Layout';\nimport { config as cssConfig } from '../../../Theme';\nimport { InsetTile } from '../InsetTile';\nimport { SecondaryTiles } from '../SecondaryTiles';\nimport { LayoutMode } from '../Settings/LayoutSettings';\nimport { LayoutProps } from './interface';\nimport { ProminenceLayout } from './ProminenceLayout';\n// @ts-ignore: No implicit Any\nimport { useSetUiSettings } from '../AppData/useUISettings';\nimport { UI_SETTINGS } from '../../common/constants';\n// eslint-disable-next-line import/no-unresolved\nimport '@100mslive/hms-whiteboard/index.css';\n\nconst WhiteboardEmbed = () => {\n  const isMobile = useMedia(cssConfig.media.md);\n  const { token, endpoint, zoomToContent } = useWhiteboard(isMobile);\n\n  if (!token) {\n    return null;\n  }\n\n  return (\n    <Box\n      css={{\n        mx: '$8',\n        flex: '3 1 0',\n        '@lg': {\n          flex: '2 1 0',\n          display: 'flex',\n          alignItems: 'center',\n        },\n      }}\n    >\n      <Box css={{ size: '100%' }}>\n        <Whiteboard token={token} endpoint={`https://${endpoint}`} zoomToContent={zoomToContent} />\n      </Box>\n    </Box>\n  );\n};\n\nexport const WhiteboardLayout = ({ peers, onPageChange, onPageSize, edgeToEdge }: LayoutProps) => {\n  const whiteboard = useHMSStore(selectWhiteboard);\n  const whiteboardOwner = useHMSStore(selectPeerByCondition(peer => peer.customerUserId === whiteboard?.owner));\n  const [layoutMode, setLayoutMode] = useSetUiSettings(UI_SETTINGS.layoutMode);\n  const isMobile = useMedia(cssConfig.media.md);\n  const hasSidebar = !isMobile && layoutMode === LayoutMode.SIDEBAR;\n  const secondaryPeers = useMemo(() => {\n    if (layoutMode === LayoutMode.SPOTLIGHT) {\n      return [];\n    }\n    if (isMobile || layoutMode === LayoutMode.SIDEBAR) {\n      return whiteboardOwner\n        ? [whiteboardOwner, ...peers.filter(p => p.id !== whiteboardOwner?.id)] //keep active sharing peer as first tile\n        : peers;\n    }\n    return peers.filter(p => p.id !== whiteboardOwner?.id);\n  }, [whiteboardOwner, peers, isMobile, layoutMode]);\n\n  useEffect(() => {\n    if (isMobile) {\n      setLayoutMode(LayoutMode.GALLERY);\n      return;\n    }\n    if (layoutMode === LayoutMode.SIDEBAR) {\n      return;\n    }\n    setLayoutMode(LayoutMode.SIDEBAR);\n    return () => {\n      // reset to gallery once whiteboard is stopped\n      setLayoutMode(LayoutMode.GALLERY);\n    };\n  }, [isMobile]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <ProminenceLayout.Root edgeToEdge={edgeToEdge} hasSidebar={hasSidebar}>\n      <ProminenceLayout.ProminentSection>\n        <WhiteboardEmbed />\n      </ProminenceLayout.ProminentSection>\n      <SecondaryTiles\n        peers={secondaryPeers}\n        onPageChange={onPageChange}\n        onPageSize={onPageSize}\n        edgeToEdge={edgeToEdge}\n        hasSidebar={hasSidebar}\n      />\n      {layoutMode === LayoutMode.SPOTLIGHT && whiteboardOwner && <InsetTile peerId={whiteboardOwner?.id} />}\n    </ProminenceLayout.Root>\n  );\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,OAAO,SAAS,WAAW,eAAe;AAC1C,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB,kBAAkB,aAAa,qBAAqB;AAcpF,IAAM,kBAAkB,MAAM;AAC5B,QAAM,WAAW,SAAS,OAAU,MAAM,EAAE;AAC5C,QAAM,EAAE,OAAO,UAAU,cAAc,IAAI,cAAc,QAAQ;AAEjE,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,QACH,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,UACL,MAAM;AAAA,UACN,SAAS;AAAA,UACT,YAAY;AAAA,QACd;AAAA,MACF;AAAA;AAAA,IAEA,oCAAC,OAAI,KAAK,EAAE,MAAM,OAAO,KACvB,oCAAC,cAAW,OAAc,UAAU,WAAW,QAAQ,IAAI,eAA8B,CAC3F;AAAA,EACF;AAEJ;AAEO,IAAM,mBAAmB,CAAC,EAAE,OAAO,cAAc,YAAY,WAAW,MAAmB;AAChG,QAAM,aAAa,YAAY,gBAAgB;AAC/C,QAAM,kBAAkB,YAAY,sBAAsB,UAAQ,KAAK,oBAAmB,yCAAY,MAAK,CAAC;AAC5G,QAAM,CAAC,YAAY,aAAa,IAAI,iBAAiB,YAAY,UAAU;AAC3E,QAAM,WAAW,SAAS,OAAU,MAAM,EAAE;AAC5C,QAAM,aAAa,CAAC,YAAY,eAAe,WAAW;AAC1D,QAAM,iBAAiB,QAAQ,MAAM;AACnC,QAAI,eAAe,WAAW,WAAW;AACvC,aAAO,CAAC;AAAA,IACV;AACA,QAAI,YAAY,eAAe,WAAW,SAAS;AACjD,aAAO,kBACH,CAAC,iBAAiB,GAAG,MAAM,OAAO,OAAK,EAAE,QAAO,mDAAiB,GAAE,CAAC,IACpE;AAAA,IACN;AACA,WAAO,MAAM,OAAO,OAAK,EAAE,QAAO,mDAAiB,GAAE;AAAA,EACvD,GAAG,CAAC,iBAAiB,OAAO,UAAU,UAAU,CAAC;AAEjD,YAAU,MAAM;AACd,QAAI,UAAU;AACZ,oBAAc,WAAW,OAAO;AAChC;AAAA,IACF;AACA,QAAI,eAAe,WAAW,SAAS;AACrC;AAAA,IACF;AACA,kBAAc,WAAW,OAAO;AAChC,WAAO,MAAM;AAEX,oBAAc,WAAW,OAAO;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,SACE,oCAAC,iBAAiB,MAAjB,EAAsB,YAAwB,cAC7C,oCAAC,iBAAiB,kBAAjB,MACC,oCAAC,qBAAgB,CACnB,GACA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF,GACC,eAAe,WAAW,aAAa,mBAAmB,oCAAC,aAAU,QAAQ,mDAAiB,IAAI,CACrG;AAEJ;",
+  "names": []
+}