@nadicodeai/ui 12.1.102 → 12.1.104

package/dist/showcase/specimens/navigation.d.ts

@@ -1,20 +1,22 @@
 declare function CommandDialogSpecimen(): import("react").JSX.Element;
 declare function ScopeSwitcherSpecimen(): import("react").JSX.Element;
 declare function SidebarSectionsSpecimen(): import("react").JSX.Element;
+declare function TabsSpecimen(): import("react").JSX.Element;
 export declare const NAVIGATION: {
     AgentListRow: () => import("react").JSX.Element;
     Breadcrumb: () => import("react").JSX.Element;
     CommandDialog: typeof CommandDialogSpecimen;
-    DashboardShell: () => import("react").JSX.Element;
     DesktopAppShell: () => import("react").JSX.Element;
     Footer: () => import("react").JSX.Element;
-    NavigationMenu: () => import("react").JSX.Element;
-    Pagination: () => import("react").JSX.Element;
     PortalSidebarFrame: () => import("react").JSX.Element;
     ScopeSwitcher: typeof ScopeSwitcherSpecimen;
     Sidebar: () => import("react").JSX.Element;
+    SidebarBrand: () => import("react").JSX.Element;
+    SidebarFind: () => import("react").JSX.Element;
+    SidebarFrame: () => import("react").JSX.Element;
+    SidebarMenuChevron: () => import("react").JSX.Element;
     SidebarSections: typeof SidebarSectionsSpecimen;
-    Tabs: () => import("react").JSX.Element;
+    Tabs: typeof TabsSpecimen;
     TabsNav: () => import("react").JSX.Element;
     textLinkVariants: () => import("react").JSX.Element;
 };

package/dist/showcase/specimens/navigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navigation.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/navigation.tsx"],"names":[],"mappings":"AAgFA,iBAAS,qBAAqB,gCAgC7B;AAED,iBAAS,qBAAqB,gCAc7B;AAED,iBAAS,uBAAuB,gCAiC/B;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;CA4PI,CAAC"}
+{"version":3,"file":"navigation.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/navigation.tsx"],"names":[],"mappings":"AAqEA,iBAAS,qBAAqB,gCAoC7B;AAED,iBAAS,qBAAqB,gCAmB7B;AAED,iBAAS,uBAAuB,gCAiE/B;AAED,iBAAS,YAAY,gCAqCpB;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;CA0SI,CAAC"}

package/dist/showcase/specimens/navigation.js

@@ -2,21 +2,19 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Building2, CreditCard, Download, LayoutDashboard, Settings, Users } from "lucide-react";
 import { useState } from "react";
+import { AccountMenuIdentity } from "../../components/account-menu.js";
 import { AgentListRow } from "../../components/agent-list-row.js";
 import { BrandWordmark } from "../../components/brand.js";
-import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from "../../components/breadcrumb.js";
+import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from "../../components/breadcrumb.js";
 import { Button } from "../../components/button.js";
 import { CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandShortcut, } from "../../components/command.js";
-import { DashboardShell } from "../../components/dashboard-shell.js";
 import { DesktopAppShell } from "../../components/desktop-shell.js";
 import { Footer, FooterBrand, FooterIdentity, FooterInner, FooterMeta, FooterNav, } from "../../components/footer.js";
 import { AgentIcon, ApprovalsIcon } from "../../components/house-icons.js";
 import { Kbd } from "../../components/kbd.js";
-import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, } from "../../components/navigation-menu.js";
-import { Pagination, PaginationContent, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, } from "../../components/pagination.js";
 import { PortalSidebarFrame } from "../../components/portal-sidebar-frame.js";
 import { ScopeSwitcher } from "../../components/scope-switcher.js";
-import { Sidebar, SidebarContent, SidebarGroup, SidebarGroupLabel, SidebarMenu, SidebarMenuButton, SidebarMenuItem, SidebarProvider, } from "../../components/sidebar.js";
+import { Sidebar, SidebarBrand, SidebarContent, SidebarFind, SidebarFrame, SidebarGroup, SidebarGroupLabel, SidebarMenu, SidebarMenuButton, SidebarMenuChevron, SidebarMenuItem, SidebarProvider, } from "../../components/sidebar.js";
 import { SidebarSections } from "../../components/sidebar-sections.js";
 import { Tabs, TabsContent, TabsLink, TabsList, TabsNav, TabsTrigger } from "../../components/tabs.js";
 import { textLinkVariants } from "../../components/text-link.js";
