@braedonsaunders/appkit-ui 0.2.0

package/account-menu.d.ts

@@ -0,0 +1,49 @@
+import * as React from 'react';
+import { type BadgeProps } from './badge.js';
+export type AccountMenuOption = {
+    value: string;
+    label: string;
+    description?: string;
+};
+export type AccountMenuChoice = {
+    label: string;
+    summary: string;
+    value: string;
+    options: AccountMenuOption[];
+    onChange: (value: string) => void | Promise<void>;
+};
+export type AccountMenuLabels = {
+    menu: string;
+    account: string;
+    theme: string;
+    back: string;
+    signOut: string;
+    signingOut: string;
+};
+export type AccountMenuProps = {
+    name: string;
+    email: string;
+    contextLabel?: string;
+    contextTone?: 'default' | 'warning';
+    roleLabel?: string;
+    status?: {
+        label: string;
+        variant?: BadgeProps['variant'];
+    };
+    organization?: AccountMenuChoice;
+    language?: AccountMenuChoice;
+    navigation?: AccountMenuChoice;
+    showTheme?: boolean;
+    elevatedAccess?: {
+        label: string;
+        href: string;
+    };
+    onSignOut?: () => void | Promise<void>;
+    labels?: Partial<AccountMenuLabels>;
+};
+/**
+ * Bounded account launcher generalized into controlled choices.
+ * Organization, language, layout persistence and sign-out stay app-owned.
+ */
+export declare function AccountMenu({ name, email, contextLabel, contextTone, roleLabel, status, organization, language, navigation, showTheme, elevatedAccess, onSignOut, labels: labelOverrides, }: AccountMenuProps): React.JSX.Element;
+//# sourceMappingURL=account-menu.d.ts.map

package/account-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"account-menu.d.ts","sourceRoot":"","sources":["../src/account-menu.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAe9B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;AAMhD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,iBAAiB,EAAE,CAAA;IAC5B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;CAClD,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,CAAA;IACf,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAaD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;IACnC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAA;KAAE,CAAA;IAC3D,YAAY,CAAC,EAAE,iBAAiB,CAAA;IAChC,QAAQ,CAAC,EAAE,iBAAiB,CAAA;IAC5B,UAAU,CAAC,EAAE,iBAAiB,CAAA;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,cAAc,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;IAChD,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACtC,MAAM,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAA;CACpC,CAAA;AAED;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,KAAK,EACL,YAAY,EACZ,WAAuB,EACvB,SAAS,EACT,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,SAAgB,EAChB,cAAc,EACd,SAAS,EACT,MAAM,EAAE,cAAc,GACvB,EAAE,gBAAgB,qBAyHlB"}

package/account-menu.js

@@ -0,0 +1,66 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { Building2, Check, ChevronDown, ChevronLeft, ChevronRight, Languages, LayoutPanelLeft, LogOut, Palette, ShieldAlert, } from 'lucide-react';
+import { Avatar } from './avatar.js';
+import { Badge } from './badge.js';
+import { UiLink } from './link-context.js';
+import { Popover } from './popover.js';
+import { ThemeToggle } from './theme.js';
+import { cn } from './utils.js';
+const DEFAULT_LABELS = {
+    menu: 'Open account menu',
+    account: 'Account',
+    theme: 'Theme',
+    back: 'Back',
+    signOut: 'Sign out',
+    signingOut: 'Signing out…',
+};
+/**
+ * Bounded account launcher generalized into controlled choices.
+ * Organization, language, layout persistence and sign-out stay app-owned.
+ */
+export function AccountMenu({ name, email, contextLabel, contextTone = 'default', roleLabel, status, organization, language, navigation, showTheme = true, elevatedAccess, onSignOut, labels: labelOverrides, }) {
+    const labels = { ...DEFAULT_LABELS, ...labelOverrides };
+    const [open, setOpen] = React.useState(false);
+    const [view, setView] = React.useState('home');
+    const [saving, setSaving] = React.useState(false);
+    const [signingOut, startSignOut] = React.useTransition();
+    const displayName = name || email || labels.account;
+    function close() {
+        setOpen(false);
+        window.setTimeout(() => setView('home'), 150);
+    }
+    async function choose(choice, value) {
+        setSaving(true);
+        try {
+            await choice.onChange(value);
+            close();
+        }
+        finally {
+            setSaving(false);
+        }
+    }
+    const title = view === 'organization'
+        ? organization?.label
+        : view === 'language'
+            ? language?.label
+            : view === 'navigation'
+                ? navigation?.label
+                : labels.theme;
+    return (_jsx(Popover, { open: open, onOpenChange: (next) => {
+            setOpen(next);
+            if (!next)
+                window.setTimeout(() => setView('home'), 150);
+        }, align: "end", className: "w-72", trigger: _jsxs("button", { type: "button", onClick: () => setOpen((current) => !current), "aria-label": labels.menu, "aria-expanded": open, "aria-haspopup": "menu", className: "flex shrink-0 items-center gap-2 rounded-md border border-transparent px-1.5 py-1 text-sm text-fg-muted transition-colors hover:bg-surface-hover hover:text-fg", children: [_jsx(Avatar, { name: displayName, size: 28 }), _jsxs("span", { className: "hidden min-w-0 max-w-44 flex-col text-left sm:flex", children: [_jsx("span", { className: "truncate text-sm leading-tight text-fg", children: displayName }), contextLabel ? (_jsx("span", { className: cn('truncate text-[11px] leading-tight', contextTone === 'warning' ? 'text-warning' : 'text-fg-subtle'), children: contextLabel })) : null] }), _jsx(ChevronDown, { size: 14, className: "hidden shrink-0 text-fg-subtle sm:inline" })] }), children: view === 'home' ? (_jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-3 px-3 py-3", children: [_jsx(Avatar, { name: displayName, size: 40 }), _jsxs("span", { className: "flex min-w-0 flex-col", children: [_jsx("span", { className: "truncate text-sm font-medium text-fg", children: displayName }), email ? _jsx("span", { className: "truncate text-xs text-fg-muted", children: email }) : null, _jsxs("span", { className: "mt-1 flex flex-wrap gap-1", children: [roleLabel ? _jsx(Badge, { variant: "secondary", className: "text-[10px]", children: roleLabel }) : null, status ? _jsx(Badge, { variant: status.variant ?? 'secondary', className: "text-[10px]", children: status.label }) : null] })] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-2 px-2 pb-2", children: [organization ? _jsx(LauncherCard, { icon: Building2, tone: "primary", label: organization.label, summary: organization.summary, onClick: () => setView('organization') }) : null, language ? _jsx(LauncherCard, { icon: Languages, tone: "info", label: language.label, summary: language.summary, onClick: () => setView('language') }) : null, showTheme ? _jsx(LauncherCard, { icon: Palette, tone: "primary", label: labels.theme, onClick: () => setView('theme') }) : null, navigation ? _jsx(LauncherCard, { icon: LayoutPanelLeft, tone: "warning", label: navigation.label, summary: navigation.summary, onClick: () => setView('navigation') }) : null, elevatedAccess ? (_jsxs(UiLink, { href: elevatedAccess.href, onClick: close, className: "group relative flex flex-col gap-2 rounded-xl border border-border bg-surface p-3 transition-colors hover:border-border-strong hover:bg-surface-hover", children: [_jsx("span", { className: "grid size-9 place-items-center rounded-lg bg-danger-subtle text-danger", children: _jsx(ShieldAlert, { size: 18 }) }), _jsx("span", { className: "truncate text-sm font-medium text-fg", children: elevatedAccess.label })] })) : null] }), onSignOut ? (_jsx("div", { className: "border-t border-border-subtle p-1", children: _jsxs("button", { type: "button", disabled: signingOut, role: "menuitem", onClick: () => startSignOut(async () => { await onSignOut(); close(); }), className: "flex w-full items-center gap-2.5 rounded-md px-3 py-2 text-sm text-fg-muted transition-colors hover:bg-surface-hover hover:text-fg disabled:opacity-60", children: [_jsx(LogOut, { size: 15 }), signingOut ? labels.signingOut : labels.signOut] }) })) : null] })) : (_jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-1.5 border-b border-border-subtle px-2 py-2", children: [_jsx("button", { type: "button", onClick: () => setView('home'), "aria-label": labels.back, className: "grid size-7 place-items-center rounded-md text-fg-muted hover:bg-surface-hover hover:text-fg", children: _jsx(ChevronLeft, { size: 16 }) }), _jsx("span", { className: "text-sm font-semibold text-fg", children: title })] }), view === 'theme' ? _jsx("div", { className: "p-3", children: _jsx(ThemeToggle, {}) }) : null, view === 'organization' && organization ? _jsx(ChoiceList, { choice: organization, saving: saving, onChoose: choose }) : null, view === 'language' && language ? _jsx(ChoiceList, { choice: language, saving: saving, onChoose: choose }) : null, view === 'navigation' && navigation ? _jsx(ChoiceList, { choice: navigation, saving: saving, onChoose: choose }) : null] })) }));
+}
+function LauncherCard({ icon: Icon, tone, label, summary, onClick }) {
+    return (_jsxs("button", { type: "button", onClick: onClick, className: "group relative flex flex-col gap-2 rounded-xl border border-border bg-surface p-3 text-left transition-colors hover:border-border-strong hover:bg-surface-hover", children: [_jsx("span", { className: cn('grid size-9 place-items-center rounded-lg', tone === 'info' ? 'bg-info-subtle text-info' : tone === 'warning' ? 'bg-warning-subtle text-warning' : 'bg-primary-subtle text-primary'), children: _jsx(Icon, { size: 18 }) }), _jsxs("span", { className: "min-w-0", children: [_jsx("span", { className: "block truncate text-sm font-medium text-fg", children: label }), summary ? _jsx("span", { className: "block truncate text-[11px] text-fg-subtle", children: summary }) : null] }), _jsx(ChevronRight, { size: 14, className: "absolute right-2.5 top-3 text-fg-subtle transition-transform group-hover:translate-x-0.5" })] }));
+}
+function ChoiceList({ choice, saving, onChoose }) {
+    return (_jsx("div", { className: "max-h-72 overflow-y-auto p-1", children: choice.options.map((option) => {
+            const active = choice.value === option.value;
+            return (_jsxs("button", { type: "button", role: "menuitemradio", "aria-checked": active, disabled: saving, onClick: () => void onChoose(choice, option.value), className: "flex w-full items-start gap-2 rounded-md px-3 py-2 text-left text-sm text-fg-muted hover:bg-surface-hover hover:text-fg disabled:opacity-60", children: [_jsx(Check, { size: 15, className: cn('mt-0.5 shrink-0', active ? 'text-primary' : 'text-transparent') }), _jsxs("span", { className: "min-w-0", children: [_jsx("span", { className: "block truncate", children: option.label }), option.description ? _jsx("span", { className: "block truncate text-xs text-fg-subtle", children: option.description }) : null] })] }, option.value));
+        }) }));
+}
+//# sourceMappingURL=account-menu.js.map

