From 6ec259a0e71174651bae95d4628138bf6fd68742 Mon Sep 17 00:00:00 2001
From: kj_sh604
Date: Sun, 15 Mar 2026 16:19:35 -0400
Subject: refactor: packages/

---
 .../LiveCollaborationTrigger.tsx                   | 42 ++++++++++++++++++++++
 1 file changed, 42 insertions(+)
 create mode 100644 packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx

(limited to 'packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx')

diff --git a/packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx b/packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx
new file mode 100644
index 0000000..a22bc52
--- /dev/null
+++ b/packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx
@@ -0,0 +1,42 @@
+import { t } from "../../i18n";
+import { share } from "../icons";
+import { Button } from "../Button";
+
+import clsx from "clsx";
+
+import "./LiveCollaborationTrigger.scss";
+import { useUIAppState } from "../../context/ui-appState";
+
+const LiveCollaborationTrigger = ({
+  isCollaborating,
+  onSelect,
+  ...rest
+}: {
+  isCollaborating: boolean;
+  onSelect: () => void;
+} & React.ButtonHTMLAttributes<HTMLButtonElement>) => {
+  const appState = useUIAppState();
+
+  const showIconOnly = appState.width < 830;
+
+  return (
+    <Button
+      {...rest}
+      className={clsx("collab-button", { active: isCollaborating })}
+      type="button"
+      onSelect={onSelect}
+      style={{ position: "relative", width: showIconOnly ? undefined : "auto" }}
+      title={t("labels.liveCollaboration")}
+    >
+      {showIconOnly ? share : t("labels.share")}
+      {appState.collaborators.size > 0 && (
+        <div className="CollabButton-collaborators">
+          {appState.collaborators.size}
+        </div>
+      )}
+    </Button>
+  );
+};
+
+export default LiveCollaborationTrigger;
+LiveCollaborationTrigger.displayName = "LiveCollaborationTrigger";
-- 
cgit v1.2.3