@@ -26,11 +24,16 @@ function Navigation({ children }) {
 }
 function CommandDialogSpecimen() {
     const [open, setOpen] = useState(false);
-    return (_jsxs(_Fragment, { children: [_jsxs(Button, { onClick: () => setOpen(true), variant: "outline", children: ["Find", _jsx(Kbd, { children: "\u2318K" })] }), _jsxs(CommandDialog, { description: "Find an Agent, a customer or a page", onOpenChange: setOpen, open: open, title: "Find", children: [_jsx(CommandInput, { placeholder: "Find anything" }), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "Nothing matches" }), _jsxs(CommandGroup, { heading: "Agents", children: [_jsx(CommandItem, { onSelect: () => setOpen(false), children: "Invoices" }), _jsx(CommandItem, { onSelect: () => setOpen(false), children: "Orders" })] }), _jsxs(CommandGroup, { heading: "Go to", children: [_jsxs(CommandItem, { onSelect: () => setOpen(false), children: ["Usage and billing", _jsx(CommandShortcut, { children: "\u2318U" })] }), _jsx(CommandItem, { onSelect: () => setOpen(false), children: "New Agent" })] })] })] })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs(Button, { onClick: () => setOpen(true), variant: "outline", children: ["Find", _jsx(Kbd, { meta: true, size: "sm", children: "K" })] }), _jsxs(CommandDialog, { closeLabel: "Close", description: "Find an Agent, a customer or a page", onOpenChange: setOpen, open: open, resultCount: (count) => `${count} results`, title: "Find", children: [_jsx(CommandInput, { placeholder: "Find anything" }), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "Nothing matches" }), _jsxs(CommandGroup, { heading: "Agents", children: [_jsx(CommandItem, { onSelect: () => setOpen(false), children: "Invoices" }), _jsx(CommandItem, { onSelect: () => setOpen(false), children: "Orders" })] }), _jsxs(CommandGroup, { heading: "Go to", children: [_jsxs(CommandItem, { onSelect: () => setOpen(false), children: ["Usage and billing", _jsx(CommandShortcut, { meta: true, children: "U" })] }), _jsx(CommandItem, { onSelect: () => setOpen(false), children: "New Agent" })] })] })] })] }));
 }
 function ScopeSwitcherSpecimen() {
     const [scope, setScope] = useState("all");
-    return (_jsx(ScopeSwitcher, { copy: { label: "Scope", search: "Find a scope", empty: "No scope matches" }, onValueChange: setScope, options: [
+    return (_jsx(ScopeSwitcher, { copy: {
+            label: "Scope",
+            search: "Find a scope",
+            empty: "No scope matches",
+            results: (count) => `${count} results`,
+        }, onValueChange: setScope, options: [
             { value: "all", label: "All customers" },
             { value: "rossi", label: "Rossi Ottica", group: "Partners" },
             { value: "bizeta", label: "Bizeta Arredamenti", group: "Customers" },
@@ -38,35 +41,57 @@ function ScopeSwitcherSpecimen() {
 }
 function SidebarSectionsSpecimen() {
     const [section, setSection] = useState("overview");
-    return (_jsx(Navigation, { children: _jsx(Sidebar, { collapsible: "none", children: _jsx(SidebarSections, { back: { label: "Agents", onClick: nothing }, current: section, identity: {
-                    name: "Invoices",
-                    mark: { kind: "agent", orb: { form: "orbit", color: COBALTO } },
-                    detail: "Drafts and sends the month's invoices",
-                }, label: "Invoices", sections: [
-                    {
-                        id: "overview",
-                        label: "Overview",
-                        icon: LayoutDashboard,
-                        onClick: () => setSection("overview"),
-                    },
-                    { id: "skills", label: "Skills", icon: AgentIcon, onClick: () => setSection("skills") },
-                    {
-                        id: "settings",
-                        label: "Settings",
-                        icon: Settings,
-                        onClick: () => setSection("settings"),
-                    },
-                ] }) }) }));
+    const [page, setPage] = useState("identity");
+    return (_jsxs("div", { className: "flex flex-wrap gap-6", children: [_jsx(Navigation, { children: _jsx(Sidebar, { collapsible: "none", children: _jsx(SidebarSections, { back: { label: "Back to workspace", onClick: nothing }, current: page, label: "Company", sections: [
+                            {
+                                id: "identity",
+                                label: "Identity",
+                                icon: Building2,
+                                onClick: () => setPage("identity"),
+                            },
+                            { id: "members", label: "Members", icon: Users, onClick: () => setPage("members") },
+                            {
+                                id: "accounts",
+                                label: "Subscriptions",
+                                icon: CreditCard,
+                                onClick: () => setPage("accounts"),
+                            },
+                        ] }) }) }), _jsx(Navigation, { children: _jsx(Sidebar, { collapsible: "none", children: _jsx(SidebarSections, { back: { label: "Agents", onClick: nothing }, current: section, identity: {
+                            name: "Invoices",
+                            mark: { kind: "agent", orb: { form: "orbit", color: COBALTO } },
+                            detail: "Drafts and sends the month's invoices",
+                        }, label: "Invoices", sections: [
+                            {
+                                id: "overview",
+                                label: "Overview",
+                                icon: LayoutDashboard,
+                                onClick: () => setSection("overview"),
+                            },
+                            {
+                                id: "skills",
+                                label: "Skills",
+                                icon: AgentIcon,
+                                onClick: () => setSection("skills"),
+                            },
+                            {
+                                id: "settings",
+                                label: "Settings",
+                                icon: Settings,
+                                onClick: () => setSection("settings"),
+                            },
+                        ] }) }) })] }));
+}
+function TabsSpecimen() {
+    const [plain, setPlain] = useState("overview");
+    const [lined, setLined] = useState("overview");
+    return (_jsxs("div", { className: "grid gap-8", children: [_jsxs(Tabs, { onValueChange: setPlain, value: plain, children: [_jsxs(TabsList, { "aria-label": "Rossi Ottica", children: [_jsx(TabsTrigger, { value: "overview", children: "Overview" }), _jsx(TabsTrigger, { value: "installations", children: "Installations" }), _jsx(TabsTrigger, { disabled: true, disabledReason: "Only owners see billing", value: "billing", children: "Billing" })] }), _jsx(TabsContent, { className: "pt-3 text-sm text-muted-foreground", value: "overview", children: "What the customer runs, at a glance." }), _jsx(TabsContent, { className: "pt-3 text-sm text-muted-foreground", value: "installations", children: "Every machine Nadia is installed on." })] }), _jsxs(Tabs, { onValueChange: setLined, value: lined, children: [_jsxs(TabsList, { "aria-label": "Rossi Ottica, with a rule", variant: "line", children: [_jsx(TabsTrigger, { value: "overview", children: "Overview" }), _jsx(TabsTrigger, { value: "installations", children: "Installations" }), _jsx(TabsTrigger, { disabled: true, disabledReason: "Only owners see billing", value: "billing", children: "Billing" })] }), _jsx(TabsContent, { className: "pt-3 text-sm text-muted-foreground", value: "overview", children: "What the customer runs, at a glance." }), _jsx(TabsContent, { className: "pt-3 text-sm text-muted-foreground", value: "installations", children: "Every machine Nadia is installed on." })] })] }));
 }
 export const NAVIGATION = {
     AgentListRow: () => (_jsxs("ul", { className: "grid max-w-xs gap-1", children: [_jsx("li", { children: _jsx(AgentListRow, { color: COBALTO, current: true, form: "orbit", name: "Invoices", state: "working", stateLine: "Drafting October's invoices" }) }), _jsx("li", { children: _jsx(AgentListRow, { color: VERDE, form: "lattice", name: "Orders", state: "waiting", stateLine: "Waiting for you", stateTone: "warn" }) })] })),
-    Breadcrumb: () => (_jsx(Breadcrumb, { "aria-label": "Path", children: _jsxs(BreadcrumbList, { children: [_jsx(BreadcrumbItem, { children: _jsx(BreadcrumbLink, { href: "#customers", children: "Customers" }) }), _jsx(BreadcrumbSeparator, {}), _jsx(BreadcrumbItem, { children: _jsx(BreadcrumbPage, { children: "Rossi Ottica" }) })] }) })),
+    Breadcrumb: () => (_jsxs("div", { className: "grid gap-4", children: [_jsx(Breadcrumb, { "aria-label": "Path", children: _jsxs(BreadcrumbList, { children: [_jsx(BreadcrumbItem, { children: _jsx(BreadcrumbLink, { href: "#customers", children: "Customers" }) }), _jsx(BreadcrumbSeparator, {}), _jsx(BreadcrumbItem, { children: _jsx(BreadcrumbPage, { children: "Rossi Ottica" }) })] }) }), _jsx(Breadcrumb, { "aria-label": "Path with a closed ancestor", children: _jsxs(BreadcrumbList, { children: [_jsx(BreadcrumbItem, { children: _jsx(BreadcrumbLink, { disabled: true, children: "Partners" }) }), _jsx(BreadcrumbSeparator, {}), _jsx(BreadcrumbItem, { children: _jsx(BreadcrumbLink, { href: "#customers", children: "Customers" }) }), _jsx(BreadcrumbSeparator, {}), _jsx(BreadcrumbItem, { children: _jsx(BreadcrumbPage, { children: "Rossi Ottica" }) })] }) }), _jsx(Breadcrumb, { "aria-label": "Long path", children: _jsxs(BreadcrumbList, { children: [_jsx(BreadcrumbItem, { children: _jsx(BreadcrumbLink, { href: "#customers", children: "Customers" }) }), _jsx(BreadcrumbSeparator, {}), _jsx(BreadcrumbItem, { children: _jsx(BreadcrumbEllipsis, { label: "More" }) }), _jsx(BreadcrumbSeparator, {}), _jsx(BreadcrumbItem, { children: _jsx(BreadcrumbLink, { href: "#installations", children: "Installations" }) }), _jsx(BreadcrumbSeparator, {}), _jsx(BreadcrumbItem, { children: _jsx(BreadcrumbPage, { children: "Rossi Ottica, Milano" }) })] }) })] })),
     CommandDialog: CommandDialogSpecimen,
-    DashboardShell: () => (_jsx("div", { className: "h-96 overflow-hidden rounded-md border border-border", children: _jsx(DashboardShell, { className: "min-h-0", contentLabel: "Customers", header: _jsx("span", { className: "text-sm font-medium", children: "Customers" }), mobileNavigationLabel: "Navigation", passive: true, sidebar: _jsxs(SidebarMenu, { children: [_jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { isActive: true, children: [_jsx(Building2, { "aria-hidden": "true" }), "Customers"] }) }), _jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { children: [_jsx(CreditCard, { "aria-hidden": "true" }), "Usage and billing"] }) })] }), sidebarCollapsible: "none", children: _jsx("p", { className: "text-sm text-muted-foreground", children: "The page's content scrolls here." }) }) })),
     DesktopAppShell: () => (_jsx("div", { className: "h-96 overflow-hidden rounded-md border border-border", children: _jsx(DesktopAppShell, { activityRail: _jsx(Navigation, { children: _jsx(SidebarMenu, { className: "p-2", children: _jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { isActive: true, children: _jsx(AgentListRow, { color: COBALTO, form: "orbit", name: "Invoices", size: 24 }) }) }) }) }), activityRailLabel: "Agents", className: "h-full", primaryPaneLabel: "Conversation", title: "Invoices", children: _jsx("p", { className: "p-4 text-sm text-muted-foreground", children: "The Agent's conversation." }) }) })),
     Footer: () => (_jsx(Footer, { children: _jsxs(FooterInner, { children: [_jsx(FooterBrand, { "aria-label": "nadicode", href: "#top", children: _jsx(BrandWordmark, { alt: "" }) }), _jsx(FooterIdentity, { children: "Agents that do the work, for Italian companies." }), _jsxs(FooterNav, { "aria-label": "Company", children: [_jsx("a", { href: "#privacy", children: "Privacy" }), _jsx("a", { href: "#terms", children: "Terms" })] }), _jsx(FooterMeta, { children: "\u00A9 2026 nadicode" })] }) })),
-    NavigationMenu: () => (_jsx(NavigationMenu, { children: _jsxs(NavigationMenuList, { children: [_jsxs(NavigationMenuItem, { children: [_jsx(NavigationMenuTrigger, { children: "Product" }), _jsx(NavigationMenuContent, { children: _jsxs("ul", { className: "grid w-72 gap-1 p-2", children: [_jsx("li", { children: _jsx(NavigationMenuLink, { href: "#nadia", children: "Nadia" }) }), _jsx("li", { children: _jsx(NavigationMenuLink, { href: "#portal", children: "The Portal" }) })] }) })] }), _jsx(NavigationMenuItem, { children: _jsx(NavigationMenuLink, { href: "#pricing", children: "Pricing" }) })] }) })),
-    Pagination: () => (_jsx(Pagination, { children: _jsxs(PaginationContent, { children: [_jsx(PaginationItem, { children: _jsx(PaginationPrevious, { href: "#page-1" }) }), _jsx(PaginationItem, { children: _jsx(PaginationLink, { href: "#page-1", children: "1" }) }), _jsx(PaginationItem, { children: _jsx(PaginationLink, { href: "#page-2", isActive: true, children: "2" }) }), _jsx(PaginationItem, { children: _jsx(PaginationLink, { href: "#page-3", children: "3" }) }), _jsx(PaginationItem, { children: _jsx(PaginationNext, { href: "#page-3" }) })] }) })),
     PortalSidebarFrame: () => (_jsx(Navigation, { children: _jsx(PortalSidebarFrame, { account: { name: "Ada Rossi", initials: "AR", lines: ["Acme S.r.l."] }, bands: [
                 {
                     id: "work",
@@ -96,8 +121,12 @@ export const NAVIGATION = {
             ], findLabel: "Find", footerItem: { id: "get-nadia", label: "Get Nadia", icon: _jsx(Download, { "aria-hidden": "true" }) }, subtitle: "Portal", toggleLabel: "Collapse navigation" }) })),
     ScopeSwitcher: ScopeSwitcherSpecimen,
     Sidebar: () => (_jsx(Navigation, { children: _jsx(Sidebar, { collapsible: "none", children: _jsx(SidebarContent, { children: _jsxs(SidebarGroup, { children: [_jsx(SidebarGroupLabel, { children: "Company" }), _jsxs(SidebarMenu, { children: [_jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { isActive: true, children: [_jsx(Building2, { "aria-hidden": "true" }), "Statements"] }) }), _jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { children: [_jsx(CreditCard, { "aria-hidden": "true" }), "Usage and billing"] }) })] })] }) }) }) })),