package/account-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"account-menu.js","sourceRoot":"","sources":["../src/account-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport {\n  Building2,\n  Check,\n  ChevronDown,\n  ChevronLeft,\n  ChevronRight,\n  Languages,\n  LayoutPanelLeft,\n  LogOut,\n  Palette,\n  ShieldAlert,\n  type LucideIcon,\n} from 'lucide-react'\nimport { Avatar } from './avatar'\nimport { Badge, type BadgeProps } from './badge'\nimport { UiLink } from './link-context'\nimport { Popover } from './popover'\nimport { ThemeToggle } from './theme'\nimport { cn } from './utils'\n\nexport type AccountMenuOption = {\n  value: string\n  label: string\n  description?: string\n}\n\nexport type AccountMenuChoice = {\n  label: string\n  summary: string\n  value: string\n  options: AccountMenuOption[]\n  onChange: (value: string) => void | Promise<void>\n}\n\nexport type AccountMenuLabels = {\n  menu: string\n  account: string\n  theme: string\n  back: string\n  signOut: string\n  signingOut: string\n}\n\nconst DEFAULT_LABELS: AccountMenuLabels = {\n  menu: 'Open account menu',\n  account: 'Account',\n  theme: 'Theme',\n  back: 'Back',\n  signOut: 'Sign out',\n  signingOut: 'Signing out…',\n}\n\ntype View = 'home' | 'organization' | 'language' | 'theme' | 'navigation'\n\nexport type AccountMenuProps = {\n  name: string\n  email: string\n  contextLabel?: string\n  contextTone?: 'default' | 'warning'\n  roleLabel?: string\n  status?: { label: string; variant?: BadgeProps['variant'] }\n  organization?: AccountMenuChoice\n  language?: AccountMenuChoice\n  navigation?: AccountMenuChoice\n  showTheme?: boolean\n  elevatedAccess?: { label: string; href: string }\n  onSignOut?: () => void | Promise<void>\n  labels?: Partial<AccountMenuLabels>\n}\n\n/**\n * Bounded account launcher generalized into controlled choices.\n * Organization, language, layout persistence and sign-out stay app-owned.\n */\nexport function AccountMenu({\n  name,\n  email,\n  contextLabel,\n  contextTone = 'default',\n  roleLabel,\n  status,\n  organization,\n  language,\n  navigation,\n  showTheme = true,\n  elevatedAccess,\n  onSignOut,\n  labels: labelOverrides,\n}: AccountMenuProps) {\n  const labels = { ...DEFAULT_LABELS, ...labelOverrides }\n  const [open, setOpen] = React.useState(false)\n  const [view, setView] = React.useState<View>('home')\n  const [saving, setSaving] = React.useState(false)\n  const [signingOut, startSignOut] = React.useTransition()\n  const displayName = name || email || labels.account\n\n  function close() {\n    setOpen(false)\n    window.setTimeout(() => setView('home'), 150)\n  }\n\n  async function choose(choice: AccountMenuChoice, value: string) {\n    setSaving(true)\n    try {\n      await choice.onChange(value)\n      close()\n    } finally {\n      setSaving(false)\n    }\n  }\n\n  const title =\n    view === 'organization'\n      ? organization?.label\n      : view === 'language'\n        ? language?.label\n        : view === 'navigation'\n          ? navigation?.label\n          : labels.theme\n\n  return (\n    <Popover\n      open={open}\n      onOpenChange={(next) => {\n        setOpen(next)\n        if (!next) window.setTimeout(() => setView('home'), 150)\n      }}\n      align=\"end\"\n      className=\"w-72\"\n      trigger={\n        <button\n          type=\"button\"\n          onClick={() => setOpen((current) => !current)}\n          aria-label={labels.menu}\n          aria-expanded={open}\n          aria-haspopup=\"menu\"\n          className=\"flex shrink-0 items-center gap-2 rounded-md border border-transparent px-1.5 py-1 text-sm text-fg-muted transition-colors hover:bg-surface-hover hover:text-fg\"\n        >\n          <Avatar name={displayName} size={28} />\n          <span className=\"hidden min-w-0 max-w-44 flex-col text-left sm:flex\">\n            <span className=\"truncate text-sm leading-tight text-fg\">{displayName}</span>\n            {contextLabel ? (\n              <span className={cn('truncate text-[11px] leading-tight', contextTone === 'warning' ? 'text-warning' : 'text-fg-subtle')}>\n                {contextLabel}\n              </span>\n            ) : null}\n          </span>\n          <ChevronDown size={14} className=\"hidden shrink-0 text-fg-subtle sm:inline\" />\n        </button>\n      }\n    >\n      {view === 'home' ? (\n        <div>\n          <div className=\"flex items-center gap-3 px-3 py-3\">\n            <Avatar name={displayName} size={40} />\n            <span className=\"flex min-w-0 flex-col\">\n              <span className=\"truncate text-sm font-medium text-fg\">{displayName}</span>\n              {email ? <span className=\"truncate text-xs text-fg-muted\">{email}</span> : null}\n              <span className=\"mt-1 flex flex-wrap gap-1\">\n                {roleLabel ? <Badge variant=\"secondary\" className=\"text-[10px]\">{roleLabel}</Badge> : null}\n                {status ? <Badge variant={status.variant ?? 'secondary'} className=\"text-[10px]\">{status.label}</Badge> : null}\n              </span>\n            </span>\n          </div>\n\n          <div className=\"grid grid-cols-2 gap-2 px-2 pb-2\">\n            {organization ? <LauncherCard icon={Building2} tone=\"primary\" label={organization.label} summary={organization.summary} onClick={() => setView('organization')} /> : null}\n            {language ? <LauncherCard icon={Languages} tone=\"info\" label={language.label} summary={language.summary} onClick={() => setView('language')} /> : null}\n            {showTheme ? <LauncherCard icon={Palette} tone=\"primary\" label={labels.theme} onClick={() => setView('theme')} /> : null}\n            {navigation ? <LauncherCard icon={LayoutPanelLeft} tone=\"warning\" label={navigation.label} summary={navigation.summary} onClick={() => setView('navigation')} /> : null}\n            {elevatedAccess ? (\n              <UiLink href={elevatedAccess.href} onClick={close} className=\"group relative flex flex-col gap-2 rounded-xl border border-border bg-surface p-3 transition-colors hover:border-border-strong hover:bg-surface-hover\">\n                <span className=\"grid size-9 place-items-center rounded-lg bg-danger-subtle text-danger\"><ShieldAlert size={18} /></span>\n                <span className=\"truncate text-sm font-medium text-fg\">{elevatedAccess.label}</span>\n              </UiLink>\n            ) : null}\n          </div>\n\n          {onSignOut ? (\n            <div className=\"border-t border-border-subtle p-1\">\n              <button\n                type=\"button\"\n                disabled={signingOut}\n                role=\"menuitem\"\n                onClick={() => startSignOut(async () => { await onSignOut(); close() })}\n                className=\"flex w-full items-center gap-2.5 rounded-md px-3 py-2 text-sm text-fg-muted transition-colors hover:bg-surface-hover hover:text-fg disabled:opacity-60\"\n              >\n                <LogOut size={15} />\n                {signingOut ? labels.signingOut : labels.signOut}\n              </button>\n            </div>\n          ) : null}\n        </div>\n      ) : (\n        <div>\n          <div className=\"flex items-center gap-1.5 border-b border-border-subtle px-2 py-2\">\n            <button type=\"button\" onClick={() => setView('home')} aria-label={labels.back} className=\"grid size-7 place-items-center rounded-md text-fg-muted hover:bg-surface-hover hover:text-fg\">\n              <ChevronLeft size={16} />\n            </button>\n            <span className=\"text-sm font-semibold text-fg\">{title}</span>\n          </div>\n          {view === 'theme' ? <div className=\"p-3\"><ThemeToggle /></div> : null}\n          {view === 'organization' && organization ? <ChoiceList choice={organization} saving={saving} onChoose={choose} /> : null}\n          {view === 'language' && language ? <ChoiceList choice={language} saving={saving} onChoose={choose} /> : null}\n          {view === 'navigation' && navigation ? <ChoiceList choice={navigation} saving={saving} onChoose={choose} /> : null}\n        </div>\n      )}\n    </Popover>\n  )\n}\n\nfunction LauncherCard({ icon: Icon, tone, label, summary, onClick }: { icon: LucideIcon; tone: 'primary' | 'info' | 'warning'; label: string; summary?: string; onClick: () => void }) {\n  return (\n    <button type=\"button\" onClick={onClick} className=\"group relative flex flex-col gap-2 rounded-xl border border-border bg-surface p-3 text-left transition-colors hover:border-border-strong hover:bg-surface-hover\">\n      <span className={cn('grid size-9 place-items-center rounded-lg', tone === 'info' ? 'bg-info-subtle text-info' : tone === 'warning' ? 'bg-warning-subtle text-warning' : 'bg-primary-subtle text-primary')}><Icon size={18} /></span>\n      <span className=\"min-w-0\">\n        <span className=\"block truncate text-sm font-medium text-fg\">{label}</span>\n        {summary ? <span className=\"block truncate text-[11px] text-fg-subtle\">{summary}</span> : null}\n      </span>\n      <ChevronRight size={14} className=\"absolute right-2.5 top-3 text-fg-subtle transition-transform group-hover:translate-x-0.5\" />\n    </button>\n  )\n}\n\nfunction ChoiceList({ choice, saving, onChoose }: { choice: AccountMenuChoice; saving: boolean; onChoose: (choice: AccountMenuChoice, value: string) => Promise<void> }) {\n  return (\n    <div className=\"max-h-72 overflow-y-auto p-1\">\n      {choice.options.map((option) => {\n        const active = choice.value === option.value\n        return (\n          <button key={option.value} type=\"button\" role=\"menuitemradio\" aria-checked={active} disabled={saving} onClick={() => void onChoose(choice, option.value)} className=\"flex w-full items-start gap-2 rounded-md px-3 py-2 text-left text-sm text-fg-muted hover:bg-surface-hover hover:text-fg disabled:opacity-60\">\n            <Check size={15} className={cn('mt-0.5 shrink-0', active ? 'text-primary' : 'text-transparent')} />\n            <span className=\"min-w-0\"><span className=\"block truncate\">{option.label}</span>{option.description ? <span className=\"block truncate text-xs text-fg-subtle\">{option.description}</span> : null}</span>\n          </button>\n        )\n      })}\n    </div>\n  )\n}\n"]}

