@dxos/react-ui-thread 0.8.4-main.f5c0578 → 0.8.4-main.fcfe5033a5
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/lib/browser/index.mjs +141 -187
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/types/src/Message/Message.d.ts +2 -2
- package/dist/types/src/Message/Message.d.ts.map +1 -1
- package/dist/types/src/Message/Message.stories.d.ts +18 -16
- package/dist/types/src/Message/Message.stories.d.ts.map +1 -1
- package/dist/types/src/Thread/Comments.stories.d.ts +19 -36
- package/dist/types/src/Thread/Comments.stories.d.ts.map +1 -1
- package/dist/types/src/Thread/Thread.d.ts +25 -11
- package/dist/types/src/Thread/Thread.d.ts.map +1 -1
- package/dist/types/src/Thread/Thread.stories.d.ts +33 -5
- package/dist/types/src/Thread/Thread.stories.d.ts.map +1 -1
- package/dist/types/src/testing.d.ts.map +1 -1
- package/dist/types/src/translations.d.ts +12 -12
- package/dist/types/src/translations.d.ts.map +1 -1
- package/dist/types/src/types.d.ts +1 -0
- package/dist/types/src/types.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +27 -24
- package/src/Message/Message.stories.tsx +17 -12
- package/src/Message/Message.tsx +16 -15
- package/src/Thread/Comments.stories.tsx +79 -48
- package/src/Thread/Thread.stories.tsx +18 -15
- package/src/Thread/Thread.tsx +19 -18
- package/src/testing.tsx +9 -8
- package/src/translations.ts +11 -11
- package/src/types.ts +1 -0
|
@@ -1,90 +1,74 @@
|
|
|
1
1
|
// src/translations.ts
|
|
2
|
-
var translationKey = "react-ui-thread";
|
|
2
|
+
var translationKey = "@dxos/react-ui-thread";
|
|
3
3
|
var translations = [
|
|
4
4
|
{
|
|
5
5
|
"en-US": {
|
|
6
6
|
[translationKey]: {
|
|
7
|
-
"plugin
|
|
8
|
-
"thread
|
|
9
|
-
"thread
|
|
10
|
-
"delete
|
|
11
|
-
"create
|
|
12
|
-
"message
|
|
13
|
-
"comment
|
|
14
|
-
"settings
|
|
15
|
-
"anonymous
|
|
16
|
-
"enter
|
|
7
|
+
"plugin.name": "Threads",
|
|
8
|
+
"thread-title.placeholder": "New thread",
|
|
9
|
+
"thread-title.label": "Title",
|
|
10
|
+
"delete-thread.label": "Delete",
|
|
11
|
+
"create-thread.label": "Create thread",
|
|
12
|
+
"message.placeholder": "Enter message...",
|
|
13
|
+
"comment.placeholder": "Enter comment...",
|
|
14
|
+
"settings-standalone.label": "Enable standalone thread creation",
|
|
15
|
+
"anonymous.label": "Anonymous",
|
|
16
|
+
"enter-to-send.message": "Enter to add \u23CE"
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
}
|
|
20
20
|
];
|
|
21
21
|
|
|
22
22
|
// src/Thread/Thread.tsx
|
|
23
|
-
import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
|
|
24
23
|
import React, { forwardRef } from "react";
|
|
25
24
|
import { Icon, useTranslation } from "@dxos/react-ui";
|
|
26
|
-
import { hoverableControlItem, hoverableFocusedWithinControls, mx } from "@dxos/
|
|
27
|
-
var threadLayout = "
|
|
25
|
+
import { hoverableControlItem, hoverableFocusedWithinControls, mx } from "@dxos/ui-theme";
|
|
26
|
+
var threadLayout = "w-full place-self-start grid grid-cols-[var(--dx-rail-size)_1fr]";
|
|
28
27
|
var ThreadRoot = /* @__PURE__ */ forwardRef(({ current, children, classNames, ...props }, forwardedRef) => {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
"
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
ref: forwardedRef
|
|
40
|
-
}, children);
|
|
41
|
-
} finally {
|
|
42
|
-
_effect.f();
|
|
43
|
-
}
|
|
28
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
29
|
+
role: "group",
|
|
30
|
+
"data-testid": "thread",
|
|
31
|
+
...current && {
|
|
32
|
+
"aria-current": typeof current === "string" ? current : "location"
|
|
33
|
+
},
|
|
34
|
+
...props,
|
|
35
|
+
className: mx(threadLayout, hoverableFocusedWithinControls, "bg-[var(--surface-bg)] current-related dx-attention-surface [--controls-opacity:0]", classNames),
|
|
36
|
+
ref: forwardedRef
|
|
37
|
+
}, children);
|
|
44
38
|
});
|
|
45
|
-
var ThreadHeader = /* @__PURE__ */ forwardRef(({
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
ref: forwardedRef
|
|
62
|
-
}, children)));
|
|
63
|
-
} finally {
|
|
64
|
-
_effect.f();
|
|
65
|
-
}
|
|
39
|
+
var ThreadHeader = /* @__PURE__ */ forwardRef(({ children, detached, ...props }, forwardedRef) => {
|
|
40
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", {
|
|
41
|
+
role: "none",
|
|
42
|
+
className: "flex items-center justify-center text-description"
|
|
43
|
+
}, /* @__PURE__ */ React.createElement(Icon, {
|
|
44
|
+
icon: "ph--caret-double-right--regular"
|
|
45
|
+
})), /* @__PURE__ */ React.createElement("div", {
|
|
46
|
+
role: "none",
|
|
47
|
+
className: "flex items-center overflow-hidden"
|
|
48
|
+
}, /* @__PURE__ */ React.createElement("p", {
|
|
49
|
+
role: "heading",
|
|
50
|
+
"data-testid": "thread.heading",
|
|
51
|
+
...props,
|
|
52
|
+
className: mx("me-2 text-description font-medium truncate italic", detached && "line-through decoration-1"),
|
|
53
|
+
ref: forwardedRef
|
|
54
|
+
}, children)));
|
|
66
55
|
});
|
|
67
56
|
var ThreadStatus = /* @__PURE__ */ forwardRef(({ activity, classNames, children, ...props }, forwardedRef) => {
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
className: mx("text-end", hoverableControlItem)
|
|
84
|
-
}, t("enter to send message")));
|
|
85
|
-
} finally {
|
|
86
|
-
_effect.f();
|
|
87
|
-
}
|
|
57
|
+
const { t } = useTranslation(translationKey);
|
|
58
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
59
|
+
...props,
|
|
60
|
+
className: mx("col-start-2 grid grid-cols-[min-content_1fr_max-content] pb-2 pe-2 text-xs text-description", classNames),
|
|
61
|
+
ref: forwardedRef
|
|
62
|
+
}, /* @__PURE__ */ React.createElement(Icon, {
|
|
63
|
+
icon: "ph--spinner--bold",
|
|
64
|
+
classNames: "w-6 h-4 invisible data-[visible=show]:visible animate-spin-slow",
|
|
65
|
+
"data-visible": activity ? "show" : "hide"
|
|
66
|
+
}), /* @__PURE__ */ React.createElement("span", {
|
|
67
|
+
className: "truncate min-w-0",
|
|
68
|
+
"aria-live": "polite"
|
|
69
|
+
}, activity ? children : null), /* @__PURE__ */ React.createElement("span", {
|
|
70
|
+
className: mx("text-end", hoverableControlItem)
|
|
71
|
+
}, t("enter-to-send.message")));
|
|
88
72
|
});
|
|
89
73
|
var Thread = {
|
|
90
74
|
Root: ThreadRoot,
|
|
@@ -93,99 +77,74 @@ var Thread = {
|
|
|
93
77
|
};
|
|
94
78
|
|
|
95
79
|
// src/Message/Message.tsx
|
|
96
|
-
import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
|
|
97
80
|
import { formatDistanceToNow } from "date-fns/formatDistanceToNow";
|
|
98
81
|
import React2, { forwardRef as forwardRef2 } from "react";
|
|
99
82
|
import { Avatar, useTranslation as useTranslation2 } from "@dxos/react-ui";
|
|
100
|
-
import {
|
|
101
|
-
import {
|
|
102
|
-
import {
|
|
83
|
+
import { useTextEditor } from "@dxos/react-ui-editor";
|
|
84
|
+
import { keymap, listener } from "@dxos/ui-editor";
|
|
85
|
+
import { mx as mx2 } from "@dxos/ui-theme";
|
|
86
|
+
import { hexToEmoji, hexToHue, isTruthy } from "@dxos/util";
|
|
103
87
|
var avatarSize = 7;
|
|
104
88
|
var MessageRoot = /* @__PURE__ */ forwardRef2(({ authorImgSrc, authorId, authorName, authorAvatarProps, continues = true, children, classNames, ...rootProps }, forwardedRef) => {
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
}, children)))
|
|
132
|
-
);
|
|
133
|
-
} finally {
|
|
134
|
-
_effect.f();
|
|
135
|
-
}
|
|
89
|
+
return (
|
|
90
|
+
// Must wrap the message since Avatar.Label may be used in the content.
|
|
91
|
+
/* @__PURE__ */ React2.createElement(Avatar.Root, null, /* @__PURE__ */ React2.createElement("div", {
|
|
92
|
+
role: "none",
|
|
93
|
+
"data-testid": "thread.message",
|
|
94
|
+
...rootProps,
|
|
95
|
+
className: mx2("grid grid-cols-subgrid col-span-2", classNames),
|
|
96
|
+
ref: forwardedRef
|
|
97
|
+
}, /* @__PURE__ */ React2.createElement("div", {
|
|
98
|
+
role: "none",
|
|
99
|
+
className: "flex flex-col items-center gap-2 pt-1"
|
|
100
|
+
}, /* @__PURE__ */ React2.createElement(Avatar.Content, {
|
|
101
|
+
size: avatarSize,
|
|
102
|
+
hue: authorAvatarProps?.hue || hexToHue(authorId ?? "0"),
|
|
103
|
+
fallback: authorAvatarProps?.emoji || hexToEmoji(authorId ?? "0"),
|
|
104
|
+
...authorImgSrc && {
|
|
105
|
+
imgSrc: authorImgSrc
|
|
106
|
+
}
|
|
107
|
+
}), continues && /* @__PURE__ */ React2.createElement("div", {
|
|
108
|
+
role: "none",
|
|
109
|
+
className: "w-px grow bg-separator"
|
|
110
|
+
})), /* @__PURE__ */ React2.createElement("div", {
|
|
111
|
+
role: "none",
|
|
112
|
+
className: "py-1 min-w-0"
|
|
113
|
+
}, children)))
|
|
114
|
+
);
|
|
136
115
|
});
|
|
137
116
|
var MessageHeading = ({ children, classNames, timestamp, authorName, ...props }) => {
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
timestamp
|
|
150
|
-
})), children);
|
|
151
|
-
} finally {
|
|
152
|
-
_effect.f();
|
|
153
|
-
}
|
|
117
|
+
return /* @__PURE__ */ React2.createElement("div", {
|
|
118
|
+
role: "none",
|
|
119
|
+
...props,
|
|
120
|
+
className: mx2("flex gap-2 items-start", classNames)
|
|
121
|
+
}, /* @__PURE__ */ React2.createElement("p", {
|
|
122
|
+
className: "grow"
|
|
123
|
+
}, /* @__PURE__ */ React2.createElement(MessageAuthorName, {
|
|
124
|
+
authorName
|
|
125
|
+
}), timestamp && /* @__PURE__ */ React2.createElement(MessageTime, {
|
|
126
|
+
timestamp
|
|
127
|
+
})), children);
|
|
154
128
|
};
|
|
155
129
|
var MessageAuthorName = ({ authorName }) => {
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
classNames: "block truncate text-sm text-subdued"
|
|
161
|
-
}, authorName ?? t("anonymous label"));
|
|
162
|
-
} finally {
|
|
163
|
-
_effect.f();
|
|
164
|
-
}
|
|
130
|
+
const { t } = useTranslation2(translationKey);
|
|
131
|
+
return /* @__PURE__ */ React2.createElement(Avatar.Label, {
|
|
132
|
+
classNames: "block truncate text-sm text-subdued"
|
|
133
|
+
}, authorName ?? t("anonymous.label"));
|
|
165
134
|
};
|
|
166
135
|
var MessageTime = ({ timestamp }) => {
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
addSuffix: true
|
|
177
|
-
}) : "");
|
|
178
|
-
} finally {
|
|
179
|
-
_effect.f();
|
|
180
|
-
}
|
|
136
|
+
const { dtLocale } = useTranslation2(translationKey);
|
|
137
|
+
const dt = timestamp ? new Date(timestamp) : void 0;
|
|
138
|
+
return /* @__PURE__ */ React2.createElement("time", {
|
|
139
|
+
className: "block text-subdued text-xs pb-0.5",
|
|
140
|
+
dateTime: dt?.toISOString()
|
|
141
|
+
}, dt ? formatDistanceToNow(dt, {
|
|
142
|
+
locale: dtLocale,
|
|
143
|
+
addSuffix: true
|
|
144
|
+
}) : "");
|
|
181
145
|
};
|
|
182
146
|
var MessageBody = ({ children, ...props }) => {
|
|
183
|
-
|
|
184
|
-
try {
|
|
185
|
-
return /* @__PURE__ */ React2.createElement("p", props, children);
|
|
186
|
-
} finally {
|
|
187
|
-
_effect.f();
|
|
188
|
-
}
|
|
147
|
+
return /* @__PURE__ */ React2.createElement("p", props, children);
|
|
189
148
|
};
|
|
190
149
|
var keyBindings = ({ onSend, onClear }) => [
|
|
191
150
|
{
|
|
@@ -213,45 +172,40 @@ var keyBindings = ({ onSend, onClear }) => [
|
|
|
213
172
|
}
|
|
214
173
|
];
|
|
215
174
|
var MessageTextbox = ({ id, authorId, authorName, authorImgSrc, authorAvatarProps, disabled, extensions, onSend, onClear, onEditorFocus, ...editorProps }) => {
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
})
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
if (focusing) {
|
|
228
|
-
onEditorFocus?.();
|
|
229
|
-
}
|
|
175
|
+
const { parentRef, focusAttributes } = useTextEditor(() => ({
|
|
176
|
+
id,
|
|
177
|
+
extensions: [
|
|
178
|
+
keymap.of(keyBindings({
|
|
179
|
+
onSend,
|
|
180
|
+
onClear
|
|
181
|
+
})),
|
|
182
|
+
listener({
|
|
183
|
+
onFocus: ({ focusing }) => {
|
|
184
|
+
if (focusing) {
|
|
185
|
+
onEditorFocus?.();
|
|
230
186
|
}
|
|
231
|
-
}
|
|
232
|
-
|
|
233
|
-
].filter(isNotFalsy),
|
|
234
|
-
...editorProps
|
|
235
|
-
}), [
|
|
236
|
-
id,
|
|
187
|
+
}
|
|
188
|
+
}),
|
|
237
189
|
extensions
|
|
238
|
-
])
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
190
|
+
].filter(isTruthy),
|
|
191
|
+
...editorProps
|
|
192
|
+
}), [
|
|
193
|
+
id,
|
|
194
|
+
extensions
|
|
195
|
+
]);
|
|
196
|
+
return /* @__PURE__ */ React2.createElement(MessageRoot, {
|
|
197
|
+
id,
|
|
198
|
+
authorId,
|
|
199
|
+
authorName,
|
|
200
|
+
authorImgSrc,
|
|
201
|
+
authorAvatarProps,
|
|
202
|
+
continues: false
|
|
203
|
+
}, /* @__PURE__ */ React2.createElement("div", {
|
|
204
|
+
role: "none",
|
|
205
|
+
ref: parentRef,
|
|
206
|
+
className: mx2("py-0.5 me-1 rounded-xs dx-focus-ring", disabled && "opacity-50"),
|
|
207
|
+
...focusAttributes
|
|
208
|
+
}));
|
|
255
209
|
};
|
|
256
210
|
export {
|
|
257
211
|
MessageAuthorName,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/translations.ts", "../../../src/Thread/Thread.tsx", "../../../src/Message/Message.tsx"],
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Resource } from '@dxos/react-ui';\n\nexport const translationKey = 'react-ui-thread';\n\nexport const translations = [\n {\n 'en-US': {\n [translationKey]: {\n 'plugin
|
|
5
|
-
"mappings": ";AAMO,IAAMA,iBAAiB;AAEvB,IAAMC,eAAe;EAC1B;IACE,SAAS;MACP,CAACD,cAAAA,GAAiB;QAChB,eAAe;QACf,4BAA4B;QAC5B,sBAAsB;QACtB,uBAAuB;QACvB,uBAAuB;QACvB,uBAAuB;QACvB,uBAAuB;QACvB,6BAA6B;QAC7B,mBAAmB;QACnB,yBAAyB;MAC3B;IACF;EACF
|
|
6
|
-
"names": ["translationKey", "translations", "React", "forwardRef", "Icon", "useTranslation", "hoverableControlItem", "hoverableFocusedWithinControls", "mx", "threadLayout", "ThreadRoot", "forwardRef", "current", "children", "classNames", "props", "forwardedRef", "div", "role", "data-testid", "className", "mx", "hoverableFocusedWithinControls", "ref", "ThreadHeader", "detached", "Icon", "icon", "p", "ThreadStatus", "activity", "t", "useTranslation", "translationKey", "data-visible", "span", "aria-live", "hoverableControlItem", "Thread", "Root", "Header", "Status", "formatDistanceToNow", "React", "forwardRef", "Avatar", "useTranslation", "
|
|
4
|
+
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Resource } from '@dxos/react-ui';\n\nexport const translationKey = '@dxos/react-ui-thread';\n\nexport const translations = [\n {\n 'en-US': {\n [translationKey]: {\n 'plugin.name': 'Threads',\n 'thread-title.placeholder': 'New thread',\n 'thread-title.label': 'Title',\n 'delete-thread.label': 'Delete',\n 'create-thread.label': 'Create thread',\n 'message.placeholder': 'Enter message...',\n 'comment.placeholder': 'Enter comment...',\n 'settings-standalone.label': 'Enable standalone thread creation',\n 'anonymous.label': 'Anonymous',\n 'enter-to-send.message': 'Enter to add ⏎',\n },\n },\n },\n] as const satisfies Resource[];\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { ComponentPropsWithRef, forwardRef, PropsWithChildren } from 'react';\n\nimport { Icon, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { hoverableControlItem, hoverableFocusedWithinControls, mx } from '@dxos/ui-theme';\n\nimport { translationKey } from '../translations';\nimport type { ThreadEntity } from '../types';\n\n// TODO(burdon): Avoid exporting fragments.\nexport const threadLayout = 'w-full place-self-start grid grid-cols-[var(--dx-rail-size)_1fr]';\n\n//\n// Root\n//\n\ntype ThreadRootProps = ThemedClassName<\n PropsWithChildren<\n ThreadEntity & { current?: boolean } & Pick<ComponentPropsWithRef<'div'>, 'onClickCapture' | 'onFocusCapture'>\n >\n>;\n\nconst ThreadRoot = forwardRef<HTMLDivElement, ThreadRootProps>(\n ({ current, children, classNames, ...props }, forwardedRef) => {\n return (\n <div\n role='group'\n data-testid='thread'\n {...(current && { 'aria-current': typeof current === 'string' ? current : 'location' })}\n {...props}\n className={mx(\n threadLayout,\n hoverableFocusedWithinControls,\n 'bg-[var(--surface-bg)] current-related dx-attention-surface [--controls-opacity:0]',\n classNames,\n )}\n ref={forwardedRef}\n >\n {children}\n </div>\n );\n },\n);\n\n//\n// Heading\n//\n\ntype ThreadHeaderProps = PropsWithChildren<{ detached?: boolean }>;\n\nconst ThreadHeader = forwardRef<HTMLParagraphElement, ThreadHeaderProps>(\n ({ children, detached, ...props }, forwardedRef) => {\n return (\n <>\n <div role='none' className='flex items-center justify-center text-description'>\n <Icon icon='ph--caret-double-right--regular' />\n </div>\n <div role='none' className='flex items-center overflow-hidden'>\n <p\n role='heading'\n data-testid='thread.heading'\n {...props}\n className={mx('me-2 text-description font-medium truncate italic', detached && 'line-through decoration-1')}\n ref={forwardedRef}\n >\n {children}\n </p>\n </div>\n </>\n );\n },\n);\n\n//\n// Status\n//\n\ntype ThreadStatusProps = ThemedClassName<PropsWithChildren> & {\n activity?: boolean;\n};\n\nconst ThreadStatus = forwardRef<HTMLDivElement, ThreadStatusProps>(\n ({ activity, classNames, children, ...props }, forwardedRef) => {\n const { t } = useTranslation(translationKey);\n return (\n <div\n {...props}\n className={mx(\n 'col-start-2 grid grid-cols-[min-content_1fr_max-content] pb-2 pe-2 text-xs text-description',\n classNames,\n )}\n ref={forwardedRef}\n >\n <Icon\n icon='ph--spinner--bold'\n classNames='w-6 h-4 invisible data-[visible=show]:visible animate-spin-slow'\n data-visible={activity ? 'show' : 'hide'}\n />\n <span className='truncate min-w-0' aria-live='polite'>\n {activity ? children : null}\n </span>\n <span className={mx('text-end', hoverableControlItem)}>{t('enter-to-send.message')}</span>\n </div>\n );\n },\n);\n\nexport const Thread = {\n Root: ThreadRoot,\n Header: ThreadHeader,\n Status: ThreadStatus,\n};\n\nexport type { ThreadRootProps, ThreadHeaderProps, ThreadStatusProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { formatDistanceToNow } from 'date-fns/formatDistanceToNow';\nimport React, { type ComponentPropsWithRef, type ComponentPropsWithoutRef, forwardRef } from 'react';\n\nimport { Avatar, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { type UseTextEditorProps, useTextEditor } from '@dxos/react-ui-editor';\nimport { keymap, listener } from '@dxos/ui-editor';\nimport { mx } from '@dxos/ui-theme';\nimport { hexToEmoji, hexToHue, isTruthy } from '@dxos/util';\n\nimport { translationKey } from '../translations';\nimport { type MessageMetadata } from '../types';\n\nconst avatarSize = 7;\n\nexport type MessageRootProps = ThemedClassName<\n ComponentPropsWithRef<'div'> & MessageMetadata & Partial<{ continues: boolean }>\n>;\n\n// TODO(burdon): Show authorName on tooltip.\nexport const MessageRoot = forwardRef<HTMLDivElement, MessageRootProps>(\n (\n { authorImgSrc, authorId, authorName, authorAvatarProps, continues = true, children, classNames, ...rootProps },\n forwardedRef,\n ) => {\n return (\n // Must wrap the message since Avatar.Label may be used in the content.\n <Avatar.Root>\n <div\n role='none'\n data-testid='thread.message'\n {...rootProps}\n className={mx('grid grid-cols-subgrid col-span-2', classNames)}\n ref={forwardedRef}\n >\n <div role='none' className='flex flex-col items-center gap-2 pt-1'>\n <Avatar.Content\n size={avatarSize}\n hue={authorAvatarProps?.hue || hexToHue(authorId ?? '0')}\n fallback={authorAvatarProps?.emoji || hexToEmoji(authorId ?? '0')}\n {...(authorImgSrc && { imgSrc: authorImgSrc })}\n />\n {continues && <div role='none' className='w-px grow bg-separator' />}\n </div>\n <div role='none' className='py-1 min-w-0'>\n {children}\n </div>\n </div>\n </Avatar.Root>\n );\n },\n);\n\nexport type MessageHeadingProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> &\n Pick<MessageMetadata, 'authorName' | 'timestamp'>;\n\nexport const MessageHeading = ({ children, classNames, timestamp, authorName, ...props }: MessageHeadingProps) => {\n return (\n <div role='none' {...props} className={mx('flex gap-2 items-start', classNames)}>\n <p className='grow'>\n <MessageAuthorName authorName={authorName} />\n {timestamp && <MessageTime timestamp={timestamp} />}\n </p>\n {children}\n </div>\n );\n};\n\nexport type MessageAuthorNameProps = Pick<MessageMetadata, 'authorName'>;\n\nexport const MessageAuthorName = ({ authorName }: MessageAuthorNameProps) => {\n const { t } = useTranslation(translationKey);\n return (\n <Avatar.Label classNames='block truncate text-sm text-subdued'>{authorName ?? t('anonymous.label')}</Avatar.Label>\n );\n};\n\nexport type MessageTimeProps = Pick<MessageMetadata, 'timestamp'>;\n\nexport const MessageTime = ({ timestamp }: MessageTimeProps) => {\n const { dtLocale } = useTranslation(translationKey);\n const dt = timestamp ? new Date(timestamp) : undefined;\n return (\n <time className='block text-subdued text-xs pb-0.5' dateTime={dt?.toISOString()}>\n {dt ? formatDistanceToNow(dt, { locale: dtLocale, addSuffix: true }) : ''}\n </time>\n );\n};\n\nexport type MessageBodyProps = ComponentPropsWithoutRef<'p'>;\n\nexport const MessageBody = ({ children, ...props }: MessageBodyProps) => {\n return <p {...props}>{children}</p>;\n};\n\nexport type MessageTextboxProps = {\n disabled?: boolean;\n onSend?: () => void;\n onClear?: () => void;\n onEditorFocus?: () => void;\n} & MessageMetadata &\n UseTextEditorProps;\n\nconst keyBindings = ({ onSend, onClear }: Pick<MessageTextboxProps, 'onSend' | 'onClear'>) => [\n {\n key: 'Enter',\n run: () => {\n if (onSend) {\n onSend();\n return true;\n } else {\n return false;\n }\n },\n },\n {\n // TODO(burdon): Other key bindings.\n key: 'Meta+Backspace',\n run: () => {\n if (onClear) {\n onClear();\n return true;\n } else {\n return false;\n }\n },\n },\n];\n\nexport const MessageTextbox = ({\n id,\n authorId,\n authorName,\n authorImgSrc,\n authorAvatarProps,\n disabled,\n extensions,\n onSend,\n onClear,\n onEditorFocus,\n ...editorProps\n}: MessageTextboxProps) => {\n const { parentRef, focusAttributes } = useTextEditor(\n () => ({\n id,\n extensions: [\n keymap.of(keyBindings({ onSend, onClear })),\n listener({\n onFocus: ({ focusing }) => {\n if (focusing) {\n onEditorFocus?.();\n }\n },\n }),\n extensions,\n ].filter(isTruthy),\n ...editorProps,\n }),\n [id, extensions],\n );\n\n return (\n <MessageRoot {...{ id, authorId, authorName, authorImgSrc, authorAvatarProps }} continues={false}>\n <div\n role='none'\n ref={parentRef}\n className={mx('py-0.5 me-1 rounded-xs dx-focus-ring', disabled && 'opacity-50')}\n {...focusAttributes}\n />\n </MessageRoot>\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["translationKey", "translations", "React", "forwardRef", "Icon", "useTranslation", "hoverableControlItem", "hoverableFocusedWithinControls", "mx", "threadLayout", "ThreadRoot", "forwardRef", "current", "children", "classNames", "props", "forwardedRef", "div", "role", "data-testid", "className", "mx", "hoverableFocusedWithinControls", "ref", "ThreadHeader", "detached", "Icon", "icon", "p", "ThreadStatus", "activity", "t", "useTranslation", "translationKey", "data-visible", "span", "aria-live", "hoverableControlItem", "Thread", "Root", "Header", "Status", "formatDistanceToNow", "React", "forwardRef", "Avatar", "useTranslation", "useTextEditor", "keymap", "listener", "mx", "hexToEmoji", "hexToHue", "isTruthy", "avatarSize", "MessageRoot", "forwardRef", "authorImgSrc", "authorId", "authorName", "authorAvatarProps", "continues", "children", "classNames", "rootProps", "forwardedRef", "React", "Avatar", "Root", "div", "role", "data-testid", "className", "mx", "ref", "Content", "size", "hue", "hexToHue", "fallback", "emoji", "hexToEmoji", "imgSrc", "MessageHeading", "timestamp", "props", "p", "MessageAuthorName", "MessageTime", "t", "useTranslation", "translationKey", "Label", "dtLocale", "dt", "Date", "undefined", "time", "dateTime", "toISOString", "formatDistanceToNow", "locale", "addSuffix", "MessageBody", "keyBindings", "onSend", "onClear", "key", "run", "MessageTextbox", "id", "disabled", "extensions", "onEditorFocus", "editorProps", "parentRef", "focusAttributes", "useTextEditor", "keymap", "of", "listener", "onFocus", "focusing", "filter", "isTruthy"]
|
|
7
7
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/translations.ts":{"bytes":
|
|
1
|
+
{"inputs":{"src/translations.ts":{"bytes":2480,"imports":[],"format":"esm"},"src/Thread/Thread.tsx":{"bytes":9780,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"src/Thread/index.ts":{"bytes":459,"imports":[{"path":"src/Thread/Thread.tsx","kind":"import-statement","original":"./Thread"}],"format":"esm"},"src/Message/Message.tsx":{"bytes":16659,"imports":[{"path":"date-fns/formatDistanceToNow","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-editor","kind":"import-statement","external":true},{"path":"@dxos/ui-editor","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"src/Message/index.ts":{"bytes":461,"imports":[{"path":"src/Message/Message.tsx","kind":"import-statement","original":"./Message"}],"format":"esm"},"src/index.ts":{"bytes":839,"imports":[{"path":"src/translations.ts","kind":"import-statement","original":"./translations"},{"path":"src/Thread/index.ts","kind":"import-statement","original":"./Thread"},{"path":"src/Message/index.ts","kind":"import-statement","original":"./Message"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":15231},"dist/lib/browser/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"date-fns/formatDistanceToNow","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-editor","kind":"import-statement","external":true},{"path":"@dxos/ui-editor","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true}],"exports":["MessageAuthorName","MessageBody","MessageHeading","MessageRoot","MessageTextbox","MessageTime","Thread","threadLayout","translations"],"entryPoint":"src/index.ts","inputs":{"src/translations.ts":{"bytesInOutput":616},"src/Thread/Thread.tsx":{"bytesInOutput":2549},"src/index.ts":{"bytesInOutput":0},"src/Message/Message.tsx":{"bytesInOutput":4245}},"bytes":7677}}}
|
|
@@ -2,9 +2,9 @@ import React, { type ComponentPropsWithRef, type ComponentPropsWithoutRef } from
|
|
|
2
2
|
import { type ThemedClassName } from '@dxos/react-ui';
|
|
3
3
|
import { type UseTextEditorProps } from '@dxos/react-ui-editor';
|
|
4
4
|
import { type MessageMetadata } from '../types';
|
|
5
|
-
export type MessageRootProps = ThemedClassName<ComponentPropsWithRef<'div'
|
|
5
|
+
export type MessageRootProps = ThemedClassName<ComponentPropsWithRef<'div'> & MessageMetadata & Partial<{
|
|
6
6
|
continues: boolean;
|
|
7
|
-
}
|
|
7
|
+
}>>;
|
|
8
8
|
export declare const MessageRoot: React.ForwardRefExoticComponent<Omit<MessageRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
9
9
|
export type MessageHeadingProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & Pick<MessageMetadata, 'authorName' | 'timestamp'>;
|
|
10
10
|
export declare const MessageHeading: ({ children, classNames, timestamp, authorName, ...props }: MessageHeadingProps) => React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../../../src/Message/Message.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,KAAK,wBAAwB,EAAc,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../../../src/Message/Message.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,KAAK,wBAAwB,EAAc,MAAM,OAAO,CAAC;AAErG,OAAO,EAAU,KAAK,eAAe,EAAkB,MAAM,gBAAgB,CAAC;AAC9E,OAAO,EAAE,KAAK,kBAAkB,EAAiB,MAAM,uBAAuB,CAAC;AAM/E,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,UAAU,CAAC;AAIhD,MAAM,MAAM,gBAAgB,GAAG,eAAe,CAC5C,qBAAqB,CAAC,KAAK,CAAC,GAAG,eAAe,GAAG,OAAO,CAAC;IAAE,SAAS,EAAE,OAAO,CAAA;CAAE,CAAC,CACjF,CAAC;AAGF,eAAO,MAAM,WAAW,sGA+BvB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAChF,IAAI,CAAC,eAAe,EAAE,YAAY,GAAG,WAAW,CAAC,CAAC;AAEpD,eAAO,MAAM,cAAc,GAAI,2DAA2D,mBAAmB,sBAU5G,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;AAEzE,eAAO,MAAM,iBAAiB,GAAI,gBAAgB,sBAAsB,sBAKvE,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,eAAe,EAAE,WAAW,CAAC,CAAC;AAElE,eAAO,MAAM,WAAW,GAAI,eAAe,gBAAgB,sBAQ1D,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,GAAG,CAAC,CAAC;AAE7D,eAAO,MAAM,WAAW,GAAI,wBAAwB,gBAAgB,sBAEnE,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B,GAAG,eAAe,GACjB,kBAAkB,CAAC;AA4BrB,eAAO,MAAM,cAAc,GAAI,qIAY5B,mBAAmB,sBA8BrB,CAAC"}
|
|
@@ -1,29 +1,31 @@
|
|
|
1
|
-
import '@
|
|
1
|
+
import { type StoryObj } from '@storybook/react-vite';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
declare const
|
|
3
|
+
declare const meta: {
|
|
4
4
|
title: string;
|
|
5
|
-
component:
|
|
5
|
+
component: any;
|
|
6
6
|
render: () => React.JSX.Element;
|
|
7
7
|
decorators: import("@storybook/react").Decorator[];
|
|
8
8
|
parameters: {
|
|
9
|
+
layout: string;
|
|
9
10
|
translations: [{
|
|
10
11
|
readonly 'en-US': {
|
|
11
|
-
readonly "react-ui-thread": {
|
|
12
|
-
readonly 'plugin
|
|
13
|
-
readonly 'thread
|
|
14
|
-
readonly 'thread
|
|
15
|
-
readonly 'delete
|
|
16
|
-
readonly 'create
|
|
17
|
-
readonly 'message
|
|
18
|
-
readonly 'comment
|
|
19
|
-
readonly 'settings
|
|
20
|
-
readonly 'anonymous
|
|
21
|
-
readonly 'enter
|
|
12
|
+
readonly "@dxos/react-ui-thread": {
|
|
13
|
+
readonly 'plugin.name': "Threads";
|
|
14
|
+
readonly 'thread-title.placeholder': "New thread";
|
|
15
|
+
readonly 'thread-title.label': "Title";
|
|
16
|
+
readonly 'delete-thread.label': "Delete";
|
|
17
|
+
readonly 'create-thread.label': "Create thread";
|
|
18
|
+
readonly 'message.placeholder': "Enter message...";
|
|
19
|
+
readonly 'comment.placeholder': "Enter comment...";
|
|
20
|
+
readonly 'settings-standalone.label': "Enable standalone thread creation";
|
|
21
|
+
readonly 'anonymous.label': "Anonymous";
|
|
22
|
+
readonly 'enter-to-send.message': "Enter to add ⏎";
|
|
22
23
|
};
|
|
23
24
|
};
|
|
24
25
|
}];
|
|
25
26
|
};
|
|
26
27
|
};
|
|
27
|
-
export default
|
|
28
|
-
|
|
28
|
+
export default meta;
|
|
29
|
+
type Story = StoryObj<typeof meta>;
|
|
30
|
+
export declare const Default: Story;
|
|
29
31
|
//# sourceMappingURL=Message.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Message.stories.d.ts","sourceRoot":"","sources":["../../../../src/Message/Message.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,
|
|
1
|
+
{"version":3,"file":"Message.stories.d.ts","sourceRoot":"","sources":["../../../../src/Message/Message.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAmB,MAAM,OAAO,CAAC;AA+BxC,QAAA,MAAM,IAAI;;eAEkB,GAAG;;;;;;;;;;;;;;;;;;;;;;CAOM,CAAC;AAEtC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}
|