+    SidebarBrand: () => (_jsx("div", { className: "w-56", children: _jsx(SidebarBrand, { subtitle: "Portal" }) })),
+    SidebarFind: () => (_jsx(Navigation, { children: _jsx("div", { className: "w-64", children: _jsx(SidebarFind, { label: "Find", onClick: nothing, shortcut: _jsx(Kbd, { meta: true, size: "sm", children: "K" }) }) }) })),
+    SidebarFrame: () => (_jsx(Navigation, { children: _jsx("div", { className: "h-96 w-64 overflow-hidden rounded-md border border-border", children: _jsx(Sidebar, { collapsible: "none", children: _jsx(SidebarFrame, { account: _jsx(AccountMenuIdentity, { identity: { name: "Ada Rossi", initials: "AR", lines: ["Acme S.r.l."] } }), find: _jsx(SidebarFind, { label: "Find", onClick: nothing, shortcut: _jsx(Kbd, { meta: true, size: "sm", children: "K" }) }), header: _jsx(SidebarBrand, { subtitle: "Portal" }), children: _jsxs(SidebarGroup, { children: [_jsx(SidebarGroupLabel, { children: "Work" }), _jsxs(SidebarMenu, { children: [_jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { isActive: true, children: [_jsx(AgentIcon, { "aria-hidden": "true" }), "Agents"] }) }), _jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { children: [_jsx(ApprovalsIcon, { "aria-hidden": "true" }), "Approvals"] }) })] })] }) }) }) }) })),
+    SidebarMenuChevron: () => (_jsx(Navigation, { children: _jsx(SidebarMenu, { className: "w-64", children: _jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { children: [_jsx(Settings, { "aria-hidden": "true" }), "Settings", _jsx(SidebarMenuChevron, {})] }) }) }) })),
     SidebarSections: SidebarSectionsSpecimen,
-    Tabs: () => (_jsxs(Tabs, { defaultValue: "overview", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "overview", children: "Overview" }), _jsx(TabsTrigger, { value: "installations", children: "Installations" })] }), _jsx(TabsContent, { className: "pt-3 text-sm text-muted-foreground", value: "overview", children: "What the customer runs, at a glance." }), _jsx(TabsContent, { className: "pt-3 text-sm text-muted-foreground", value: "installations", children: "Every machine Nadia is installed on." })] })),
-    TabsNav: () => (_jsxs(TabsNav, { "aria-label": "Rossi Ottica", variant: "line", children: [_jsx(TabsLink, { current: true, href: "#overview", children: "Overview" }), _jsx(TabsLink, { href: "#installations", children: "Installations" }), _jsx(TabsLink, { href: "#billing", children: "Billing" })] })),
+    Tabs: TabsSpecimen,
+    TabsNav: () => (_jsxs("div", { className: "grid gap-8", children: [_jsxs(TabsNav, { "aria-label": "Rossi Ottica", children: [_jsx(TabsLink, { current: true, href: "#overview", children: "Overview" }), _jsx(TabsLink, { href: "#installations", children: "Installations" }), _jsx(TabsLink, { href: "#billing", children: "Billing" })] }), _jsxs(TabsNav, { "aria-label": "Rossi Ottica, with a rule", variant: "line", children: [_jsx(TabsLink, { current: true, href: "#overview", children: "Overview" }), _jsx(TabsLink, { href: "#installations", children: "Installations" }), _jsx(TabsLink, { href: "#billing", children: "Billing" })] }), _jsx("div", { className: "max-w-72", children: _jsxs(TabsNav, { "aria-label": "Rossi Ottica, scrolled", children: [_jsx(TabsLink, { href: "#overview", children: "Overview" }), _jsx(TabsLink, { href: "#tasks", children: "Scheduled tasks" }), _jsx(TabsLink, { current: true, href: "#usage", children: "Usage" }), _jsx(TabsLink, { href: "#capabilities", children: "Capabilities" }), _jsx(TabsLink, { href: "#settings", children: "Settings" })] }) })] })),
     textLinkVariants: () => (_jsxs("p", { className: "max-w-md text-sm", children: ["Your data stays in the EU. Read the", " ", _jsx("a", { className: textLinkVariants({ kind: "inline" }), href: "#privacy", children: "privacy notice" }), " ", "for what each Agent keeps.", " ", _jsx("a", { className: textLinkVariants({ kind: "quiet" }), href: "#learn", children: "Learn more" })] })),
 };

package/dist/showcase/specimens/other.d.ts

