@handled-ai/design-system 0.20.13 → 0.20.15
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/components/badge.d.ts +1 -1
- package/dist/components/button.d.ts +1 -1
- package/dist/components/comment-composer.d.ts +3 -1
- package/dist/components/comment-composer.js +73 -49
- package/dist/components/comment-composer.js.map +1 -1
- package/dist/components/conversation-panel.js +5 -4
- package/dist/components/conversation-panel.js.map +1 -1
- package/dist/components/email-body.js +39 -1
- package/dist/components/email-body.js.map +1 -1
- package/dist/components/pill.d.ts +1 -1
- package/dist/components/tabs.d.ts +1 -1
- package/dist/prototype/prototype-inbox-view.js +124 -70
- package/dist/prototype/prototype-inbox-view.js.map +1 -1
- package/package.json +1 -1
- package/src/components/__tests__/comment-composer.test.tsx +22 -3
- package/src/components/__tests__/conversation-panel.test.tsx +118 -0
- package/src/components/__tests__/email-body.test.tsx +32 -0
- package/src/components/comment-composer.tsx +40 -14
- package/src/components/conversation-panel.tsx +14 -7
- package/src/components/email-body.tsx +46 -1
- package/src/prototype/__tests__/detail-view-case-panel-v2.test.tsx +21 -3
- package/src/prototype/__tests__/detail-view-timeline-system-events.test.tsx +42 -14
- package/src/prototype/prototype-inbox-view.tsx +102 -56
|
@@ -3,7 +3,7 @@ import * as React from 'react';
|
|
|
3
3
|
import { VariantProps } from 'class-variance-authority';
|
|
4
4
|
|
|
5
5
|
declare const badgeVariants: (props?: ({
|
|
6
|
-
variant?: "
|
|
6
|
+
variant?: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
|
|
7
7
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
8
8
|
declare function Badge({ className, variant, asChild, ...props }: React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
|
|
9
9
|
asChild?: boolean;
|
|
@@ -3,7 +3,7 @@ import * as React from 'react';
|
|
|
3
3
|
import { VariantProps } from 'class-variance-authority';
|
|
4
4
|
|
|
5
5
|
declare const buttonVariants: (props?: ({
|
|
6
|
-
variant?: "
|
|
6
|
+
variant?: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
|
|
7
7
|
size?: "default" | "sm" | "lg" | "icon" | null | undefined;
|
|
8
8
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
9
9
|
declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
|
|
@@ -20,10 +20,12 @@ interface CommentComposerProps {
|
|
|
20
20
|
avatarUrl?: string | null;
|
|
21
21
|
};
|
|
22
22
|
placeholder?: string;
|
|
23
|
+
/** Compact spacing for the case-panel timeline surface. Defaults preserve the standard composer sizing. */
|
|
24
|
+
density?: "default" | "case-panel";
|
|
23
25
|
/** Hint shown in the footer; defaults to the internal-note reassurance. */
|
|
24
26
|
hint?: string;
|
|
25
27
|
className?: string;
|
|
26
28
|
}
|
|
27
|
-
declare function CommentComposer({ onPost, author, placeholder, hint, className, }: CommentComposerProps): React.JSX.Element;
|
|
29
|
+
declare function CommentComposer({ onPost, author, placeholder, density, hint, className, }: CommentComposerProps): React.JSX.Element;
|
|
28
30
|
|
|
29
31
|
export { CommentComposer, type CommentComposerProps };
|
|
@@ -13,6 +13,7 @@ function CommentComposer({
|
|
|
13
13
|
onPost,
|
|
14
14
|
author,
|
|
15
15
|
placeholder = "Add a comment or internal note\u2026",
|
|
16
|
+
density = "default",
|
|
16
17
|
hint = "Internal note: only your team sees this",
|
|
17
18
|
className
|
|
18
19
|
}) {
|
|
@@ -21,6 +22,8 @@ function CommentComposer({
|
|
|
21
22
|
const [focused, setFocused] = React.useState(false);
|
|
22
23
|
const open = focused || text.length > 0;
|
|
23
24
|
const canPost = text.trim().length > 0;
|
|
25
|
+
const hasDraft = text.length > 0;
|
|
26
|
+
const compact = density === "case-panel";
|
|
24
27
|
const post = () => {
|
|
25
28
|
const value = text.trim();
|
|
26
29
|
if (!value) return;
|
|
@@ -34,64 +37,85 @@ function CommentComposer({
|
|
|
34
37
|
"data-slot": "comment-composer",
|
|
35
38
|
"data-open": open ? "true" : void 0,
|
|
36
39
|
className: cn(
|
|
37
|
-
"
|
|
38
|
-
open && "ring-ring/30 ring-2",
|
|
40
|
+
"flex items-start gap-4 rounded-xl transition-colors",
|
|
39
41
|
className
|
|
40
42
|
),
|
|
41
43
|
children: [
|
|
42
|
-
/* @__PURE__ */ jsxs(Avatar, { size: "sm", className: "mt-
|
|
44
|
+
/* @__PURE__ */ jsxs(Avatar, { size: "sm", className: "mt-1", children: [
|
|
43
45
|
(author == null ? void 0 : author.avatarUrl) ? /* @__PURE__ */ jsx(AvatarImage, { src: author.avatarUrl, alt: (_a = author.name) != null ? _a : "You" }) : null,
|
|
44
|
-
/* @__PURE__ */ jsx(AvatarFallback, { className: "bg-
|
|
46
|
+
/* @__PURE__ */ jsx(AvatarFallback, { className: "bg-slate-700 text-[10px] font-semibold uppercase text-white dark:bg-slate-200 dark:text-slate-900", children: getInitials({ name: author == null ? void 0 : author.name, email: author == null ? void 0 : author.email }) })
|
|
45
47
|
] }),
|
|
46
|
-
/* @__PURE__ */ jsxs(
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
rows: open ? 3 : 1,
|
|
56
|
-
className: cn(
|
|
57
|
-
"resize-none border-0 bg-transparent px-1 py-0.5 text-sm leading-snug shadow-none focus-visible:ring-0",
|
|
58
|
-
!open && "min-h-0"
|
|
59
|
-
),
|
|
60
|
-
onKeyDown: (e) => {
|
|
61
|
-
if ((e.metaKey || e.ctrlKey) && e.key === "Enter") {
|
|
62
|
-
e.preventDefault();
|
|
63
|
-
post();
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
),
|
|
68
|
-
open ? /* @__PURE__ */ jsxs("div", { className: "mt-0.5 flex items-center justify-between gap-2", children: [
|
|
69
|
-
/* @__PURE__ */ jsxs("span", { className: "text-muted-foreground inline-flex items-center gap-1 text-[11px]", children: [
|
|
70
|
-
/* @__PURE__ */ jsx(Lock, { size: 12 }),
|
|
71
|
-
" ",
|
|
72
|
-
hint
|
|
73
|
-
] }),
|
|
74
|
-
/* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
|
|
48
|
+
/* @__PURE__ */ jsxs(
|
|
49
|
+
"div",
|
|
50
|
+
{
|
|
51
|
+
"data-slot": "comment-composer-shell",
|
|
52
|
+
className: cn(
|
|
53
|
+
"min-w-0 flex-1 rounded-xl border border-border bg-background transition-[box-shadow,border-color]",
|
|
54
|
+
open ? "overflow-hidden shadow-sm" : "shadow-none"
|
|
55
|
+
),
|
|
56
|
+
children: [
|
|
75
57
|
/* @__PURE__ */ jsx(
|
|
76
|
-
|
|
58
|
+
Textarea,
|
|
77
59
|
{
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
60
|
+
"data-slot": "comment-composer-input",
|
|
61
|
+
value: text,
|
|
62
|
+
onChange: (e) => setText(e.target.value),
|
|
63
|
+
onFocus: () => setFocused(true),
|
|
64
|
+
placeholder,
|
|
65
|
+
rows: compact ? hasDraft ? 3 : 1 : open ? 4 : 1,
|
|
66
|
+
className: cn(
|
|
67
|
+
"resize-none rounded-none border-0 bg-transparent px-5 text-[15px] leading-6 shadow-none outline-none placeholder:text-muted-foreground/60 focus-visible:ring-0 focus-visible:ring-offset-0",
|
|
68
|
+
compact ? open ? "py-4" : "py-3" : "py-4",
|
|
69
|
+
compact ? hasDraft ? "!min-h-28" : open ? "!min-h-[76px]" : "!min-h-12" : open ? "min-h-32" : "min-h-14"
|
|
70
|
+
),
|
|
71
|
+
onKeyDown: (e) => {
|
|
72
|
+
if ((e.metaKey || e.ctrlKey) && e.key === "Enter") {
|
|
73
|
+
e.preventDefault();
|
|
74
|
+
post();
|
|
75
|
+
}
|
|
76
|
+
}
|
|
86
77
|
}
|
|
87
78
|
),
|
|
88
|
-
/* @__PURE__ */ jsxs(
|
|
89
|
-
"
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
79
|
+
open ? /* @__PURE__ */ jsxs("div", { className: cn("flex items-center justify-between gap-3 border-t border-border bg-muted/10 px-5", compact ? "py-3.5" : "py-4"), children: [
|
|
80
|
+
/* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 text-sm text-muted-foreground", children: [
|
|
81
|
+
/* @__PURE__ */ jsx(Lock, { size: 16, strokeWidth: 1.75 }),
|
|
82
|
+
" ",
|
|
83
|
+
hint
|
|
84
|
+
] }),
|
|
85
|
+
/* @__PURE__ */ jsxs("span", { className: "flex items-center gap-3", children: [
|
|
86
|
+
/* @__PURE__ */ jsx(
|
|
87
|
+
Button,
|
|
88
|
+
{
|
|
89
|
+
type: "button",
|
|
90
|
+
variant: "ghost",
|
|
91
|
+
size: "sm",
|
|
92
|
+
className: "px-2 text-sm font-medium text-muted-foreground hover:bg-transparent hover:text-foreground",
|
|
93
|
+
onClick: () => {
|
|
94
|
+
setText("");
|
|
95
|
+
setFocused(false);
|
|
96
|
+
},
|
|
97
|
+
children: "Cancel"
|
|
98
|
+
}
|
|
99
|
+
),
|
|
100
|
+
/* @__PURE__ */ jsxs(
|
|
101
|
+
Button,
|
|
102
|
+
{
|
|
103
|
+
type: "button",
|
|
104
|
+
size: "sm",
|
|
105
|
+
disabled: !canPost,
|
|
106
|
+
onClick: post,
|
|
107
|
+
className: "rounded-lg bg-foreground px-4 text-sm font-semibold text-background shadow-none hover:bg-foreground/90",
|
|
108
|
+
children: [
|
|
109
|
+
"Comment",
|
|
110
|
+
/* @__PURE__ */ jsx("kbd", { className: "ml-1 rounded px-1 text-[10px] text-background/70", children: "\u2318\u21B5" })
|
|
111
|
+
]
|
|
112
|
+
}
|
|
113
|
+
)
|
|
114
|
+
] })
|
|
115
|
+
] }) : null
|
|
116
|
+
]
|
|
117
|
+
}
|
|
118
|
+
)
|
|
95
119
|
]
|
|
96
120
|
}
|
|
97
121
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/comment-composer.tsx"],"sourcesContent":["\"use client\"\n\n/**\n * comment-composer.tsx — an internal-note composer for the case activity\n * timeline. Posting a comment prepends an `operatorNote` event to the log\n * (wired by the consumer). Collapses to a single line; expands on focus or\n * when it has text. ⌘↵ / Ctrl↵ posts.\n *\n * Presentational: `onPost` does the work (the consumer persists the note and\n * adds it to the timeline). Reuses Avatar / Button / Textarea primitives.\n */\n\nimport * as React from \"react\"\nimport { Lock } from \"lucide-react\"\n\nimport { cn } from \"../lib/utils\"\nimport { getInitials } from \"../lib/user-display\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"./avatar\"\nimport { Button } from \"./button\"\nimport { Textarea } from \"./textarea\"\n\nexport interface CommentComposerProps {\n /** Called with the trimmed note text when the operator posts. */\n onPost: (text: string) => void\n /** Current operator (for the avatar). */\n author?: { name?: string; email?: string; avatarUrl?: string | null }\n placeholder?: string\n /** Hint shown in the footer; defaults to the internal-note reassurance. */\n hint?: string\n className?: string\n}\n\nfunction CommentComposer({\n onPost,\n author,\n placeholder = \"Add a comment or internal note…\",\n hint = \"Internal note: only your team sees this\",\n className,\n}: CommentComposerProps) {\n const [text, setText] = React.useState(\"\")\n const [focused, setFocused] = React.useState(false)\n const open = focused || text.length > 0\n const canPost = text.trim().length > 0\n\n const post = () => {\n const value = text.trim()\n if (!value) return\n onPost(value)\n setText(\"\")\n setFocused(false)\n }\n\n return (\n <div\n data-slot=\"comment-composer\"\n data-open={open ? \"true\" : undefined}\n className={cn(\n \"
|
|
1
|
+
{"version":3,"sources":["../../src/components/comment-composer.tsx"],"sourcesContent":["\"use client\"\n\n/**\n * comment-composer.tsx — an internal-note composer for the case activity\n * timeline. Posting a comment prepends an `operatorNote` event to the log\n * (wired by the consumer). Collapses to a single line; expands on focus or\n * when it has text. ⌘↵ / Ctrl↵ posts.\n *\n * Presentational: `onPost` does the work (the consumer persists the note and\n * adds it to the timeline). Reuses Avatar / Button / Textarea primitives.\n */\n\nimport * as React from \"react\"\nimport { Lock } from \"lucide-react\"\n\nimport { cn } from \"../lib/utils\"\nimport { getInitials } from \"../lib/user-display\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"./avatar\"\nimport { Button } from \"./button\"\nimport { Textarea } from \"./textarea\"\n\nexport interface CommentComposerProps {\n /** Called with the trimmed note text when the operator posts. */\n onPost: (text: string) => void\n /** Current operator (for the avatar). */\n author?: { name?: string; email?: string; avatarUrl?: string | null }\n placeholder?: string\n /** Compact spacing for the case-panel timeline surface. Defaults preserve the standard composer sizing. */\n density?: \"default\" | \"case-panel\"\n /** Hint shown in the footer; defaults to the internal-note reassurance. */\n hint?: string\n className?: string\n}\n\nfunction CommentComposer({\n onPost,\n author,\n placeholder = \"Add a comment or internal note…\",\n density = \"default\",\n hint = \"Internal note: only your team sees this\",\n className,\n}: CommentComposerProps) {\n const [text, setText] = React.useState(\"\")\n const [focused, setFocused] = React.useState(false)\n const open = focused || text.length > 0\n const canPost = text.trim().length > 0\n const hasDraft = text.length > 0\n const compact = density === \"case-panel\"\n\n const post = () => {\n const value = text.trim()\n if (!value) return\n onPost(value)\n setText(\"\")\n setFocused(false)\n }\n\n return (\n <div\n data-slot=\"comment-composer\"\n data-open={open ? \"true\" : undefined}\n className={cn(\n \"flex items-start gap-4 rounded-xl transition-colors\",\n className\n )}\n >\n <Avatar size=\"sm\" className=\"mt-1\">\n {author?.avatarUrl ? <AvatarImage src={author.avatarUrl} alt={author.name ?? \"You\"} /> : null}\n <AvatarFallback className=\"bg-slate-700 text-[10px] font-semibold uppercase text-white dark:bg-slate-200 dark:text-slate-900\">\n {getInitials({ name: author?.name, email: author?.email })}\n </AvatarFallback>\n </Avatar>\n\n <div\n data-slot=\"comment-composer-shell\"\n className={cn(\n \"min-w-0 flex-1 rounded-xl border border-border bg-background transition-[box-shadow,border-color]\",\n open ? \"overflow-hidden shadow-sm\" : \"shadow-none\"\n )}\n >\n <Textarea\n data-slot=\"comment-composer-input\"\n value={text}\n onChange={(e) => setText(e.target.value)}\n onFocus={() => setFocused(true)}\n placeholder={placeholder}\n rows={compact ? (hasDraft ? 3 : 1) : (open ? 4 : 1)}\n className={cn(\n \"resize-none rounded-none border-0 bg-transparent px-5 text-[15px] leading-6 shadow-none outline-none placeholder:text-muted-foreground/60 focus-visible:ring-0 focus-visible:ring-offset-0\",\n compact ? (open ? \"py-4\" : \"py-3\") : \"py-4\",\n compact\n ? hasDraft\n ? \"!min-h-28\"\n : open\n ? \"!min-h-[76px]\"\n : \"!min-h-12\"\n : open\n ? \"min-h-32\"\n : \"min-h-14\"\n )}\n onKeyDown={(e) => {\n if ((e.metaKey || e.ctrlKey) && e.key === \"Enter\") {\n e.preventDefault()\n post()\n }\n }}\n />\n\n {open ? (\n <div className={cn(\"flex items-center justify-between gap-3 border-t border-border bg-muted/10 px-5\", compact ? \"py-3.5\" : \"py-4\")}>\n <span className=\"inline-flex items-center gap-2 text-sm text-muted-foreground\">\n <Lock size={16} strokeWidth={1.75} /> {hint}\n </span>\n <span className=\"flex items-center gap-3\">\n <Button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n className=\"px-2 text-sm font-medium text-muted-foreground hover:bg-transparent hover:text-foreground\"\n onClick={() => {\n setText(\"\")\n setFocused(false)\n }}\n >\n Cancel\n </Button>\n <Button\n type=\"button\"\n size=\"sm\"\n disabled={!canPost}\n onClick={post}\n className=\"rounded-lg bg-foreground px-4 text-sm font-semibold text-background shadow-none hover:bg-foreground/90\"\n >\n Comment\n <kbd className=\"ml-1 rounded px-1 text-[10px] text-background/70\">⌘↵</kbd>\n </Button>\n </span>\n </div>\n ) : null}\n </div>\n </div>\n )\n}\n\nexport { CommentComposer }\n"],"mappings":"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","names":[]}
|
|
@@ -769,17 +769,18 @@ function ConversationPanel({
|
|
|
769
769
|
defaultOpenThreadId,
|
|
770
770
|
className
|
|
771
771
|
}) {
|
|
772
|
+
var _a, _b, _c, _d, _e;
|
|
772
773
|
const responded = threads.filter((t) => t.status === "responded" && t.canReply !== false).length;
|
|
773
774
|
const draft = threads.filter((t) => effectiveStatus(t) === "draft").length;
|
|
774
775
|
const awaiting = threads.filter((t) => effectiveStatus(t) === "awaiting").length;
|
|
775
776
|
const anyPaused = threads.some((t) => t.paused);
|
|
776
|
-
const
|
|
777
|
+
const prioritizedThread = (_b = (_a = threads.find((t) => t.status === "responded" && t.canReply !== false)) != null ? _a : threads.find((t) => effectiveStatus(t) === "draft")) != null ? _b : threads.find((t) => effectiveStatus(t) === "awaiting");
|
|
778
|
+
const hubGmailThread = (_e = (_d = (_c = threads.find((t) => t.status === "responded" && t.canReply !== false && canOpenInGmail(t, onOpenInGmail))) != null ? _c : threads.find((t) => effectiveStatus(t) === "draft" && canOpenInGmail(t, onOpenInGmail))) != null ? _d : threads.find((t) => effectiveStatus(t) === "awaiting" && canOpenInGmail(t, onOpenInGmail))) != null ? _e : threads.find((t) => canOpenInGmail(t, onOpenInGmail));
|
|
777
779
|
const firstAwaiting = threads.find((t) => effectiveStatus(t) === "awaiting");
|
|
778
780
|
const [hubOpen, setHubOpen] = React.useState(true);
|
|
779
781
|
const [openId, setOpenId] = React.useState(() => {
|
|
780
782
|
if (defaultOpenThreadId) return defaultOpenThreadId;
|
|
781
|
-
|
|
782
|
-
return firstActionable ? firstActionable.threadId : null;
|
|
783
|
+
return prioritizedThread ? prioritizedThread.threadId : null;
|
|
783
784
|
});
|
|
784
785
|
if (!threads.length) return null;
|
|
785
786
|
const badge = responded > 0 ? { label: "Email response detected", dot: "bg-status-warning-fg", ring: "bg-status-warning-fg/30" } : draft > 0 ? { label: "Draft ready", dot: "bg-status-pending-fg", ring: "bg-status-pending-fg/30" } : awaiting > 0 ? { label: "Email sent \xB7 awaiting reply", dot: "bg-status-info-fg", ring: "bg-status-info-fg/30" } : { label: "Conversations", dot: "bg-muted-foreground/50", ring: "bg-muted-foreground/20" };
|
|
@@ -820,7 +821,7 @@ function ConversationPanel({
|
|
|
820
821
|
"data-slot": "conversation-badge",
|
|
821
822
|
className: cn(
|
|
822
823
|
"inline-flex items-center gap-1.5 rounded-full px-2 py-0.5 text-[11px] font-semibold",
|
|
823
|
-
responded > 0 ? "bg-status-warning-bg text-status-warning-fg" :
|
|
824
|
+
responded > 0 ? "bg-status-warning-bg text-status-warning-fg" : draft > 0 ? "bg-status-pending-bg text-status-pending-fg" : awaiting > 0 ? "bg-status-info-bg text-status-info-fg" : "bg-muted text-muted-foreground"
|
|
824
825
|
),
|
|
825
826
|
children: [
|
|
826
827
|
/* @__PURE__ */ jsxs("span", { className: "relative inline-flex size-2", children: [
|