package/alert.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const alertVariants: (props?: ({
+    variant?: "default" | "destructive" | "warning" | "success" | "info" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type AlertProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>;
+export declare const Alert: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    variant?: "default" | "destructive" | "warning" | "success" | "info" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
+export declare const AlertTitle: ({ className, ...props }: React.HTMLAttributes<HTMLHeadingElement>) => React.JSX.Element;
+export declare const AlertDescription: ({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>) => React.JSX.Element;
+export { alertVariants };
+//# sourceMappingURL=alert.d.ts.map

package/alert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../src/alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,QAAA,MAAM,aAAa;;8EAWjB,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAA;AAElG,eAAO,MAAM,KAAK;;sHAIjB,CAAA;AAGD,eAAO,MAAM,UAAU,GAAI,yBAAyB,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,sBAE3F,CAAA;AAED,eAAO,MAAM,gBAAgB,GAAI,yBAAyB,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC,sBAEnG,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}

package/alert.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from './utils.js';
+const alertVariants = cva('relative w-full rounded-lg border p-4 text-sm shadow-sm', {
+    variants: {
+        variant: {
+            default: 'border-border bg-surface text-fg',
+            destructive: 'border-danger/25 bg-danger-subtle text-danger',
+            warning: 'border-warning/25 bg-warning-subtle text-warning',
+            success: 'border-success/25 bg-success-subtle text-success',
+            info: 'border-info/25 bg-info-subtle text-info',
+        },
+    },
+    defaultVariants: { variant: 'default' },
+});
+export const Alert = React.forwardRef(({ className, variant, ...props }, ref) => (_jsx("div", { ref: ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props })));
+Alert.displayName = 'Alert';
+export const AlertTitle = ({ className, ...props }) => (_jsx("h5", { className: cn('mb-1 font-semibold leading-tight tracking-tight', className), ...props }));
+export const AlertDescription = ({ className, ...props }) => (_jsx("div", { className: cn('text-sm leading-relaxed opacity-90 [&_p]:leading-relaxed', className), ...props }));
+export { alertVariants };
+//# sourceMappingURL=alert.js.map

package/alert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.js","sourceRoot":"","sources":["../src/alert.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAA;AAE5B,MAAM,aAAa,GAAG,GAAG,CAAC,yDAAyD,EAAE;IACnF,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,kCAAkC;YAC3C,WAAW,EAAE,+CAA+C;YAC5D,OAAO,EAAE,kDAAkD;YAC3D,OAAO,EAAE,kDAAkD;YAC3D,IAAI,EAAE,yCAAyC;SAChD;KACF;IACD,eAAe,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;CACxC,CAAC,CAAA;AAIF,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACzC,cAAK,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAChG,CACF,CAAA;AACD,KAAK,CAAC,WAAW,GAAG,OAAO,CAAA;AAE3B,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA4C,EAAE,EAAE,CAAC,CAC/F,aAAI,SAAS,EAAE,EAAE,CAAC,iDAAiD,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC/F,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA8C,EAAE,EAAE,CAAC,CACvG,cAAK,SAAS,EAAE,EAAE,CAAC,0DAA0D,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CACzG,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA","sourcesContent":["import * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from './utils'\n\nconst alertVariants = cva('relative w-full rounded-lg border p-4 text-sm shadow-sm', {\n  variants: {\n    variant: {\n      default: 'border-border bg-surface text-fg',\n      destructive: 'border-danger/25 bg-danger-subtle text-danger',\n      warning: 'border-warning/25 bg-warning-subtle text-warning',\n      success: 'border-success/25 bg-success-subtle text-success',\n      info: 'border-info/25 bg-info-subtle text-info',\n    },\n  },\n  defaultVariants: { variant: 'default' },\n})\n\nexport type AlertProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>\n\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n  ({ className, variant, ...props }, ref) => (\n    <div ref={ref} role=\"alert\" className={cn(alertVariants({ variant }), className)} {...props} />\n  ),\n)\nAlert.displayName = 'Alert'\n\nexport const AlertTitle = ({ className, ...props }: React.HTMLAttributes<HTMLHeadingElement>) => (\n  <h5 className={cn('mb-1 font-semibold leading-tight tracking-tight', className)} {...props} />\n)\n\nexport const AlertDescription = ({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>) => (\n  <div className={cn('text-sm leading-relaxed opacity-90 [&_p]:leading-relaxed', className)} {...props} />\n)\n\nexport { alertVariants }\n"]}

package/animated-number.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+export type AnimatedNumberProps = {
+    value: number;
+    from?: number;
+    duration?: number;
+    format?: (value: number) => string;
+    className?: string;
+    decimals?: number;
+};
+/** Byte-compatible sibling counter, with its default duration read from appkit's motion tokens. */
+export declare function AnimatedNumber({ value, from, duration, format, className, decimals, }: AnimatedNumberProps): React.JSX.Element;
+export declare function formatNumber(value: number, format?: (value: number) => string, decimals?: number): string;
+//# sourceMappingURL=animated-number.d.ts.map

package/animated-number.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animated-number.d.ts","sourceRoot":"","sources":["../src/animated-number.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAW9B,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IAClC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,mGAAmG;AACnG,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,IAAQ,EACR,QAAQ,EACR,MAAM,EACN,SAAS,EACT,QAAQ,GACT,EAAE,mBAAmB,qBAkCrB;AAED,wBAAgB,YAAY,CAC1B,KAAK,EAAE,MAAM,EACb,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,EAClC,QAAQ,SAAI,GACX,MAAM,CAMR"}

package/animated-number.js

@@ -0,0 +1,53 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { animate, useMotionValue, useReducedMotion } from 'framer-motion';
+function tokenDurationSeconds(token) {
+    if (typeof document === 'undefined')
+        return 0.32;
+    const raw = getComputedStyle(document.documentElement).getPropertyValue(token).trim();
+    if (raw.endsWith('ms'))
+        return Number.parseFloat(raw) / 1000;
+    if (raw.endsWith('s'))
+        return Number.parseFloat(raw);
+    return 0.32;
+}
+/** Byte-compatible sibling counter, with its default duration read from appkit's motion tokens. */
+export function AnimatedNumber({ value, from = 0, duration, format, className, decimals, }) {
+    const reduce = useReducedMotion();
+    const motionValue = useMotionValue(reduce ? value : from);
+    const [displayValue, setDisplayValue] = React.useState(reduce ? value : from);
+    React.useEffect(() => {
+        if (reduce || document.visibilityState !== 'visible') {
+            setDisplayValue(value);
+            return;
+        }
+        const controls = animate(motionValue, value, {
+            duration: duration ?? tokenDurationSeconds('--duration-slow'),
+            ease: [0.22, 1, 0.36, 1],
+            onUpdate: setDisplayValue,
+        });
+        const onVisibilityChange = () => {
+            if (document.visibilityState === 'hidden') {
+                controls.stop();
+                motionValue.set(value);
+                setDisplayValue(value);
+            }
+        };
+        document.addEventListener('visibilitychange', onVisibilityChange);
+        return () => {
+            document.removeEventListener('visibilitychange', onVisibilityChange);
+            controls.stop();
+        };
+    }, [duration, motionValue, reduce, value]);
+    return (_jsx("span", { className: className, "aria-label": String(value), children: formatNumber(displayValue, format, decimals) }));
+}
+export function formatNumber(value, format, decimals = 0) {
+    if (format)
+        return format(value);
+    const rounded = decimals > 0 ? value.toFixed(decimals) : Math.round(value).toString();
+    const [integer, fraction] = rounded.split('.');
+    const grouped = integer.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+    return fraction ? `${grouped}.${fraction}` : grouped;
+}
+//# sourceMappingURL=animated-number.js.map

package/animated-number.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"animated-number.js","sourceRoot":"","sources":["../src/animated-number.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { animate, useMotionValue, useReducedMotion } from 'framer-motion'\n\nfunction tokenDurationSeconds(token: '--duration-fast' | '--duration-base' | '--duration-slow'): number {\n  if (typeof document === 'undefined') return 0.32\n  const raw = getComputedStyle(document.documentElement).getPropertyValue(token).trim()\n  if (raw.endsWith('ms')) return Number.parseFloat(raw) / 1000\n  if (raw.endsWith('s')) return Number.parseFloat(raw)\n  return 0.32\n}\n\nexport type AnimatedNumberProps = {\n  value: number\n  from?: number\n  duration?: number\n  format?: (value: number) => string\n  className?: string\n  decimals?: number\n}\n\n/** Byte-compatible sibling counter, with its default duration read from appkit's motion tokens. */\nexport function AnimatedNumber({\n  value,\n  from = 0,\n  duration,\n  format,\n  className,\n  decimals,\n}: AnimatedNumberProps) {\n  const reduce = useReducedMotion()\n  const motionValue = useMotionValue(reduce ? value : from)\n  const [displayValue, setDisplayValue] = React.useState(reduce ? value : from)\n\n  React.useEffect(() => {\n    if (reduce || document.visibilityState !== 'visible') {\n      setDisplayValue(value)\n      return\n    }\n    const controls = animate(motionValue, value, {\n      duration: duration ?? tokenDurationSeconds('--duration-slow'),\n      ease: [0.22, 1, 0.36, 1],\n      onUpdate: setDisplayValue,\n    })\n    const onVisibilityChange = () => {\n      if (document.visibilityState === 'hidden') {\n        controls.stop()\n        motionValue.set(value)\n        setDisplayValue(value)\n      }\n    }\n    document.addEventListener('visibilitychange', onVisibilityChange)\n    return () => {\n      document.removeEventListener('visibilitychange', onVisibilityChange)\n      controls.stop()\n    }\n  }, [duration, motionValue, reduce, value])\n\n  return (\n    <span className={className} aria-label={String(value)}>\n      {formatNumber(displayValue, format, decimals)}\n    </span>\n  )\n}\n\nexport function formatNumber(\n  value: number,\n  format?: (value: number) => string,\n  decimals = 0,\n): string {\n  if (format) return format(value)\n  const rounded = decimals > 0 ? value.toFixed(decimals) : Math.round(value).toString()\n  const [integer, fraction] = rounded.split('.')\n  const grouped = integer!.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',')\n  return fraction ? `${grouped}.${fraction}` : grouped\n}\n"]}

package/api-reference.d.ts

@@ -0,0 +1,44 @@
+import * as React from 'react';
+export type ApiParamDoc = {
+    name: string;
+    in?: 'query' | 'path' | 'header';
+    type?: string;
+    required?: boolean;
+    description?: string;
+};
+export type ApiEndpointDoc = {
+    method: string;
+    path: string;
+    summary?: string;
+    description?: string;
+    tag?: string;
+    permission?: string;
+    params?: ApiParamDoc[];
+    requestExample?: unknown;
+    responseExample?: unknown;
+};
+export declare function MethodBadge({ method, className }: {
+    method: string;
+    className?: string;
+}): React.JSX.Element;
+export declare function CodeBlock({ code, className }: {
+    code: string;
+    className?: string;
+}): React.JSX.Element;
+export declare function ApiEndpoint({ endpoint, baseUrl, apiKey, defaultOpen, }: {
+    endpoint: ApiEndpointDoc;
+    baseUrl?: string;
+    apiKey?: string;
+    defaultOpen?: boolean;
+}): React.JSX.Element;
+export declare function ApiReference({ endpoints, baseUrl, title, description, apiKey: initialApiKey, showBearerToken, className, }: {
+    endpoints: ApiEndpointDoc[];
+    baseUrl?: string;
+    title?: string;
+    description?: string;
+    apiKey?: string;
+    /** Show the optional bearer-token input beside the base URL. */
+    showBearerToken?: boolean;
+    className?: string;
+}): React.JSX.Element;
+//# sourceMappingURL=api-reference.d.ts.map

package/api-reference.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"api-reference.d.ts","sourceRoot":"","sources":["../src/api-reference.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAY9B,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,MAAM,CAAA;IACZ,EAAE,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;IAChC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,MAAM,CAAC,EAAE,WAAW,EAAE,CAAA;IACtB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAUD,wBAAgB,WAAW,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,qBAaxF;AAED,wBAAgB,SAAS,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,qBAuBlF;AAID,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,OAAO,EACP,MAAM,EACN,WAAmB,GACpB,EAAE;IACD,QAAQ,EAAE,cAAc,CAAA;IACxB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,qBAsIA;AAED,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,OAAO,EACP,KAAK,EACL,WAAW,EACX,MAAM,EAAE,aAAa,EACrB,eAAsB,EACtB,SAAS,GACV,EAAE;IACD,SAAS,EAAE,cAAc,EAAE,CAAA;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gEAAgE;IAChE,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,qBAiDA"}

package/api-reference.js

@@ -0,0 +1,82 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { AnimatePresence, motion } from 'framer-motion';
+import { Check, ChevronRight, Copy, Loader2, Play } from 'lucide-react';
+import { Badge } from './badge.js';
+import { Button } from './button.js';
+import { Input } from './input.js';
+import { cn } from './utils.js';
+const METHOD_COLORS = {
+    GET: 'bg-success-subtle text-success',
+    POST: 'bg-info-subtle text-info',
+    PUT: 'bg-warning-subtle text-warning',
+    PATCH: 'bg-warning-subtle text-warning',
+    DELETE: 'bg-danger-subtle text-danger',
+};
+export function MethodBadge({ method, className }) {
+    const m = method.toUpperCase();
+    return (_jsx("span", { className: cn('inline-flex min-w-14 justify-center rounded-md px-2 py-0.5 text-[11px] font-bold tracking-wide', METHOD_COLORS[m] ?? 'bg-bg-subtle text-fg-muted', className), children: m }));
+}
+export function CodeBlock({ code, className }) {
+    const [copied, setCopied] = React.useState(false);
+    const copy = () => {
+        navigator.clipboard?.writeText(code).then(() => {
+            setCopied(true);
+            setTimeout(() => setCopied(false), 1500);
+        });
+    };
+    return (_jsxs("div", { className: cn('group relative overflow-hidden rounded-lg border border-border bg-bg-subtle', className), children: [_jsx("button", { type: "button", onClick: copy, "aria-label": "Copy", className: "absolute right-2 top-2 rounded-md p-1.5 text-fg-subtle opacity-0 transition hover:bg-surface-hover hover:text-fg group-hover:opacity-100", children: copied ? _jsx(Check, { className: "size-4 text-success" }) : _jsx(Copy, { className: "size-4" }) }), _jsx("pre", { className: "app-scroll overflow-x-auto p-3 text-xs leading-relaxed", children: _jsx("code", { className: "font-mono text-fg", children: code }) })] }));
+}
+const json = (v) => JSON.stringify(v, null, 2);
+export function ApiEndpoint({ endpoint, baseUrl, apiKey, defaultOpen = false, }) {
+    const [open, setOpen] = React.useState(defaultOpen);
+    const [sending, setSending] = React.useState(false);
+    const [result, setResult] = React.useState(null);
+    async function send() {
+        if (!baseUrl)
+            return;
+        setSending(true);
+        setResult(null);
+        try {
+            const hasBody = endpoint.method !== 'GET' && endpoint.requestExample !== undefined;
+            const res = await fetch(baseUrl + endpoint.path, {
+                method: endpoint.method,
+                headers: {
+                    ...(apiKey ? { Authorization: `Bearer ${apiKey}` } : {}),
+                    ...(hasBody ? { 'Content-Type': 'application/json' } : {}),
+                },
+                body: hasBody ? JSON.stringify(endpoint.requestExample) : undefined,
+            });
+            const text = await res.text();
+            let body = text;
+            try {
+                body = json(JSON.parse(text));
+            }
+            catch {
+                // Preserve non-JSON response bodies verbatim.
+            }
+            setResult({ status: res.status, body });
+        }
+        catch (e) {
+            setResult({ status: 0, body: String(e) });
+        }
+        finally {
+            setSending(false);
+        }
+    }
+    return (_jsxs("div", { className: "overflow-hidden rounded-xl border border-border bg-surface", children: [_jsxs("button", { type: "button", onClick: () => setOpen((o) => !o), className: "flex w-full items-center gap-3 px-4 py-3 text-left transition-colors hover:bg-surface-hover", children: [_jsx(MethodBadge, { method: endpoint.method }), _jsx("code", { className: "min-w-0 flex-1 truncate font-mono text-sm text-fg", children: endpoint.path }), endpoint.summary ? (_jsx("span", { className: "hidden min-w-0 truncate text-sm text-fg-muted md:block", children: endpoint.summary })) : null, _jsx(ChevronRight, { className: cn('size-4 shrink-0 text-fg-subtle transition-transform', open && 'rotate-90') })] }), _jsx(AnimatePresence, { initial: false, children: open ? (_jsx(motion.div, { initial: { height: 0, opacity: 0 }, animate: { height: 'auto', opacity: 1 }, exit: { height: 0, opacity: 0 }, transition: { duration: 0.2, ease: [0.22, 1, 0.36, 1] }, className: "overflow-hidden", children: _jsxs("div", { className: "space-y-4 border-t border-border px-4 py-4", children: [endpoint.description ? _jsx("p", { className: "text-sm text-fg-muted", children: endpoint.description }) : null, endpoint.permission ? (_jsxs("div", { className: "flex items-center gap-2 text-xs", children: [_jsx("span", { className: "text-fg-subtle", children: "Requires" }), _jsx(Badge, { variant: "secondary", className: "font-mono", children: endpoint.permission })] })) : null, endpoint.params?.length ? (_jsx("div", { className: "overflow-hidden rounded-lg border border-border", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "bg-bg-subtle text-xs uppercase tracking-wide text-fg-muted", children: _jsxs("tr", { children: [_jsx("th", { className: "px-3 py-2 text-left font-medium", children: "Param" }), _jsx("th", { className: "px-3 py-2 text-left font-medium", children: "Type" }), _jsx("th", { className: "px-3 py-2 text-left font-medium", children: "Description" })] }) }), _jsx("tbody", { className: "divide-y divide-border", children: endpoint.params.map((p) => (_jsxs("tr", { children: [_jsxs("td", { className: "px-3 py-2 font-mono text-fg", children: [p.name, p.required ? _jsx("span", { className: "text-danger", children: " *" }) : null, _jsx("span", { className: "ml-1 text-[11px] text-fg-subtle", children: p.in ?? 'query' })] }), _jsx("td", { className: "px-3 py-2 font-mono text-fg-muted", children: p.type ?? 'string' }), _jsx("td", { className: "px-3 py-2 text-fg-muted", children: p.description })] }, p.name))) })] }) })) : null, endpoint.requestExample !== undefined ? (_jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: "text-xs font-medium text-fg-muted", children: "Request body" }), _jsx(CodeBlock, { code: json(endpoint.requestExample) })] })) : null, endpoint.responseExample !== undefined ? (_jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: "text-xs font-medium text-fg-muted", children: "Response" }), _jsx(CodeBlock, { code: json(endpoint.responseExample) })] })) : null, baseUrl ? (_jsxs("div", { className: "space-y-2", children: [_jsxs(Button, { size: "sm", onClick: send, disabled: sending, children: [sending ? _jsx(Loader2, { className: "size-4 animate-spin" }) : _jsx(Play, { className: "size-4" }), "Send request"] }), result ? (_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-xs", children: [_jsx("span", { className: "text-fg-subtle", children: "Response" }), _jsx(Badge, { variant: result.status >= 200 && result.status < 300 ? 'success' : 'destructive', children: result.status || 'error' })] }), _jsx(CodeBlock, { code: result.body })] })) : null] })) : null] }) })) : null })] }));
+}
+export function ApiReference({ endpoints, baseUrl, title, description, apiKey: initialApiKey, showBearerToken = true, className, }) {
+    const [apiKey, setApiKey] = React.useState(initialApiKey ?? '');
+    const groups = React.useMemo(() => {
+        const map = new Map();
+        for (const e of endpoints) {
+            const tag = e.tag ?? 'Endpoints';
+            (map.get(tag) ?? map.set(tag, []).get(tag)).push(e);
+        }
+        return [...map.entries()];
+    }, [endpoints]);
+    return (_jsxs("div", { className: cn('space-y-6', className), children: [title || description ? (_jsxs("div", { className: "space-y-1", children: [title ? _jsx("h2", { className: "text-lg font-semibold tracking-tight text-fg", children: title }) : null, description ? _jsx("p", { className: "text-sm text-fg-muted", children: description }) : null] })) : null, baseUrl ? (_jsxs("div", { className: "flex flex-col gap-2 rounded-xl border border-border bg-surface p-4 sm:flex-row sm:items-center", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "text-xs text-fg-subtle", children: "Base URL" }), _jsx("code", { className: "truncate font-mono text-sm text-fg", children: baseUrl })] }), showBearerToken ? (_jsx(Input, { value: apiKey, onChange: (e) => setApiKey(e.target.value), placeholder: "Bearer token (optional)", className: "sm:w-64" })) : null] })) : null, groups.map(([tag, eps]) => (_jsxs("section", { className: "space-y-2", children: [_jsx("h3", { className: "px-0.5 text-xs font-semibold uppercase tracking-wide text-fg-subtle", children: tag }), _jsx("div", { className: "space-y-2", children: eps.map((e, i) => (_jsx(ApiEndpoint, { endpoint: e, baseUrl: baseUrl, apiKey: apiKey || initialApiKey }, `${e.method}-${e.path}-${i}`))) })] }, tag)))] }));
+}
+//# sourceMappingURL=api-reference.js.map