@@ -7,15 +7,13 @@ export declare const OTHER: {
     AspectRatio: typeof AspectRatioSpecimen;
     BrandField: () => import("react").JSX.Element;
     Carousel: () => import("react").JSX.Element;
-    ChannelView: () => import("react").JSX.Element;
     Collapsible: () => import("react").JSX.Element;
     CompanyCard: typeof CompanyCardSpecimen;
     Disclosure: () => import("react").JSX.Element;
-    ExpandableBlock: () => import("react").JSX.Element;
     HiveScene: typeof HiveSceneSpecimen;
     NadiaPresence: typeof NadiaPresenceSpecimen;
     NumberedSteps: () => import("react").JSX.Element;
-    PluginSlotBoundary: () => import("react").JSX.Element;
+    Prose: () => import("react").JSX.Element;
     ReadingColumn: () => import("react").JSX.Element;
     ResizablePanelGroup: () => import("react").JSX.Element;
     ScrollArea: () => import("react").JSX.Element;

package/dist/showcase/specimens/other.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"other.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/other.tsx"],"names":[],"mappings":"AAwDA,iBAAS,mBAAmB,gCAS3B;AAED,iBAAS,mBAAmB,gCAiB3B;AAED,iBAAS,iBAAiB,gCAczB;AAED,iBAAS,qBAAqB,gCAa7B;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;CAmJS,CAAC"}
+{"version":3,"file":"other.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/other.tsx"],"names":[],"mappings":"AA8CA,iBAAS,mBAAmB,gCAS3B;AAED,iBAAS,mBAAmB,gCAiB3B;AAED,iBAAS,iBAAiB,gCAczB;AAED,iBAAS,qBAAqB,gCAa7B;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;CA6LS,CAAC"}

package/dist/showcase/specimens/other.js

@@ -3,28 +3,24 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ChevronDown } from "lucide-react";
 import { useState } from "react";
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger, } from "../../components/accordion.js";
-import { AgentOrb } from "../../components/agent-orb.js";
 import { AspectRatio } from "../../components/aspect-ratio.js";
 import { BrandField } from "../../components/brand-field.js";
 import { BrandWordmark } from "../../components/brand.js";
 import { Button } from "../../components/button.js";
 import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, } from "../../components/carousel.js";
-import { ChannelDay, ChannelHeader, ChannelMessage, ChannelPerson, ChannelView, } from "../../components/channel-view.js";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../components/collapsible.js";
 import { CompanyCard } from "../../components/company-card.js";
 import { Disclosure } from "../../components/disclosure.js";
-import { ExpandableBlock } from "../../components/expandable-block.js";
 import { HiveScene } from "../../components/hive-scene.js";
 import { NadiaPresence } from "../../components/nadia-presence.js";
 import { NumberedSteps } from "../../components/numbered-steps.js";
-import { PluginSlotBoundary } from "../../components/plugin-slot-boundary.js";
+import { Prose } from "../../components/prose.js";
 import { ReadingColumn } from "../../components/reading-column.js";
 import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "../../components/resizable.js";
 import { ScrollArea } from "../../components/scroll-area.js";
 import { Separator } from "../../components/separator.js";
 import { ToolIcon } from "../../components/tool-icon.js";
 import { useEmptyArt } from "../assets.js";
