@arbidocs/blocks 0.4.1 → 0.4.3

package/dist/settings/index.js

@@ -8,6 +8,7 @@ import { ModalScaffold, useRestoreFocus, ModalSection, ModalSectionTitle, ModalH
 export { MODAL_SECTION_TITLE_CLASS, ModalHeader, ModalScaffold, ModalSection, ModalSectionTitle } from '../chunk-TX2ZICS7.js';
 import { TabHeader } from '../chunk-UBNVIIBT.js';
 import '../chunk-NPLYHR2E.js';
+import { formatCount } from '../chunk-OXF2IFXG.js';
 import { testIdOr, prefixedTestId } from '../chunk-7F6CBP3Z.js';
 import { useMemo, useRef, useId, useState, useEffect, Fragment as Fragment$1 } from 'react';
 import { AlertTriangle, CheckCircle2, AlertCircle, Loader2, LogOut, ChevronDown, ChevronRight, Radio, History, Undo2, Star, Trash2, Users, Sparkles, Brain, RefreshCw, Wifi, WifiOff, Crown, Pencil, Plus, Search, ChevronsUpDown, TriangleAlert, Filter, MoreVertical, Check, Tag, Info, Gift, PlugIcon, ExternalLink, ShieldCheck, Plug, Camera, MessageCircleQuestionMark, BookOpen, UserPlus, BadgeCent, ChartNoAxesColumn, FileText, X, Mail, Send, Clock, Infinity, ArrowRight, Copy, FunnelX, Ban } from 'lucide-react';
@@ -92,7 +93,7 @@ var DEFAULT_PASSWORD_CHANGE_DIALOG_LABELS = {
   newPassword: "New Password",
   confirmPassword: "Confirm Password",
   confirmNewPassword: "Confirm New Password",
-  workspacesRekeyed: (count) => `${count} workspace${count !== 1 ? "s" : ""} will be re-keyed with your new password.`,
+  workspacesRekeyed: (count) => `${formatCount(count, { one: "workspace", other: "workspaces" })} will be re-keyed with your new password.`,
   cancel: "Cancel",
   settingPassword: "Setting Password...",
   changingPassword: "Changing Password...",
@@ -263,8 +264,8 @@ var DEFAULT_LOGOUT_DIALOG_LABELS = {
   offlineTooltip: "Ending all sessions needs a connection \u2014 you can still log out of this device.",
   thisSession: "This session",
   offlineNote: "You\u2019re offline \u2014 ending all sessions needs a connection. You can still log out of this device.",
-  activeSessions: (count) => `${count} active session${count > 1 ? "s" : ""}`,
-  workspaces: (count) => `${count} workspace${count > 1 ? "s" : ""}`,
+  activeSessions: (count) => formatCount(count, { one: "active session", other: "active sessions" }),
+  workspaces: (count) => formatCount(count, { one: "workspace", other: "workspaces" }),
   ttl: (ttlLabel) => `TTL ${ttlLabel}`
 };
 function SessionRow({
@@ -446,7 +447,7 @@ function SettingsRow({
       "data-slot": "settings-row",
       "data-testid": testId,
       className: cn(
-        "flex flex-col gap-2 py-2 sm:flex-row sm:items-center sm:justify-between sm:gap-6",
+        "flex flex-col gap-2 py-2 @xl:flex-row @xl:items-center @xl:justify-between @xl:gap-6",
         className
       ),
       ...props,
@@ -1193,6 +1194,7 @@ function ThreadPreviewDialog({
     }
   ) });
 }
+var ITEMS = { one: "item", other: "items" };
 function isInlineObject(data) {
   if (data === null || data === void 0) return true;
   if (typeof data !== "object") return true;
@@ -1215,12 +1217,12 @@ function inlineSummary(data) {
 function arrayPreview(data) {
   if (data.length === 0) return "[]";
   const first = data[0];
-  if (typeof first !== "object" || first === null) return `[${data.length} items]`;
+  if (typeof first !== "object" || first === null) return `[${formatCount(data.length, ITEMS)}]`;
   const obj = first;
   const previewKeys = ["action", "step", "phase", "tool", "name", "type", "id"];
   const parts = previewKeys.filter((k) => obj[k] !== void 0).slice(0, 3).map((k) => `${k}: ${JSON.stringify(obj[k])}`);
-  if (parts.length === 0) return `[${data.length} items]`;
-  return `[${data.length} items \u2014 { ${parts.join(", ")} }, \u2026]`;
+  if (parts.length === 0) return `[${formatCount(data.length, ITEMS)}]`;
+  return `[${formatCount(data.length, ITEMS)} \u2014 { ${parts.join(", ")} }, \u2026]`;
 }
 var NAME_CLASS = "font-medium text-blue-600 dark:text-blue-400";
 var COPY_CLASS = "rounded p-0.5 opacity-50 transition-opacity hover:bg-muted hover:opacity-100 focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:flex pointer-coarse:size-11 pointer-coarse:items-center pointer-coarse:justify-center pointer-coarse:opacity-100";
@@ -2508,7 +2510,7 @@ function PlanCardGrid({
     {
       className: cn(
         "grid gap-2",
-        plans.length === 4 ? "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4" : "grid-cols-1 sm:grid-cols-3"
+        plans.length === 4 ? "grid-cols-1 @xl:grid-cols-2 @4xl:grid-cols-4" : "grid-cols-1 @xl:grid-cols-3"
       ),
       children: plans.map((plan) => /* @__PURE__ */ jsx(PlanCard, { plan, onSelect, labels }, plan.id))
     }
@@ -4117,7 +4119,7 @@ function ProfileCard({
       avatar,
       /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-3", children: [
         name.isEditing ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 sm:flex-row", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 @xl:flex-row", children: [
             /* @__PURE__ */ jsx(
               Input,
               {
@@ -4502,7 +4504,7 @@ function PlanPickerCard({ children }) {
   return /* @__PURE__ */ jsx("div", { "data-slot": "plan-picker-card", className: "space-y-4 rounded-lg bg-muted p-4", children });
 }
 function PlanActionRow({ children }) {
-  return /* @__PURE__ */ jsx("div", { "data-slot": "plan-action-row", className: "flex flex-col-reverse gap-2 sm:flex-row", children });
+  return /* @__PURE__ */ jsx("div", { "data-slot": "plan-action-row", className: "flex flex-col-reverse gap-2 @xl:flex-row", children });
 }
 function PlanActionButton({
   tone = "primary",