package/api-reference.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"api-reference.js","sourceRoot":"","sources":["../src/api-reference.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AACvD,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AACvE,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAA;AA0B5B,MAAM,aAAa,GAA2B;IAC5C,GAAG,EAAE,gCAAgC;IACrC,IAAI,EAAE,0BAA0B;IAChC,GAAG,EAAE,gCAAgC;IACrC,KAAK,EAAE,gCAAgC;IACvC,MAAM,EAAE,8BAA8B;CACvC,CAAA;AAED,MAAM,UAAU,WAAW,CAAC,EAAE,MAAM,EAAE,SAAS,EAA0C;IACvF,MAAM,CAAC,GAAG,MAAM,CAAC,WAAW,EAAE,CAAA;IAC9B,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,gGAAgG,EAChG,aAAa,CAAC,CAAC,CAAC,IAAI,4BAA4B,EAChD,SAAS,CACV,YAEA,CAAC,GACG,CACR,CAAA;AACH,CAAC;AAED,MAAM,UAAU,SAAS,CAAC,EAAE,IAAI,EAAE,SAAS,EAAwC;IACjF,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjD,MAAM,IAAI,GAAG,GAAG,EAAE;QAChB,SAAS,CAAC,SAAS,EAAE,SAAS,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE;YAC7C,SAAS,CAAC,IAAI,CAAC,CAAA;YACf,UAAU,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,CAAA;QAC1C,CAAC,CAAC,CAAA;IACJ,CAAC,CAAA;IACD,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,6EAA6E,EAAE,SAAS,CAAC,aAC1G,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,gBACF,MAAM,EACjB,SAAS,EAAC,0IAA0I,YAEnJ,MAAM,CAAC,CAAC,CAAC,KAAC,KAAK,IAAC,SAAS,EAAC,qBAAqB,GAAG,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,SAAS,EAAC,QAAQ,GAAG,GAC1E,EACT,cAAK,SAAS,EAAC,wDAAwD,YACrE,eAAM,SAAS,EAAC,mBAAmB,YAAE,IAAI,GAAQ,GAC7C,IACF,CACP,CAAA;AACH,CAAC;AAED,MAAM,IAAI,GAAG,CAAC,CAAU,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;AAEvD,MAAM,UAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,OAAO,EACP,MAAM,EACN,WAAW,GAAG,KAAK,GAMpB;IACC,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAA;IACnD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IACnD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAA0C,IAAI,CAAC,CAAA;IAEzF,KAAK,UAAU,IAAI;QACjB,IAAI,CAAC,OAAO;YAAE,OAAM;QACpB,UAAU,CAAC,IAAI,CAAC,CAAA;QAChB,SAAS,CAAC,IAAI,CAAC,CAAA;QACf,IAAI,CAAC;YACH,MAAM,OAAO,GAAG,QAAQ,CAAC,MAAM,KAAK,KAAK,IAAI,QAAQ,CAAC,cAAc,KAAK,SAAS,CAAA;YAClF,MAAM,GAAG,GAAG,MAAM,KAAK,CAAC,OAAO,GAAG,QAAQ,CAAC,IAAI,EAAE;gBAC/C,MAAM,EAAE,QAAQ,CAAC,MAAM;gBACvB,OAAO,EAAE;oBACP,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,aAAa,EAAE,UAAU,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;oBACxD,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,kBAAkB,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;iBAC3D;gBACD,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,SAAS;aACpE,CAAC,CAAA;YACF,MAAM,IAAI,GAAG,MAAM,GAAG,CAAC,IAAI,EAAE,CAAA;YAC7B,IAAI,IAAI,GAAG,IAAI,CAAA;YACf,IAAI,CAAC;gBACH,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAA;YAC/B,CAAC;YAAC,MAAM,CAAC;gBACP,8CAA8C;YAChD,CAAC;YACD,SAAS,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAA;QACzC,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA;QAC3C,CAAC;gBAAS,CAAC;YACT,UAAU,CAAC,KAAK,CAAC,CAAA;QACnB,CAAC;IACH,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAC,4DAA4D,aACzE,kBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EACjC,SAAS,EAAC,6FAA6F,aAEvG,KAAC,WAAW,IAAC,MAAM,EAAE,QAAQ,CAAC,MAAM,GAAI,EACxC,eAAM,SAAS,EAAC,mDAAmD,YAAE,QAAQ,CAAC,IAAI,GAAQ,EACzF,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAClB,eAAM,SAAS,EAAC,wDAAwD,YAAE,QAAQ,CAAC,OAAO,GAAQ,CACnG,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,YAAY,IAAC,SAAS,EAAE,EAAE,CAAC,qDAAqD,EAAE,IAAI,IAAI,WAAW,CAAC,GAAI,IACpG,EAET,KAAC,eAAe,IAAC,OAAO,EAAE,KAAK,YAC5B,IAAI,CAAC,CAAC,CAAC,CACN,KAAC,MAAM,CAAC,GAAG,IACT,OAAO,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EAClC,OAAO,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,EAAE,EACvC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EAC/B,UAAU,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,EAAE,EACvD,SAAS,EAAC,iBAAiB,YAE3B,eAAK,SAAS,EAAC,4CAA4C,aACxD,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,YAAG,SAAS,EAAC,uBAAuB,YAAE,QAAQ,CAAC,WAAW,GAAK,CAAC,CAAC,CAAC,IAAI,EAC7F,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,CACrB,eAAK,SAAS,EAAC,iCAAiC,aAC9C,eAAM,SAAS,EAAC,gBAAgB,yBAAgB,EAChD,KAAC,KAAK,IAAC,OAAO,EAAC,WAAW,EAAC,SAAS,EAAC,WAAW,YAC7C,QAAQ,CAAC,UAAU,GACd,IACJ,CACP,CAAC,CAAC,CAAC,IAAI,EAEP,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CACzB,cAAK,SAAS,EAAC,iDAAiD,YAC9D,iBAAO,SAAS,EAAC,gBAAgB,aAC/B,gBAAO,SAAS,EAAC,4DAA4D,YAC3E,yBACE,aAAI,SAAS,EAAC,iCAAiC,sBAAW,EAC1D,aAAI,SAAS,EAAC,iCAAiC,qBAAU,EACzD,aAAI,SAAS,EAAC,iCAAiC,4BAAiB,IAC7D,GACC,EACR,gBAAO,SAAS,EAAC,wBAAwB,YACtC,QAAQ,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAC1B,yBACE,cAAI,SAAS,EAAC,6BAA6B,aACxC,CAAC,CAAC,IAAI,EACN,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAM,SAAS,EAAC,aAAa,mBAAU,CAAC,CAAC,CAAC,IAAI,EAC5D,eAAM,SAAS,EAAC,iCAAiC,YAAE,CAAC,CAAC,EAAE,IAAI,OAAO,GAAQ,IACvE,EACL,aAAI,SAAS,EAAC,mCAAmC,YAAE,CAAC,CAAC,IAAI,IAAI,QAAQ,GAAM,EAC3E,aAAI,SAAS,EAAC,yBAAyB,YAAE,CAAC,CAAC,WAAW,GAAM,KAPrD,CAAC,CAAC,IAAI,CAQV,CACN,CAAC,GACI,IACF,GACJ,CACP,CAAC,CAAC,CAAC,IAAI,EAEP,QAAQ,CAAC,cAAc,KAAK,SAAS,CAAC,CAAC,CAAC,CACvC,eAAK,SAAS,EAAC,aAAa,aAC1B,cAAK,SAAS,EAAC,mCAAmC,6BAAmB,EACrE,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAI,IAC9C,CACP,CAAC,CAAC,CAAC,IAAI,EACP,QAAQ,CAAC,eAAe,KAAK,SAAS,CAAC,CAAC,CAAC,CACxC,eAAK,SAAS,EAAC,aAAa,aAC1B,cAAK,SAAS,EAAC,mCAAmC,yBAAe,EACjE,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,GAAI,IAC/C,CACP,CAAC,CAAC,CAAC,IAAI,EAEP,OAAO,CAAC,CAAC,CAAC,CACT,eAAK,SAAS,EAAC,WAAW,aACxB,MAAC,MAAM,IAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,aAC/C,OAAO,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,SAAS,EAAC,qBAAqB,GAAG,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,SAAS,EAAC,QAAQ,GAAG,oBAE7E,EACR,MAAM,CAAC,CAAC,CAAC,CACR,eAAK,SAAS,EAAC,aAAa,aAC1B,eAAK,SAAS,EAAC,iCAAiC,aAC9C,eAAM,SAAS,EAAC,gBAAgB,yBAAgB,EAChD,KAAC,KAAK,IAAC,OAAO,EAAE,MAAM,CAAC,MAAM,IAAI,GAAG,IAAI,MAAM,CAAC,MAAM,GAAG,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,YACpF,MAAM,CAAC,MAAM,IAAI,OAAO,GACnB,IACJ,EACN,KAAC,SAAS,IAAC,IAAI,EAAE,MAAM,CAAC,IAAI,GAAI,IAC5B,CACP,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC,CAAC,CAAC,IAAI,IACJ,GACK,CACd,CAAC,CAAC,CAAC,IAAI,GACQ,IACd,CACP,CAAA;AACH,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,EAC3B,SAAS,EACT,OAAO,EACP,KAAK,EACL,WAAW,EACX,MAAM,EAAE,aAAa,EACrB,eAAe,GAAG,IAAI,EACtB,SAAS,GAUV;IACC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,aAAa,IAAI,EAAE,CAAC,CAAA;IAC/D,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAChC,MAAM,GAAG,GAAG,IAAI,GAAG,EAA4B,CAAA;QAC/C,KAAK,MAAM,CAAC,IAAI,SAAS,EAAE,CAAC;YAC1B,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,IAAI,WAAW,CAC/B;YAAA,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;QACvD,CAAC;QACD,OAAO,CAAC,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC,CAAA;IAC3B,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;IAEf,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,WAAW,EAAE,SAAS,CAAC,aACvC,KAAK,IAAI,WAAW,CAAC,CAAC,CAAC,CACtB,eAAK,SAAS,EAAC,WAAW,aACvB,KAAK,CAAC,CAAC,CAAC,aAAI,SAAS,EAAC,8CAA8C,YAAE,KAAK,GAAM,CAAC,CAAC,CAAC,IAAI,EACxF,WAAW,CAAC,CAAC,CAAC,YAAG,SAAS,EAAC,uBAAuB,YAAE,WAAW,GAAK,CAAC,CAAC,CAAC,IAAI,IACxE,CACP,CAAC,CAAC,CAAC,IAAI,EAEP,OAAO,CAAC,CAAC,CAAC,CACT,eAAK,SAAS,EAAC,gGAAgG,aAC7G,eAAK,SAAS,EAAC,gBAAgB,aAC7B,cAAK,SAAS,EAAC,wBAAwB,yBAAe,EACtD,eAAM,SAAS,EAAC,oCAAoC,YAAE,OAAO,GAAQ,IACjE,EACL,eAAe,CAAC,CAAC,CAAC,CACjB,KAAC,KAAK,IACJ,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAC1C,WAAW,EAAC,yBAAyB,EACrC,SAAS,EAAC,SAAS,GACnB,CACH,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC,CAAC,CAAC,IAAI,EAEP,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,CAC1B,mBAAmB,SAAS,EAAC,WAAW,aACtC,aAAI,SAAS,EAAC,qEAAqE,YAAE,GAAG,GAAM,EAC9F,cAAK,SAAS,EAAC,WAAW,YACvB,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACjB,KAAC,WAAW,IAAoC,QAAQ,EAAE,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,IAAI,aAAa,IAA5F,GAAG,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,EAAE,CAAoE,CACnH,CAAC,GACE,KANM,GAAG,CAOP,CACX,CAAC,IACE,CACP,CAAA;AACH,CAAC","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport { Check, ChevronRight, Copy, Loader2, Play } from 'lucide-react'\nimport { Badge } from './badge'\nimport { Button } from './button'\nimport { Input } from './input'\nimport { cn } from './utils'\n\n// Self-documenting API reference. Feed it route descriptions (structurally the\n// same as @braedonsaunders/appkit-api's ApiRouteDoc) and it renders a live, interactive reference\n// — method badges, params, code samples, and a real \"Send\" button.\n\nexport type ApiParamDoc = {\n  name: string\n  in?: 'query' | 'path' | 'header'\n  type?: string\n  required?: boolean\n  description?: string\n}\n\nexport type ApiEndpointDoc = {\n  method: string\n  path: string\n  summary?: string\n  description?: string\n  tag?: string\n  permission?: string\n  params?: ApiParamDoc[]\n  requestExample?: unknown\n  responseExample?: unknown\n}\n\nconst METHOD_COLORS: Record<string, string> = {\n  GET: 'bg-success-subtle text-success',\n  POST: 'bg-info-subtle text-info',\n  PUT: 'bg-warning-subtle text-warning',\n  PATCH: 'bg-warning-subtle text-warning',\n  DELETE: 'bg-danger-subtle text-danger',\n}\n\nexport function MethodBadge({ method, className }: { method: string; className?: string }) {\n  const m = method.toUpperCase()\n  return (\n    <span\n      className={cn(\n        'inline-flex min-w-14 justify-center rounded-md px-2 py-0.5 text-[11px] font-bold tracking-wide',\n        METHOD_COLORS[m] ?? 'bg-bg-subtle text-fg-muted',\n        className,\n      )}\n    >\n      {m}\n    </span>\n  )\n}\n\nexport function CodeBlock({ code, className }: { code: string; className?: string }) {\n  const [copied, setCopied] = React.useState(false)\n  const copy = () => {\n    navigator.clipboard?.writeText(code).then(() => {\n      setCopied(true)\n      setTimeout(() => setCopied(false), 1500)\n    })\n  }\n  return (\n    <div className={cn('group relative overflow-hidden rounded-lg border border-border bg-bg-subtle', className)}>\n      <button\n        type=\"button\"\n        onClick={copy}\n        aria-label=\"Copy\"\n        className=\"absolute right-2 top-2 rounded-md p-1.5 text-fg-subtle opacity-0 transition hover:bg-surface-hover hover:text-fg group-hover:opacity-100\"\n      >\n        {copied ? <Check className=\"size-4 text-success\" /> : <Copy className=\"size-4\" />}\n      </button>\n      <pre className=\"app-scroll overflow-x-auto p-3 text-xs leading-relaxed\">\n        <code className=\"font-mono text-fg\">{code}</code>\n      </pre>\n    </div>\n  )\n}\n\nconst json = (v: unknown) => JSON.stringify(v, null, 2)\n\nexport function ApiEndpoint({\n  endpoint,\n  baseUrl,\n  apiKey,\n  defaultOpen = false,\n}: {\n  endpoint: ApiEndpointDoc\n  baseUrl?: string\n  apiKey?: string\n  defaultOpen?: boolean\n}) {\n  const [open, setOpen] = React.useState(defaultOpen)\n  const [sending, setSending] = React.useState(false)\n  const [result, setResult] = React.useState<{ status: number; body: string } | null>(null)\n\n  async function send() {\n    if (!baseUrl) return\n    setSending(true)\n    setResult(null)\n    try {\n      const hasBody = endpoint.method !== 'GET' && endpoint.requestExample !== undefined\n      const res = await fetch(baseUrl + endpoint.path, {\n        method: endpoint.method,\n        headers: {\n          ...(apiKey ? { Authorization: `Bearer ${apiKey}` } : {}),\n          ...(hasBody ? { 'Content-Type': 'application/json' } : {}),\n        },\n        body: hasBody ? JSON.stringify(endpoint.requestExample) : undefined,\n      })\n      const text = await res.text()\n      let body = text\n      try {\n        body = json(JSON.parse(text))\n      } catch {\n        // Preserve non-JSON response bodies verbatim.\n      }\n      setResult({ status: res.status, body })\n    } catch (e) {\n      setResult({ status: 0, body: String(e) })\n    } finally {\n      setSending(false)\n    }\n  }\n\n  return (\n    <div className=\"overflow-hidden rounded-xl border border-border bg-surface\">\n      <button\n        type=\"button\"\n        onClick={() => setOpen((o) => !o)}\n        className=\"flex w-full items-center gap-3 px-4 py-3 text-left transition-colors hover:bg-surface-hover\"\n      >\n        <MethodBadge method={endpoint.method} />\n        <code className=\"min-w-0 flex-1 truncate font-mono text-sm text-fg\">{endpoint.path}</code>\n        {endpoint.summary ? (\n          <span className=\"hidden min-w-0 truncate text-sm text-fg-muted md:block\">{endpoint.summary}</span>\n        ) : null}\n        <ChevronRight className={cn('size-4 shrink-0 text-fg-subtle transition-transform', open && 'rotate-90')} />\n      </button>\n\n      <AnimatePresence initial={false}>\n        {open ? (\n          <motion.div\n            initial={{ height: 0, opacity: 0 }}\n            animate={{ height: 'auto', opacity: 1 }}\n            exit={{ height: 0, opacity: 0 }}\n            transition={{ duration: 0.2, ease: [0.22, 1, 0.36, 1] }}\n            className=\"overflow-hidden\"\n          >\n            <div className=\"space-y-4 border-t border-border px-4 py-4\">\n              {endpoint.description ? <p className=\"text-sm text-fg-muted\">{endpoint.description}</p> : null}\n              {endpoint.permission ? (\n                <div className=\"flex items-center gap-2 text-xs\">\n                  <span className=\"text-fg-subtle\">Requires</span>\n                  <Badge variant=\"secondary\" className=\"font-mono\">\n                    {endpoint.permission}\n                  </Badge>\n                </div>\n              ) : null}\n\n              {endpoint.params?.length ? (\n                <div className=\"overflow-hidden rounded-lg border border-border\">\n                  <table className=\"w-full text-sm\">\n                    <thead className=\"bg-bg-subtle text-xs uppercase tracking-wide text-fg-muted\">\n                      <tr>\n                        <th className=\"px-3 py-2 text-left font-medium\">Param</th>\n                        <th className=\"px-3 py-2 text-left font-medium\">Type</th>\n                        <th className=\"px-3 py-2 text-left font-medium\">Description</th>\n                      </tr>\n                    </thead>\n                    <tbody className=\"divide-y divide-border\">\n                      {endpoint.params.map((p) => (\n                        <tr key={p.name}>\n                          <td className=\"px-3 py-2 font-mono text-fg\">\n                            {p.name}\n                            {p.required ? <span className=\"text-danger\"> *</span> : null}\n                            <span className=\"ml-1 text-[11px] text-fg-subtle\">{p.in ?? 'query'}</span>\n                          </td>\n                          <td className=\"px-3 py-2 font-mono text-fg-muted\">{p.type ?? 'string'}</td>\n                          <td className=\"px-3 py-2 text-fg-muted\">{p.description}</td>\n                        </tr>\n                      ))}\n                    </tbody>\n                  </table>\n                </div>\n              ) : null}\n\n              {endpoint.requestExample !== undefined ? (\n                <div className=\"space-y-1.5\">\n                  <div className=\"text-xs font-medium text-fg-muted\">Request body</div>\n                  <CodeBlock code={json(endpoint.requestExample)} />\n                </div>\n              ) : null}\n              {endpoint.responseExample !== undefined ? (\n                <div className=\"space-y-1.5\">\n                  <div className=\"text-xs font-medium text-fg-muted\">Response</div>\n                  <CodeBlock code={json(endpoint.responseExample)} />\n                </div>\n              ) : null}\n\n              {baseUrl ? (\n                <div className=\"space-y-2\">\n                  <Button size=\"sm\" onClick={send} disabled={sending}>\n                    {sending ? <Loader2 className=\"size-4 animate-spin\" /> : <Play className=\"size-4\" />}\n                    Send request\n                  </Button>\n                  {result ? (\n                    <div className=\"space-y-1.5\">\n                      <div className=\"flex items-center gap-2 text-xs\">\n                        <span className=\"text-fg-subtle\">Response</span>\n                        <Badge variant={result.status >= 200 && result.status < 300 ? 'success' : 'destructive'}>\n                          {result.status || 'error'}\n                        </Badge>\n                      </div>\n                      <CodeBlock code={result.body} />\n                    </div>\n                  ) : null}\n                </div>\n              ) : null}\n            </div>\n          </motion.div>\n        ) : null}\n      </AnimatePresence>\n    </div>\n  )\n}\n\nexport function ApiReference({\n  endpoints,\n  baseUrl,\n  title,\n  description,\n  apiKey: initialApiKey,\n  showBearerToken = true,\n  className,\n}: {\n  endpoints: ApiEndpointDoc[]\n  baseUrl?: string\n  title?: string\n  description?: string\n  apiKey?: string\n  /** Show the optional bearer-token input beside the base URL. */\n  showBearerToken?: boolean\n  className?: string\n}) {\n  const [apiKey, setApiKey] = React.useState(initialApiKey ?? '')\n  const groups = React.useMemo(() => {\n    const map = new Map<string, ApiEndpointDoc[]>()\n    for (const e of endpoints) {\n      const tag = e.tag ?? 'Endpoints'\n      ;(map.get(tag) ?? map.set(tag, []).get(tag)!).push(e)\n    }\n    return [...map.entries()]\n  }, [endpoints])\n\n  return (\n    <div className={cn('space-y-6', className)}>\n      {title || description ? (\n        <div className=\"space-y-1\">\n          {title ? <h2 className=\"text-lg font-semibold tracking-tight text-fg\">{title}</h2> : null}\n          {description ? <p className=\"text-sm text-fg-muted\">{description}</p> : null}\n        </div>\n      ) : null}\n\n      {baseUrl ? (\n        <div className=\"flex flex-col gap-2 rounded-xl border border-border bg-surface p-4 sm:flex-row sm:items-center\">\n          <div className=\"min-w-0 flex-1\">\n            <div className=\"text-xs text-fg-subtle\">Base URL</div>\n            <code className=\"truncate font-mono text-sm text-fg\">{baseUrl}</code>\n          </div>\n          {showBearerToken ? (\n            <Input\n              value={apiKey}\n              onChange={(e) => setApiKey(e.target.value)}\n              placeholder=\"Bearer token (optional)\"\n              className=\"sm:w-64\"\n            />\n          ) : null}\n        </div>\n      ) : null}\n\n      {groups.map(([tag, eps]) => (\n        <section key={tag} className=\"space-y-2\">\n          <h3 className=\"px-0.5 text-xs font-semibold uppercase tracking-wide text-fg-subtle\">{tag}</h3>\n          <div className=\"space-y-2\">\n            {eps.map((e, i) => (\n              <ApiEndpoint key={`${e.method}-${e.path}-${i}`} endpoint={e} baseUrl={baseUrl} apiKey={apiKey || initialApiKey} />\n            ))}\n          </div>\n        </section>\n      ))}\n    </div>\n  )\n}\n"]}