-import { COBALTO } from "../samples.js";
 const HIVE_LOGO = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 21V11a8 8 0 0 1 16 0v10' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E";
 const LOG = Array.from({ length: 14 }, (_, line) => `07:30:${String(line).padStart(2, "0")} read row ${line + 1}`).join("\n");
 function AspectRatioSpecimen() {
@@ -48,15 +44,13 @@ function NadiaPresenceSpecimen() {
     return (_jsxs("div", { className: "grid justify-items-start gap-3", children: [_jsx(NadiaPresence, { label: "Nadia is getting ready", reveal: reveal, state: "arriving" }), _jsx(Button, { onClick: () => setReveal((value) => (value >= 1 ? 0 : value + 0.2)), variant: "outline", children: "Move her arrival on" })] }));
 }
 export const OTHER = {
-    Accordion: () => (_jsxs(Accordion, { className: "max-w-lg", children: [_jsxs(AccordionItem, { value: "data", children: [_jsx(AccordionTrigger, { children: "Where does my data live?" }), _jsx(AccordionContent, { children: "In the EU, on servers nadicode runs." })] }), _jsxs(AccordionItem, { value: "agents", children: [_jsx(AccordionTrigger, { children: "Can an Agent send email on its own?" }), _jsx(AccordionContent, { children: "Only from a mailbox you connect, and only with approval." })] })] })),
+    Accordion: () => (_jsxs("div", { className: "grid max-w-lg gap-10", children: [["default", "small"].map((size) => (_jsxs(Accordion, { size: size, children: [_jsxs(AccordionItem, { value: "data", children: [_jsx(AccordionTrigger, { children: "Where does my data live?" }), _jsx(AccordionContent, { children: "In the EU, on servers nadicode runs." })] }), _jsxs(AccordionItem, { value: "agents", children: [_jsx(AccordionTrigger, { children: "Can an Agent send email on its own?" }), _jsx(AccordionContent, { children: "Only from a mailbox you connect, and only with approval." })] }), _jsxs(AccordionItem, { value: "export", children: [_jsx(AccordionTrigger, { children: "Can I take my data with me?" }), _jsx(AccordionContent, { hiddenUntilFound: false, children: "Yes. Export every record as a .zip from Settings." })] })] }, size))), _jsxs(Accordion, { multiple: true, children: [_jsxs(AccordionItem, { value: "invoices", children: [_jsx(AccordionTrigger, { children: "Invoices" }), _jsx(AccordionContent, { children: "Issued on the first of each month." })] }), _jsxs(AccordionItem, { value: "payments", children: [_jsx(AccordionTrigger, { children: "Payments" }), _jsx(AccordionContent, { children: "Card and bank transfer, in euro." })] })] })] })),
     AspectRatio: AspectRatioSpecimen,
     BrandField: () => (_jsxs(BrandField, { className: "grid gap-2 rounded-md p-8", children: [_jsx(BrandWordmark, {}), _jsx("p", { className: "text-sm text-muted-foreground", children: "White on ink, in either theme." })] })),
     Carousel: () => (_jsxs(Carousel, { className: "mx-12 max-w-xs", children: [_jsx(CarouselContent, { children: ["Invoices", "Orders", "Support"].map((name) => (_jsx(CarouselItem, { children: _jsx("div", { className: "grid h-32 place-items-center rounded-md border border-border text-sm", children: name }) }, name))) }), _jsx(CarouselPrevious, {}), _jsx(CarouselNext, {})] })),
-    ChannelView: () => (_jsx("div", { className: "max-w-lg", children: _jsxs(ChannelView, { header: _jsx(ChannelHeader, { memberCount: 4, membersLabel: "4 members", name: "sales" }), children: [_jsx(ChannelDay, { label: "Today" }), _jsx(ChannelMessage, { author: "Marco Bianchi", member: _jsx(ChannelPerson, { initials: "MB", name: "Marco Bianchi" }), time: "09:12", children: "Can someone quote Rossi Ottica for 40 frames?" }), _jsx(ChannelMessage, { author: "Acme Quotes", member: _jsx(AgentOrb, { color: COBALTO, decorative: true, form: "orbit", size: 32 }), time: "09:13", children: "Drafted from the price list: \u20AC 3,120 before VAT. It's waiting for your approval." })] }) })),
-    Collapsible: () => (_jsxs(Collapsible, { className: "max-w-sm", children: [_jsxs(CollapsibleTrigger, { render: _jsx(Button, { variant: "ghost" }), children: [_jsx(ChevronDown, { "aria-hidden": "true", "data-icon": "inline-start" }), "src"] }), _jsxs(CollapsibleContent, { className: "grid gap-1 pl-8 font-mono text-sm", children: [_jsx("span", { children: "index.ts" }), _jsx("span", { children: "quote.ts" })] })] })),
+    Collapsible: () => (_jsxs(Collapsible, { className: "max-w-sm", children: [_jsx(CollapsibleTrigger, { render: _jsx(Button, { prefix: _jsx(ChevronDown, { "aria-hidden": "true" }), variant: "ghost" }), children: "src" }), _jsxs(CollapsibleContent, { className: "grid gap-1 pl-8 font-mono text-sm", children: [_jsx("span", { children: "index.ts" }), _jsx("span", { children: "quote.ts" })] })] })),
     CompanyCard: CompanyCardSpecimen,
     Disclosure: () => (_jsx(Disclosure, { label: "Other formats", children: _jsx("p", { className: "text-sm text-muted-foreground", children: "Download for Windows, or as a .zip for macOS." }) })),
-    ExpandableBlock: () => (_jsx("div", { className: "max-w-md", children: _jsx(ExpandableBlock, { collapseLabel: "Show less", expandLabel: "Show all", children: _jsx("pre", { className: "font-mono text-xs", children: LOG }) }) })),
     HiveScene: HiveSceneSpecimen,
     NadiaPresence: NadiaPresenceSpecimen,
     NumberedSteps: () => (_jsx(NumberedSteps, { current: { id: "pair", label: "Current step" }, label: "Connect Telegram", steps: [
@@ -64,10 +58,20 @@ export const OTHER = {
             { id: "pair", title: "Send it the code", description: "The code is valid for 10 minutes." },
             { id: "done", title: "Come back here" },
         ] })),
-    PluginSlotBoundary: () => (_jsx(PluginSlotBoundary, { className: "max-w-lg", contentLabel: "Weather plugin", description: "Shows the forecast for each delivery address.", permissions: [{ id: "network", label: "Network", level: "review" }], title: "Weather", children: _jsx("p", { className: "text-sm", children: "Milano: 18\u00B0, light rain." }) })),
+    Prose: () => (_jsx(ReadingColumn, { children: _jsxs(Prose, { children: [_jsx("h2", { children: "Payment terms" }), _jsxs("p", { children: ["Invoices are due within ", _jsx("strong", { children: "30 days" }), ". The full terms are in the", " ", _jsx("a", { href: "#terms", children: "service agreement" }), ", and late payment adds ", _jsx("code", { children: "0.5%" }), " a month."] }), _jsxs("ul", { children: [_jsx("li", { children: "Pay by bank transfer or card." }), _jsx("li", { children: "Ask billing for a copy of any invoice." })] }), _jsx("blockquote", { children: "Nothing here is a quote until it is signed." })] }) })),
     ReadingColumn: () => (_jsx(ReadingColumn, { className: "rounded-md border border-dashed border-border p-4 text-sm", children: "The reading column holds prose and conversations at a comfortable measure." })),
-    ResizablePanelGroup: () => (_jsx("div", { className: "h-40 max-w-lg rounded-md border border-border", children: _jsxs(ResizablePanelGroup, { orientation: "horizontal", children: [_jsx(ResizablePanel, { defaultSize: 60, minSize: 30, children: _jsx("div", { className: "p-4 text-sm", children: "Conversation" }) }), _jsx(ResizableHandle, { withHandle: true }), _jsx(ResizablePanel, { defaultSize: 40, minSize: 20, children: _jsx("div", { className: "p-4 text-sm", children: "Side panel" }) })] }) })),
-    ScrollArea: () => (_jsx(ScrollArea, { className: "h-32 max-w-xs rounded-md border border-border", children: _jsx("pre", { className: "p-3 font-mono text-xs", children: LOG }) })),
-    Separator: () => (_jsxs("div", { className: "grid max-w-xs gap-3 text-sm", children: ["Agents", _jsx(Separator, {}), "Settings"] })),
+    ResizablePanelGroup: () => (_jsx("div", { className: "h-40 max-w-lg rounded-md border border-border", children: _jsxs(ResizablePanelGroup, { orientation: "horizontal", children: [_jsx(ResizablePanel, { defaultSize: "60%", minSize: "30%", children: _jsx("div", { className: "p-4 text-sm", children: "Conversation" }) }), _jsx(ResizableHandle, { "aria-label": "Resize the first panel", withHandle: true }), _jsx(ResizablePanel, { defaultSize: "40%", minSize: "20%", children: _jsx("div", { className: "p-4 text-sm", children: "Side panel" }) })] }) })),
+    ScrollArea: () => (_jsxs("div", { className: "grid max-w-xs gap-6", children: [_jsx(ScrollArea, { className: "h-32 rounded-md border border-border", overflow: "y", children: _jsx("pre", { className: "p-3 font-mono text-xs", children: LOG }) }), _jsx(ScrollArea, { buttonLabels: {
+                    previous: "Scroll customer logos left",
+                    next: "Scroll customer logos right",
+                }, className: "rounded-md border border-border", contentClassName: "flex gap-3 p-3", overflow: "x", children: [
+                    "Rossi Ottica",
+                    "Bianchi Srl",
+                    "Conti & Figli",
+                    "Verdi Moda",
+                    "Ferri Auto",
+                    "Neri Caffè",
+                ].map((customer) => (_jsx("span", { className: "grid h-16 w-28 shrink-0 place-items-center rounded-sm border border-border text-sm", children: customer }, customer))) }), _jsx(ScrollArea, { className: "h-32 rounded-md border border-border", overflow: "both", children: _jsx("pre", { className: "w-[640px] p-3 font-mono text-xs", children: LOG }) })] })),
+    Separator: () => (_jsxs("div", { className: "grid max-w-xs gap-6 text-sm", children: [_jsxs("div", { className: "grid gap-3", children: ["Agents", _jsx(Separator, {}), "Settings"] }), _jsxs("div", { className: "flex h-5 items-center gap-3", children: ["Runs", _jsx(Separator, { orientation: "vertical" }), "Approvals", _jsx(Separator, { orientation: "vertical" }), "Cost"] }), _jsxs("div", { className: "grid gap-3 rounded-md border border-border p-px", children: [_jsx("span", { className: "px-3 pt-3", children: "Billing" }), _jsx(Separator, { inset: true }), _jsx("span", { className: "px-3 pb-3", children: "Invoices" })] })] })),
     ToolIcon: () => (_jsx("div", { className: "flex flex-wrap items-center gap-4 text-sm", children: ["search", "edit", "terminal", "globe"].map((name) => (_jsxs("span", { className: "flex items-center gap-2", children: [_jsx(ToolIcon, { "aria-hidden": "true", name: name }), name] }, name))) })),
 };

package/dist/showcase/specimens/status.d.ts

@@ -1,4 +1,5 @@
 declare function ActionStatusSpecimen(): import("react").JSX.Element;
+declare function GaugeSpecimen(): import("react").JSX.Element;
 export declare const STATUS: {
     ActionStatus: typeof ActionStatusSpecimen;
     AgentOrb: () => import("react").JSX.Element;
@@ -7,12 +8,14 @@ export declare const STATUS: {
     Avatar: () => import("react").JSX.Element;
     Badge: () => import("react").JSX.Element;
     BrandWordmark: () => import("react").JSX.Element;
+    CheckCounts: () => import("react").JSX.Element;
     FileTypeIcon: () => import("react").JSX.Element;
+    Gauge: typeof GaugeSpecimen;
     IdentityMark: () => import("react").JSX.Element;
-    MetaLabel: () => import("react").JSX.Element;
     ModelIdentity: () => import("react").JSX.Element;
     ModelMark: () => import("react").JSX.Element;
     PlatformMark: () => import("react").JSX.Element;
+    ProgressChecklist: () => import("react").JSX.Element;
     RecordIdentity: () => import("react").JSX.Element;
     StatusBadge: () => import("react").JSX.Element;
     StatusDot: () => import("react").JSX.Element;

package/dist/showcase/specimens/status.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"status.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/status.tsx"],"names":[],"mappings":"AA0BA,iBAAS,oBAAoB,gCAsB5B;AAED,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;CAyKQ,CAAC"}
+{"version":3,"file":"status.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/status.tsx"],"names":[],"mappings":"AAyDA,iBAAS,oBAAoB,gCAiB5B;AAYD,iBAAS,aAAa,gCA2DrB;AAED,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;CA6QQ,CAAC"}

package/dist/showcase/specimens/status.js

@@ -1,44 +1,97 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Mail, Save, Wrench } from "lucide-react";
+import { useId } from "react";
+import { Building2, Check, Clock, CreditCard, Database, Lock, Mail, MonitorDown, Pause, Save, Wrench, } from "lucide-react";
 import { ActionStatus } from "../../components/action-status.js";
 import { AgentOrb } from "../../components/agent-orb.js";
 import { AppMark, composioLogo } from "../../components/app-mark.js";
