@cellarnode/ui 0.12.1 → 0.12.2
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.
- package/dist/chat/connection-banner.d.ts +7 -0
- package/dist/chat/connection-banner.d.ts.map +1 -0
- package/dist/chat/connection-banner.js +19 -0
- package/dist/chat/connection-banner.js.map +1 -0
- package/dist/chat/delivery-indicator.d.ts +12 -0
- package/dist/chat/delivery-indicator.d.ts.map +1 -0
- package/dist/chat/delivery-indicator.js +28 -0
- package/dist/chat/delivery-indicator.js.map +1 -0
- package/dist/chat/delivery-indicator.stories.d.ts +23 -0
- package/dist/chat/delivery-indicator.stories.d.ts.map +1 -0
- package/dist/chat/delivery-indicator.stories.js +27 -0
- package/dist/chat/delivery-indicator.stories.js.map +1 -0
- package/dist/chat/typing-indicator.d.ts +6 -0
- package/dist/chat/typing-indicator.d.ts.map +1 -0
- package/dist/chat/typing-indicator.js +11 -0
- package/dist/chat/typing-indicator.js.map +1 -0
- package/dist/chat/typing-indicator.stories.d.ts +15 -0
- package/dist/chat/typing-indicator.stories.d.ts.map +1 -0
- package/dist/chat/typing-indicator.stories.js +17 -0
- package/dist/chat/typing-indicator.stories.js.map +1 -0
- package/dist/chat/use-connection-status.d.ts +3 -0
- package/dist/chat/use-connection-status.d.ts.map +1 -0
- package/dist/chat/use-connection-status.js +7 -0
- package/dist/chat/use-connection-status.js.map +1 -0
- package/dist/chat/use-tab-title-badge.d.ts +2 -0
- package/dist/chat/use-tab-title-badge.d.ts.map +1 -0
- package/dist/chat/use-tab-title-badge.js +15 -0
- package/dist/chat/use-tab-title-badge.js.map +1 -0
- package/package.json +1 -1
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export type ConnectionBannerState = "reconnecting" | "offline" | "connected";
|
|
2
|
+
interface ConnectionBannerProps {
|
|
3
|
+
state: ConnectionBannerState;
|
|
4
|
+
}
|
|
5
|
+
export declare function ConnectionBanner({ state }: ConnectionBannerProps): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export {};
|
|
7
|
+
//# sourceMappingURL=connection-banner.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"connection-banner.d.ts","sourceRoot":"","sources":["../../src/chat/connection-banner.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,qBAAqB,GAAG,cAAc,GAAG,SAAS,GAAG,WAAW,CAAC;AAE7E,UAAU,qBAAqB;IAC7B,KAAK,EAAE,qBAAqB,CAAC;CAC9B;AAID,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,EAAE,qBAAqB,2CA8ChE"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useState } from "react";
|
|
3
|
+
import { AnimatePresence, motion } from "motion/react";
|
|
4
|
+
import { Loader2, Wifi, WifiOff } from "lucide-react";
|
|
5
|
+
const AUTO_DISMISS_MS = 3000;
|
|
6
|
+
export function ConnectionBanner({ state }) {
|
|
7
|
+
const [showConnected, setShowConnected] = useState(false);
|
|
8
|
+
useEffect(() => {
|
|
9
|
+
if (state === "connected") {
|
|
10
|
+
setShowConnected(true);
|
|
11
|
+
const timer = setTimeout(() => setShowConnected(false), AUTO_DISMISS_MS);
|
|
12
|
+
return () => clearTimeout(timer);
|
|
13
|
+
}
|
|
14
|
+
setShowConnected(false);
|
|
15
|
+
}, [state]);
|
|
16
|
+
const visible = state === "reconnecting" || state === "offline" || showConnected;
|
|
17
|
+
return (_jsx(AnimatePresence, { children: visible && (_jsxs(motion.div, { initial: { height: 0, opacity: 0 }, animate: { height: "auto", opacity: 1 }, exit: { height: 0, opacity: 0 }, transition: { duration: 0.2, ease: "easeInOut" }, className: "overflow-hidden", children: [state === "reconnecting" && (_jsxs("div", { className: "flex items-center gap-2 border-t border-amber-500/20 bg-amber-50 px-4 py-2 text-xs text-amber-700 dark:bg-amber-950/30 dark:text-amber-300", children: [_jsx(Loader2, { className: "size-3.5 shrink-0 animate-spin" }), "Reconnecting to live updates..."] })), state === "offline" && (_jsxs("div", { className: "flex items-center gap-2 border-t border-red-500/20 bg-red-50 px-4 py-2 text-xs text-red-700 dark:bg-red-950/30 dark:text-red-300", children: [_jsx(WifiOff, { className: "size-3.5 shrink-0" }), "You are offline. Messages will be sent when you reconnect."] })), showConnected && state === "connected" && (_jsxs("div", { className: "flex items-center gap-2 border-t border-green-500/20 bg-green-50 px-4 py-2 text-xs text-green-700 dark:bg-green-950/30 dark:text-green-300", children: [_jsx(Wifi, { className: "size-3.5 shrink-0" }), "Back online!"] }))] })) }));
|
|
18
|
+
}
|
|
19
|
+
//# sourceMappingURL=connection-banner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"connection-banner.js","sourceRoot":"","sources":["../../src/chat/connection-banner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAQtD,MAAM,eAAe,GAAG,IAAI,CAAC;AAE7B,MAAM,UAAU,gBAAgB,CAAC,EAAE,KAAK,EAAyB;IAC/D,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,KAAK,WAAW,EAAE,CAAC;YAC1B,gBAAgB,CAAC,IAAI,CAAC,CAAC;YACvB,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,eAAe,CAAC,CAAC;YACzE,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC;QACD,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,OAAO,GAAG,KAAK,KAAK,cAAc,IAAI,KAAK,KAAK,SAAS,IAAI,aAAa,CAAC;IAEjF,OAAO,CACL,KAAC,eAAe,cACb,OAAO,IAAI,CACV,MAAC,MAAM,CAAC,GAAG,IACT,OAAO,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EAClC,OAAO,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,EAAE,EACvC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EAC/B,UAAU,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,WAAW,EAAE,EAChD,SAAS,EAAC,iBAAiB,aAE1B,KAAK,KAAK,cAAc,IAAI,CAC3B,eAAK,SAAS,EAAC,4IAA4I,aACzJ,KAAC,OAAO,IAAC,SAAS,EAAC,gCAAgC,GAAG,uCAElD,CACP,EACA,KAAK,KAAK,SAAS,IAAI,CACtB,eAAK,SAAS,EAAC,kIAAkI,aAC/I,KAAC,OAAO,IAAC,SAAS,EAAC,mBAAmB,GAAG,kEAErC,CACP,EACA,aAAa,IAAI,KAAK,KAAK,WAAW,IAAI,CACzC,eAAK,SAAS,EAAC,4IAA4I,aACzJ,KAAC,IAAI,IAAC,SAAS,EAAC,mBAAmB,GAAG,oBAElC,CACP,IACU,CACd,GACe,CACnB,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export type DeliveryStatus = "sending" | "sent" | "delivered" | "read";
|
|
2
|
+
interface DeliveryIndicatorProps {
|
|
3
|
+
status: DeliveryStatus;
|
|
4
|
+
}
|
|
5
|
+
export declare function DeliveryIndicator({ status }: DeliveryIndicatorProps): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare function getDeliveryStatus(message: {
|
|
7
|
+
id: string;
|
|
8
|
+
readBy?: string[] | null;
|
|
9
|
+
deliveredTo?: string[] | null;
|
|
10
|
+
}, counterpartyOrgId: string | null): DeliveryStatus;
|
|
11
|
+
export {};
|
|
12
|
+
//# sourceMappingURL=delivery-indicator.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"delivery-indicator.d.ts","sourceRoot":"","sources":["../../src/chat/delivery-indicator.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,CAAC;AAEvE,UAAU,sBAAsB;IAC9B,MAAM,EAAE,cAAc,CAAC;CACxB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,EAAE,sBAAsB,2CAuCnE;AAED,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE;IACP,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;CAC/B,EACD,iBAAiB,EAAE,MAAM,GAAG,IAAI,GAC/B,cAAc,CAOhB"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { motion } from "motion/react";
|
|
3
|
+
import { Check, CheckCheck, Clock } from "lucide-react";
|
|
4
|
+
export function DeliveryIndicator({ status }) {
|
|
5
|
+
if (status === "sending") {
|
|
6
|
+
return (_jsx(Clock, { className: "size-3 text-muted-foreground/50", "aria-label": "Sending" }));
|
|
7
|
+
}
|
|
8
|
+
if (status === "sent") {
|
|
9
|
+
return (_jsx(Check, { className: "size-3 text-muted-foreground/60", "aria-label": "Sent" }));
|
|
10
|
+
}
|
|
11
|
+
return (_jsx(motion.span, { className: "inline-flex", initial: status === "read"
|
|
12
|
+
? { color: "var(--color-muted-foreground)" }
|
|
13
|
+
: false, animate: {
|
|
14
|
+
color: status === "read"
|
|
15
|
+
? "var(--color-primary)"
|
|
16
|
+
: "var(--color-muted-foreground)",
|
|
17
|
+
}, transition: { duration: 0.3 }, children: _jsx(CheckCheck, { className: "size-3", "aria-label": status === "read" ? "Read" : "Delivered" }) }));
|
|
18
|
+
}
|
|
19
|
+
export function getDeliveryStatus(message, counterpartyOrgId) {
|
|
20
|
+
if (message.id.startsWith("optimistic:"))
|
|
21
|
+
return "sending";
|
|
22
|
+
if (counterpartyOrgId && message.readBy?.includes(counterpartyOrgId))
|
|
23
|
+
return "read";
|
|
24
|
+
if (counterpartyOrgId && message.deliveredTo?.includes(counterpartyOrgId))
|
|
25
|
+
return "delivered";
|
|
26
|
+
return "sent";
|
|
27
|
+
}
|
|
28
|
+
//# sourceMappingURL=delivery-indicator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"delivery-indicator.js","sourceRoot":"","sources":["../../src/chat/delivery-indicator.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAQxD,MAAM,UAAU,iBAAiB,CAAC,EAAE,MAAM,EAA0B;IAClE,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;QACzB,OAAO,CACL,KAAC,KAAK,IACJ,SAAS,EAAC,iCAAiC,gBAChC,SAAS,GACpB,CACH,CAAC;IACJ,CAAC;IACD,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;QACtB,OAAO,CACL,KAAC,KAAK,IACJ,SAAS,EAAC,iCAAiC,gBAChC,MAAM,GACjB,CACH,CAAC;IACJ,CAAC;IACD,OAAO,CACL,KAAC,MAAM,CAAC,IAAI,IACV,SAAS,EAAC,aAAa,EACvB,OAAO,EACL,MAAM,KAAK,MAAM;YACf,CAAC,CAAC,EAAE,KAAK,EAAE,+BAA+B,EAAE;YAC5C,CAAC,CAAC,KAAK,EAEX,OAAO,EAAE;YACP,KAAK,EACH,MAAM,KAAK,MAAM;gBACf,CAAC,CAAC,sBAAsB;gBACxB,CAAC,CAAC,+BAA+B;SACtC,EACD,UAAU,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,YAE7B,KAAC,UAAU,IACT,SAAS,EAAC,QAAQ,gBACN,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,GACpD,GACU,CACf,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,iBAAiB,CAC/B,OAIC,EACD,iBAAgC;IAEhC,IAAI,OAAO,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC;QAAE,OAAO,SAAS,CAAC;IAC3D,IAAI,iBAAiB,IAAI,OAAO,CAAC,MAAM,EAAE,QAAQ,CAAC,iBAAiB,CAAC;QAClE,OAAO,MAAM,CAAC;IAChB,IAAI,iBAAiB,IAAI,OAAO,CAAC,WAAW,EAAE,QAAQ,CAAC,iBAAiB,CAAC;QACvE,OAAO,WAAW,CAAC;IACrB,OAAO,MAAM,CAAC;AAChB,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import type { StoryObj } from "@storybook/react-vite";
|
|
2
|
+
import { DeliveryIndicator } from "./delivery-indicator";
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: typeof DeliveryIndicator;
|
|
6
|
+
tags: string[];
|
|
7
|
+
parameters: {
|
|
8
|
+
layout: string;
|
|
9
|
+
};
|
|
10
|
+
argTypes: {
|
|
11
|
+
status: {
|
|
12
|
+
control: "select";
|
|
13
|
+
options: string[];
|
|
14
|
+
};
|
|
15
|
+
};
|
|
16
|
+
};
|
|
17
|
+
export default meta;
|
|
18
|
+
type Story = StoryObj<typeof meta>;
|
|
19
|
+
export declare const Sending: Story;
|
|
20
|
+
export declare const Sent: Story;
|
|
21
|
+
export declare const Delivered: Story;
|
|
22
|
+
export declare const Read: Story;
|
|
23
|
+
//# sourceMappingURL=delivery-indicator.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"delivery-indicator.stories.d.ts","sourceRoot":"","sources":["../../src/chat/delivery-indicator.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,QAAA,MAAM,IAAI;;;;;;;;;;;;;CAWgC,CAAC;AAE3C,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAElB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAEvB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAElB,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { DeliveryIndicator } from "./delivery-indicator";
|
|
2
|
+
const meta = {
|
|
3
|
+
title: "Chat/DeliveryIndicator",
|
|
4
|
+
component: DeliveryIndicator,
|
|
5
|
+
tags: ["autodocs"],
|
|
6
|
+
parameters: { layout: "padded" },
|
|
7
|
+
argTypes: {
|
|
8
|
+
status: {
|
|
9
|
+
control: "select",
|
|
10
|
+
options: ["sending", "sent", "delivered", "read"],
|
|
11
|
+
},
|
|
12
|
+
},
|
|
13
|
+
};
|
|
14
|
+
export default meta;
|
|
15
|
+
export const Sending = {
|
|
16
|
+
args: { status: "sending" },
|
|
17
|
+
};
|
|
18
|
+
export const Sent = {
|
|
19
|
+
args: { status: "sent" },
|
|
20
|
+
};
|
|
21
|
+
export const Delivered = {
|
|
22
|
+
args: { status: "delivered" },
|
|
23
|
+
};
|
|
24
|
+
export const Read = {
|
|
25
|
+
args: { status: "read" },
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=delivery-indicator.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"delivery-indicator.stories.js","sourceRoot":"","sources":["../../src/chat/delivery-indicator.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,iBAAiB;IAC5B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE;IAChC,QAAQ,EAAE;QACR,MAAM,EAAE;YACN,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,CAAC;SAClD;KACF;CACuC,CAAC;AAE3C,eAAe,IAAI,CAAC;AAGpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE;CAC5B,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAU;IACzB,IAAI,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE;CACzB,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE;CAC9B,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAU;IACzB,IAAI,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE;CACzB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"typing-indicator.d.ts","sourceRoot":"","sources":["../../src/chat/typing-indicator.tsx"],"names":[],"mappings":"AAEA,UAAU,oBAAoB;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,EAAE,UAAU,EAAE,EAAE,oBAAoB,2CAyBnE"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { motion } from "motion/react";
|
|
3
|
+
export function TypingIndicator({ senderName }) {
|
|
4
|
+
return (_jsxs("div", { className: "mt-3 flex items-end gap-2 self-start", children: [_jsx("div", { className: "surface-card flex items-center gap-1.5 rounded-[20px] rounded-bl-xs px-4 py-3", children: [0, 1, 2].map((i) => (_jsx(motion.span, { className: "size-1.5 rounded-full bg-muted-foreground/60", animate: { scale: [0.6, 1, 0.6], opacity: [0.4, 1, 0.4] }, transition: {
|
|
5
|
+
duration: 1.2,
|
|
6
|
+
repeat: Infinity,
|
|
7
|
+
delay: i * 0.15,
|
|
8
|
+
ease: "easeInOut",
|
|
9
|
+
} }, i))) }), senderName && (_jsx("span", { className: "pb-0.5 text-[10px] text-muted-foreground", children: senderName }))] }));
|
|
10
|
+
}
|
|
11
|
+
//# sourceMappingURL=typing-indicator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"typing-indicator.js","sourceRoot":"","sources":["../../src/chat/typing-indicator.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAMtC,MAAM,UAAU,eAAe,CAAC,EAAE,UAAU,EAAwB;IAClE,OAAO,CACL,eAAK,SAAS,EAAC,sCAAsC,aACnD,cAAK,SAAS,EAAC,+EAA+E,YAC3F,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACpB,KAAC,MAAM,CAAC,IAAI,IAEV,SAAS,EAAC,8CAA8C,EACxD,OAAO,EAAE,EAAE,KAAK,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,OAAO,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,EACzD,UAAU,EAAE;wBACV,QAAQ,EAAE,GAAG;wBACb,MAAM,EAAE,QAAQ;wBAChB,KAAK,EAAE,CAAC,GAAG,IAAI;wBACf,IAAI,EAAE,WAAW;qBAClB,IARI,CAAC,CASN,CACH,CAAC,GACE,EACL,UAAU,IAAI,CACb,eAAM,SAAS,EAAC,0CAA0C,YACvD,UAAU,GACN,CACR,IACG,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { StoryObj } from "@storybook/react-vite";
|
|
2
|
+
import { TypingIndicator } from "./typing-indicator";
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: typeof TypingIndicator;
|
|
6
|
+
tags: string[];
|
|
7
|
+
parameters: {
|
|
8
|
+
layout: string;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
export default meta;
|
|
12
|
+
type Story = StoryObj<typeof meta>;
|
|
13
|
+
export declare const Default: Story;
|
|
14
|
+
export declare const WithSenderName: Story;
|
|
15
|
+
//# sourceMappingURL=typing-indicator.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"typing-indicator.stories.d.ts","sourceRoot":"","sources":["../../src/chat/typing-indicator.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,QAAA,MAAM,IAAI;;;;;;;CAK8B,CAAC;AAEzC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAI5B,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { TypingIndicator } from "./typing-indicator";
|
|
2
|
+
const meta = {
|
|
3
|
+
title: "Chat/TypingIndicator",
|
|
4
|
+
component: TypingIndicator,
|
|
5
|
+
tags: ["autodocs"],
|
|
6
|
+
parameters: { layout: "padded" },
|
|
7
|
+
};
|
|
8
|
+
export default meta;
|
|
9
|
+
export const Default = {
|
|
10
|
+
args: {},
|
|
11
|
+
};
|
|
12
|
+
export const WithSenderName = {
|
|
13
|
+
args: {
|
|
14
|
+
senderName: "Domaine Leroy",
|
|
15
|
+
},
|
|
16
|
+
};
|
|
17
|
+
//# sourceMappingURL=typing-indicator.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"typing-indicator.stories.js","sourceRoot":"","sources":["../../src/chat/typing-indicator.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,eAAe;IAC1B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE;CACM,CAAC;AAEzC,eAAe,IAAI,CAAC;AAGpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;CACT,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAU;IACnC,IAAI,EAAE;QACJ,UAAU,EAAE,eAAe;KAC5B;CACF,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-connection-status.d.ts","sourceRoot":"","sources":["../../src/chat/use-connection-status.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAElD,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,aAAa,GAAG,OAAO,CAIlE"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { useEffect, useState } from "react";
|
|
2
|
+
export function useConnectionStatus(chatWs) {
|
|
3
|
+
const [connected, setConnected] = useState(chatWs.isConnected);
|
|
4
|
+
useEffect(() => chatWs.onConnectionChange(setConnected), [chatWs]);
|
|
5
|
+
return connected;
|
|
6
|
+
}
|
|
7
|
+
//# sourceMappingURL=use-connection-status.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-connection-status.js","sourceRoot":"","sources":["../../src/chat/use-connection-status.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG5C,MAAM,UAAU,mBAAmB,CAAC,MAAqB;IACvD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;IAC/D,SAAS,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,kBAAkB,CAAC,YAAY,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IACnE,OAAO,SAAS,CAAC;AACnB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-tab-title-badge.d.ts","sourceRoot":"","sources":["../../src/chat/use-tab-title-badge.ts"],"names":[],"mappings":"AAEA,wBAAgB,gBAAgB,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAY1D"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { useEffect, useRef } from "react";
|
|
2
|
+
export function useTabTitleBadge(unreadCount) {
|
|
3
|
+
const originalRef = useRef("");
|
|
4
|
+
useEffect(() => {
|
|
5
|
+
originalRef.current = document.title.replace(/^\(\d+\)\s/, "");
|
|
6
|
+
}, []);
|
|
7
|
+
useEffect(() => {
|
|
8
|
+
const base = originalRef.current;
|
|
9
|
+
document.title = unreadCount > 0 ? `(${unreadCount}) ${base}` : base;
|
|
10
|
+
return () => {
|
|
11
|
+
document.title = base;
|
|
12
|
+
};
|
|
13
|
+
}, [unreadCount]);
|
|
14
|
+
}
|
|
15
|
+
//# sourceMappingURL=use-tab-title-badge.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-tab-title-badge.js","sourceRoot":"","sources":["../../src/chat/use-tab-title-badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,UAAU,gBAAgB,CAAC,WAAmB;IAClD,MAAM,WAAW,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;IAC/B,SAAS,CAAC,GAAG,EAAE;QACb,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;IACjE,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,IAAI,GAAG,WAAW,CAAC,OAAO,CAAC;QACjC,QAAQ,CAAC,KAAK,GAAG,WAAW,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,WAAW,KAAK,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;QACrE,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,KAAK,GAAG,IAAI,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;AACpB,CAAC"}
|