package/app-shell.d.ts

@@ -0,0 +1,39 @@
+import * as React from 'react';
+import { type SidebarNavGroup } from './sidebar-nav.js';
+import type { LinkRender } from './settings-layout.js';
+export type AppShellNavigationMode = 'topbar' | 'sidebar';
+/**
+ * Generalized application shell. One serialized navigation registry drives the
+ * dropdown topbar, shared collapsible rail,
+ * the mobile drawer, and the native-style mobile tab bar.
+ */
+export declare function AppShell({ groups, pathname, brand, sidebarFooter, sidebarCollapsedFooter, mobileFooter, headerMiddle, header, banner, defaultCollapsed, navigationMode, linkRender, moreLabel, openNavigationLabel, menuLabel, primaryNavigationLabel, topNavigationItemClassName, topNavigationActiveItemClassName, topNavigationInactiveItemClassName, mobileTabCount, showMobileTabs, children, }: {
+    groups: SidebarNavGroup[];
+    pathname: string;
+    brand?: React.ReactNode;
+    sidebarFooter?: React.ReactNode;
+    sidebarCollapsedFooter?: React.ReactNode;
+    mobileFooter?: React.ReactNode;
+    /** Search, tenant, role, or other application-owned middle controls. */
+    headerMiddle?: React.ReactNode;
+    /** Right-side utility actions and account menu. */
+    header?: React.ReactNode;
+    banner?: React.ReactNode;
+    defaultCollapsed?: boolean;
+    navigationMode?: AppShellNavigationMode;
+    linkRender?: LinkRender;
+    moreLabel?: string;
+    openNavigationLabel?: string;
+    menuLabel?: string;
+    primaryNavigationLabel?: string;
+    /** Shared typography/spacing overrides for topbar navigation items. */
+    topNavigationItemClassName?: string;
+    /** Overrides applied only to the active topbar navigation item. */
+    topNavigationActiveItemClassName?: string;
+    /** Overrides applied only to inactive topbar navigation items. */
+    topNavigationInactiveItemClassName?: string;
+    mobileTabCount?: number;
+    showMobileTabs?: boolean;
+    children: React.ReactNode;
+}): React.JSX.Element;
+//# sourceMappingURL=app-shell.d.ts.map