-import { Avatar, AvatarFallback, AvatarGroup, AvatarGroupCount } from "../../components/avatar.js";
+import { Avatar, AvatarFallback, AvatarGroup, AvatarWithIcon } from "../../components/avatar.js";
 import { Badge } from "../../components/badge.js";
 import { BrandMark, BrandWordmark } from "../../components/brand.js";
-import { Button } from "../../components/button.js";
+import { CheckCounts, CheckState } from "../../components/check-counts.js";
 import { FileTypeIcon } from "../../components/file-type-icon.js";
+import { Gauge } from "../../components/gauge.js";
 import { AgentIcon, ApprovalsIcon, ArchIcon } from "../../components/house-icons.js";
 import { IdentityMark } from "../../components/identity-mark.js";
-import { MetaLabel } from "../../components/label-system.js";
 import { ModelIdentity } from "../../components/model-identity.js";
 import { ModelMark } from "../../components/model-mark.js";
 import { PlatformMark } from "../../components/platform-mark.js";
+import { ProgressChecklist } from "../../components/progress-checklist.js";
 import { RecordIdentity } from "../../components/record-identity.js";
 import { StatusBadge } from "../../components/status-badge.js";
 import { StatusDot } from "../../components/status-dot.js";
 import { Tag } from "../../components/tag.js";
-import { ARANCIO, COBALTO, VERDE } from "../samples.js";
+import { ARANCIO, COBALTO, nothing, VERDE } from "../samples.js";
+// A one-ink logo as Sofia keeps it: white where the mark is, transparent elsewhere.
+const SAMPLE_LOGO = `data:image/svg+xml,${encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 16"><text x="0" y="13" fill="white" font-family="sans-serif" font-size="14" font-weight="700">ROSSI</text></svg>')}`;
+const SAMPLE_ICON = `data:image/svg+xml,${encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><rect width="32" height="32" rx="7" fill="royalblue"/><path d="M10 9h8a5 5 0 0 1 0 10h-4v5h-4z" fill="white"/></svg>')}`;
+const MEMBERS = [
+    { id: "1", name: "Ada Rossi" },
+    { id: "2", name: "Marco Bianchi" },
+    { id: "3", name: "Luca Conti" },
+    { id: "4", name: "Sara Kim" },
+    { id: "5", name: "Tom Hill" },
+];
 function ActionStatusSpecimen() {
-    return (_jsx("div", { className: "flex flex-wrap items-center gap-2", children: ["idle", "saving", "done"].map((state) => (_jsx(Button, { "aria-busy": state === "saving" || undefined, disabled: state === "saving", variant: "outline", children: _jsx(ActionStatus, { busy: "Saving", done: "Saved", idle: "Save changes", idleIcon: _jsx(Save, { "aria-hidden": "true", "data-icon": "inline-start" }), state: state }) }, state))) }));
+    return (_jsx("div", { className: "flex flex-wrap items-center gap-2", children: ["idle", "saving", "done"].map((state) => (_jsx(ActionStatus, { busy: "Saving", done: "Saved", idle: "Save changes", idleIcon: _jsx(Save, { "aria-hidden": "true" }), state: state, type: "button", variant: "outline" }, state))) }));
+}
+function GaugeRow({ label, gauge }) {
+    const labelId = useId();
+    return (_jsxs("div", { className: "flex items-center gap-3 text-sm", children: [gauge(labelId), _jsx("span", { id: labelId, children: label })] }));
+}
+function GaugeSpecimen() {
+    return (_jsxs("div", { className: "grid gap-6", children: [_jsxs("div", { className: "flex flex-wrap items-end gap-6", children: [_jsx(GaugeRow, { gauge: (id) => _jsx(Gauge, { "aria-labelledby": id, size: "xs", value: 42 }), label: "Storage used" }), _jsx(GaugeRow, { gauge: (id) => _jsx(Gauge, { "aria-labelledby": id, size: "sm", value: 64 }), label: "Plan used" }), _jsx(GaugeRow, { gauge: (id) => _jsx(Gauge, { "aria-labelledby": id, size: "md", value: 87 }), label: "Tasks done" }), _jsx(GaugeRow, { gauge: (id) => _jsx(Gauge, { "aria-labelledby": id, size: "lg", value: 99.97 }), label: "Cache hit rate" })] }), _jsxs("div", { className: "flex flex-wrap items-center gap-6", children: [_jsx(GaugeRow, { gauge: (id) => _jsx(Gauge, { "aria-labelledby": id, showValue: true, size: "sm", value: 64 }), label: "Plan used, 64%" }), _jsx(GaugeRow, { gauge: (id) => _jsx(Gauge, { "aria-labelledby": id, showValue: true, size: "md", value: 87 }), label: "Tasks done, 87%" }), _jsx(GaugeRow, { gauge: (id) => _jsx(Gauge, { "aria-labelledby": id, showValue: true, size: "lg", value: 99.97 }), label: "Cache hit rate, 99.97%" })] }), _jsxs("div", { className: "flex flex-wrap items-center gap-6", children: [_jsx(GaugeRow, { gauge: (id) => (_jsx(Gauge, { "aria-labelledby": id, showValue: true, size: "md", tone: "warning", value: 82 })), label: "Model budget, 82%: close to the limit" }), _jsx(GaugeRow, { gauge: (id) => (_jsx(Gauge, { "aria-labelledby": id, showValue: true, size: "md", tone: "critical", value: 97 })), label: "Mailbox space, 97%: almost full" }), _jsx(GaugeRow, { gauge: (id) => (_jsx(Gauge, { "aria-labelledby": id, size: "md", value: 58, children: _jsx(Database, { "aria-hidden": "true" }) })), label: "Memory used" })] })] }));
 }
 export const STATUS = {
     ActionStatus: ActionStatusSpecimen,
     AgentOrb: () => (_jsxs("div", { className: "flex flex-wrap items-end gap-6", children: [_jsx(AgentOrb, { color: COBALTO, form: "orbit", label: "Invoices, working", size: 64, state: "working" }), _jsx(AgentOrb, { color: VERDE, form: "lattice", label: "Orders, waiting for you", size: 64, state: "waiting" }), _jsx(AgentOrb, { color: ARANCIO, form: "braid", label: "Support", size: 32 }), _jsx(AgentOrb, { form: "nadia", label: "Nadia", size: 96 })] })),
     AppMark: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-3 text-sm", children: [_jsx(AppMark, { app: "gmail", logo: composioLogo("gmail") }), "Gmail", _jsx(AppMark, { app: "telegram", platform: "telegram" }), "Telegram", _jsx(AppMark, { app: "Fatture in Cloud" }), "Fatture in Cloud"] })),
     ArchIcon: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-4 text-sm", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx(ArchIcon, { "aria-hidden": "true", className: "size-5" }), "Company"] }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(ApprovalsIcon, { "aria-hidden": "true", className: "size-5" }), "Approvals"] }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(AgentIcon, { "aria-hidden": "true", className: "size-5" }), "Agents"] })] })),
-    Avatar: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-6", children: [_jsx(Avatar, { children: _jsx(AvatarFallback, { children: "AR" }) }), _jsxs(AvatarGroup, { "aria-label": "5 members", children: [_jsx(Avatar, { children: _jsx(AvatarFallback, { children: "AR" }) }), _jsx(Avatar, { children: _jsx(AvatarFallback, { children: "MB" }) }), _jsx(Avatar, { children: _jsx(AvatarFallback, { children: "LC" }) }), _jsx(AvatarGroupCount, { children: "+2" })] })] })),
-    Badge: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Badge, { children: "Owner" }), _jsx(Badge, { variant: "secondary", children: "Business plan" }), _jsx(Badge, { variant: "outline", children: "Beta" })] })),
+    Avatar: () => (_jsxs("div", { className: "grid gap-6", children: [_jsx("div", { className: "flex flex-wrap items-center gap-4", children: ["xs", "sm", "default", "lg"].map((size) => (_jsx(Avatar, { label: "Ada Rossi", size: size, children: _jsx(AvatarFallback, { children: size === "xs" ? "A" : "AR" }) }, size))) }), _jsxs("div", { className: "flex flex-wrap items-center gap-6", children: [_jsx(AvatarGroup, { label: "5 members", limit: 3, members: MEMBERS }), _jsx(AvatarGroup, { label: "5 members, last on top", limit: 3, members: MEMBERS, reverse: true }), _jsx(AvatarGroup, { label: "5 members, tight", limit: 3, members: MEMBERS, overlap: 6 })] }), _jsxs("div", { className: "flex flex-wrap items-center gap-6 text-sm", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx(AvatarWithIcon, { icon: _jsx(Check, {}), iconBackground: true, label: "Ada Rossi, approved", name: "Ada Rossi" }), "Ada Rossi"] }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(AvatarWithIcon, { icon: _jsx(Pause, {}), iconBackground: true, label: "Marco Bianchi, paused", name: "Marco Bianchi" }), "Marco Bianchi"] }), _jsx(AvatarWithIcon, { icon: _jsx(Clock, {}), iconBackground: true, label: "Luca Conti, waiting for approval", name: "Luca Conti" })] })] })),
+    Badge: () => (_jsxs("div", { className: "grid gap-4", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Badge, { children: "Owner" }), _jsx(Badge, { variant: "secondary", children: "Business plan" }), _jsx(Badge, { variant: "outline", children: "Beta" })] }), _jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Badge, { size: "sm", variant: "secondary", children: "Small" }), _jsx(Badge, { size: "md", variant: "secondary", children: "Medium" }), _jsx(Badge, { size: "lg", variant: "secondary", children: "Large" })] }), _jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Badge, { icon: _jsx(Mail, { "aria-hidden": "true" }), variant: "secondary", children: "Mailbox" }), _jsx(Badge, { icon: _jsx(Lock, { "aria-hidden": "true" }), title: "Read only", variant: "secondary" }), _jsx(Badge, { render: _jsx("a", { href: "#" }), variant: "outline", children: "Release notes" })] })] })),
     BrandWordmark: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-6", children: [_jsx(BrandWordmark, {}), _jsx(BrandMark, {})] })),
