@conference-kit/ui-react 0.0.3 → 0.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,13 @@
1
+ import type { FC } from "react";
2
+ export type ChatMessage = {
3
+ id: string;
4
+ direction: "in" | "out";
5
+ text: string;
6
+ };
7
+ export type ChatPanelProps = {
8
+ messages: ChatMessage[];
9
+ ready: boolean;
10
+ onSend: (text: string) => void;
11
+ };
12
+ export declare const ChatPanel: FC<ChatPanelProps>;
13
+ //# sourceMappingURL=ChatPanel.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChatPanel.d.ts","sourceRoot":"","sources":["../src/ChatPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAe,EAAE,EAAa,MAAM,OAAO,CAAC;AAIxD,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,IAAI,GAAG,KAAK,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAqExC,CAAC"}
@@ -0,0 +1,19 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useState } from "react";
3
+ import { ChatIcon } from "./icons";
4
+ export const ChatPanel = ({ messages, ready, onSend, }) => {
5
+ const [text, setText] = useState("ping");
6
+ const submit = (e) => {
7
+ e.preventDefault();
8
+ if (!text.trim())
9
+ return;
10
+ onSend(text.trim());
11
+ setText("");
12
+ };
13
+ return (_jsxs("div", { className: "bg-slate-900 border border-slate-800 rounded-xl p-4 grid gap-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2 text-slate-100 font-semibold", children: [_jsx(ChatIcon, { className: "h-5 w-5" }), " Data Channel"] }), _jsx("span", { className: `text-xs px-2 py-1 rounded-full ${ready
14
+ ? "bg-emerald-100 text-emerald-800"
15
+ : "bg-slate-200 text-slate-700"}`, children: ready ? "Open" : "Closed" })] }), _jsxs("form", { className: "flex gap-2", onSubmit: submit, children: [_jsx("input", { className: "flex-1 rounded-lg border border-slate-700 bg-slate-950 px-3 py-2 text-slate-100", value: text, onChange: (e) => setText(e.target.value), placeholder: "Message" }), _jsx("button", { type: "submit", disabled: !ready, className: "px-3 py-2 rounded-lg bg-emerald-600 text-slate-50 font-semibold disabled:opacity-50", children: "Send" })] }), _jsxs("div", { className: "max-h-64 overflow-auto grid gap-2", children: [messages.length === 0 && (_jsx("div", { className: "text-slate-400 text-sm", children: "No messages yet" })), messages.map((msg) => (_jsxs("div", { className: `flex items-center justify-between rounded-lg px-3 py-2 border ${msg.direction === "in"
16
+ ? "bg-slate-800 border-slate-700"
17
+ : "bg-emerald-50 border-emerald-200"}`, children: [_jsx("span", { className: "text-sm text-slate-100", children: msg.text }), _jsx("span", { className: "text-xs text-slate-500", children: msg.direction === "in" ? "In" : "Out" })] }, msg.id)))] })] }));
18
+ };
19
+ //# sourceMappingURL=ChatPanel.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChatPanel.js","sourceRoot":"","sources":["../src/ChatPanel.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAcnC,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,EAC5C,QAAQ,EACR,KAAK,EACL,MAAM,GACS,EAAE,EAAE;IACnB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC;IAEzC,MAAM,MAAM,GAAG,CAAC,CAAY,EAAE,EAAE;QAC9B,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YAAE,OAAO;QACzB,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;QACpB,OAAO,CAAC,EAAE,CAAC,CAAC;IACd,CAAC,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,gEAAgE,aAC7E,eAAK,SAAS,EAAC,mCAAmC,aAChD,eAAK,SAAS,EAAC,sDAAsD,aACnE,KAAC,QAAQ,IAAC,SAAS,EAAC,SAAS,GAAG,qBAC5B,EACN,eACE,SAAS,EAAE,kCACT,KAAK;4BACH,CAAC,CAAC,iCAAiC;4BACnC,CAAC,CAAC,6BACN,EAAE,YAED,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,GACrB,IACH,EACN,gBAAM,SAAS,EAAC,YAAY,EAAC,QAAQ,EAAE,MAAM,aAC3C,gBACE,SAAS,EAAC,iFAAiF,EAC3F,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAgC,EAAE,EAAE,CAC7C,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAEzB,WAAW,EAAC,SAAS,GACrB,EACF,iBACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,KAAK,EAChB,SAAS,EAAC,qFAAqF,qBAGxF,IACJ,EACP,eAAK,SAAS,EAAC,mCAAmC,aAC/C,QAAQ,CAAC,MAAM,KAAK,CAAC,IAAI,CACxB,cAAK,SAAS,EAAC,wBAAwB,gCAAsB,CAC9D,EACA,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACrB,eAEE,SAAS,EAAE,iEACT,GAAG,CAAC,SAAS,KAAK,IAAI;4BACpB,CAAC,CAAC,+BAA+B;4BACjC,CAAC,CAAC,kCACN,EAAE,aAEF,eAAM,SAAS,EAAC,wBAAwB,YAAE,GAAG,CAAC,IAAI,GAAQ,EAC1D,eAAM,SAAS,EAAC,wBAAwB,YACrC,GAAG,CAAC,SAAS,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,GACjC,KAVF,GAAG,CAAC,EAAE,CAWP,CACP,CAAC,IACE,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,6 @@
1
+ import type { FC } from "react";
2
+ import type { ConnectionStatus } from "./types";
3
+ export declare const ConnectionBadge: FC<{
4
+ status: ConnectionStatus;
5
+ }>;
6
+ //# sourceMappingURL=ConnectionBadge.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ConnectionBadge.d.ts","sourceRoot":"","sources":["../src/ConnectionBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEhD,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC;IAAE,MAAM,EAAE,gBAAgB,CAAA;CAAE,CAwC5D,CAAC"}
@@ -0,0 +1,17 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { SignalIcon, WifiOffIcon } from "./icons";
3
+ export const ConnectionBadge = ({ status, }) => {
4
+ const signalTone = status.signaling === "open"
5
+ ? "bg-emerald-100 text-emerald-800"
6
+ : "bg-amber-100 text-amber-800";
7
+ const mediaTone = status.media === "ready"
8
+ ? "bg-emerald-100 text-emerald-800"
9
+ : status.media === "requesting"
10
+ ? "bg-amber-100 text-amber-800"
11
+ : "bg-slate-200 text-slate-700";
12
+ const dataTone = status.data === "ready"
13
+ ? "bg-emerald-100 text-emerald-800"
14
+ : "bg-slate-200 text-slate-700";
15
+ return (_jsxs("div", { className: "flex flex-wrap gap-2 text-sm", children: [_jsxs("span", { className: `inline-flex items-center gap-1 rounded-full px-2.5 py-1 ${signalTone}`, children: [_jsx(SignalIcon, { className: "h-4 w-4" }), "Signal ", status.signaling ?? "idle"] }), _jsxs("span", { className: `inline-flex items-center gap-1 rounded-full px-2.5 py-1 ${mediaTone}`, children: [_jsx(WifiOffIcon, { className: "h-4 w-4" }), "Media ", status.media ?? "off"] }), _jsxs("span", { className: `inline-flex items-center gap-1 rounded-full px-2.5 py-1 ${dataTone}`, children: [_jsx(SignalIcon, { className: "h-4 w-4" }), "Data ", status.data ?? "idle"] })] }));
16
+ };
17
+ //# sourceMappingURL=ConnectionBadge.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ConnectionBadge.js","sourceRoot":"","sources":["../src/ConnectionBadge.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGlD,MAAM,CAAC,MAAM,eAAe,GAAqC,CAAC,EAChE,MAAM,GACP,EAAE,EAAE;IACH,MAAM,UAAU,GACd,MAAM,CAAC,SAAS,KAAK,MAAM;QACzB,CAAC,CAAC,iCAAiC;QACnC,CAAC,CAAC,6BAA6B,CAAC;IACpC,MAAM,SAAS,GACb,MAAM,CAAC,KAAK,KAAK,OAAO;QACtB,CAAC,CAAC,iCAAiC;QACnC,CAAC,CAAC,MAAM,CAAC,KAAK,KAAK,YAAY;YAC/B,CAAC,CAAC,6BAA6B;YAC/B,CAAC,CAAC,6BAA6B,CAAC;IACpC,MAAM,QAAQ,GACZ,MAAM,CAAC,IAAI,KAAK,OAAO;QACrB,CAAC,CAAC,iCAAiC;QACnC,CAAC,CAAC,6BAA6B,CAAC;IAEpC,OAAO,CACL,eAAK,SAAS,EAAC,8BAA8B,aAC3C,gBACE,SAAS,EAAE,2DAA2D,UAAU,EAAE,aAElF,KAAC,UAAU,IAAC,SAAS,EAAC,SAAS,GAAG,aAC1B,MAAM,CAAC,SAAS,IAAI,MAAM,IAC7B,EACP,gBACE,SAAS,EAAE,2DAA2D,SAAS,EAAE,aAEjF,KAAC,WAAW,IAAC,SAAS,EAAC,SAAS,GAAG,YAC5B,MAAM,CAAC,KAAK,IAAI,KAAK,IACvB,EACP,gBACE,SAAS,EAAE,2DAA2D,QAAQ,EAAE,aAEhF,KAAC,UAAU,IAAC,SAAS,EAAC,SAAS,GAAG,WAC5B,MAAM,CAAC,IAAI,IAAI,MAAM,IACtB,IACH,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,17 @@
1
+ import type { FC, ReactNode } from "react";
2
+ export type ControlBarProps = {
3
+ joined?: boolean;
4
+ mediaReady?: boolean;
5
+ audioMuted?: boolean;
6
+ videoMuted?: boolean;
7
+ screenSharing?: boolean;
8
+ onJoin?: () => void;
9
+ onLeave?: () => void;
10
+ onToggleAudio?: () => void;
11
+ onToggleVideo?: () => void;
12
+ onToggleScreen?: () => void;
13
+ onReset?: () => void;
14
+ extraRight?: ReactNode;
15
+ };
16
+ export declare const ControlBar: FC<ControlBarProps>;
17
+ //# sourceMappingURL=ControlBar.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ControlBar.d.ts","sourceRoot":"","sources":["../src/ControlBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG3C,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB,CAAC;AAKF,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAkE1C,CAAC"}
@@ -0,0 +1,7 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { ChatIcon, MicIcon, PhoneIcon, ScreenIcon, VideoIcon } from "./icons";
3
+ const buttonBase = "inline-flex items-center gap-2 rounded-lg px-3 py-2 text-sm font-semibold border transition";
4
+ export const ControlBar = ({ joined, mediaReady, audioMuted, videoMuted, screenSharing, onJoin, onLeave, onToggleAudio, onToggleVideo, onToggleScreen, onReset, extraRight, }) => {
5
+ return (_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3 bg-slate-900 border border-slate-800 rounded-xl px-4 py-3", children: [_jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsxs("button", { className: `${buttonBase} border-emerald-500 text-emerald-100 bg-emerald-600/80 hover:bg-emerald-600`, disabled: joined, onClick: onJoin, children: [_jsx(VideoIcon, { className: "h-4 w-4" }), " Join"] }), _jsxs("button", { className: `${buttonBase} border-slate-700 text-slate-100 bg-slate-800 hover:bg-slate-700`, disabled: !joined, onClick: onLeave, children: [_jsx(PhoneIcon, { className: "h-4 w-4" }), " Leave"] }), _jsxs("button", { className: `${buttonBase} border-slate-700 text-slate-100 bg-slate-800 hover:bg-slate-700`, disabled: !joined || !mediaReady, onClick: onToggleAudio, children: [_jsx(MicIcon, { className: "h-4 w-4" }), " ", audioMuted ? "Unmute" : "Mute"] }), _jsxs("button", { className: `${buttonBase} border-slate-700 text-slate-100 bg-slate-800 hover:bg-slate-700`, disabled: !joined || !mediaReady, onClick: onToggleVideo, children: [_jsx(VideoIcon, { className: "h-4 w-4" }), " ", videoMuted ? "Start video" : "Stop video"] }), _jsxs("button", { className: `${buttonBase} border-slate-700 text-slate-100 bg-slate-800 hover:bg-slate-700`, disabled: !joined, onClick: onToggleScreen, children: [_jsx(ScreenIcon, { className: "h-4 w-4" }), " ", screenSharing ? "Stop share" : "Share screen"] }), _jsxs("button", { className: `${buttonBase} border-slate-700 text-slate-300 hover:bg-slate-800`, onClick: onReset, children: [_jsx(ChatIcon, { className: "h-4 w-4" }), " Reset"] })] }), extraRight ? (_jsx("div", { className: "flex items-center gap-2", children: extraRight })) : null] }));
6
+ };
7
+ //# sourceMappingURL=ControlBar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ControlBar.js","sourceRoot":"","sources":["../src/ControlBar.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAiB9E,MAAM,UAAU,GACd,6FAA6F,CAAC;AAEhG,MAAM,CAAC,MAAM,UAAU,GAAwB,CAAC,EAC9C,MAAM,EACN,UAAU,EACV,UAAU,EACV,UAAU,EACV,aAAa,EACb,MAAM,EACN,OAAO,EACP,aAAa,EACb,aAAa,EACb,cAAc,EACd,OAAO,EACP,UAAU,GACM,EAAE,EAAE;IACpB,OAAO,CACL,eAAK,SAAS,EAAC,6GAA6G,aAC1H,eAAK,SAAS,EAAC,sBAAsB,aACnC,kBACE,SAAS,EAAE,GAAG,UAAU,6EAA6E,EACrG,QAAQ,EAAE,MAAM,EAChB,OAAO,EAAE,MAAM,aAEf,KAAC,SAAS,IAAC,SAAS,EAAC,SAAS,GAAG,aAC1B,EACT,kBACE,SAAS,EAAE,GAAG,UAAU,kEAAkE,EAC1F,QAAQ,EAAE,CAAC,MAAM,EACjB,OAAO,EAAE,OAAO,aAEhB,KAAC,SAAS,IAAC,SAAS,EAAC,SAAS,GAAG,cAC1B,EACT,kBACE,SAAS,EAAE,GAAG,UAAU,kEAAkE,EAC1F,QAAQ,EAAE,CAAC,MAAM,IAAI,CAAC,UAAU,EAChC,OAAO,EAAE,aAAa,aAEtB,KAAC,OAAO,IAAC,SAAS,EAAC,SAAS,GAAG,OAAE,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,IACxD,EACT,kBACE,SAAS,EAAE,GAAG,UAAU,kEAAkE,EAC1F,QAAQ,EAAE,CAAC,MAAM,IAAI,CAAC,UAAU,EAChC,OAAO,EAAE,aAAa,aAEtB,KAAC,SAAS,IAAC,SAAS,EAAC,SAAS,GAAG,EAAC,GAAG,EACpC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,IACnC,EACT,kBACE,SAAS,EAAE,GAAG,UAAU,kEAAkE,EAC1F,QAAQ,EAAE,CAAC,MAAM,EACjB,OAAO,EAAE,cAAc,aAEvB,KAAC,UAAU,IAAC,SAAS,EAAC,SAAS,GAAG,EAAC,GAAG,EACrC,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc,IACvC,EACT,kBACE,SAAS,EAAE,GAAG,UAAU,qDAAqD,EAC7E,OAAO,EAAE,OAAO,aAEhB,KAAC,QAAQ,IAAC,SAAS,EAAC,SAAS,GAAG,cACzB,IACL,EACL,UAAU,CAAC,CAAC,CAAC,CACZ,cAAK,SAAS,EAAC,yBAAyB,YAAE,UAAU,GAAO,CAC5D,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,6 @@
1
+ import type { FC } from "react";
2
+ import type { ParticipantView } from "./types";
3
+ export declare const ParticipantGrid: FC<{
4
+ participants: ParticipantView[];
5
+ }>;
6
+ //# sourceMappingURL=ParticipantGrid.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ParticipantGrid.d.ts","sourceRoot":"","sources":["../src/ParticipantGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAG/C,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC;IAAE,YAAY,EAAE,eAAe,EAAE,CAAA;CAAE,CAanE,CAAC"}
@@ -0,0 +1,6 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { ParticipantTile } from "./ParticipantTile";
3
+ export const ParticipantGrid = ({ participants, }) => {
4
+ return (_jsxs("div", { className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-3", children: [participants.map((p) => (_jsx(ParticipantTile, { participant: p }, p.id))), participants.length === 0 && (_jsx("div", { className: "text-slate-400 text-sm", children: "Waiting for participants\u2026" }))] }));
5
+ };
6
+ //# sourceMappingURL=ParticipantGrid.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ParticipantGrid.js","sourceRoot":"","sources":["../src/ParticipantGrid.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,MAAM,CAAC,MAAM,eAAe,GAA4C,CAAC,EACvE,YAAY,GACb,EAAE,EAAE;IACH,OAAO,CACL,eAAK,SAAS,EAAC,0CAA0C,aACtD,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACvB,KAAC,eAAe,IAAY,WAAW,EAAE,CAAC,IAApB,CAAC,CAAC,EAAE,CAAoB,CAC/C,CAAC,EACD,YAAY,CAAC,MAAM,KAAK,CAAC,IAAI,CAC5B,cAAK,SAAS,EAAC,wBAAwB,+CAAgC,CACxE,IACG,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,6 @@
1
+ import type { FC } from "react";
2
+ import type { ParticipantView } from "./types";
3
+ export declare const ParticipantTile: FC<{
4
+ participant: ParticipantView;
5
+ }>;
6
+ //# sourceMappingURL=ParticipantTile.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ParticipantTile.d.ts","sourceRoot":"","sources":["../src/ParticipantTile.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC;IAAE,WAAW,EAAE,eAAe,CAAA;CAAE,CA8ChE,CAAC"}
@@ -0,0 +1,14 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ export const ParticipantTile = ({ participant, }) => {
3
+ return (_jsxs("div", { className: "bg-slate-900 border border-slate-800 rounded-xl p-3 grid gap-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-2 text-sm text-slate-200", children: [_jsx("div", { className: "font-semibold truncate", children: participant.label ?? participant.id }), _jsx("span", { className: "text-xs text-slate-400", children: participant.connectionState ?? "new" })] }), _jsx("video", { className: "w-full aspect-video rounded-lg bg-slate-950", muted: participant.isLocal, autoPlay: true, playsInline: true, ref: (el) => {
4
+ if (!el)
5
+ return;
6
+ if (participant.stream && el.srcObject !== participant.stream) {
7
+ el.srcObject = participant.stream;
8
+ }
9
+ if (!participant.stream && el.srcObject) {
10
+ el.srcObject = null;
11
+ }
12
+ } }), _jsxs("div", { className: "flex items-center gap-3 text-xs text-slate-400", children: [_jsx("span", { className: participant.mutedAudio ? "text-amber-400" : "text-emerald-300", children: participant.mutedAudio ? "Audio muted" : "Audio on" }), _jsx("span", { className: participant.mutedVideo ? "text-amber-400" : "text-emerald-300", children: participant.mutedVideo ? "Video muted" : "Video on" })] })] }));
13
+ };
14
+ //# sourceMappingURL=ParticipantTile.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ParticipantTile.js","sourceRoot":"","sources":["../src/ParticipantTile.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,MAAM,eAAe,GAAyC,CAAC,EACpE,WAAW,GACZ,EAAE,EAAE;IACH,OAAO,CACL,eAAK,SAAS,EAAC,gEAAgE,aAC7E,eAAK,SAAS,EAAC,gEAAgE,aAC7E,cAAK,SAAS,EAAC,wBAAwB,YACpC,WAAW,CAAC,KAAK,IAAI,WAAW,CAAC,EAAE,GAChC,EACN,eAAM,SAAS,EAAC,wBAAwB,YACrC,WAAW,CAAC,eAAe,IAAI,KAAK,GAChC,IACH,EACN,gBACE,SAAS,EAAC,6CAA6C,EACvD,KAAK,EAAE,WAAW,CAAC,OAAO,EAC1B,QAAQ,QACR,WAAW,QACX,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE;oBACV,IAAI,CAAC,EAAE;wBAAE,OAAO;oBAChB,IAAI,WAAW,CAAC,MAAM,IAAI,EAAE,CAAC,SAAS,KAAK,WAAW,CAAC,MAAM,EAAE,CAAC;wBAC9D,EAAE,CAAC,SAAS,GAAG,WAAW,CAAC,MAAM,CAAC;oBACpC,CAAC;oBACD,IAAI,CAAC,WAAW,CAAC,MAAM,IAAI,EAAE,CAAC,SAAS,EAAE,CAAC;wBACxC,EAAE,CAAC,SAAS,GAAG,IAAI,CAAC;oBACtB,CAAC;gBACH,CAAC,GACD,EACF,eAAK,SAAS,EAAC,gDAAgD,aAC7D,eACE,SAAS,EACP,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,kBAAkB,YAG/D,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,GAC/C,EACP,eACE,SAAS,EACP,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,kBAAkB,YAG/D,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,GAC/C,IACH,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,7 @@
1
+ import type { FC } from "react";
2
+ import type { RosterEntry } from "./types";
3
+ export declare const RosterList: FC<{
4
+ roster: RosterEntry[];
5
+ selfId?: string;
6
+ }>;
7
+ //# sourceMappingURL=RosterList.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"RosterList.d.ts","sourceRoot":"","sources":["../src/RosterList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC;IAAE,MAAM,EAAE,WAAW,EAAE,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,CA8BrE,CAAC"}
@@ -0,0 +1,10 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ export const RosterList = ({ roster, selfId, }) => {
3
+ return (_jsxs("div", { className: "grid gap-2", children: [roster.length === 0 && (_jsx("div", { className: "text-slate-400 text-sm", children: "No peers joined yet" })), roster.map((entry) => {
4
+ const tone = entry.id === selfId
5
+ ? "bg-emerald-100 text-emerald-900"
6
+ : "bg-slate-800 text-slate-200";
7
+ return (_jsxs("div", { className: `flex items-center justify-between rounded-lg border border-slate-800 px-3 py-2 ${tone}`, children: [_jsx("span", { className: "font-semibold truncate", children: entry.label ?? entry.id }), _jsx("span", { className: "text-xs opacity-80", children: entry.id === selfId ? "You" : entry.status ?? "Peer" })] }, entry.id));
8
+ })] }));
9
+ };
10
+ //# sourceMappingURL=RosterList.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"RosterList.js","sourceRoot":"","sources":["../src/RosterList.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,MAAM,UAAU,GAAmD,CAAC,EACzE,MAAM,EACN,MAAM,GACP,EAAE,EAAE;IACH,OAAO,CACL,eAAK,SAAS,EAAC,YAAY,aACxB,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,CACtB,cAAK,SAAS,EAAC,wBAAwB,oCAA0B,CAClE,EACA,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;gBACpB,MAAM,IAAI,GACR,KAAK,CAAC,EAAE,KAAK,MAAM;oBACjB,CAAC,CAAC,iCAAiC;oBACnC,CAAC,CAAC,6BAA6B,CAAC;gBACpC,OAAO,CACL,eAEE,SAAS,EAAE,kFAAkF,IAAI,EAAE,aAEnG,eAAM,SAAS,EAAC,wBAAwB,YACrC,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,EAAE,GACnB,EACP,eAAM,SAAS,EAAC,oBAAoB,YACjC,KAAK,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,MAAM,GAChD,KARF,KAAK,CAAC,EAAE,CAST,CACP,CAAC;YACJ,CAAC,CAAC,IACE,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,9 @@
1
+ import type { SVGProps } from "react";
2
+ export declare const VideoIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
3
+ export declare const MicIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
4
+ export declare const PhoneIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
5
+ export declare const ScreenIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
6
+ export declare const ChatIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
7
+ export declare const SignalIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
8
+ export declare const WifiOffIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
9
+ //# sourceMappingURL=icons.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../src/icons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,SAAS,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,4CAWvD,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,4CAYrD,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,4CAUvD,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,4CAWxD,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,4CAUtD,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,4CAUxD,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,4CAUzD,CAAC"}
package/dist/icons.js ADDED
@@ -0,0 +1,9 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ export const VideoIcon = (props) => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", ...props, children: [_jsx("path", { d: "M3 7.5A2.5 2.5 0 0 1 5.5 5h7A2.5 2.5 0 0 1 15 7.5v9A2.5 2.5 0 0 1 12.5 19h-7A2.5 2.5 0 0 1 3 16.5v-9Z" }), _jsx("path", { d: "M15 10.5 20.5 7v10l-5.5-3V10.5Z" })] }));
3
+ export const MicIcon = (props) => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", ...props, children: [_jsx("rect", { x: "7", y: "4", width: "10", height: "12", rx: "3" }), _jsx("path", { d: "M5 11v1a7 7 0 0 0 14 0v-1" }), _jsx("path", { d: "M12 19v2" })] }));
4
+ export const PhoneIcon = (props) => (_jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", ...props, children: _jsx("path", { d: "M5 4h4l1.5 4-2 1a10 10 0 0 0 5.5 5.5l1-2L19 15v4a2 2 0 0 1-2 2 14 14 0 0 1-14-14 2 2 0 0 1 2-2Z" }) }));
5
+ export const ScreenIcon = (props) => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", ...props, children: [_jsx("rect", { x: "3", y: "5", width: "18", height: "12", rx: "2" }), _jsx("path", { d: "M8 19h8" })] }));
6
+ export const ChatIcon = (props) => (_jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", ...props, children: _jsx("path", { d: "M5 5h14a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H9l-4 3v-5H5a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2Z" }) }));
7
+ export const SignalIcon = (props) => (_jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", ...props, children: _jsx("path", { d: "M4 18h2v-4H4v4Zm5 0h2V8H9v10Zm5 0h2V4h-2v14Zm5 0h2v-7h-2v7Z" }) }));
8
+ export const WifiOffIcon = (props) => (_jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", ...props, children: _jsx("path", { d: "m3 3 18 18M7.5 7.1A13 13 0 0 1 12 6c1.9 0 3.7.4 5.4 1.2M5 10.2A10 10 0 0 1 12 8c1.6 0 3.2.3 4.6 1M7 13.3A7 7 0 0 1 12 12c1.4 0 2.6.3 3.8.9M9.5 16.4A3.5 3.5 0 0 1 12 16c.5 0 1 .1 1.5.3" }) }));
9
+ //# sourceMappingURL=icons.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icons.js","sourceRoot":"","sources":["../src/icons.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CAC3D,eACE,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,KACb,KAAK,aAET,eAAM,CAAC,EAAC,uGAAuG,GAAG,EAClH,eAAM,CAAC,EAAC,iCAAiC,GAAG,IACxC,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CACzD,eACE,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,KACb,KAAK,aAET,eAAM,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,GAAG,EAClD,eAAM,CAAC,EAAC,2BAA2B,GAAG,EACtC,eAAM,CAAC,EAAC,UAAU,GAAG,IACjB,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CAC3D,cACE,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,KACb,KAAK,YAET,eAAM,CAAC,EAAC,iGAAiG,GAAG,GACxG,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CAC5D,eACE,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,KACb,KAAK,aAET,eAAM,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,GAAG,EAClD,eAAM,CAAC,EAAC,SAAS,GAAG,IAChB,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CAC1D,cACE,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,KACb,KAAK,YAET,eAAM,CAAC,EAAC,kFAAkF,GAAG,GACzF,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CAC5D,cACE,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,KACb,KAAK,YAET,eAAM,CAAC,EAAC,6DAA6D,GAAG,GACpE,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CAC7D,cACE,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,KACb,KAAK,YAET,eAAM,CAAC,EAAC,yLAAyL,GAAG,GAChM,CACP,CAAC"}
@@ -0,0 +1,9 @@
1
+ export * from "./types";
2
+ export * from "./ConnectionBadge";
3
+ export * from "./ParticipantTile";
4
+ export * from "./ParticipantGrid";
5
+ export * from "./RosterList";
6
+ export * from "./ControlBar";
7
+ export * from "./ChatPanel";
8
+ export * from "./icons";
9
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,9 @@
1
+ export * from "./types";
2
+ export * from "./ConnectionBadge";
3
+ export * from "./ParticipantTile";
4
+ export * from "./ParticipantGrid";
5
+ export * from "./RosterList";
6
+ export * from "./ControlBar";
7
+ export * from "./ChatPanel";
8
+ export * from "./icons";
9
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC"}
@@ -0,0 +1,29 @@
1
+ export type ParticipantView = {
2
+ id: string;
3
+ label?: string;
4
+ stream?: MediaStream | null;
5
+ connectionState?: RTCPeerConnectionState;
6
+ iceState?: RTCIceConnectionState;
7
+ mutedAudio?: boolean;
8
+ mutedVideo?: boolean;
9
+ isLocal?: boolean;
10
+ };
11
+ export type RosterEntry = {
12
+ id: string;
13
+ label?: string;
14
+ status?: "self" | "peer" | "connecting";
15
+ };
16
+ export type ControlHandlers = {
17
+ onJoin?: () => void;
18
+ onLeave?: () => void;
19
+ onMuteAudio?: (mute: boolean) => void;
20
+ onMuteVideo?: (mute: boolean) => void;
21
+ onScreenShare?: (enable: boolean) => void;
22
+ onReset?: () => void;
23
+ };
24
+ export type ConnectionStatus = {
25
+ signaling?: "idle" | "connecting" | "open" | "closed";
26
+ media?: "off" | "requesting" | "ready";
27
+ data?: "idle" | "ready";
28
+ };
29
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,eAAe,GAAG;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,eAAe,CAAC,EAAE,sBAAsB,CAAC;IACzC,QAAQ,CAAC,EAAE,qBAAqB,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,YAAY,CAAC;CACzC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC1C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,MAAM,GAAG,QAAQ,CAAC;IACtD,KAAK,CAAC,EAAE,KAAK,GAAG,YAAY,GAAG,OAAO,CAAC;IACvC,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CACzB,CAAC"}
package/dist/types.js ADDED
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@conference-kit/ui-react",
3
- "version": "0.0.3",
3
+ "version": "0.0.4",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",
@@ -19,8 +19,8 @@
19
19
  "tailwindcss": ">=3.4.0"
20
20
  },
21
21
  "dependencies": {
22
- "@conference-kit/react": "^0.0.3",
23
- "@conference-kit/core": "^0.0.3"
22
+ "@conference-kit/react": "^0.0.4",
23
+ "@conference-kit/core": "^0.0.4"
24
24
  },
25
25
  "devDependencies": {
26
26
  "@types/react": "^18.3.27",