package/app-shell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-shell.d.ts","sourceRoot":"","sources":["../src/app-shell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,eAAe,CAAA;AAChE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAInD,MAAM,MAAM,sBAAsB,GAAG,QAAQ,GAAG,SAAS,CAAA;AAEzD;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,EACvB,MAAM,EACN,QAAQ,EACR,KAAK,EACL,aAAa,EACb,sBAAsB,EACtB,YAAY,EACZ,YAAY,EACZ,MAAM,EACN,MAAM,EACN,gBAAwB,EACxB,cAAyB,EACzB,UAAU,EACV,SAAkB,EAClB,mBAAuC,EACvC,SAAkB,EAClB,sBAA6C,EAC7C,0BAA0B,EAC1B,gCAAgC,EAChC,kCAAkC,EAClC,cAAkB,EAClB,cAAqB,EACrB,QAAQ,GACT,EAAE;IACD,MAAM,EAAE,eAAe,EAAE,CAAA;IACzB,QAAQ,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC/B,sBAAsB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,wEAAwE;IACxE,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,mDAAmD;IACnD,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,cAAc,CAAC,EAAE,sBAAsB,CAAA;IACvC,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,uEAAuE;IACvE,0BAA0B,CAAC,EAAE,MAAM,CAAA;IACnC,mEAAmE;IACnE,gCAAgC,CAAC,EAAE,MAAM,CAAA;IACzC,kEAAkE;IAClE,kCAAkC,CAAC,EAAE,MAAM,CAAA;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,qBAmFA"}