+    CheckCounts: () => (_jsxs("div", { className: "grid max-w-md gap-2 text-sm", children: [_jsxs("span", { className: "flex items-center gap-3", children: [_jsx("span", { className: "flex-1", children: "Health checks" }), _jsx(CheckCounts, { counts: [
+                            { outcome: "passed", count: 12, label: "12 tasks completed" },
+                            { outcome: "failed", count: 1, label: "1 task failed" },
+                            { outcome: "warning", count: 0, label: "0 outcomes unknown" },
+                            { outcome: "pending", count: 2, label: "2 tasks running" },
+                        ] }), _jsx(CheckState, { label: "1 check failed", outcome: "failed" })] }), _jsxs("span", { className: "flex items-center gap-3", children: [_jsx("span", { className: "flex-1", children: "Messaging" }), _jsx(CheckState, { label: "All channels connected", outcome: "passed" })] })] })),
     FileTypeIcon: () => (_jsx("div", { className: "grid gap-2 text-sm", children: ["mcp.json", "deploy.sh", "README.md", "schema.sql"].map((path) => (_jsxs("span", { className: "flex items-center gap-2 font-mono", children: [_jsx(FileTypeIcon, { className: "size-4", path: path }), path] }, path))) })),
-    IdentityMark: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-4", children: [_jsx(IdentityMark, { kind: "agent", orb: { form: "orbit", color: COBALTO } }), _jsx(IdentityMark, { app: "gmail", kind: "app", logo: composioLogo("gmail") }), _jsx(IdentityMark, { kind: "company", name: "Acme Service & Parts" }), _jsx(IdentityMark, { kind: "person", name: "Ada Rossi" }), _jsx(IdentityMark, { icon: Mail, kind: "record" }), _jsx(IdentityMark, { icon: Wrench, kind: "record", size: 40, tone: "skill" })] })),
-    MetaLabel: () => (_jsxs("span", { className: "flex items-center gap-2 text-sm", children: ["Price list", _jsx(MetaLabel, { children: "Read only" })] })),
+    Gauge: GaugeSpecimen,
+    IdentityMark: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-4", children: [_jsx(IdentityMark, { kind: "agent", orb: { form: "orbit", color: COBALTO } }), _jsx(IdentityMark, { app: "gmail", kind: "app", logo: composioLogo("gmail") }), _jsx(IdentityMark, { kind: "company", name: "Acme Service & Parts" }), _jsx(IdentityMark, { kind: "company", logo: SAMPLE_LOGO, name: "Studio Rossi" }), _jsx(IdentityMark, { kind: "company", logo: SAMPLE_ICON, name: "Polaris Studio" }), _jsx(IdentityMark, { kind: "person", name: "Ada Rossi" }), _jsx(IdentityMark, { icon: Mail, kind: "record" }), _jsx(IdentityMark, { icon: Wrench, kind: "record", size: 40, tone: "skill" })] })),
     ModelIdentity: () => (_jsxs("div", { className: "grid gap-2", children: [_jsx(ModelIdentity, { model: "anthropic/claude-opus-5" }), _jsx(ModelIdentity, { model: "openai/gpt-5.6-sol" }), _jsx(ModelIdentity, { model: "x-ai/grok-4.5" })] })),
     ModelMark: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-4", children: [_jsx(ModelMark, { author: "anthropic", name: "Claude Opus 5" }), _jsx(ModelMark, { author: "mistralai", label: "Mistral" })] })),
     PlatformMark: () => (_jsx("div", { className: "flex flex-wrap items-center gap-4 text-sm", children: ["google", "microsoft", "apple", "telegram", "whatsapp", "slack"].map((platform) => (_jsxs("span", { className: "flex items-center gap-2 capitalize", children: [_jsx(PlatformMark, { platform: platform, size: 20 }), platform] }, platform))) })),
+    ProgressChecklist: () => (_jsx(ProgressChecklist, { closeLabel: "Close", description: "What Studio Rossi still needs before its Agents work for it.", doneLabel: "Done", finishLabel: "Done", label: "Studio Rossi's setup, 1 of 3 done", steps: [
+            {
+                id: "company",
+                title: "Company details confirmed",
+                description: "Legal name, VAT number and registered office checked.",
+                icon: Building2,
+                tone: "blue",
+                done: true,
+            },
+            {
+                id: "plan",
+                title: "Plan chosen",
+                description: "No member account holds a plan yet.",
+                icon: CreditCard,
+                tone: "green",
+                done: false,
+                action: { label: "Open billing", onClick: nothing },
+            },
+            {
+                id: "nadia",
+                title: "Nadia connected",
+                description: "Nadia has not reported an Agent from this company yet.",
+                icon: MonitorDown,
+                tone: "purple",
+                done: false,
+                action: { label: "Open downloads", onClick: nothing },
+            },
+        ], title: "Customer setup" })),
     RecordIdentity: () => (_jsx("div", { className: "max-w-sm", children: _jsx(RecordIdentity, { detail: "Company skill \u00B7 every Agent has it", hint: "skl_0042", mark: { kind: "record", icon: Wrench, tone: "skill" }, name: "Write quotes from the price list" }) })),
     StatusBadge: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(StatusBadge, { label: "Connected", tone: "success" }), _jsx(StatusBadge, { label: "Waiting for you", since: "2h", tone: "warning" }), _jsx(StatusBadge, { label: "Failed", tone: "danger" }), _jsx(StatusBadge, { label: "Running", tone: "info" }), _jsx(StatusBadge, { label: "Paused", tone: "neutral" })] })),
-    StatusDot: () => (_jsxs("div", { className: "grid gap-2 text-sm", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx(StatusDot, { tone: "good" }), "Telegram connected"] }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(StatusDot, { tone: "warn" }), "WhatsApp needs a new code"] }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(StatusDot, { tone: "bad" }), "Slack disconnected"] })] })),
+    StatusDot: () => (_jsxs("div", { className: "grid gap-2 text-sm", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx(StatusDot, { decorative: true, tone: "good" }), "Telegram connected"] }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(StatusDot, { decorative: true, tone: "warn" }), "WhatsApp needs a new code"] }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(StatusDot, { decorative: true, tone: "bad" }), "Slack disconnected"] })] })),
     Tag: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Tag, { tone: "blue", children: "Rossi Ottica" }), _jsx(Tag, { tone: "teal", children: "Partner" }), _jsx(Tag, { note: "Your account", quiet: true, children: "Direct customer" })] })),
 };

