@arbidocs/blocks 0.3.126 → 0.3.128
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/index.cjs +109 -39
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +44 -10
- package/dist/index.d.ts +44 -10
- package/dist/index.js +111 -41
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/dist/index.cjs
CHANGED
|
@@ -1057,82 +1057,152 @@ function MetricCard({
|
|
|
1057
1057
|
] })
|
|
1058
1058
|
] });
|
|
1059
1059
|
}
|
|
1060
|
-
var MAX_AVATARS =
|
|
1060
|
+
var MAX_AVATARS = 3;
|
|
1061
|
+
var ON_HOVER = "opacity-0 transition-opacity group-hover:opacity-100 group-focus-within:opacity-100";
|
|
1061
1062
|
function WorkspaceCard({
|
|
1062
1063
|
name,
|
|
1063
1064
|
matterRef,
|
|
1064
1065
|
description,
|
|
1065
1066
|
docCount,
|
|
1067
|
+
chatCount,
|
|
1066
1068
|
memberCount,
|
|
1067
1069
|
members = [],
|
|
1070
|
+
membersHidden = false,
|
|
1068
1071
|
updatedAt,
|
|
1069
1072
|
active = false,
|
|
1070
1073
|
busy = false,
|
|
1071
1074
|
onOpen,
|
|
1072
1075
|
icon: Icon = lucideReact.FolderLock,
|
|
1076
|
+
iconSlot,
|
|
1077
|
+
cornerSlot,
|
|
1078
|
+
accent = "default",
|
|
1073
1079
|
testId,
|
|
1074
1080
|
buttonTestId,
|
|
1075
1081
|
className
|
|
1076
1082
|
}) {
|
|
1077
1083
|
const totalMembers = memberCount ?? members.length;
|
|
1078
|
-
const shownMembers = members.slice(0, MAX_AVATARS);
|
|
1084
|
+
const shownMembers = membersHidden ? [] : members.slice(0, MAX_AVATARS);
|
|
1079
1085
|
const extraMembers = totalMembers - shownMembers.length;
|
|
1080
1086
|
const btnTestId = buttonTestId ?? (testId ? `${testId}-open` : void 0);
|
|
1087
|
+
const hue = accent && accent !== "default" ? `var(--color-${accent})` : null;
|
|
1088
|
+
const tileStyle = hue ? { backgroundColor: `color-mix(in oklab, ${hue} 14%, transparent)`, color: hue } : void 0;
|
|
1089
|
+
const buttonStyle = hue ? { backgroundColor: hue, color: "var(--color-primary-foreground)" } : void 0;
|
|
1081
1090
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1082
1091
|
react.Card,
|
|
1083
1092
|
{
|
|
1084
1093
|
variant: "outline",
|
|
1085
|
-
className: react.cn(
|
|
1094
|
+
className: react.cn(
|
|
1095
|
+
"card-hover group flex flex-col gap-3 p-4",
|
|
1096
|
+
// The current workspace is marked by a ring, not a badge — the footer
|
|
1097
|
+
// already says "Current workspace" in words.
|
|
1098
|
+
active && "ring-1 ring-primary",
|
|
1099
|
+
className
|
|
1100
|
+
),
|
|
1086
1101
|
"data-testid": testId,
|
|
1087
1102
|
children: [
|
|
1088
|
-
/* @__PURE__ */ jsxRuntime.jsxs(react.CardHeader, { className: "p-0", children: [
|
|
1089
|
-
/* @__PURE__ */ jsxRuntime.
|
|
1090
|
-
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
|
|
1103
|
+
/* @__PURE__ */ jsxRuntime.jsxs(react.CardHeader, { className: "flex flex-row items-start gap-3 p-0", children: [
|
|
1104
|
+
iconSlot ?? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1105
|
+
"div",
|
|
1106
|
+
{
|
|
1107
|
+
className: "flex size-9 shrink-0 items-center justify-center rounded-md bg-primary/10 text-primary",
|
|
1108
|
+
style: tileStyle,
|
|
1109
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "size-5" })
|
|
1110
|
+
}
|
|
1111
|
+
),
|
|
1112
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
|
|
1113
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1114
|
+
react.CardTitle,
|
|
1115
|
+
{
|
|
1116
|
+
className: "line-clamp-2 text-base leading-tight",
|
|
1117
|
+
"data-testid": testId && `${testId}-title`,
|
|
1118
|
+
children: name
|
|
1119
|
+
}
|
|
1120
|
+
),
|
|
1121
|
+
matterRef && /* @__PURE__ */ jsxRuntime.jsx(react.CardDescription, { className: "mt-0.5 truncate text-xs font-medium uppercase tracking-wide text-muted-foreground", children: matterRef })
|
|
1095
1122
|
] }),
|
|
1096
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1097
|
-
matterRef && /* @__PURE__ */ jsxRuntime.jsx(react.CardDescription, { className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: matterRef })
|
|
1123
|
+
cornerSlot && /* @__PURE__ */ jsxRuntime.jsx("div", { className: react.cn("shrink-0", ON_HOVER), children: cornerSlot })
|
|
1098
1124
|
] }),
|
|
1099
|
-
/* @__PURE__ */ jsxRuntime.jsxs(react.CardContent, { className: "
|
|
1125
|
+
/* @__PURE__ */ jsxRuntime.jsxs(react.CardContent, { className: "flex flex-1 flex-col gap-2 p-0", children: [
|
|
1100
1126
|
description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "line-clamp-2 text-sm text-muted-foreground", children: description }),
|
|
1101
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-
|
|
1102
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1
|
|
1103
|
-
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { className: "size-
|
|
1104
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: docCount.toLocaleString() })
|
|
1105
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "docs" })
|
|
1127
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3 text-sm", children: [
|
|
1128
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1 text-foreground", title: "Documents", children: [
|
|
1129
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { className: "size-3.5 text-muted-foreground" }),
|
|
1130
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium tabular-nums", children: docCount.toLocaleString() })
|
|
1106
1131
|
] }),
|
|
1107
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1
|
|
1108
|
-
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.
|
|
1109
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children:
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1132
|
+
chatCount !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1 text-foreground", title: "Chats", children: [
|
|
1133
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessagesSquare, { className: "size-3.5 text-muted-foreground" }),
|
|
1134
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium tabular-nums", children: chatCount.toLocaleString() })
|
|
1135
|
+
] }),
|
|
1136
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1 text-foreground", title: "Members", children: [
|
|
1137
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Users, { className: "size-3.5 text-muted-foreground" }),
|
|
1138
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1139
|
+
"span",
|
|
1140
|
+
{
|
|
1141
|
+
className: "font-medium tabular-nums",
|
|
1142
|
+
"data-testid": testId && `${testId}-member-count`,
|
|
1143
|
+
children: membersHidden ? "\u2014" : totalMembers
|
|
1144
|
+
}
|
|
1145
|
+
)
|
|
1146
|
+
] }),
|
|
1147
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex shrink-0 -space-x-2", children: [
|
|
1148
|
+
shownMembers.map((m, i) => /* @__PURE__ */ jsxRuntime.jsxs(react.Avatar, { className: "size-6 border-2 border-card", title: m.name, children: [
|
|
1116
1149
|
m.picture && /* @__PURE__ */ jsxRuntime.jsx(react.AvatarImage, { src: m.picture, alt: m.name }),
|
|
1117
|
-
/* @__PURE__ */ jsxRuntime.jsx(react.AvatarFallback, { className: "bg-foreground text-[
|
|
1150
|
+
/* @__PURE__ */ jsxRuntime.jsx(react.AvatarFallback, { className: "bg-foreground text-[9px] font-medium text-background", children: chunkAHWIZJ4M_cjs.initials(m.name || "?") })
|
|
1118
1151
|
] }, i)),
|
|
1119
|
-
extraMembers > 0 && /* @__PURE__ */ jsxRuntime.jsx(react.Avatar, { className: "size-
|
|
1152
|
+
!membersHidden && extraMembers > 0 && /* @__PURE__ */ jsxRuntime.jsx(react.Avatar, { className: "size-6 border-2 border-card", children: /* @__PURE__ */ jsxRuntime.jsxs(react.AvatarFallback, { className: "bg-accent text-[9px] font-medium text-muted-foreground", children: [
|
|
1120
1153
|
"+",
|
|
1121
1154
|
extraMembers
|
|
1122
1155
|
] }) })
|
|
1123
|
-
] }),
|
|
1124
|
-
updatedAt && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", title: chunkAHWIZJ4M_cjs.fmtDate(updatedAt), children: [
|
|
1125
|
-
"Updated ",
|
|
1126
|
-
chunkAHWIZJ4M_cjs.fromNow(updatedAt)
|
|
1127
1156
|
] })
|
|
1128
1157
|
] })
|
|
1129
1158
|
] }),
|
|
1130
|
-
/* @__PURE__ */ jsxRuntime.jsx(react.CardFooter, { className: "
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1135
|
-
|
|
1159
|
+
/* @__PURE__ */ jsxRuntime.jsx(react.CardFooter, { className: "grid min-h-8 place-items-center p-0", children: active ? (
|
|
1160
|
+
// Reads as a statement, not a call to action — but stays clickable, so
|
|
1161
|
+
// re-entering the workspace you're already in still works.
|
|
1162
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1163
|
+
react.Button,
|
|
1164
|
+
{
|
|
1165
|
+
variant: "ghost",
|
|
1166
|
+
size: "sm",
|
|
1167
|
+
className: "col-start-1 row-start-1 h-8 whitespace-nowrap px-2 text-xs font-medium text-primary hover:bg-primary/10",
|
|
1168
|
+
onClick: onOpen,
|
|
1169
|
+
"data-testid": btnTestId,
|
|
1170
|
+
children: [
|
|
1171
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle2, { className: "size-3.5" }),
|
|
1172
|
+
" Current workspace"
|
|
1173
|
+
]
|
|
1174
|
+
}
|
|
1175
|
+
)
|
|
1176
|
+
) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1177
|
+
updatedAt && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1178
|
+
"span",
|
|
1179
|
+
{
|
|
1180
|
+
className: react.cn(
|
|
1181
|
+
"col-start-1 row-start-1 whitespace-nowrap text-xs text-muted-foreground",
|
|
1182
|
+
"transition-opacity group-hover:opacity-0 group-focus-within:opacity-0"
|
|
1183
|
+
),
|
|
1184
|
+
title: chunkAHWIZJ4M_cjs.fmtDate(updatedAt),
|
|
1185
|
+
children: [
|
|
1186
|
+
"Updated ",
|
|
1187
|
+
chunkAHWIZJ4M_cjs.fromNow(updatedAt)
|
|
1188
|
+
]
|
|
1189
|
+
}
|
|
1190
|
+
),
|
|
1191
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1192
|
+
react.Button,
|
|
1193
|
+
{
|
|
1194
|
+
size: "sm",
|
|
1195
|
+
className: react.cn("col-start-1 row-start-1 whitespace-nowrap", ON_HOVER),
|
|
1196
|
+
style: buttonStyle,
|
|
1197
|
+
onClick: onOpen,
|
|
1198
|
+
disabled: busy,
|
|
1199
|
+
"data-testid": btnTestId,
|
|
1200
|
+
children: [
|
|
1201
|
+
busy ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeftRight, { className: "size-3.5" }),
|
|
1202
|
+
"Open"
|
|
1203
|
+
]
|
|
1204
|
+
}
|
|
1205
|
+
)
|
|
1136
1206
|
] }) })
|
|
1137
1207
|
]
|
|
1138
1208
|
}
|