package/app-shell.js

@@ -0,0 +1,21 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { Menu } from 'lucide-react';
+import { AppSidebar } from './app-sidebar.js';
+import { Drawer } from './drawer.js';
+import { MobileTabBar } from './mobile-tab-bar.js';
+import { SidebarNav } from './sidebar-nav.js';
+import { TopNav } from './top-nav.js';
+import { cn } from './utils.js';
+/**
+ * Generalized application shell. One serialized navigation registry drives the
+ * dropdown topbar, shared collapsible rail,
+ * the mobile drawer, and the native-style mobile tab bar.
+ */
+export function AppShell({ groups, pathname, brand, sidebarFooter, sidebarCollapsedFooter, mobileFooter, headerMiddle, header, banner, defaultCollapsed = false, navigationMode = 'topbar', linkRender, moreLabel = 'More', openNavigationLabel = 'Open navigation', menuLabel = 'Menu', primaryNavigationLabel = 'Primary navigation', topNavigationItemClassName, topNavigationActiveItemClassName, topNavigationInactiveItemClassName, mobileTabCount = 4, showMobileTabs = true, children, }) {
+    const [mobileOpen, setMobileOpen] = React.useState(false);
+    const topbar = navigationMode === 'topbar';
+    return (_jsxs("div", { className: "flex h-screen overflow-hidden", children: [topbar ? null : (_jsx(AppSidebar, { groups: groups, pathname: pathname, brand: brand, footer: sidebarFooter, collapsedFooter: sidebarCollapsedFooter, defaultCollapsed: defaultCollapsed, linkRender: linkRender })), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col overflow-hidden [padding-top:env(safe-area-inset-top)]", children: [banner, _jsxs("header", { className: "flex h-14 shrink-0 items-center gap-2 border-b border-border bg-surface px-3 sm:gap-3 sm:px-4", children: [_jsx("button", { type: "button", onClick: () => setMobileOpen(true), "aria-label": openNavigationLabel, className: "grid size-9 shrink-0 place-items-center rounded-md border border-border text-fg-muted transition-colors hover:bg-surface-hover hover:text-fg lg:hidden", children: _jsx(Menu, { size: 18 }) }), topbar ? (_jsxs(_Fragment, { children: [brand ? _jsx("div", { className: "hidden shrink-0 lg:block", children: brand }) : null, _jsx(TopNav, { groups: groups, pathname: pathname, linkRender: linkRender, moreLabel: moreLabel, ariaLabel: primaryNavigationLabel, itemClassName: topNavigationItemClassName, activeItemClassName: topNavigationActiveItemClassName, inactiveItemClassName: topNavigationInactiveItemClassName }), _jsx("div", { className: "flex-1 lg:hidden" }), headerMiddle] })) : (_jsx("div", { className: cn('min-w-0 flex-1', !headerMiddle && 'hidden lg:block'), children: headerMiddle })), header ? _jsx("div", { className: "flex shrink-0 items-center gap-1", children: header }) : null] }), _jsx("main", { className: "flex min-h-0 flex-1 flex-col overflow-hidden bg-bg-subtle", children: children }), showMobileTabs ? (_jsx(MobileTabBar, { groups: groups, pathname: pathname, onOpenMenu: () => setMobileOpen(true), linkRender: linkRender, tabCount: mobileTabCount, menuLabel: menuLabel, ariaLabel: primaryNavigationLabel })) : null] }), _jsx(Drawer, { open: mobileOpen, onClose: () => setMobileOpen(false), side: "left", size: "sm", title: brand ?? menuLabel, disableFullscreen: true, bodyClassName: "min-h-0 flex-1 overflow-hidden p-0", footer: mobileFooter ?? sidebarFooter, children: _jsx("div", { onClick: () => setMobileOpen(false), className: "flex h-full flex-col", children: _jsx(SidebarNav, { groups: groups, pathname: pathname, linkRender: linkRender }) }) })] }));
+}
+//# sourceMappingURL=app-shell.js.map

package/app-shell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-shell.js","sourceRoot":"","sources":["../src/app-shell.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Menu } from 'lucide-react'\nimport { AppSidebar } from './app-sidebar'\nimport { Drawer } from './drawer'\nimport { MobileTabBar } from './mobile-tab-bar'\nimport { SidebarNav, type SidebarNavGroup } from './sidebar-nav'\nimport type { LinkRender } from './settings-layout'\nimport { TopNav } from './top-nav'\nimport { cn } from './utils'\n\nexport type AppShellNavigationMode = 'topbar' | 'sidebar'\n\n/**\n * Generalized application shell. One serialized navigation registry drives the\n * dropdown topbar, shared collapsible rail,\n * the mobile drawer, and the native-style mobile tab bar.\n */\nexport function AppShell({\n  groups,\n  pathname,\n  brand,\n  sidebarFooter,\n  sidebarCollapsedFooter,\n  mobileFooter,\n  headerMiddle,\n  header,\n  banner,\n  defaultCollapsed = false,\n  navigationMode = 'topbar',\n  linkRender,\n  moreLabel = 'More',\n  openNavigationLabel = 'Open navigation',\n  menuLabel = 'Menu',\n  primaryNavigationLabel = 'Primary navigation',\n  topNavigationItemClassName,\n  topNavigationActiveItemClassName,\n  topNavigationInactiveItemClassName,\n  mobileTabCount = 4,\n  showMobileTabs = true,\n  children,\n}: {\n  groups: SidebarNavGroup[]\n  pathname: string\n  brand?: React.ReactNode\n  sidebarFooter?: React.ReactNode\n  sidebarCollapsedFooter?: React.ReactNode\n  mobileFooter?: React.ReactNode\n  /** Search, tenant, role, or other application-owned middle controls. */\n  headerMiddle?: React.ReactNode\n  /** Right-side utility actions and account menu. */\n  header?: React.ReactNode\n  banner?: React.ReactNode\n  defaultCollapsed?: boolean\n  navigationMode?: AppShellNavigationMode\n  linkRender?: LinkRender\n  moreLabel?: string\n  openNavigationLabel?: string\n  menuLabel?: string\n  primaryNavigationLabel?: string\n  /** Shared typography/spacing overrides for topbar navigation items. */\n  topNavigationItemClassName?: string\n  /** Overrides applied only to the active topbar navigation item. */\n  topNavigationActiveItemClassName?: string\n  /** Overrides applied only to inactive topbar navigation items. */\n  topNavigationInactiveItemClassName?: string\n  mobileTabCount?: number\n  showMobileTabs?: boolean\n  children: React.ReactNode\n}) {\n  const [mobileOpen, setMobileOpen] = React.useState(false)\n  const topbar = navigationMode === 'topbar'\n\n  return (\n    <div className=\"flex h-screen overflow-hidden\">\n      {topbar ? null : (\n        <AppSidebar\n          groups={groups}\n          pathname={pathname}\n          brand={brand}\n          footer={sidebarFooter}\n          collapsedFooter={sidebarCollapsedFooter}\n          defaultCollapsed={defaultCollapsed}\n          linkRender={linkRender}\n        />\n      )}\n\n      <div className=\"flex min-w-0 flex-1 flex-col overflow-hidden [padding-top:env(safe-area-inset-top)]\">\n        {banner}\n        <header className=\"flex h-14 shrink-0 items-center gap-2 border-b border-border bg-surface px-3 sm:gap-3 sm:px-4\">\n          <button\n            type=\"button\"\n            onClick={() => setMobileOpen(true)}\n            aria-label={openNavigationLabel}\n            className=\"grid size-9 shrink-0 place-items-center rounded-md border border-border text-fg-muted transition-colors hover:bg-surface-hover hover:text-fg lg:hidden\"\n          >\n            <Menu size={18} />\n          </button>\n\n          {topbar ? (\n            <>\n              {brand ? <div className=\"hidden shrink-0 lg:block\">{brand}</div> : null}\n              <TopNav\n                groups={groups}\n                pathname={pathname}\n                linkRender={linkRender}\n                moreLabel={moreLabel}\n                ariaLabel={primaryNavigationLabel}\n                itemClassName={topNavigationItemClassName}\n                activeItemClassName={topNavigationActiveItemClassName}\n                inactiveItemClassName={topNavigationInactiveItemClassName}\n              />\n              <div className=\"flex-1 lg:hidden\" />\n              {headerMiddle}\n            </>\n          ) : (\n            <div className={cn('min-w-0 flex-1', !headerMiddle && 'hidden lg:block')}>{headerMiddle}</div>\n          )}\n          {header ? <div className=\"flex shrink-0 items-center gap-1\">{header}</div> : null}\n        </header>\n\n        <main className=\"flex min-h-0 flex-1 flex-col overflow-hidden bg-bg-subtle\">{children}</main>\n\n        {showMobileTabs ? (\n          <MobileTabBar\n            groups={groups}\n            pathname={pathname}\n            onOpenMenu={() => setMobileOpen(true)}\n            linkRender={linkRender}\n            tabCount={mobileTabCount}\n            menuLabel={menuLabel}\n            ariaLabel={primaryNavigationLabel}\n          />\n        ) : null}\n      </div>\n\n      <Drawer\n        open={mobileOpen}\n        onClose={() => setMobileOpen(false)}\n        side=\"left\"\n        size=\"sm\"\n        title={brand ?? menuLabel}\n        disableFullscreen\n        bodyClassName=\"min-h-0 flex-1 overflow-hidden p-0\"\n        footer={mobileFooter ?? sidebarFooter}\n      >\n        <div onClick={() => setMobileOpen(false)} className=\"flex h-full flex-col\">\n          <SidebarNav groups={groups} pathname={pathname} linkRender={linkRender} />\n        </div>\n      </Drawer>\n    </div>\n  )\n}\n"]}