package/dist/showcase/usage.generated.d.ts

@@ -1,4 +1,4 @@
-export type UsageName = "ActivityFeed" | "AgentProfileCard" | "CatalogDrawer" | "CollectionFilters" | "CollectionPage" | "CollectionToolbar" | "ConfirmDialog" | "EntryScene" | "FormDialog" | "FormDrawer" | "LibraryShelf" | "ObjectPage" | "ObjectSection" | "OverviewPage" | "PageHeader" | "RecordList" | "RecordSheet" | "RowEditForm" | "SettingsPage" | "SettingsSection" | "Button" | "ButtonGroup" | "CopyButton" | "PageActions" | "Calendar" | "CollectionSearch" | "Field" | "Form" | "Input" | "InputGroup" | "InputOTP" | "Label" | "NativeSelect" | "SettingsField" | "Slider" | "Textarea" | "Checkbox" | "CollectionSort" | "Combobox" | "ModelSelect" | "RadioGroup" | "SegmentedChoice" | "Select" | "Switch" | "ThemeModeSwitcher" | "Toggle" | "ToggleGroup" | "ActionStatus" | "AgentOrb" | "AppMark" | "ArchIcon" | "Avatar" | "Badge" | "BrandWordmark" | "FileTypeIcon" | "IdentityMark" | "MetaLabel" | "ModelIdentity" | "ModelMark" | "PlatformMark" | "RecordIdentity" | "StatusBadge" | "StatusDot" | "Tag" | "AgentListRow" | "Breadcrumb" | "CommandDialog" | "DashboardShell" | "DesktopAppShell" | "Footer" | "NavigationMenu" | "Pagination" | "PortalSidebarFrame" | "ScopeSwitcher" | "Sidebar" | "SidebarSections" | "Tabs" | "TabsNav" | "textLinkVariants" | "AgentCard" | "ApprovalRow" | "Card" | "CardRow" | "CodeBlock" | "DataTable" | "DiffCount" | "DisclosureRow" | "FileDiff" | "Item" | "Kbd" | "MemoryItem" | "ObjectFacts" | "PairingCode" | "Progress" | "QrCode" | "RecordTime" | "RunTimeline" | "SettingsFactsSection" | "StatusRow" | "Table" | "TableCard" | "TableValue" | "UsageMeter" | "Alert" | "EmptyState" | "EntryProgress" | "EntryStageList" | "HoverCard" | "LabelledPicture" | "MessageNotice" | "NoticeBanner" | "PendingLabel" | "Skeleton" | "Toaster" | "Tooltip" | "UpdateCard" | "WaitingLine" | "AccountMenu" | "ActionContextMenu" | "ActionMenu" | "AlertDialog" | "ContextMenu" | "Dialog" | "Drawer" | "DropdownMenu" | "GlassControl" | "MenuChoiceRow" | "Menubar" | "Popover" | "Sheet" | "ThemeModeMenu" | "ActivityCalendar" | "ChartAreaStacked" | "ChartBarHorizontal" | "ChartBarMultiple" | "ChartBarStacked" | "ChartCard" | "ChartContainer" | "ChartSparkline" | "DateRangeControl" | "KpiCard" | "TrendBadge" | "createEntityColorMap" | "Accordion" | "AspectRatio" | "BrandField" | "Carousel" | "ChannelView" | "Collapsible" | "CompanyCard" | "Disclosure" | "ExpandableBlock" | "HiveScene" | "NadiaPresence" | "NumberedSteps" | "PluginSlotBoundary" | "ReadingColumn" | "ResizablePanelGroup" | "ScrollArea" | "Separator" | "ToolIcon";
+export type UsageName = "ActivityFeed" | "AgentProfileCard" | "CatalogDrawer" | "CollectionFilters" | "CollectionPage" | "CollectionToolbar" | "ConfirmDialog" | "EntryScene" | "FormDialog" | "FormDrawer" | "LibraryShelf" | "ObjectPage" | "ObjectSection" | "OverviewPage" | "PageHeader" | "RecordList" | "RecordSheet" | "RowEditForm" | "SettingsPage" | "SettingsSection" | "Button" | "ButtonGroup" | "ButtonLink" | "CopyButton" | "LoadMoreButton" | "PageActions" | "Calendar" | "ClearableInput" | "CollectionSearch" | "Field" | "Input" | "InputGroup" | "InputOTP" | "Label" | "NativeSelect" | "SettingsField" | "SettingsRows" | "Slider" | "Textarea" | "Checkbox" | "ChoiceboxGroup" | "CollectionSort" | "Combobox" | "ModelSelect" | "MultiSelect" | "RadioGroup" | "SegmentedChoice" | "SegmentedControl" | "Select" | "Switch" | "ThemeModeSegments" | "ThemeModeSwitcher" | "Toggle" | "ToggleGroup" | "ActionStatus" | "AgentOrb" | "AppMark" | "ArchIcon" | "Avatar" | "Badge" | "BrandWordmark" | "CheckCounts" | "FileTypeIcon" | "IdentityMark" | "ModelIdentity" | "ModelMark" | "PlatformMark" | "ProgressChecklist" | "RecordIdentity" | "StatusBadge" | "StatusDot" | "Tag" | "AgentListRow" | "Breadcrumb" | "CommandDialog" | "DesktopAppShell" | "Footer" | "PortalSidebarFrame" | "ScopeSwitcher" | "Sidebar" | "SidebarBrand" | "SidebarFind" | "SidebarFrame" | "SidebarMenuChevron" | "SidebarSections" | "Tabs" | "TabsNav" | "textLinkVariants" | "AgentCard" | "Card" | "CardRow" | "CodeBlock" | "DataTable" | "DiffCount" | "DisclosureRow" | "FileDiff" | "Gauge" | "Item" | "Kbd" | "MiddleTruncate" | "ObjectFacts" | "PairingCode" | "Progress" | "QrCode" | "RecordTime" | "RunTimeline" | "SettingsFactsSection" | "Snippet" | "Table" | "TableCard" | "TableValue" | "TextWithCopyButton" | "UsageMeter" | "Alert" | "EmptyState" | "EntryProgress" | "EntryStageList" | "HoverCard" | "LabelledPicture" | "MessageNotice" | "NoticeBanner" | "PendingLabel" | "Skeleton" | "SkeletonRegion" | "Toaster" | "Tooltip" | "UpdateCard" | "WaitingLine" | "AccountMenu" | "ActionContextMenu" | "ActionMenu" | "AlertDialog" | "ContextMenu" | "Dialog" | "Drawer" | "DropdownMenu" | "GlassControl" | "MenuChoiceRow" | "Popover" | "Sheet" | "ThemeModeMenu" | "ActivityCalendar" | "ChartAreaStacked" | "ChartBarHorizontal" | "ChartBarMultiple" | "ChartBarStacked" | "ChartCard" | "ChartContainer" | "ChartSparkline" | "DateRangeControl" | "KpiCard" | "TrendBadge" | "createEntityColorMap" | "Accordion" | "AspectRatio" | "BrandField" | "Carousel" | "Collapsible" | "CompanyCard" | "Disclosure" | "HiveScene" | "NadiaPresence" | "NumberedSteps" | "Prose" | "ReadingColumn" | "ResizablePanelGroup" | "ScrollArea" | "Separator" | "ToolIcon";
 export type UsageFamily = "Compositions" | "Actions" | "Inputs" | "Choices" | "Status" | "Navigation" | "Data" | "Feedback" | "Menus" | "Charts" | "Other";
 export type ComponentUsage = {
     name: UsageName;

package/dist/showcase/usage.generated.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usage.generated.d.ts","sourceRoot":"","sources":["../../src/showcase/usage.generated.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"usage.generated.d.ts","sourceRoot":"","sources":["../../src/showcase/usage.generated.ts"],"names":[],"mappings":"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"}