npm - @devalok/shilp-sutra - Versions diffs - 0.38.0 → 0.39.0 - Mend

@devalok/shilp-sutra 0.38.0 → 0.39.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (212) hide show

package/MIGRATION.md +118 -0
package/dist/_chunks/badge-group.js +4 -4
package/dist/_chunks/badge-group.js.map +1 -1
package/dist/_chunks/chat.js +14 -14
package/dist/_chunks/chat.js.map +1 -1
package/dist/_chunks/date-picker.js +9 -9
package/dist/_chunks/date-picker.js.map +1 -1
package/dist/_chunks/document-preview.js +2 -2
package/dist/_chunks/document-preview.js.map +1 -1
package/dist/_chunks/file-preview.js +11 -11
package/dist/_chunks/file-preview.js.map +1 -1
package/dist/_chunks/image-preview.js +2 -2
package/dist/_chunks/image-preview.js.map +1 -1
package/dist/_chunks/mention-suggestion.js +5 -5
package/dist/_chunks/mention-suggestion.js.map +1 -1
package/dist/_chunks/popover.js +3 -3
package/dist/_chunks/popover.js.map +1 -1
package/dist/_chunks/rich-chat-input.js +33 -33
package/dist/_chunks/rich-chat-input.js.map +1 -1
package/dist/_chunks/shared.js +5 -5
package/dist/_chunks/shared.js.map +1 -1
package/dist/_chunks/text.js +2 -2
package/dist/_chunks/text.js.map +1 -1
package/dist/_chunks/tree-view.js +1 -1
package/dist/_chunks/tree-view.js.map +1 -1
package/dist/_chunks/use-calendar.js +5 -5
package/dist/_chunks/use-calendar.js.map +1 -1
package/dist/ai/command-bar.js +10 -10
package/dist/ai/command-bar.js.map +1 -1
package/dist/ai/conversation.js +4 -4
package/dist/ai/conversation.js.map +1 -1
package/dist/composed/activity-feed.js +5 -5
package/dist/composed/activity-feed.js.map +1 -1
package/dist/composed/avatar-group.js +4 -4
package/dist/composed/avatar-group.js.map +1 -1
package/dist/composed/bulk-action-bar.js +1 -1
package/dist/composed/bulk-action-bar.js.map +1 -1
package/dist/composed/command-palette.js +5 -5
package/dist/composed/command-palette.js.map +1 -1
package/dist/composed/content-card.js +1 -1
package/dist/composed/content-card.js.map +1 -1
package/dist/composed/emoji-picker.js +4 -4
package/dist/composed/emoji-picker.js.map +1 -1
package/dist/composed/empty-state.js +1 -1
package/dist/composed/empty-state.js.map +1 -1
package/dist/composed/error-boundary.js +3 -3
package/dist/composed/error-boundary.js.map +1 -1
package/dist/composed/filter-bar.js +1 -1
package/dist/composed/filter-bar.js.map +1 -1
package/dist/composed/inline-edit.js +1 -1
package/dist/composed/inline-edit.js.map +1 -1
package/dist/composed/loading-skeleton.js +9 -9
package/dist/composed/loading-skeleton.js.map +1 -1
package/dist/composed/markdown-viewer.js +3 -3
package/dist/composed/markdown-viewer.js.map +1 -1
package/dist/composed/multi-select-popover.js +1 -1
package/dist/composed/multi-select-popover.js.map +1 -1
package/dist/composed/page-header.js +1 -1
package/dist/composed/page-header.js.map +1 -1
package/dist/composed/page-skeletons.js +15 -15
package/dist/composed/page-skeletons.js.map +1 -1
package/dist/composed/priority-indicator.js +3 -3
package/dist/composed/priority-indicator.js.map +1 -1
package/dist/composed/rich-text-editor.js +11 -11
package/dist/composed/rich-text-editor.js.map +1 -1
package/dist/composed/schedule-view.js +3 -3
package/dist/composed/schedule-view.js.map +1 -1
package/dist/composed/status-badge.js +3 -3
package/dist/composed/status-badge.js.map +1 -1
package/dist/shell/bottom-navbar.js +6 -6
package/dist/shell/bottom-navbar.js.map +1 -1
package/dist/shell/notification-center.js +8 -8
package/dist/shell/notification-center.js.map +1 -1
package/dist/shell/notification-preferences.js +1 -1
package/dist/shell/notification-preferences.js.map +1 -1
package/dist/shell/sidebar.js +6 -6
package/dist/shell/sidebar.js.map +1 -1
package/dist/shell/top-bar.js +4 -4
package/dist/shell/top-bar.js.map +1 -1
package/dist/tokens/semantic.css +82 -9
package/dist/ui/accordion.js +1 -1
package/dist/ui/accordion.js.map +1 -1
package/dist/ui/alert-dialog.js +3 -3
package/dist/ui/alert-dialog.js.map +1 -1
package/dist/ui/alert.js +2 -2
package/dist/ui/alert.js.map +1 -1
package/dist/ui/autocomplete.js +2 -2
package/dist/ui/autocomplete.js.map +1 -1
package/dist/ui/avatar.js +11 -11
package/dist/ui/avatar.js.map +1 -1
package/dist/ui/badge-indicator.js +1 -1
package/dist/ui/badge-indicator.js.map +1 -1
package/dist/ui/banner.js +1 -1
package/dist/ui/banner.js.map +1 -1
package/dist/ui/breadcrumb.js +1 -1
package/dist/ui/breadcrumb.js.map +1 -1
package/dist/ui/button.d.ts +2 -2
package/dist/ui/button.js +14 -14
package/dist/ui/button.js.map +1 -1
package/dist/ui/card.js +5 -5
package/dist/ui/card.js.map +1 -1
package/dist/ui/charts/index.js +5 -5
package/dist/ui/charts/index.js.map +1 -1
package/dist/ui/checkbox.js +1 -1
package/dist/ui/checkbox.js.map +1 -1
package/dist/ui/code.js +2 -2
package/dist/ui/code.js.map +1 -1
package/dist/ui/color-input.js +10 -10
package/dist/ui/color-input.js.map +1 -1
package/dist/ui/color-swatch.js +3 -3
package/dist/ui/color-swatch.js.map +1 -1
package/dist/ui/combobox.js +5 -5
package/dist/ui/combobox.js.map +1 -1
package/dist/ui/context-menu.js +6 -6
package/dist/ui/context-menu.js.map +1 -1
package/dist/ui/data-table-body.js +1 -1
package/dist/ui/data-table-body.js.map +1 -1
package/dist/ui/data-table-bulk-actions.js +2 -2
package/dist/ui/data-table-bulk-actions.js.map +1 -1
package/dist/ui/data-table-card.js +2 -2
package/dist/ui/data-table-card.js.map +1 -1
package/dist/ui/data-table-header.js +2 -2
package/dist/ui/data-table-header.js.map +1 -1
package/dist/ui/data-table-pagination.js +3 -3
package/dist/ui/data-table-pagination.js.map +1 -1
package/dist/ui/data-table-toolbar.js +1 -1
package/dist/ui/data-table-toolbar.js.map +1 -1
package/dist/ui/data-table.js +1 -1
package/dist/ui/data-table.js.map +1 -1
package/dist/ui/devalok-grain.d.ts +1 -1
package/dist/ui/devalok-grain.js.map +1 -1
package/dist/ui/dialog.js +2 -2
package/dist/ui/dialog.js.map +1 -1
package/dist/ui/dropdown-menu.js +6 -6
package/dist/ui/dropdown-menu.js.map +1 -1
package/dist/ui/file-upload.js +4 -4
package/dist/ui/file-upload.js.map +1 -1
package/dist/ui/hover-card.js +1 -1
package/dist/ui/hover-card.js.map +1 -1
package/dist/ui/icon-button.js +1 -1
package/dist/ui/icon-button.js.map +1 -1
package/dist/ui/input-otp.js +1 -1
package/dist/ui/input-otp.js.map +1 -1
package/dist/ui/input.js +2 -2
package/dist/ui/input.js.map +1 -1
package/dist/ui/link.js +1 -1
package/dist/ui/link.js.map +1 -1
package/dist/ui/menubar.js +8 -8
package/dist/ui/menubar.js.map +1 -1
package/dist/ui/navigation-menu.js +3 -3
package/dist/ui/navigation-menu.js.map +1 -1
package/dist/ui/number-input.js +3 -3
package/dist/ui/number-input.js.map +1 -1
package/dist/ui/pagination.js +1 -1
package/dist/ui/pagination.js.map +1 -1
package/dist/ui/progress.js +1 -1
package/dist/ui/progress.js.map +1 -1
package/dist/ui/radio.js +1 -1
package/dist/ui/radio.js.map +1 -1
package/dist/ui/segmented-control.js +3 -3
package/dist/ui/segmented-control.js.map +1 -1
package/dist/ui/select.js +3 -3
package/dist/ui/select.js.map +1 -1
package/dist/ui/sheet.js +2 -2
package/dist/ui/sheet.js.map +1 -1
package/dist/ui/sidebar.js +11 -11
package/dist/ui/sidebar.js.map +1 -1
package/dist/ui/skeleton.js +9 -9
package/dist/ui/skeleton.js.map +1 -1
package/dist/ui/slider.js +2 -2
package/dist/ui/slider.js.map +1 -1
package/dist/ui/split-button.js +7 -7
package/dist/ui/split-button.js.map +1 -1
package/dist/ui/stat-card.js +7 -7
package/dist/ui/stat-card.js.map +1 -1
package/dist/ui/status-dot.js +2 -2
package/dist/ui/status-dot.js.map +1 -1
package/dist/ui/stepper.js +2 -2
package/dist/ui/stepper.js.map +1 -1
package/dist/ui/switch.js +2 -2
package/dist/ui/switch.js.map +1 -1
package/dist/ui/tabs.js +3 -3
package/dist/ui/tabs.js.map +1 -1
package/dist/ui/textarea.js +1 -1
package/dist/ui/textarea.js.map +1 -1
package/dist/ui/toast.js +8 -8
package/dist/ui/toast.js.map +1 -1
package/dist/ui/toggle.js +1 -1
package/dist/ui/toggle.js.map +1 -1
package/dist/ui/tooltip.js +1 -1
package/dist/ui/tooltip.js.map +1 -1
package/docs/components/_header.md +90 -1
package/docs/recipes/customize-brand.md +85 -4
package/docs/recipes/index.md +1 -1
package/llms-full.txt +91 -2
package/llms.txt +9 -1
package/package.json +2 -1
package/skill/README.md +99 -0
package/skill/SKILL.md +144 -0
package/skill/install.sh +59 -0
package/skill/references/components-full.md +6997 -0
package/skill/references/components.md +673 -0
package/skill/references/customize-brand.md +299 -0
package/skill/references/server-components.md +211 -0
package/skill/references/setup-astro.md +180 -0
package/skill/references/setup-next-app-router.md +232 -0
package/skill/references/setup-next-pages.md +125 -0
package/skill/references/setup-remix.md +173 -0
package/skill/references/setup-tanstack-start.md +145 -0
package/skill/references/setup-vite.md +172 -0
package/skill/references/troubleshoot.md +219 -0
/package/{LICENSE → skill/LICENSE} +0 -0

package/MIGRATION.md CHANGED Viewed

@@ -4,6 +4,124 @@ This page indexes all breaking changes across `@devalok/shilp-sutra` versions. F
 > **Upgrading from &lt; 0.36?** Start here, then read each intermediate version section. Breaking changes stack — skipping versions means stacking migrations.
+## v0.39.0 — Shape presets & semantic radius role tokens
+No API breaks. Component prop signatures unchanged. But the visual output of several components shifts because radius is now role-driven, not per-size ad-hoc.
+### What changed under the hood
+Radius now has TWO layers:
+- **Primitive scale** (private, unchanged): `--radius-ds-sm/md/lg/xl/2xl/full`
+- **Semantic roles** (new, public): `--radius-control`, `--radius-control-inner`, `--radius-surface`, `--radius-overlay-sm`, `--radius-overlay`, `--radius-overlay-lg`, `--radius-pill`, `--radius-bubble`
+Components reference roles. A new `[data-shape]` attribute on `<html>` (or any subtree) remaps all roles at once. Three presets ship: `sharp`, `slightly-rounded` (default), `rounded`.
+### Visual changes consumers see
+| Component | Was (px) | Now (px) | Why |
+|---|---|---|---|
+| Button md | 10 | 6 | Per-size radius scaling removed — same role, same radius |
+| Button lg | 16 | 6 | Same |
+| Button icon-lg | 10 | 6 | Same |
+| Input lg | 10 | 6 | Now matches Button at same height |
+| Tabs trigger (contained) | 10 | 6 | Now matches Button |
+| SegmentedControl item | 10 | 9999 | Renamed `pill` is now actually pill |
+| Menubar trigger | 2 | 6 | Now matches DropdownMenu item |
+| Autocomplete listbox | 6 | 10 | Now matches Popover / DropdownMenu |
+| ChatMessage bubble | 24 | 24 (preset-aware) | Now `rounded-bubble` — shifts with preset |
+| Everything else | unchanged | | |
+### If you liked the old "chunky big controls" look
+Either set the `rounded` preset on `<html>`:
+```diff
+- <html lang="en">
++ <html lang="en" data-shape="rounded">
+```
+Or override just `--radius-control` to keep the previous v0.38 default:
+```css
+:root { --radius-control: 10px; }
+```
+### Opting into the preset system
+To set the default (slightly-rounded) preset on your app explicitly:
+```diff
+- <html lang="en">
++ <html lang="en" data-shape="slightly-rounded">
+```
+Scoped overrides also work — apply `data-shape` to any subtree:
+```tsx
+<div data-shape="sharp">
+  <DeveloperConsole />
+</div>
+```
+### Migrating your own code from `rounded-ds-*` / `rounded-full`
+Your existing classes still render (primitive tokens are unchanged), but they're pinned to fixed values and won't respond to `[data-shape]` presets. To opt in, swap to role tokens:
+```diff
+- className="rounded-ds-md ..."       /* control-sized, 6px */
++ className="rounded-control ..."
+- className="rounded-ds-lg ..."       /* surface context — Card, Alert, panel */
++ className="rounded-surface ..."
+- className="rounded-ds-lg ..."       /* overlay context — Popover, Dropdown, listbox */
++ className="rounded-overlay ..."
+- className="rounded-ds-xl ..."       /* Dialog, Sheet, picker panel */
++ className="rounded-overlay-lg ..."
+- className="rounded-ds-2xl ..."      /* chat bubble */
++ className="rounded-bubble ..."
+- className="rounded-ds-sm ..."       /* checkbox box, focus ring, small chip */
++ className="rounded-control-inner ..."
+- className="rounded-ds-full ..."     /* and bare rounded-full */
++ className="rounded-pill ..."
+```
+A re-runnable codemod lives at `scripts/migrate-radius-roles.mjs` in this repo. Dry-run by default — pass `--write` to apply.
+### Custom presets
+Define your own `[data-shape="..."]` block:
+```css
+[data-shape="brand-soft"] {
+  --radius-control:        8px;
+  --radius-control-inner:  3px;
+  --radius-surface:        14px;
+  --radius-overlay-sm:     8px;
+  --radius-overlay:        14px;
+  --radius-overlay-lg:     20px;
+  --radius-pill:           9999px;
+  --radius-bubble:         28px;
+}
+```
+```html
+<html data-shape="brand-soft">
+```
+### Reference
+- Role token map: `packages/core/llms-full.txt` → "Shape Presets & Radius Roles" section
+- Recipe: `packages/core/docs/recipes/customize-brand.md` → "Shape presets" section
+- Storybook: `Foundations / Shape Presets` story — interactive switcher + custom-preset demo
+---
 ## v0.38.0 — Deprecation sweep
 0.38 removes 8 deprecated APIs that were soft-deprecated in earlier minor releases. All were available as aliases alongside their replacements; this release drops the aliases.

package/dist/_chunks/badge-group.js CHANGED Viewed

@@ -120,7 +120,7 @@ function g(e, t) {
 		case "soft": return i(n.bg, n.fg, "border-transparent");
 	}
 }
-var _ = r("relative inline-flex items-center rounded-full font-sans font-medium overflow-hidden isolate transition-[color,background-color,border-color,padding] duration-fast-02 ease-productive-standard select-none [&>span:not([data-grain])]:relative [&>span:not([data-grain])]:z-[2]", {
+var _ = r("relative inline-flex items-center rounded-pill font-sans font-medium overflow-hidden isolate transition-[color,background-color,border-color,padding] duration-fast-02 ease-productive-standard select-none [&>span:not([data-grain])]:relative [&>span:not([data-grain])]:z-[2]", {
 	variants: {
 		variant: {
 			subtle: "border",
@@ -208,7 +208,7 @@ var _ = r("relative inline-flex items-center rounded-full font-sans font-medium
 				className: "relative inline-flex h-1.5 w-1.5 shrink-0",
 				"aria-hidden": "true",
 				children: [/* @__PURE__ */ c(p.span, {
-					className: "absolute inset-0 rounded-full bg-current",
+					className: "absolute inset-0 rounded-pill bg-current",
 					animate: I ? void 0 : {
 						scale: [1, 2.5],
 						opacity: [.35, 0]
@@ -224,7 +224,7 @@ var _ = r("relative inline-flex items-center rounded-full font-sans font-medium
 							1
 						]
 					}
-				}), /* @__PURE__ */ c("span", { className: "relative h-1.5 w-1.5 rounded-full bg-current" })]
+				}), /* @__PURE__ */ c("span", { className: "relative h-1.5 w-1.5 rounded-pill bg-current" })]
 			}, "dot") }),
 			E && !S && !w && /* @__PURE__ */ c(p.span, {
 				initial: !1,
@@ -274,7 +274,7 @@ var _ = r("relative inline-flex items-center rounded-full font-sans font-medium
 				onClick: (e) => {
 					e.stopPropagation(), T();
 				},
-				className: i("shrink-0 rounded-full text-current/60 hover:text-current hover:bg-current/10 transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-accent-9", z === "xs" ? "p-0 -mr-0.5 min-w-[16px] min-h-[16px]" : "p-px"),
+				className: i("shrink-0 rounded-pill text-current/60 hover:text-current hover:bg-current/10 transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-accent-9", z === "xs" ? "p-0 -mr-0.5 min-w-[16px] min-h-[16px]" : "p-px"),
 				"aria-label": `Remove ${typeof M == "string" ? M : ""}`.trim() || "Remove",
 				children: /* @__PURE__ */ c(a, {
 					icon: d,

package/dist/_chunks/badge-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"badge-group.js","names":[],"sources":["../../src/ui/badge.tsx","../../src/ui/badge-group.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@primitives/react-slot'\nimport { IconCheck, IconX } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { AnimatePresence, motion, useReducedMotion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { durations,springs } from './lib/motion'\nimport { cn } from './lib/utils'\n\n// ── Color map — single source of truth for all badge color × variant combos ──\nconst colorMap = {\n default: { bg: 'bg-surface-raised-hover', fg: 'text-surface-fg-muted', border: 'border-surface-border-strong', solid: 'bg-neutral-5', solidFg: 'text-surface-fg' },\n accent: { bg: 'bg-accent-3', fg: 'text-accent-11', border: 'border-accent-7', solid: 'bg-accent-9', solidFg: 'text-accent-fg' },\n error: { bg: 'bg-error-3', fg: 'text-error-11', border: 'border-error-7', solid: 'bg-error-9', solidFg: 'text-error-fg' },\n success: { bg: 'bg-success-3', fg: 'text-success-11', border: 'border-success-7', solid: 'bg-success-9', solidFg: 'text-success-fg' },\n warning: { bg: 'bg-warning-3', fg: 'text-warning-11', border: 'border-warning-7', solid: 'bg-warning-9', solidFg: 'text-warning-fg' },\n info: { bg: 'bg-info-3', fg: 'text-info-11', border: 'border-info-7', solid: 'bg-info-9', solidFg: 'text-info-fg' },\n neutral: { bg: 'bg-surface-raised-hover', fg: 'text-surface-fg-muted', border: 'border-surface-border-strong', solid: 'bg-neutral-5', solidFg: 'text-surface-fg' },\n teal: { bg: 'bg-category-teal-3', fg: 'text-category-teal-11', border: 'border-category-teal-7', solid: 'bg-category-teal-9', solidFg: 'text-white' },\n amber: { bg: 'bg-category-amber-3', fg: 'text-category-amber-11', border: 'border-category-amber-7', solid: 'bg-category-amber-9', solidFg: 'text-white' },\n slate: { bg: 'bg-category-slate-3', fg: 'text-category-slate-11', border: 'border-category-slate-7', solid: 'bg-category-slate-9', solidFg: 'text-white' },\n indigo: { bg: 'bg-category-indigo-3', fg: 'text-category-indigo-11', border: 'border-category-indigo-7', solid: 'bg-category-indigo-9', solidFg: 'text-white' },\n cyan: { bg: 'bg-category-cyan-3', fg: 'text-category-cyan-11', border: 'border-category-cyan-7', solid: 'bg-category-cyan-9', solidFg: 'text-white' },\n orange: { bg: 'bg-category-orange-3', fg: 'text-category-orange-11', border: 'border-category-orange-7', solid: 'bg-category-orange-9', solidFg: 'text-white' },\n emerald: { bg: 'bg-category-emerald-3', fg: 'text-category-emerald-11', border: 'border-category-emerald-7', solid: 'bg-category-emerald-9', solidFg: 'text-white' },\n} as const\n\ntype BadgeColor = keyof typeof colorMap \| 'custom'\n\n/** Derive color classes for a given variant + color pair /\nfunction getColorClasses(variant: 'subtle' \| 'solid' \| 'outline' \| 'soft', color: BadgeColor): string {\n if (color === 'custom') return ''\n const c = colorMap[color]\n switch (variant) {\n case 'subtle': return cn(c.bg, c.fg, c.border)\n case 'solid': return cn(c.solid, c.solidFg, 'border-transparent')\n case 'outline': return cn('bg-transparent', c.fg, c.border)\n case 'soft': return cn(c.bg, c.fg, 'border-transparent')\n }\n}\n\nconst badgeVariants = cva(\n 'relative inline-flex items-center rounded-full font-sans font-medium overflow-hidden isolate transition-[color,background-color,border-color,padding] duration-fast-02 ease-productive-standard select-none [&>span:not([data-grain])]:relative [&>span:not([data-grain])]:z-[2]',\n {\n variants: {\n variant: {\n subtle: 'border',\n solid: 'border border-transparent',\n outline: 'border',\n soft: 'border border-transparent',\n },\n size: {\n xs: 'h-4 px-ds-02b text-ds-xs gap-ds-02',\n sm: 'h-5 px-ds-03 text-ds-xs gap-ds-02',\n md: 'h-6 px-2.5 text-ds-xs gap-ds-02b', / px-2.5=10px — no exact DS token /\n lg: 'h-7 px-ds-04 text-ds-sm gap-ds-02b',\n },\n },\n defaultVariants: {\n variant: 'subtle',\n size: 'md',\n },\n },\n)\n\n/* Icon sizing per badge size /\nconst iconSizeMap: Record<string, string> = {\n xs: '[&>svg]:h-2.5 [&>svg]:w-2.5',\n sm: '[&>svg]:h-3 [&>svg]:w-3',\n md: '[&>svg]:h-3 [&>svg]:w-3',\n lg: '[&>svg]:h-3.5 [&>svg]:w-3.5',\n}\n\n/* Reduced left padding when leading content (icon/dot/selected) is present /\nconst paddingLeftWithIcon: Record<string, string> = {\n xs: 'pl-ds-02',\n sm: 'pl-ds-02b',\n md: 'pl-ds-03',\n lg: 'pl-2.5', / 10px — no exact DS token /\n}\n\n/* Reduced right padding when trailing content (dismiss/endIcon) is present /\nconst paddingRightWithTrailing: Record<string, string> = {\n xs: 'pr-ds-01',\n sm: 'pr-ds-02',\n md: 'pr-ds-02',\n lg: 'pr-ds-02b',\n}\n\n/\n Badge — a compact inline label with a two-axis variant system.\n \n Two axes:\n * - `variant` controls visual style: `\"subtle\"` \| `\"solid\"` \| `\"outline\"` \| `\"soft\"`\n * - `color` controls semantic intent/category: 16 built-in colors + `\"custom\"` (CSS variable)\n \n Interactive: Pass `onClick` to make it a button. Pass `selected` for toggle state.\n * Dismissible: Pass `onDismiss` to show a dismiss button.\n * Custom colors: Set `color=\"custom\"` and CSS variable `--badge-color` on a parent or via `style`.\n * For light custom colors on solid variant, set `--badge-fg-color` to a dark value.\n \n @example\n * <Badge color=\"success\">Active</Badge>\n \n @example\n * <Badge variant=\"solid\" size=\"sm\" dot>3 new</Badge>\n \n @example\n * <Badge color=\"custom\" style={{ '--badge-color': '#8b5cf6' } as React.CSSProperties}>\n * Custom\n * </Badge>\n /\ninterface BadgeProps\n extends Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n VariantProps<typeof badgeVariants> {\n /* Semantic intent or category color. Use `\"custom\"` with `--badge-color` CSS variable. /\n color?: BadgeColor\n asChild?: boolean\n startIcon?: React.ReactElement \| null\n endIcon?: React.ReactElement \| null\n dot?: boolean\n onDismiss?: () => void\n selected?: boolean\n disabled?: boolean\n maxWidth?: number\n /\n Truncate children with ellipsis when they overflow the badge width.\n * Use with a fixed width (e.g. `className=\"w-20\"`) or `maxWidth` for\n * constrained pill badges. Always adds a title tooltip on the full text.\n /\n truncate?: boolean\n circle?: boolean\n}\n\nconst Badge = React.forwardRef<HTMLElement, BadgeProps>(\n (\n {\n className,\n variant,\n color,\n size,\n asChild,\n startIcon,\n endIcon,\n dot,\n onDismiss,\n onClick,\n selected,\n disabled,\n maxWidth,\n truncate,\n circle,\n children,\n style,\n ...props\n },\n ref,\n ) => {\n const prefersReducedMotion = useReducedMotion()\n const resolvedVariant = variant ?? 'subtle'\n const resolvedColor = color ?? 'default'\n const resolvedSize = size ?? 'md'\n\n // When both onClick + onDismiss, use div with role=\"button\" to avoid nested <button>\n const Comp = asChild\n ? Slot\n : onClick && onDismiss\n ? 'div'\n : onClick\n ? 'button'\n : 'span'\n\n // Custom color inline styles via CSS variable\n const customStyles =\n resolvedColor === 'custom'\n ? {\n ...(resolvedVariant === 'subtle' && {\n backgroundColor: 'color-mix(in oklch, var(--badge-color) 15%, transparent)',\n color: 'var(--badge-color)',\n borderColor: 'color-mix(in oklch, var(--badge-color) 40%, transparent)',\n }),\n ...(resolvedVariant === 'solid' && {\n backgroundColor: 'var(--badge-color)',\n color: 'var(--badge-fg-color, white)',\n borderColor: 'transparent',\n }),\n ...(resolvedVariant === 'outline' && {\n backgroundColor: 'transparent',\n color: 'var(--badge-color)',\n borderColor: 'color-mix(in oklch, var(--badge-color) 50%, transparent)',\n }),\n ...(resolvedVariant === 'soft' && {\n backgroundColor: 'color-mix(in oklch, var(--badge-color) 12%, transparent)',\n color: 'var(--badge-color)',\n borderColor: 'transparent',\n }),\n }\n : undefined\n\n // Keyboard handler for div[role=\"button\"] (onClick + onDismiss case)\n const handleKeyDown =\n onClick && onDismiss\n ? (e: React.KeyboardEvent<HTMLElement>) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault()\n if (!disabled) onClick(e as unknown as React.MouseEvent<HTMLElement>)\n }\n props.onKeyDown?.(e)\n }\n : props.onKeyDown\n\n const hasLeading = !!(dot \|\| startIcon \|\| (onClick && selected && !startIcon && !dot))\n const hasTrailing = !!(onDismiss \|\| endIcon)\n\n return (\n <Comp\n ref={ref as React.Ref<never>}\n className={cn(\n badgeVariants({ variant: resolvedVariant, size: resolvedSize }),\n getColorClasses(resolvedVariant, resolvedColor),\n hasLeading && paddingLeftWithIcon[resolvedSize],\n hasTrailing && paddingRightWithTrailing[resolvedSize],\n onClick &&\n 'cursor-pointer hover:brightness-[0.97] focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-1 transition-[color,background-color,border-color,transform,filter] duration-moderate-01 ease-productive-exit hover:duration-fast-02 hover:ease-productive-entrance active:scale-[0.95] active:brightness-[0.92] active:duration-[0ms]',\n selected && 'ring-1 ring-current/20 transition-shadow duration-fast-02',\n disabled && 'opacity-action-disabled pointer-events-none saturate-[0.3]',\n circle && 'justify-center px-0 aspect-square',\n className,\n )}\n style={{ ...style, ...customStyles, ...(maxWidth ? { maxWidth } : undefined) }}\n onClick={disabled ? undefined : (onClick as React.MouseEventHandler<HTMLElement>)}\n onKeyDown={handleKeyDown}\n {...(Comp === 'button' && { type: 'button' as const })}\n {...(Comp === 'button' && disabled ? { disabled: true } : {})}\n {...(Comp === 'div' && onClick ? { role: 'button' as const, tabIndex: 0 } : {})}\n {...props}\n >\n {/ Dot indicator — animated entrance + continuous pulse /}\n <AnimatePresence>\n {dot && (\n <motion.span\n key=\"dot\"\n initial={{ scale: 0 }}\n animate={{ scale: 1 }}\n exit={{ scale: 0 }}\n transition={springs.snappy}\n className=\"relative inline-flex h-1.5 w-1.5 shrink-0\"\n aria-hidden=\"true\"\n >\n <motion.span\n className=\"absolute inset-0 rounded-full bg-current\"\n animate={prefersReducedMotion ? undefined : { scale: [1, 2.5], opacity: [0.35, 0] }}\n transition={prefersReducedMotion ? { duration: 0 } : { repeat: Infinity, repeatDelay: 0.3, duration: 1.2, ease: [0, 0, 0.58, 1] }}\n />\n <span className=\"relative h-1.5 w-1.5 rounded-full bg-current\" />\n </motion.span>\n )}\n </AnimatePresence>\n\n {/ Selected check icon — always mounted for interactive badges /}\n {onClick && !startIcon && !dot && (\n <motion.span\n initial={false}\n animate={selected\n ? { opacity: 1, scale: 1, width: 'auto', marginRight: 0 }\n : { opacity: 0, scale: 0.5, width: 0, marginRight: -4 }\n }\n transition={{ type: 'tween', duration: durations.moderate01, ease: [0.2, 0, 0.38, 0.9] }} / ease-productive-standard /\n className=\"inline-flex shrink-0 overflow-hidden\"\n aria-hidden={!selected}\n >\n <Icon icon={IconCheck} size=\"xs\" />\n </motion.span>\n )}\n\n {/ Start icon /}\n {startIcon && (\n <span className={cn('shrink-0', iconSizeMap[resolvedSize])}>{startIcon}</span>\n )}\n\n {/ Children — with optional truncation /}\n {truncate \|\| maxWidth ? (\n <span\n className=\"truncate\"\n title={typeof children === 'string' ? children : undefined}\n >\n {children}\n </span>\n ) : (\n children\n )}\n\n {/ End icon /}\n {endIcon && (\n <span className={cn('shrink-0', iconSizeMap[resolvedSize])}>{endIcon}</span>\n )}\n\n {/ Dismiss button /}\n {onDismiss && (\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation()\n onDismiss()\n }}\n className={cn(\n 'shrink-0 rounded-full text-current/60 hover:text-current hover:bg-current/10 transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-accent-9',\n resolvedSize === 'xs'\n ? 'p-0 -mr-0.5 min-w-[16px] min-h-[16px]'\n : 'p-px',\n )}\n aria-label={\n `Remove ${typeof children === 'string' ? children : ''}`.trim() \|\| 'Remove'\n }\n >\n <Icon icon={IconX} size=\"xs\" />\n </button>\n )}\n </Comp>\n )\n },\n)\nBadge.displayName = 'Badge'\n\nimport { BadgeGroup } from './badge-group'\nimport { BadgeIndicator } from './badge-indicator'\n\nconst BadgeCompound = Object.assign(Badge, {\n Indicator: BadgeIndicator,\n Group: BadgeGroup,\n})\n\nexport { BadgeCompound as Badge, type BadgeColor,type BadgeProps, badgeVariants }\n","'use client'\n\nimport as React from 'react'\n\nimport { Badge, type BadgeProps } from './badge'\nimport { cn } from './lib/utils'\n\nconst GAP_CLASSES = {\n tight: 'gap-1',\n default: 'gap-1.5',\n loose: 'gap-2',\n} as const\n\nexport interface BadgeGroupProps {\n max?: number\n gap?: keyof typeof GAP_CLASSES\n size?: BadgeProps['size']\n onOverflowClick?: () => void\n className?: string\n children: React.ReactNode\n}\n\nexport function BadgeGroup({\n max,\n gap = 'default',\n size,\n onOverflowClick,\n className,\n children,\n}: BadgeGroupProps) {\n const childArray = React.Children.toArray(children)\n const total = childArray.length\n const hasOverflow = max !== undefined && total > max\n const visible = hasOverflow ? childArray.slice(0, max) : childArray\n const overflowCount = hasOverflow ? total - max! : 0\n\n return (\n <div className={cn('flex flex-wrap items-center', GAP_CLASSES[gap], className)}>\n {visible}\n {hasOverflow && (\n <Badge\n variant=\"outline\"\n color=\"neutral\"\n size={size ?? 'sm'}\n onClick={onOverflowClick}\n >\n +{overflowCount}\n </Badge>\n )}\n </div>\n )\n}\n\nBadgeGroup.displayName = 'BadgeGroup'\n"],"mappings":"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"}
1	+ {"version":3,"file":"badge-group.js","names":[],"sources":["../../src/ui/badge.tsx","../../src/ui/badge-group.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@primitives/react-slot'\nimport { IconCheck, IconX } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { AnimatePresence, motion, useReducedMotion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { durations,springs } from './lib/motion'\nimport { cn } from './lib/utils'\n\n// ── Color map — single source of truth for all badge color × variant combos ──\nconst colorMap = {\n default: { bg: 'bg-surface-raised-hover', fg: 'text-surface-fg-muted', border: 'border-surface-border-strong', solid: 'bg-neutral-5', solidFg: 'text-surface-fg' },\n accent: { bg: 'bg-accent-3', fg: 'text-accent-11', border: 'border-accent-7', solid: 'bg-accent-9', solidFg: 'text-accent-fg' },\n error: { bg: 'bg-error-3', fg: 'text-error-11', border: 'border-error-7', solid: 'bg-error-9', solidFg: 'text-error-fg' },\n success: { bg: 'bg-success-3', fg: 'text-success-11', border: 'border-success-7', solid: 'bg-success-9', solidFg: 'text-success-fg' },\n warning: { bg: 'bg-warning-3', fg: 'text-warning-11', border: 'border-warning-7', solid: 'bg-warning-9', solidFg: 'text-warning-fg' },\n info: { bg: 'bg-info-3', fg: 'text-info-11', border: 'border-info-7', solid: 'bg-info-9', solidFg: 'text-info-fg' },\n neutral: { bg: 'bg-surface-raised-hover', fg: 'text-surface-fg-muted', border: 'border-surface-border-strong', solid: 'bg-neutral-5', solidFg: 'text-surface-fg' },\n teal: { bg: 'bg-category-teal-3', fg: 'text-category-teal-11', border: 'border-category-teal-7', solid: 'bg-category-teal-9', solidFg: 'text-white' },\n amber: { bg: 'bg-category-amber-3', fg: 'text-category-amber-11', border: 'border-category-amber-7', solid: 'bg-category-amber-9', solidFg: 'text-white' },\n slate: { bg: 'bg-category-slate-3', fg: 'text-category-slate-11', border: 'border-category-slate-7', solid: 'bg-category-slate-9', solidFg: 'text-white' },\n indigo: { bg: 'bg-category-indigo-3', fg: 'text-category-indigo-11', border: 'border-category-indigo-7', solid: 'bg-category-indigo-9', solidFg: 'text-white' },\n cyan: { bg: 'bg-category-cyan-3', fg: 'text-category-cyan-11', border: 'border-category-cyan-7', solid: 'bg-category-cyan-9', solidFg: 'text-white' },\n orange: { bg: 'bg-category-orange-3', fg: 'text-category-orange-11', border: 'border-category-orange-7', solid: 'bg-category-orange-9', solidFg: 'text-white' },\n emerald: { bg: 'bg-category-emerald-3', fg: 'text-category-emerald-11', border: 'border-category-emerald-7', solid: 'bg-category-emerald-9', solidFg: 'text-white' },\n} as const\n\ntype BadgeColor = keyof typeof colorMap \| 'custom'\n\n/** Derive color classes for a given variant + color pair /\nfunction getColorClasses(variant: 'subtle' \| 'solid' \| 'outline' \| 'soft', color: BadgeColor): string {\n if (color === 'custom') return ''\n const c = colorMap[color]\n switch (variant) {\n case 'subtle': return cn(c.bg, c.fg, c.border)\n case 'solid': return cn(c.solid, c.solidFg, 'border-transparent')\n case 'outline': return cn('bg-transparent', c.fg, c.border)\n case 'soft': return cn(c.bg, c.fg, 'border-transparent')\n }\n}\n\nconst badgeVariants = cva(\n 'relative inline-flex items-center rounded-pill font-sans font-medium overflow-hidden isolate transition-[color,background-color,border-color,padding] duration-fast-02 ease-productive-standard select-none [&>span:not([data-grain])]:relative [&>span:not([data-grain])]:z-[2]',\n {\n variants: {\n variant: {\n subtle: 'border',\n solid: 'border border-transparent',\n outline: 'border',\n soft: 'border border-transparent',\n },\n size: {\n xs: 'h-4 px-ds-02b text-ds-xs gap-ds-02',\n sm: 'h-5 px-ds-03 text-ds-xs gap-ds-02',\n md: 'h-6 px-2.5 text-ds-xs gap-ds-02b', / px-2.5=10px — no exact DS token /\n lg: 'h-7 px-ds-04 text-ds-sm gap-ds-02b',\n },\n },\n defaultVariants: {\n variant: 'subtle',\n size: 'md',\n },\n },\n)\n\n/* Icon sizing per badge size /\nconst iconSizeMap: Record<string, string> = {\n xs: '[&>svg]:h-2.5 [&>svg]:w-2.5',\n sm: '[&>svg]:h-3 [&>svg]:w-3',\n md: '[&>svg]:h-3 [&>svg]:w-3',\n lg: '[&>svg]:h-3.5 [&>svg]:w-3.5',\n}\n\n/* Reduced left padding when leading content (icon/dot/selected) is present /\nconst paddingLeftWithIcon: Record<string, string> = {\n xs: 'pl-ds-02',\n sm: 'pl-ds-02b',\n md: 'pl-ds-03',\n lg: 'pl-2.5', / 10px — no exact DS token /\n}\n\n/* Reduced right padding when trailing content (dismiss/endIcon) is present /\nconst paddingRightWithTrailing: Record<string, string> = {\n xs: 'pr-ds-01',\n sm: 'pr-ds-02',\n md: 'pr-ds-02',\n lg: 'pr-ds-02b',\n}\n\n/\n Badge — a compact inline label with a two-axis variant system.\n \n Two axes:\n * - `variant` controls visual style: `\"subtle\"` \| `\"solid\"` \| `\"outline\"` \| `\"soft\"`\n * - `color` controls semantic intent/category: 16 built-in colors + `\"custom\"` (CSS variable)\n \n Interactive: Pass `onClick` to make it a button. Pass `selected` for toggle state.\n * Dismissible: Pass `onDismiss` to show a dismiss button.\n * Custom colors: Set `color=\"custom\"` and CSS variable `--badge-color` on a parent or via `style`.\n * For light custom colors on solid variant, set `--badge-fg-color` to a dark value.\n \n @example\n * <Badge color=\"success\">Active</Badge>\n \n @example\n * <Badge variant=\"solid\" size=\"sm\" dot>3 new</Badge>\n \n @example\n * <Badge color=\"custom\" style={{ '--badge-color': '#8b5cf6' } as React.CSSProperties}>\n * Custom\n * </Badge>\n /\ninterface BadgeProps\n extends Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n VariantProps<typeof badgeVariants> {\n /* Semantic intent or category color. Use `\"custom\"` with `--badge-color` CSS variable. /\n color?: BadgeColor\n asChild?: boolean\n startIcon?: React.ReactElement \| null\n endIcon?: React.ReactElement \| null\n dot?: boolean\n onDismiss?: () => void\n selected?: boolean\n disabled?: boolean\n maxWidth?: number\n /\n Truncate children with ellipsis when they overflow the badge width.\n * Use with a fixed width (e.g. `className=\"w-20\"`) or `maxWidth` for\n * constrained pill badges. Always adds a title tooltip on the full text.\n /\n truncate?: boolean\n circle?: boolean\n}\n\nconst Badge = React.forwardRef<HTMLElement, BadgeProps>(\n (\n {\n className,\n variant,\n color,\n size,\n asChild,\n startIcon,\n endIcon,\n dot,\n onDismiss,\n onClick,\n selected,\n disabled,\n maxWidth,\n truncate,\n circle,\n children,\n style,\n ...props\n },\n ref,\n ) => {\n const prefersReducedMotion = useReducedMotion()\n const resolvedVariant = variant ?? 'subtle'\n const resolvedColor = color ?? 'default'\n const resolvedSize = size ?? 'md'\n\n // When both onClick + onDismiss, use div with role=\"button\" to avoid nested <button>\n const Comp = asChild\n ? Slot\n : onClick && onDismiss\n ? 'div'\n : onClick\n ? 'button'\n : 'span'\n\n // Custom color inline styles via CSS variable\n const customStyles =\n resolvedColor === 'custom'\n ? {\n ...(resolvedVariant === 'subtle' && {\n backgroundColor: 'color-mix(in oklch, var(--badge-color) 15%, transparent)',\n color: 'var(--badge-color)',\n borderColor: 'color-mix(in oklch, var(--badge-color) 40%, transparent)',\n }),\n ...(resolvedVariant === 'solid' && {\n backgroundColor: 'var(--badge-color)',\n color: 'var(--badge-fg-color, white)',\n borderColor: 'transparent',\n }),\n ...(resolvedVariant === 'outline' && {\n backgroundColor: 'transparent',\n color: 'var(--badge-color)',\n borderColor: 'color-mix(in oklch, var(--badge-color) 50%, transparent)',\n }),\n ...(resolvedVariant === 'soft' && {\n backgroundColor: 'color-mix(in oklch, var(--badge-color) 12%, transparent)',\n color: 'var(--badge-color)',\n borderColor: 'transparent',\n }),\n }\n : undefined\n\n // Keyboard handler for div[role=\"button\"] (onClick + onDismiss case)\n const handleKeyDown =\n onClick && onDismiss\n ? (e: React.KeyboardEvent<HTMLElement>) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault()\n if (!disabled) onClick(e as unknown as React.MouseEvent<HTMLElement>)\n }\n props.onKeyDown?.(e)\n }\n : props.onKeyDown\n\n const hasLeading = !!(dot \|\| startIcon \|\| (onClick && selected && !startIcon && !dot))\n const hasTrailing = !!(onDismiss \|\| endIcon)\n\n return (\n <Comp\n ref={ref as React.Ref<never>}\n className={cn(\n badgeVariants({ variant: resolvedVariant, size: resolvedSize }),\n getColorClasses(resolvedVariant, resolvedColor),\n hasLeading && paddingLeftWithIcon[resolvedSize],\n hasTrailing && paddingRightWithTrailing[resolvedSize],\n onClick &&\n 'cursor-pointer hover:brightness-[0.97] focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-1 transition-[color,background-color,border-color,transform,filter] duration-moderate-01 ease-productive-exit hover:duration-fast-02 hover:ease-productive-entrance active:scale-[0.95] active:brightness-[0.92] active:duration-[0ms]',\n selected && 'ring-1 ring-current/20 transition-shadow duration-fast-02',\n disabled && 'opacity-action-disabled pointer-events-none saturate-[0.3]',\n circle && 'justify-center px-0 aspect-square',\n className,\n )}\n style={{ ...style, ...customStyles, ...(maxWidth ? { maxWidth } : undefined) }}\n onClick={disabled ? undefined : (onClick as React.MouseEventHandler<HTMLElement>)}\n onKeyDown={handleKeyDown}\n {...(Comp === 'button' && { type: 'button' as const })}\n {...(Comp === 'button' && disabled ? { disabled: true } : {})}\n {...(Comp === 'div' && onClick ? { role: 'button' as const, tabIndex: 0 } : {})}\n {...props}\n >\n {/ Dot indicator — animated entrance + continuous pulse /}\n <AnimatePresence>\n {dot && (\n <motion.span\n key=\"dot\"\n initial={{ scale: 0 }}\n animate={{ scale: 1 }}\n exit={{ scale: 0 }}\n transition={springs.snappy}\n className=\"relative inline-flex h-1.5 w-1.5 shrink-0\"\n aria-hidden=\"true\"\n >\n <motion.span\n className=\"absolute inset-0 rounded-pill bg-current\"\n animate={prefersReducedMotion ? undefined : { scale: [1, 2.5], opacity: [0.35, 0] }}\n transition={prefersReducedMotion ? { duration: 0 } : { repeat: Infinity, repeatDelay: 0.3, duration: 1.2, ease: [0, 0, 0.58, 1] }}\n />\n <span className=\"relative h-1.5 w-1.5 rounded-pill bg-current\" />\n </motion.span>\n )}\n </AnimatePresence>\n\n {/ Selected check icon — always mounted for interactive badges /}\n {onClick && !startIcon && !dot && (\n <motion.span\n initial={false}\n animate={selected\n ? { opacity: 1, scale: 1, width: 'auto', marginRight: 0 }\n : { opacity: 0, scale: 0.5, width: 0, marginRight: -4 }\n }\n transition={{ type: 'tween', duration: durations.moderate01, ease: [0.2, 0, 0.38, 0.9] }} / ease-productive-standard /\n className=\"inline-flex shrink-0 overflow-hidden\"\n aria-hidden={!selected}\n >\n <Icon icon={IconCheck} size=\"xs\" />\n </motion.span>\n )}\n\n {/ Start icon /}\n {startIcon && (\n <span className={cn('shrink-0', iconSizeMap[resolvedSize])}>{startIcon}</span>\n )}\n\n {/ Children — with optional truncation /}\n {truncate \|\| maxWidth ? (\n <span\n className=\"truncate\"\n title={typeof children === 'string' ? children : undefined}\n >\n {children}\n </span>\n ) : (\n children\n )}\n\n {/ End icon /}\n {endIcon && (\n <span className={cn('shrink-0', iconSizeMap[resolvedSize])}>{endIcon}</span>\n )}\n\n {/ Dismiss button /}\n {onDismiss && (\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation()\n onDismiss()\n }}\n className={cn(\n 'shrink-0 rounded-pill text-current/60 hover:text-current hover:bg-current/10 transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-accent-9',\n resolvedSize === 'xs'\n ? 'p-0 -mr-0.5 min-w-[16px] min-h-[16px]'\n : 'p-px',\n )}\n aria-label={\n `Remove ${typeof children === 'string' ? children : ''}`.trim() \|\| 'Remove'\n }\n >\n <Icon icon={IconX} size=\"xs\" />\n </button>\n )}\n </Comp>\n )\n },\n)\nBadge.displayName = 'Badge'\n\nimport { BadgeGroup } from './badge-group'\nimport { BadgeIndicator } from './badge-indicator'\n\nconst BadgeCompound = Object.assign(Badge, {\n Indicator: BadgeIndicator,\n Group: BadgeGroup,\n})\n\nexport { BadgeCompound as Badge, type BadgeColor,type BadgeProps, badgeVariants }\n","'use client'\n\nimport as React from 'react'\n\nimport { Badge, type BadgeProps } from './badge'\nimport { cn } from './lib/utils'\n\nconst GAP_CLASSES = {\n tight: 'gap-1',\n default: 'gap-1.5',\n loose: 'gap-2',\n} as const\n\nexport interface BadgeGroupProps {\n max?: number\n gap?: keyof typeof GAP_CLASSES\n size?: BadgeProps['size']\n onOverflowClick?: () => void\n className?: string\n children: React.ReactNode\n}\n\nexport function BadgeGroup({\n max,\n gap = 'default',\n size,\n onOverflowClick,\n className,\n children,\n}: BadgeGroupProps) {\n const childArray = React.Children.toArray(children)\n const total = childArray.length\n const hasOverflow = max !== undefined && total > max\n const visible = hasOverflow ? childArray.slice(0, max) : childArray\n const overflowCount = hasOverflow ? total - max! : 0\n\n return (\n <div className={cn('flex flex-wrap items-center', GAP_CLASSES[gap], className)}>\n {visible}\n {hasOverflow && (\n <Badge\n variant=\"outline\"\n color=\"neutral\"\n size={size ?? 'sm'}\n onClick={onOverflowClick}\n >\n +{overflowCount}\n </Badge>\n )}\n </div>\n )\n}\n\nBadgeGroup.displayName = 'BadgeGroup'\n"],"mappings":";;;;;;;;;;;AAaA,IAAM,IAAW;CACf,SAAS;EAAE,IAAI;EAA2B,IAAI;EAAyB,QAAQ;EAAgC,OAAO;EAAgB,SAAS;EAAmB;CAClK,QAAS;EAAE,IAAI;EAAgB,IAAI;EAAmB,QAAQ;EAAoB,OAAO;EAAgB,SAAS;EAAkB;CACpI,OAAS;EAAE,IAAI;EAAgB,IAAI;EAAmB,QAAQ;EAAoB,OAAO;EAAgB,SAAS;EAAiB;CACnI,SAAS;EAAE,IAAI;EAAgB,IAAI;EAAmB,QAAQ;EAAoB,OAAO;EAAgB,SAAS;EAAmB;CACrI,SAAS;EAAE,IAAI;EAAgB,IAAI;EAAmB,QAAQ;EAAoB,OAAO;EAAgB,SAAS;EAAmB;CACrI,MAAS;EAAE,IAAI;EAAgB,IAAI;EAAmB,QAAQ;EAAoB,OAAO;EAAgB,SAAS;EAAgB;CAClI,SAAS;EAAE,IAAI;EAA2B,IAAI;EAAyB,QAAQ;EAAgC,OAAO;EAAgB,SAAS;EAAmB;CAClK,MAAS;EAAE,IAAI;EAAyB,IAAI;EAA4B,QAAQ;EAA6B,OAAO;EAAyB,SAAS;EAAc;CACpK,OAAS;EAAE,IAAI;EAAyB,IAAI;EAA4B,QAAQ;EAA6B,OAAO;EAAyB,SAAS;EAAc;CACpK,OAAS;EAAE,IAAI;EAAyB,IAAI;EAA4B,QAAQ;EAA6B,OAAO;EAAyB,SAAS;EAAc;CACpK,QAAS;EAAE,IAAI;EAAyB,IAAI;EAA4B,QAAQ;EAA6B,OAAO;EAAyB,SAAS;EAAc;CACpK,MAAS;EAAE,IAAI;EAAyB,IAAI;EAA4B,QAAQ;EAA6B,OAAO;EAAyB,SAAS;EAAc;CACpK,QAAS;EAAE,IAAI;EAAyB,IAAI;EAA4B,QAAQ;EAA6B,OAAO;EAAyB,SAAS;EAAc;CACpK,SAAS;EAAE,IAAI;EAAyB,IAAI;EAA4B,QAAQ;EAA6B,OAAO;EAAyB,SAAS;EAAc;CACrK;AAKD,SAAS,EAAgB,GAAkD,GAA2B;AACpG,KAAI,MAAU,SAAU,QAAO;CAC/B,IAAM,IAAI,EAAS;AACnB,SAAQ,GAAR;EACE,KAAK,SAAW,QAAO,EAAG,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO;EAC/C,KAAK,QAAW,QAAO,EAAG,EAAE,OAAO,EAAE,SAAS,qBAAqB;EACnE,KAAK,UAAW,QAAO,EAAG,kBAAkB,EAAE,IAAI,EAAE,OAAO;EAC3D,KAAK,OAAW,QAAO,EAAG,EAAE,IAAI,EAAE,IAAI,qBAAqB;;;AAI/D,IAAM,IAAgB,EACpB,oRACA;CACE,UAAU;EACR,SAAS;GACP,QAAQ;GACR,OAAO;GACP,SAAS;GACT,MAAM;GACP;EACD,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACP;CACF,CACF,EAGK,IAAsC;CAC1C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGK,IAA8C;CAClD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGK,IAAmD;CACvD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EA+CK,IAAQ,EAAM,YAEhB,EACE,cACA,YACA,UACA,SACA,YACA,cACA,YACA,QACA,cACA,YACA,aACA,aACA,aACA,aACA,WACA,aACA,UACA,GAAG,KAEL,MACG;CACH,IAAM,IAAuB,GAAkB,EACzC,IAAkB,KAAW,UAC7B,IAAgB,KAAS,WACzB,IAAe,KAAQ,MAGvB,IAAO,IACT,IACA,KAAW,IACT,QACA,IACE,WACA,QAGF,IACJ,MAAkB,WACd;EACE,GAAI,MAAoB,YAAY;GAClC,iBAAiB;GACjB,OAAO;GACP,aAAa;GACd;EACD,GAAI,MAAoB,WAAW;GACjC,iBAAiB;GACjB,OAAO;GACP,aAAa;GACd;EACD,GAAI,MAAoB,aAAa;GACnC,iBAAiB;GACjB,OAAO;GACP,aAAa;GACd;EACD,GAAI,MAAoB,UAAU;GAChC,iBAAiB;GACjB,OAAO;GACP,aAAa;GACd;EACF,GACD,KAAA,GAGA,IACJ,KAAW,KACN,MAAwC;AAKvC,GAJI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,gBAAgB,EACb,KAAU,EAAQ,EAA8C,GAEvE,EAAM,YAAY,EAAE;KAEtB,EAAM,WAEN,IAAa,CAAC,EAAE,KAAO,KAAc,KAAW,KAAY,CAAC,KAAa,CAAC,IAC3E,IAAc,CAAC,EAAE,KAAa;AAEpC,QACE,kBAAC,GAAD;EACO;EACL,WAAW,EACT,EAAc;GAAE,SAAS;GAAiB,MAAM;GAAc,CAAC,EAC/D,EAAgB,GAAiB,EAAc,EAC/C,KAAc,EAAoB,IAClC,KAAe,EAAyB,IACxC,KACE,yXACF,KAAY,6DACZ,KAAY,8DACZ,KAAU,qCACV,EACD;EACD,OAAO;GAAE,GAAG;GAAO,GAAG;GAAc,GAAI,IAAW,EAAE,aAAU,GAAG,KAAA;GAAY;EAC9E,SAAS,IAAW,KAAA,IAAa;EACjC,WAAW;EACX,GAAK,MAAS,YAAY,EAAE,MAAM,UAAmB;EACrD,GAAK,MAAS,YAAY,IAAW,EAAE,UAAU,IAAM,GAAG,EAAE;EAC5D,GAAK,MAAS,SAAS,IAAU;GAAE,MAAM;GAAmB,UAAU;GAAG,GAAG,EAAE;EAC9E,GAAI;YApBN;GAuBE,kBAAC,GAAD,EAAA,UACG,KACC,kBAAC,EAAO,MAAR;IAEE,SAAS,EAAE,OAAO,GAAG;IACrB,SAAS,EAAE,OAAO,GAAG;IACrB,MAAM,EAAE,OAAO,GAAG;IAClB,YAAY,EAAQ;IACpB,WAAU;IACV,eAAY;cAPd,CASE,kBAAC,EAAO,MAAR;KACE,WAAU;KACV,SAAS,IAAuB,KAAA,IAAY;MAAE,OAAO,CAAC,GAAG,IAAI;MAAE,SAAS,CAAC,KAAM,EAAE;MAAE;KACnF,YAAY,IAAuB,EAAE,UAAU,GAAG,GAAG;MAAE,QAAQ;MAAU,aAAa;MAAK,UAAU;MAAK,MAAM;OAAC;OAAG;OAAG;OAAM;OAAE;MAAE;KACjI,CAAA,EACF,kBAAC,QAAD,EAAM,WAAU,gDAAiD,CAAA,CACrD;MAdR,MAcQ,EAEA,CAAA;GAGjB,KAAW,CAAC,KAAa,CAAC,KACzB,kBAAC,EAAO,MAAR;IACE,SAAS;IACT,SAAS,IACL;KAAE,SAAS;KAAG,OAAO;KAAG,OAAO;KAAQ,aAAa;KAAG,GACvD;KAAE,SAAS;KAAG,OAAO;KAAK,OAAO;KAAG,aAAa;KAAI;IAEzD,YAAY;KAAE,MAAM;KAAS,UAAU,EAAU;KAAY,MAAM;MAAC;MAAK;MAAG;MAAM;MAAI;KAAE;IACxF,WAAU;IACV,eAAa,CAAC;cAEd,kBAAC,GAAD;KAAM,MAAM;KAAW,MAAK;KAAO,CAAA;IACvB,CAAA;GAIf,KACC,kBAAC,QAAD;IAAM,WAAW,EAAG,YAAY,EAAY,GAAc;cAAG;IAAiB,CAAA;GAI/E,KAAY,IACX,kBAAC,QAAD;IACE,WAAU;IACV,OAAO,OAAO,KAAa,WAAW,IAAW,KAAA;IAEhD;IACI,CAAA,GAEP;GAID,KACC,kBAAC,QAAD;IAAM,WAAW,EAAG,YAAY,EAAY,GAAc;cAAG;IAAe,CAAA;GAI7E,KACC,kBAAC,UAAD;IACE,MAAK;IACL,UAAU,MAAM;AAEd,KADA,EAAE,iBAAiB,EACnB,GAAW;;IAEb,WAAW,EACT,gLACA,MAAiB,OACb,0CACA,OACL;IACD,cACE,UAAU,OAAO,KAAa,WAAW,IAAW,KAAK,MAAM,IAAI;cAGrE,kBAAC,GAAD;KAAM,MAAM;KAAO,MAAK;KAAO,CAAA;IACxB,CAAA;GAEN;;EAGZ;AACD,EAAM,cAAc;AAKpB,IAAM,IAAgB,OAAO,OAAO,GAAO;CACzC,WAAW;CACX,OAAO;CACR,CAAC,ECtUI,IAAc;CAClB,OAAO;CACP,SAAS;CACT,OAAO;CACR;AAWD,SAAgB,EAAW,EACzB,QACA,SAAM,WACN,SACA,oBACA,cACA,eACkB;CAClB,IAAM,IAAa,EAAM,SAAS,QAAQ,EAAS,EAC7C,IAAQ,EAAW,QACnB,IAAc,MAAQ,KAAA,KAAa,IAAQ,GAC3C,IAAU,IAAc,EAAW,MAAM,GAAG,EAAI,GAAG,GACnD,IAAgB,IAAc,IAAQ,IAAO;AAEnD,QACE,kBAAC,OAAD;EAAK,WAAW,EAAG,+BAA+B,EAAY,IAAM,EAAU;YAA9E,CACG,GACA,KACC,kBAAC,GAAD;GACE,SAAQ;GACR,OAAM;GACN,MAAM,KAAQ;GACd,SAAS;aAJX,CAKC,KACG,EACI;KAEN;;;AAIV,EAAW,cAAc"}

package/dist/_chunks/chat.js CHANGED Viewed

@@ -85,10 +85,10 @@ var E = p.forwardRef(({ children: n, variant: i = "flat", placement: o = "start"
 				y: 0
 			},
 			transition: t.snappy,
-			className: r("group/message relative flex", o === "end" ? "justify-end" : "justify-start", s === "mention" && "border-l-2 border-l-accent-9 bg-accent-2 pl-ds-03 rounded-ds-sm", s === "internal" && "bg-warning-2/50 rounded-ds-sm", d),
+			className: r("group/message relative flex", o === "end" ? "justify-end" : "justify-start", s === "mention" && "border-l-2 border-l-accent-9 bg-accent-2 pl-ds-03 rounded-control-inner", s === "internal" && "bg-warning-2/50 rounded-control-inner", d),
 			...e(f),
 			children: /* @__PURE__ */ m("div", {
-				className: r("max-w-[85%] rounded-ds-2xl px-ds-04 py-ds-03", o === "end" ? "bg-accent-3 text-surface-fg" : "bg-surface-raised text-surface-fg"),
+				className: r("max-w-[85%] rounded-bubble px-ds-04 py-ds-03", o === "end" ? "bg-accent-3 text-surface-fg" : "bg-surface-raised text-surface-fg"),
 				children: n
 			})
 		})
@@ -105,7 +105,7 @@ var E = p.forwardRef(({ children: n, variant: i = "flat", placement: o = "start"
 				y: 0
 			},
 			transition: t.snappy,
-			className: r("group/message relative flex gap-ds-04", c && "-mt-ds-01", s === "mention" && "border-l-2 border-l-accent-9 bg-accent-2 pl-ds-03 rounded-ds-sm", s === "internal" && "bg-warning-2/50 rounded-ds-sm", d),
+			className: r("group/message relative flex gap-ds-04", c && "-mt-ds-01", s === "mention" && "border-l-2 border-l-accent-9 bg-accent-2 pl-ds-03 rounded-control-inner", s === "internal" && "bg-warning-2/50 rounded-control-inner", d),
 			...e(f),
 			children: n
 		})
@@ -118,7 +118,7 @@ function D({ src: e, fallback: t, icon: n, size: i = "md", children: a }) {
 		className: r(u, "shrink-0 flex items-start"),
 		children: a
 	}) : n ? /* @__PURE__ */ m("div", {
-		className: r(u, i === "sm" ? "h-5" : "h-6", "shrink-0 flex items-center justify-center rounded-ds-full bg-surface-raised-hover"),
+		className: r(u, i === "sm" ? "h-5" : "h-6", "shrink-0 flex items-center justify-center rounded-pill bg-surface-raised-hover"),
 		children: n
 	}) : /* @__PURE__ */ m("div", {
 		className: r(u, "shrink-0"),
@@ -201,14 +201,14 @@ function M({ content: e, onSave: t, onCancel: n, canEdit: i = !1, renderContent:
 			onChange: (e) => l(e.target.value),
 			onKeyDown: _,
 			onBlur: f,
-			className: "w-full resize-none rounded-ds-sm border border-surface-border-strong bg-surface-raised-hover px-ds-02 py-ds-01 text-[13px] leading-relaxed text-surface-fg focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
+			className: "w-full resize-none rounded-control-inner border border-surface-border-strong bg-surface-raised-hover px-ds-02 py-ds-01 text-[13px] leading-relaxed text-surface-fg focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
 			rows: 2
 		}), /* @__PURE__ */ m("div", {
 			className: "mt-ds-01 text-ds-xs text-surface-fg-subtle/50",
 			children: "Enter to save · Escape to cancel"
 		})]
 	}) : /* @__PURE__ */ m("div", {
-		className: r("text-[13px] leading-relaxed text-surface-fg whitespace-pre-wrap", i && "cursor-pointer hover:bg-surface-raised-hover rounded-ds-sm transition-colors"),
+		className: r("text-[13px] leading-relaxed text-surface-fg whitespace-pre-wrap", i && "cursor-pointer hover:bg-surface-raised-hover rounded-control-inner transition-colors"),
 		onClick: d,
 		role: i ? "button" : void 0,
 		tabIndex: i ? 0 : void 0,
@@ -226,7 +226,7 @@ function N({ reactions: e, onReact: t }) {
 			type: "button",
 			onClick: () => t(e.emoji),
 			"aria-label": `${e.emoji} ${e.count} reaction${e.count === 1 ? "" : "s"}${e.reacted ? ", you reacted" : ""}`,
-			className: r("inline-flex items-center gap-ds-01 rounded-full px-ds-02 py-ds-01 text-ds-xs transition-colors", e.reacted ? "bg-accent-3 ring-1 ring-accent-6" : "bg-surface-raised-hover hover:bg-surface-raised-active"),
+			className: r("inline-flex items-center gap-ds-01 rounded-pill px-ds-02 py-ds-01 text-ds-xs transition-colors", e.reacted ? "bg-accent-3 ring-1 ring-accent-6" : "bg-surface-raised-hover hover:bg-surface-raised-active"),
 			children: [/* @__PURE__ */ m("span", { children: e.emoji }), /* @__PURE__ */ m("span", { children: e.count })]
 		}, e.emoji))
 	});
@@ -234,7 +234,7 @@ function N({ reactions: e, onReact: t }) {
 N.displayName = "Message.Reactions";
 function P({ children: e, delay: t = 100 }) {
 	return /* @__PURE__ */ m("div", {
-		className: r("absolute -top-2 right-0 z-10", "flex items-center gap-ds-01 rounded-ds-md border border-surface-border bg-surface-raised px-ds-01 py-ds-01 shadow-raised", "opacity-0 group-hover/message:opacity-100 group-focus-within/message:opacity-100 transition-opacity duration-150"),
+		className: r("absolute -top-2 right-0 z-10", "flex items-center gap-ds-01 rounded-control border border-surface-border bg-surface-raised px-ds-01 py-ds-01 shadow-raised", "opacity-0 group-hover/message:opacity-100 group-focus-within/message:opacity-100 transition-opacity duration-150"),
 		style: { transitionDelay: `${t}ms` },
 		children: e
 	});
@@ -247,7 +247,7 @@ function F({ icon: e, label: t, onClick: n, variant: i = "default" }) {
 			type: "button",
 			onClick: n,
 			"aria-label": t,
-			className: r("p-ds-02 rounded-ds-sm transition-colors", i === "default" && "text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-raised-hover", i === "danger" && "text-surface-fg-subtle hover:text-error-11 hover:bg-surface-raised-hover"),
+			className: r("p-ds-02 rounded-control-inner transition-colors", i === "default" && "text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-raised-hover", i === "danger" && "text-surface-fg-subtle hover:text-error-11 hover:bg-surface-raised-hover"),
 			children: /* @__PURE__ */ m(a, {
 				icon: e,
 				size: "xs"
@@ -286,7 +286,7 @@ var I = Object.assign(E, {
 		className: r("border-t border-surface-border-subtle px-ds-05 py-ds-04", f),
 		...g,
 		children: [/* @__PURE__ */ h("div", {
-			className: "flex items-end gap-ds-02 rounded-ds-xl border border-surface-border bg-surface-base p-ds-03",
+			className: "flex items-end gap-ds-02 rounded-overlay-lg border border-surface-border bg-surface-base p-ds-03",
 			children: [
 				s,
 				/* @__PURE__ */ m("textarea", {
@@ -405,7 +405,7 @@ var R = p.forwardRef(({ children: e, autoScroll: t = !0, newMessageCount: a = 0,
 				},
 				transition: n.fade,
 				onClick: k,
-				className: "absolute bottom-ds-04 left-1/2 z-10 -translate-x-1/2 rounded-full bg-accent-9 px-ds-04 py-ds-02 text-ds-xs font-medium text-accent-fg shadow-raised transition-colors hover:bg-accent-10",
+				className: "absolute bottom-ds-04 left-1/2 z-10 -translate-x-1/2 rounded-pill bg-accent-9 px-ds-04 py-ds-02 text-ds-xs font-medium text-accent-fg shadow-raised transition-colors hover:bg-accent-10",
 				children: [a, " new"]
 			}) })
 		]
@@ -426,7 +426,7 @@ var B = p.forwardRef(({ icon: e, timestamp: t, variant: n = "event", children: i
 	className: r("flex justify-center", o),
 	...s,
 	children: /* @__PURE__ */ h("div", {
-		className: "flex items-center gap-ds-03 rounded-ds-lg bg-error-3 px-ds-04 py-ds-03",
+		className: "flex items-center gap-ds-03 rounded-surface bg-error-3 px-ds-04 py-ds-03",
 		children: [
 			e ?? /* @__PURE__ */ m(a, {
 				icon: g,
@@ -444,7 +444,7 @@ var B = p.forwardRef(({ icon: e, timestamp: t, variant: n = "event", children: i
 	})
 }) : /* @__PURE__ */ h("div", {
 	ref: c,
-	className: r("flex items-center gap-ds-02 rounded-ds-sm bg-surface-raised-hover/30 px-ds-02 py-ds-01 -mx-ds-02 text-ds-sm text-surface-fg-subtle/60", o),
+	className: r("flex items-center gap-ds-02 rounded-control-inner bg-surface-raised-hover/30 px-ds-02 py-ds-01 -mx-ds-02 text-ds-sm text-surface-fg-subtle/60", o),
 	...s,
 	children: [
 		e,
@@ -478,7 +478,7 @@ function H({ users: e, className: t }) {
 					1,
 					2
 				].map((e) => /* @__PURE__ */ m(x.span, {
-					className: "h-1 w-1 rounded-full bg-surface-fg-subtle",
+					className: "h-1 w-1 rounded-pill bg-surface-fg-subtle",
 					animate: { y: [
 						0,
 						-3,

package/dist/_chunks/chat.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"chat.js","names":[],"sources":["../../src/ui/chat/date-separator.tsx","../../src/ui/chat/message.tsx","../../src/ui/chat/message-input.tsx","../../src/ui/chat/message-list.tsx","../../src/ui/chat/system-message.tsx","../../src/ui/chat/typing-indicator.tsx","../../src/ui/chat/unread-separator.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport interface DateSeparatorProps {\n date: Date \| string\n format?: (date: Date) => string\n className?: string\n}\n\nfunction defaultFormat(date: Date): string {\n const now = new Date()\n const today = new Date(now.getFullYear(), now.getMonth(), now.getDate())\n const target = new Date(date.getFullYear(), date.getMonth(), date.getDate())\n const diffMs = today.getTime() - target.getTime()\n const diffDays = Math.round(diffMs / (1000 * 60 * 60 * 24))\n\n if (diffDays === 0) return 'Today'\n if (diffDays === 1) return 'Yesterday'\n\n const month = date.toLocaleString('en-US', { month: 'short' })\n const day = date.getDate()\n\n if (date.getFullYear() !== now.getFullYear()) {\n return `${month} ${day}, ${date.getFullYear()}`\n }\n\n return `${month} ${day}`\n}\n\nfunction DateSeparator({ date, format, className }: DateSeparatorProps) {\n const d = typeof date === 'string' ? new Date(date) : date\n const label = format ? format(d) : defaultFormat(d)\n\n return (\n <div className={cn('flex items-center gap-ds-03 py-ds-03', className)}>\n <div className=\"flex-1 border-t border-surface-border-subtle\" />\n <span className=\"text-ds-xs font-medium text-surface-fg-subtle/50 uppercase tracking-wider\">\n {label}\n </span>\n <div className=\"flex-1 border-t border-surface-border-subtle\" />\n </div>\n )\n}\nDateSeparator.displayName = 'DateSeparator'\n\nexport { DateSeparator }\n","'use client'\n\nimport { IconTrash } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Avatar, AvatarFallback,AvatarImage } from '../avatar'\nimport { Icon, type IconProps } from '../icon'\nimport { motionProps,springs } from '../lib/motion'\nimport { cn } from '../lib/utils'\nimport { Tooltip, TooltipContent,TooltipTrigger } from '../tooltip'\n\n// ── Context ──────────────────────────────────────────────────────────────\n\ninterface MessageContextValue {\n variant: 'flat' \| 'bubble'\n placement: 'start' \| 'end'\n grouped: boolean\n highlight?: 'mention' \| 'internal'\n}\n\nconst MessageContext = React.createContext<MessageContextValue>({\n variant: 'flat',\n placement: 'start',\n grouped: false,\n})\n\nfunction useMessageContext() {\n return React.useContext(MessageContext)\n}\n\n// ── Root ─────────────────────────────────────────────────────────────────\n\nexport interface MessageProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n variant?: 'flat' \| 'bubble'\n placement?: 'start' \| 'end'\n highlight?: 'mention' \| 'internal'\n grouped?: boolean\n deleted?: boolean\n deletedText?: string\n}\n\nconst MessageRoot = React.forwardRef<HTMLDivElement, MessageProps>(\n (\n {\n children,\n variant = 'flat',\n placement = 'start',\n highlight,\n grouped = false,\n deleted = false,\n deletedText = 'This message was deleted',\n className,\n ...props\n },\n ref,\n ) => {\n const ctx = React.useMemo<MessageContextValue>(\n () => ({ variant, placement, grouped, highlight }),\n [variant, placement, grouped, highlight],\n )\n\n if (deleted) {\n return (\n <motion.div\n ref={ref}\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={springs.snappy}\n className={cn(\n 'flex items-center gap-ds-02 py-ds-02 text-ds-xs text-surface-fg-subtle/50 italic',\n className,\n )}\n {...motionProps(props)}\n >\n <Icon icon={IconTrash} size=\"xs\" />\n {deletedText}\n </motion.div>\n )\n }\n\n if (variant === 'bubble') {\n return (\n <MessageContext.Provider value={ctx}>\n <motion.div\n ref={ref}\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={springs.snappy}\n className={cn(\n 'group/message relative flex',\n placement === 'end' ? 'justify-end' : 'justify-start',\n highlight === 'mention' && 'border-l-2 border-l-accent-9 bg-accent-2 pl-ds-03 rounded-ds-sm',\n highlight === 'internal' && 'bg-warning-2/50 rounded-ds-sm',\n className,\n )}\n {...motionProps(props)}\n >\n <div\n className={cn(\n 'max-w-[85%] rounded-ds-2xl px-ds-04 py-ds-03',\n placement === 'end'\n ? 'bg-accent-3 text-surface-fg'\n : 'bg-surface-raised text-surface-fg',\n )}\n >\n {children}\n </div>\n </motion.div>\n </MessageContext.Provider>\n )\n }\n\n // flat variant (default)\n return (\n <MessageContext.Provider value={ctx}>\n <motion.div\n ref={ref}\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={springs.snappy}\n className={cn(\n 'group/message relative flex gap-ds-04',\n grouped && '-mt-ds-01',\n highlight === 'mention' && 'border-l-2 border-l-accent-9 bg-accent-2 pl-ds-03 rounded-ds-sm',\n highlight === 'internal' && 'bg-warning-2/50 rounded-ds-sm',\n className,\n )}\n {...motionProps(props)}\n >\n {children}\n </motion.div>\n </MessageContext.Provider>\n )\n },\n)\nMessageRoot.displayName = 'Message'\n\n// ── Avatar ───────────────────────────────────────────────────────────────\n\nexport interface MessageAvatarProps {\n src?: string \| null\n fallback?: string\n icon?: React.ReactNode\n size?: 'sm' \| 'md'\n children?: React.ReactNode\n}\n\nfunction MessageAvatar({\n src,\n fallback,\n icon,\n size = 'md',\n children,\n}: MessageAvatarProps) {\n const { grouped } = useMessageContext()\n\n const sizeClass = size === 'sm' ? 'w-5' : 'w-6'\n const heightClass = size === 'sm' ? 'h-5' : 'h-6'\n\n if (grouped) {\n return <div className={cn(sizeClass, heightClass, 'shrink-0')} />\n }\n\n if (children) {\n return (\n <div className={cn(sizeClass, 'shrink-0 flex items-start')}>\n {children}\n </div>\n )\n }\n\n if (icon) {\n return (\n <div\n className={cn(\n sizeClass,\n size === 'sm' ? 'h-5' : 'h-6',\n 'shrink-0 flex items-center justify-center rounded-ds-full bg-surface-raised-hover',\n )}\n >\n {icon}\n </div>\n )\n }\n\n return (\n <div className={cn(sizeClass, 'shrink-0')}>\n <Avatar size={size === 'sm' ? 'xs' : 'sm'}>\n {src && <AvatarImage src={src} alt={fallback ?? ''} />}\n <AvatarFallback>{fallback ?? ''}</AvatarFallback>\n </Avatar>\n </div>\n )\n}\nMessageAvatar.displayName = 'Message.Avatar'\n\n// ── Content ──────────────────────────────────────────────────────────────\n\nexport interface MessageContentProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n}\n\nfunction MessageContent({ children, className, ...props }: MessageContentProps) {\n return (\n <div className={cn('min-w-0 flex-1 flex flex-col gap-ds-02', className)} {...props}>\n {children}\n </div>\n )\n}\nMessageContent.displayName = 'Message.Content'\n\n// ── Author ───────────────────────────────────────────────────────────────\n\nexport interface MessageAuthorProps {\n name: string\n badge?: React.ReactNode\n timestamp?: Date\n formattedTimestamp?: string\n timestampFormat?: (date: Date) => string\n}\n\nfunction defaultTimestampFormat(date: Date): string {\n return date.toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' })\n}\n\nfunction MessageAuthor({\n name,\n badge,\n timestamp,\n formattedTimestamp,\n timestampFormat = defaultTimestampFormat,\n}: MessageAuthorProps) {\n const { grouped } = useMessageContext()\n\n if (grouped) return null\n\n const timeStr = formattedTimestamp\n ?? (timestamp ? timestampFormat(timestamp) : undefined)\n\n return (\n <div className=\"flex items-baseline gap-ds-02\">\n <span className=\"font-semibold text-[13px] text-surface-fg\">{name}</span>\n {badge}\n {timeStr && (\n <span className=\"text-[11px] text-surface-fg-subtle/50\">{timeStr}</span>\n )}\n </div>\n )\n}\nMessageAuthor.displayName = 'Message.Author'\n\n// ── Body ─────────────────────────────────────────────────────────────────\n\nexport interface MessageBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n}\n\nfunction MessageBody({ children, className, ...props }: MessageBodyProps) {\n return (\n <div\n className={cn(\n 'text-[13px] leading-relaxed text-surface-fg whitespace-pre-wrap',\n className,\n )}\n {...props}\n >\n {children}\n </div>\n )\n}\nMessageBody.displayName = 'Message.Body'\n\n// ── EditableBody ─────────────────────────────────────────────────────────\n\nexport interface MessageEditableBodyProps {\n content: string\n onSave: (newContent: string) => void\n onCancel?: () => void\n canEdit?: boolean\n renderContent?: (content: string) => React.ReactNode\n}\n\nfunction MessageEditableBody({\n content,\n onSave,\n onCancel,\n canEdit = false,\n renderContent,\n}: MessageEditableBodyProps) {\n const [isEditing, setIsEditing] = React.useState(false)\n const [editDraft, setEditDraft] = React.useState(content)\n const textareaRef = React.useRef<HTMLTextAreaElement>(null)\n\n React.useEffect(() => {\n if (isEditing && textareaRef.current) {\n textareaRef.current.focus()\n textareaRef.current.select()\n }\n }, [isEditing])\n\n const handleStartEdit = React.useCallback(() => {\n if (!canEdit) return\n setEditDraft(content)\n setIsEditing(true)\n }, [canEdit, content])\n\n const handleSave = React.useCallback(() => {\n const trimmed = editDraft.trim()\n if (trimmed && trimmed !== content) {\n onSave(trimmed)\n }\n setIsEditing(false)\n }, [editDraft, content, onSave])\n\n const handleCancel = React.useCallback(() => {\n setIsEditing(false)\n setEditDraft(content)\n onCancel?.()\n }, [content, onCancel])\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault()\n handleSave()\n } else if (e.key === 'Escape') {\n e.preventDefault()\n handleCancel()\n }\n },\n [handleSave, handleCancel],\n )\n\n if (isEditing) {\n return (\n <div className=\"text-[13px] leading-relaxed\">\n <textarea\n ref={textareaRef}\n value={editDraft}\n onChange={(e) => setEditDraft(e.target.value)}\n onKeyDown={handleKeyDown}\n onBlur={handleSave}\n className=\"w-full resize-none rounded-ds-sm border border-surface-border-strong bg-surface-raised-hover px-ds-02 py-ds-01 text-[13px] leading-relaxed text-surface-fg focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9\"\n rows={2}\n />\n <div className=\"mt-ds-01 text-ds-xs text-surface-fg-subtle/50\">\n Enter to save · Escape to cancel\n </div>\n </div>\n )\n }\n\n return (\n <div\n className={cn(\n 'text-[13px] leading-relaxed text-surface-fg whitespace-pre-wrap',\n canEdit && 'cursor-pointer hover:bg-surface-raised-hover rounded-ds-sm transition-colors',\n )}\n onClick={handleStartEdit}\n role={canEdit ? 'button' : undefined}\n tabIndex={canEdit ? 0 : undefined}\n onKeyDown={\n canEdit\n ? (e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault()\n handleStartEdit()\n }\n }\n : undefined\n }\n >\n {renderContent ? renderContent(content) : content}\n </div>\n )\n}\nMessageEditableBody.displayName = 'Message.EditableBody'\n\n// ── Reactions ────────────────────────────────────────────────────────────\n\nexport interface MessageReactionsProps {\n reactions: { emoji: string; count: number; reacted: boolean }[]\n onReact: (emoji: string) => void\n}\n\nfunction MessageReactions({ reactions, onReact }: MessageReactionsProps) {\n if (reactions.length === 0) return null\n\n return (\n <div className=\"flex flex-wrap gap-ds-02 mt-ds-03\">\n {reactions.map((r) => (\n <button\n key={r.emoji}\n type=\"button\"\n onClick={() => onReact(r.emoji)}\n aria-label={`${r.emoji} ${r.count} reaction${r.count !== 1 ? 's' : ''}${r.reacted ? ', you reacted' : ''}`}\n className={cn(\n 'inline-flex items-center gap-ds-01 rounded-full px-ds-02 py-ds-01 text-ds-xs transition-colors',\n r.reacted\n ? 'bg-accent-3 ring-1 ring-accent-6'\n : 'bg-surface-raised-hover hover:bg-surface-raised-active',\n )}\n >\n <span>{r.emoji}</span>\n <span>{r.count}</span>\n </button>\n ))}\n </div>\n )\n}\nMessageReactions.displayName = 'Message.Reactions'\n\n// ── Actions (floating toolbar) ───────────────────────────────────────────\n\nexport interface MessageActionsProps {\n children: React.ReactNode\n delay?: number\n}\n\nfunction MessageActions({ children, delay = 100 }: MessageActionsProps) {\n return (\n <div\n className={cn(\n 'absolute -top-2 right-0 z-10',\n 'flex items-center gap-ds-01 rounded-ds-md border border-surface-border bg-surface-raised px-ds-01 py-ds-01 shadow-raised',\n 'opacity-0 group-hover/message:opacity-100 group-focus-within/message:opacity-100 transition-opacity duration-150',\n )}\n style={{ transitionDelay: `${delay}ms` }}\n >\n {children}\n </div>\n )\n}\nMessageActions.displayName = 'Message.Actions'\n\n// ── Action (single icon button) ──────────────────────────────────────────\n\nexport interface MessageActionProps {\n icon: IconProps['icon']\n label: string\n onClick: () => void\n variant?: 'default' \| 'danger'\n}\n\nfunction MessageAction({\n icon,\n label,\n onClick,\n variant = 'default',\n}: MessageActionProps) {\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={label}\n className={cn(\n 'p-ds-02 rounded-ds-sm transition-colors',\n variant === 'default' &&\n 'text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-raised-hover',\n variant === 'danger' &&\n 'text-surface-fg-subtle hover:text-error-11 hover:bg-surface-raised-hover',\n )}\n >\n <Icon icon={icon} size=\"xs\" />\n </button>\n </TooltipTrigger>\n <TooltipContent>{label}</TooltipContent>\n </Tooltip>\n )\n}\nMessageAction.displayName = 'Message.Action'\n\n// ── Compound Export ──────────────────────────────────────────────────────\n\nexport const Message = Object.assign(MessageRoot, {\n Avatar: MessageAvatar,\n Content: MessageContent,\n Author: MessageAuthor,\n Body: MessageBody,\n EditableBody: MessageEditableBody,\n Reactions: MessageReactions,\n Actions: MessageActions,\n Action: MessageAction,\n})\n\nexport {\n type MessageContextValue,\n useMessageContext,\n}\n","'use client'\n\nimport { IconSend, IconSquare } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Button } from '../button'\nimport { Icon } from '../icon'\nimport { cn } from '../lib/utils'\n\nexport interface MessageInputProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSubmit'> {\n onSubmit: (text: string) => void\n placeholder?: string\n disabled?: boolean\n isStreaming?: boolean\n onCancel?: () => void\n leadingSlot?: React.ReactNode\n trailingSlot?: React.ReactNode\n disclaimer?: string\n sendIcon?: React.ReactNode\n}\n\nconst MessageInput = React.forwardRef<HTMLDivElement, MessageInputProps>(\n (\n {\n onSubmit,\n placeholder = 'Type a message...',\n disabled = false,\n isStreaming = false,\n onCancel,\n leadingSlot,\n trailingSlot,\n disclaimer,\n sendIcon,\n className,\n ...props\n },\n ref,\n ) => {\n const [text, setText] = React.useState('')\n const textareaRef = React.useRef<HTMLTextAreaElement>(null)\n\n const resize = React.useCallback(() => {\n const el = textareaRef.current\n if (!el) return\n el.style.height = 'auto'\n el.style.height = `${Math.min(el.scrollHeight, 160)}px`\n }, [])\n\n const handleChange = React.useCallback(\n (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setText(e.target.value)\n resize()\n },\n [resize],\n )\n\n const handleSend = React.useCallback(() => {\n const trimmed = text.trim()\n if (!trimmed \|\| isStreaming) return\n onSubmit(trimmed)\n setText('')\n // Reset height after clearing\n if (textareaRef.current) {\n textareaRef.current.style.height = 'auto'\n }\n }, [text, isStreaming, onSubmit])\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault()\n if (!isStreaming) {\n handleSend()\n }\n }\n },\n [isStreaming, handleSend],\n )\n\n const isEmpty = text.trim().length === 0\n\n return (\n <div\n ref={ref}\n className={cn(\n 'border-t border-surface-border-subtle px-ds-05 py-ds-04',\n className,\n )}\n {...props}\n >\n <div className=\"flex items-end gap-ds-02 rounded-ds-xl border border-surface-border bg-surface-base p-ds-03\">\n {leadingSlot}\n <textarea\n ref={textareaRef}\n value={text}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n aria-label={placeholder \|\| 'Type a message'}\n disabled={disabled}\n rows={1}\n className=\"flex-1 resize-none bg-transparent px-ds-02 py-ds-01 text-ds-sm text-surface-fg placeholder:text-surface-fg-subtle/50 focus:outline-hidden disabled:opacity-50\"\n style={{ maxHeight: 160 }}\n />\n {isStreaming ? (\n <Button\n variant=\"ghost\"\n size=\"icon-sm\"\n color=\"error\"\n onClick={onCancel}\n aria-label=\"Stop\"\n >\n <Icon icon={IconSquare} size=\"sm\" />\n </Button>\n ) : (\n <Button\n variant=\"ghost\"\n size=\"icon-sm\"\n onClick={handleSend}\n disabled={isEmpty \|\| disabled}\n aria-label=\"Send\"\n >\n {sendIcon ?? <Icon icon={IconSend} size=\"sm\" />}\n </Button>\n )}\n {trailingSlot}\n </div>\n {disclaimer && (\n <p className=\"mt-ds-02 text-center text-ds-xs text-surface-fg-subtle/50\">\n {disclaimer}\n </p>\n )}\n </div>\n )\n },\n)\nMessageInput.displayName = 'MessageInput'\n\nexport { MessageInput }\n","'use client'\n\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { tweens } from '../lib/motion'\nimport { cn } from '../lib/utils'\nimport { Spinner } from '../spinner'\n\nexport interface MessageListProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n /** Auto-scroll to bottom when new content arrives (default true) /\n autoScroll?: boolean\n /* Number of new messages to show in the floating pill /\n newMessageCount?: number\n /* Called when user clicks the \"N new\" pill /\n onScrollToBottom?: () => void\n /* Called when user scrolls near the top — triggers load-more /\n onLoadMore?: () => void\n /* Whether more messages are currently being loaded /\n loadingMore?: boolean\n /* Content to render when there are no children /\n emptySlot?: React.ReactNode\n /* Custom scroll-to-bottom button (unused slot for future override) /\n scrollToBottomSlot?: React.ReactNode\n /* Content rendered above the scroll container (e.g. channel name) /\n headerSlot?: React.ReactNode\n}\n\nconst MessageList = React.forwardRef<HTMLDivElement, MessageListProps>(\n (\n {\n children,\n autoScroll = true,\n newMessageCount = 0,\n onScrollToBottom,\n onLoadMore,\n loadingMore = false,\n emptySlot,\n scrollToBottomSlot,\n headerSlot,\n className,\n ...props\n },\n ref,\n ) => {\n const scrollRef = React.useRef<HTMLDivElement>(null)\n const isAtBottomRef = React.useRef(true)\n const [isAtBottom, setIsAtBottom] = React.useState(true)\n const loadingMoreRef = React.useRef(false)\n const prevScrollHeightRef = React.useRef(0)\n\n const isEmpty = React.Children.count(children) === 0 && !loadingMore\n\n // ── Scroll handler ────────────────────────────────────────────\n const handleScroll = React.useCallback(() => {\n const el = scrollRef.current\n if (!el) return\n\n const atBottom = el.scrollHeight - el.scrollTop - el.clientHeight < 40\n isAtBottomRef.current = atBottom\n setIsAtBottom(atBottom)\n\n // Load more when near top\n if (el.scrollTop < 100 && onLoadMore && !loadingMoreRef.current) {\n loadingMoreRef.current = true\n prevScrollHeightRef.current = el.scrollHeight\n onLoadMore()\n }\n }, [onLoadMore])\n\n // ── Auto-scroll to bottom when children change ────────────────\n React.useLayoutEffect(() => {\n const el = scrollRef.current\n if (!el) return\n\n // Scroll preservation after load-more\n if (loadingMoreRef.current) {\n const newScrollHeight = el.scrollHeight\n el.scrollTop = newScrollHeight - prevScrollHeightRef.current\n loadingMoreRef.current = false\n return\n }\n\n // Auto-scroll if user was at bottom\n if (autoScroll && isAtBottomRef.current) {\n el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' })\n }\n }, [children, autoScroll])\n\n // ── Reset loading flag when loadingMore goes false ──────────\n React.useEffect(() => {\n if (!loadingMore) {\n loadingMoreRef.current = false\n }\n }, [loadingMore])\n\n // ── \"N new\" pill visibility ───────────────────────────────────\n const showNewPill = newMessageCount > 0 && !isAtBottom\n\n const handleScrollToBottom = React.useCallback(() => {\n const el = scrollRef.current\n if (el) {\n el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' })\n }\n onScrollToBottom?.()\n }, [onScrollToBottom])\n\n return (\n <div\n ref={ref}\n className={cn('relative flex flex-1 flex-col overflow-hidden', className)}\n {...props}\n >\n {headerSlot}\n <div\n ref={scrollRef}\n role=\"log\"\n aria-live=\"polite\"\n aria-relevant=\"additions\"\n className=\"flex-1 overflow-y-auto px-ds-05 py-ds-04\"\n style={{\n scrollbarWidth: 'thin',\n scrollbarColor: 'var(--color-surface-border) transparent',\n }}\n onScroll={handleScroll}\n >\n {loadingMore && (\n <div className=\"flex justify-center py-ds-03\">\n <Spinner size=\"sm\" />\n </div>\n )}\n {isEmpty ? (\n emptySlot\n ) : (\n <div className=\"flex flex-col gap-ds-04\">\n <AnimatePresence initial={false}>{children}</AnimatePresence>\n </div>\n )}\n </div>\n\n {/ \"N new\" floating pill /}\n <AnimatePresence>\n {showNewPill && (\n <motion.button\n initial={{ opacity: 0, y: 10 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 10 }}\n transition={tweens.fade}\n onClick={handleScrollToBottom}\n className=\"absolute bottom-ds-04 left-1/2 z-10 -translate-x-1/2 rounded-full bg-accent-9 px-ds-04 py-ds-02 text-ds-xs font-medium text-accent-fg shadow-raised transition-colors hover:bg-accent-10\"\n >\n {newMessageCount} new\n </motion.button>\n )}\n </AnimatePresence>\n </div>\n )\n },\n)\nMessageList.displayName = 'MessageList'\n\nexport { MessageList }\n","'use client'\n\nimport { IconAlertCircle } from '@tabler/icons-react'\nimport as React from 'react'\n\nimport { Icon } from '../icon'\nimport { cn } from '../lib/utils'\n\nexport interface SystemMessageProps extends React.HTMLAttributes<HTMLDivElement> {\n icon?: React.ReactNode\n timestamp?: string\n variant?: 'event' \| 'alert'\n children: React.ReactNode\n}\n\nfunction formatTime(ts: string): string {\n return new Date(ts).toLocaleTimeString('en-US', {\n hour: 'numeric',\n minute: '2-digit',\n })\n}\n\nconst SystemMessage = React.forwardRef<HTMLDivElement, SystemMessageProps>(\n ({ icon, timestamp, variant = 'event', children, className, ...props }, ref) => {\n if (variant === 'alert') {\n return (\n <div\n ref={ref}\n role=\"alert\"\n className={cn('flex justify-center', className)}\n {...props}\n >\n <div className=\"flex items-center gap-ds-03 rounded-ds-lg bg-error-3 px-ds-04 py-ds-03\">\n {icon ?? <Icon icon={IconAlertCircle} size=\"sm\" />}\n <span className=\"text-ds-sm text-error-11\">{children}</span>\n {timestamp && (\n <span className=\"text-ds-sm text-error-11/60\">\n {formatTime(timestamp)}\n </span>\n )}\n </div>\n </div>\n )\n }\n\n // event variant (default)\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-center gap-ds-02 rounded-ds-sm bg-surface-raised-hover/30 px-ds-02 py-ds-01 -mx-ds-02 text-ds-sm text-surface-fg-subtle/60',\n className,\n )}\n {...props}\n >\n {icon}\n <span className=\"flex-1\">{children}</span>\n {timestamp && <span>{formatTime(timestamp)}</span>}\n </div>\n )\n },\n)\nSystemMessage.displayName = 'SystemMessage'\n\nexport { SystemMessage }\n","'use client'\n\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport interface TypingIndicatorProps {\n users: { name: string; image?: string }[]\n className?: string\n}\n\nfunction formatTypingText(users: { name: string }[]): string {\n if (users.length === 1) return `${users[0].name} is typing...`\n if (users.length === 2) return `${users[0].name} and ${users[1].name} are typing...`\n return 'Several people are typing...'\n}\n\nfunction TypingIndicator({ users, className }: TypingIndicatorProps) {\n return (\n <div className={cn('min-h-[24px] px-ds-05', className)} role=\"status\" aria-live=\"polite\">\n <AnimatePresence>\n {users.length > 0 && (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n className=\"flex items-center gap-ds-02 text-ds-xs text-surface-fg-subtle\"\n >\n <span className=\"flex items-center gap-ds-01\">\n {[0, 1, 2].map((i) => (\n <motion.span\n key={i}\n className=\"h-1 w-1 rounded-full bg-surface-fg-subtle\"\n animate={{ y: [0, -3, 0] }}\n transition={{\n duration: 0.5,\n repeat: Infinity,\n delay: i * 0.15,\n }}\n />\n ))}\n </span>\n <span>{formatTypingText(users)}</span>\n </motion.div>\n )}\n </AnimatePresence>\n </div>\n )\n}\nTypingIndicator.displayName = 'TypingIndicator'\n\nexport { TypingIndicator }\n","import * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport interface UnreadSeparatorProps {\n label?: string\n count?: number\n className?: string\n}\n\nfunction UnreadSeparator({\n label = 'NEW',\n count,\n className,\n}: UnreadSeparatorProps) {\n return (\n <div className={cn('relative flex items-center py-ds-02', className)}>\n <div className=\"flex-1 border-t-2 border-accent-7\" />\n <span className=\"px-ds-03 text-ds-xs font-semibold text-accent-11\">\n {count ? `${count} ${label}` : label}\n </span>\n <div className=\"flex-1 border-t-2 border-accent-7\" />\n </div>\n )\n}\nUnreadSeparator.displayName = 'UnreadSeparator'\n\nexport { UnreadSeparator }\n"],"mappings":"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"}
1	+ {"version":3,"file":"chat.js","names":[],"sources":["../../src/ui/chat/date-separator.tsx","../../src/ui/chat/message.tsx","../../src/ui/chat/message-input.tsx","../../src/ui/chat/message-list.tsx","../../src/ui/chat/system-message.tsx","../../src/ui/chat/typing-indicator.tsx","../../src/ui/chat/unread-separator.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport interface DateSeparatorProps {\n date: Date \| string\n format?: (date: Date) => string\n className?: string\n}\n\nfunction defaultFormat(date: Date): string {\n const now = new Date()\n const today = new Date(now.getFullYear(), now.getMonth(), now.getDate())\n const target = new Date(date.getFullYear(), date.getMonth(), date.getDate())\n const diffMs = today.getTime() - target.getTime()\n const diffDays = Math.round(diffMs / (1000 * 60 * 60 * 24))\n\n if (diffDays === 0) return 'Today'\n if (diffDays === 1) return 'Yesterday'\n\n const month = date.toLocaleString('en-US', { month: 'short' })\n const day = date.getDate()\n\n if (date.getFullYear() !== now.getFullYear()) {\n return `${month} ${day}, ${date.getFullYear()}`\n }\n\n return `${month} ${day}`\n}\n\nfunction DateSeparator({ date, format, className }: DateSeparatorProps) {\n const d = typeof date === 'string' ? new Date(date) : date\n const label = format ? format(d) : defaultFormat(d)\n\n return (\n <div className={cn('flex items-center gap-ds-03 py-ds-03', className)}>\n <div className=\"flex-1 border-t border-surface-border-subtle\" />\n <span className=\"text-ds-xs font-medium text-surface-fg-subtle/50 uppercase tracking-wider\">\n {label}\n </span>\n <div className=\"flex-1 border-t border-surface-border-subtle\" />\n </div>\n )\n}\nDateSeparator.displayName = 'DateSeparator'\n\nexport { DateSeparator }\n","'use client'\n\nimport { IconTrash } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Avatar, AvatarFallback,AvatarImage } from '../avatar'\nimport { Icon, type IconProps } from '../icon'\nimport { motionProps,springs } from '../lib/motion'\nimport { cn } from '../lib/utils'\nimport { Tooltip, TooltipContent,TooltipTrigger } from '../tooltip'\n\n// ── Context ──────────────────────────────────────────────────────────────\n\ninterface MessageContextValue {\n variant: 'flat' \| 'bubble'\n placement: 'start' \| 'end'\n grouped: boolean\n highlight?: 'mention' \| 'internal'\n}\n\nconst MessageContext = React.createContext<MessageContextValue>({\n variant: 'flat',\n placement: 'start',\n grouped: false,\n})\n\nfunction useMessageContext() {\n return React.useContext(MessageContext)\n}\n\n// ── Root ─────────────────────────────────────────────────────────────────\n\nexport interface MessageProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n variant?: 'flat' \| 'bubble'\n placement?: 'start' \| 'end'\n highlight?: 'mention' \| 'internal'\n grouped?: boolean\n deleted?: boolean\n deletedText?: string\n}\n\nconst MessageRoot = React.forwardRef<HTMLDivElement, MessageProps>(\n (\n {\n children,\n variant = 'flat',\n placement = 'start',\n highlight,\n grouped = false,\n deleted = false,\n deletedText = 'This message was deleted',\n className,\n ...props\n },\n ref,\n ) => {\n const ctx = React.useMemo<MessageContextValue>(\n () => ({ variant, placement, grouped, highlight }),\n [variant, placement, grouped, highlight],\n )\n\n if (deleted) {\n return (\n <motion.div\n ref={ref}\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={springs.snappy}\n className={cn(\n 'flex items-center gap-ds-02 py-ds-02 text-ds-xs text-surface-fg-subtle/50 italic',\n className,\n )}\n {...motionProps(props)}\n >\n <Icon icon={IconTrash} size=\"xs\" />\n {deletedText}\n </motion.div>\n )\n }\n\n if (variant === 'bubble') {\n return (\n <MessageContext.Provider value={ctx}>\n <motion.div\n ref={ref}\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={springs.snappy}\n className={cn(\n 'group/message relative flex',\n placement === 'end' ? 'justify-end' : 'justify-start',\n highlight === 'mention' && 'border-l-2 border-l-accent-9 bg-accent-2 pl-ds-03 rounded-control-inner',\n highlight === 'internal' && 'bg-warning-2/50 rounded-control-inner',\n className,\n )}\n {...motionProps(props)}\n >\n <div\n className={cn(\n 'max-w-[85%] rounded-bubble px-ds-04 py-ds-03',\n placement === 'end'\n ? 'bg-accent-3 text-surface-fg'\n : 'bg-surface-raised text-surface-fg',\n )}\n >\n {children}\n </div>\n </motion.div>\n </MessageContext.Provider>\n )\n }\n\n // flat variant (default)\n return (\n <MessageContext.Provider value={ctx}>\n <motion.div\n ref={ref}\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={springs.snappy}\n className={cn(\n 'group/message relative flex gap-ds-04',\n grouped && '-mt-ds-01',\n highlight === 'mention' && 'border-l-2 border-l-accent-9 bg-accent-2 pl-ds-03 rounded-control-inner',\n highlight === 'internal' && 'bg-warning-2/50 rounded-control-inner',\n className,\n )}\n {...motionProps(props)}\n >\n {children}\n </motion.div>\n </MessageContext.Provider>\n )\n },\n)\nMessageRoot.displayName = 'Message'\n\n// ── Avatar ───────────────────────────────────────────────────────────────\n\nexport interface MessageAvatarProps {\n src?: string \| null\n fallback?: string\n icon?: React.ReactNode\n size?: 'sm' \| 'md'\n children?: React.ReactNode\n}\n\nfunction MessageAvatar({\n src,\n fallback,\n icon,\n size = 'md',\n children,\n}: MessageAvatarProps) {\n const { grouped } = useMessageContext()\n\n const sizeClass = size === 'sm' ? 'w-5' : 'w-6'\n const heightClass = size === 'sm' ? 'h-5' : 'h-6'\n\n if (grouped) {\n return <div className={cn(sizeClass, heightClass, 'shrink-0')} />\n }\n\n if (children) {\n return (\n <div className={cn(sizeClass, 'shrink-0 flex items-start')}>\n {children}\n </div>\n )\n }\n\n if (icon) {\n return (\n <div\n className={cn(\n sizeClass,\n size === 'sm' ? 'h-5' : 'h-6',\n 'shrink-0 flex items-center justify-center rounded-pill bg-surface-raised-hover',\n )}\n >\n {icon}\n </div>\n )\n }\n\n return (\n <div className={cn(sizeClass, 'shrink-0')}>\n <Avatar size={size === 'sm' ? 'xs' : 'sm'}>\n {src && <AvatarImage src={src} alt={fallback ?? ''} />}\n <AvatarFallback>{fallback ?? ''}</AvatarFallback>\n </Avatar>\n </div>\n )\n}\nMessageAvatar.displayName = 'Message.Avatar'\n\n// ── Content ──────────────────────────────────────────────────────────────\n\nexport interface MessageContentProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n}\n\nfunction MessageContent({ children, className, ...props }: MessageContentProps) {\n return (\n <div className={cn('min-w-0 flex-1 flex flex-col gap-ds-02', className)} {...props}>\n {children}\n </div>\n )\n}\nMessageContent.displayName = 'Message.Content'\n\n// ── Author ───────────────────────────────────────────────────────────────\n\nexport interface MessageAuthorProps {\n name: string\n badge?: React.ReactNode\n timestamp?: Date\n formattedTimestamp?: string\n timestampFormat?: (date: Date) => string\n}\n\nfunction defaultTimestampFormat(date: Date): string {\n return date.toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' })\n}\n\nfunction MessageAuthor({\n name,\n badge,\n timestamp,\n formattedTimestamp,\n timestampFormat = defaultTimestampFormat,\n}: MessageAuthorProps) {\n const { grouped } = useMessageContext()\n\n if (grouped) return null\n\n const timeStr = formattedTimestamp\n ?? (timestamp ? timestampFormat(timestamp) : undefined)\n\n return (\n <div className=\"flex items-baseline gap-ds-02\">\n <span className=\"font-semibold text-[13px] text-surface-fg\">{name}</span>\n {badge}\n {timeStr && (\n <span className=\"text-[11px] text-surface-fg-subtle/50\">{timeStr}</span>\n )}\n </div>\n )\n}\nMessageAuthor.displayName = 'Message.Author'\n\n// ── Body ─────────────────────────────────────────────────────────────────\n\nexport interface MessageBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n}\n\nfunction MessageBody({ children, className, ...props }: MessageBodyProps) {\n return (\n <div\n className={cn(\n 'text-[13px] leading-relaxed text-surface-fg whitespace-pre-wrap',\n className,\n )}\n {...props}\n >\n {children}\n </div>\n )\n}\nMessageBody.displayName = 'Message.Body'\n\n// ── EditableBody ─────────────────────────────────────────────────────────\n\nexport interface MessageEditableBodyProps {\n content: string\n onSave: (newContent: string) => void\n onCancel?: () => void\n canEdit?: boolean\n renderContent?: (content: string) => React.ReactNode\n}\n\nfunction MessageEditableBody({\n content,\n onSave,\n onCancel,\n canEdit = false,\n renderContent,\n}: MessageEditableBodyProps) {\n const [isEditing, setIsEditing] = React.useState(false)\n const [editDraft, setEditDraft] = React.useState(content)\n const textareaRef = React.useRef<HTMLTextAreaElement>(null)\n\n React.useEffect(() => {\n if (isEditing && textareaRef.current) {\n textareaRef.current.focus()\n textareaRef.current.select()\n }\n }, [isEditing])\n\n const handleStartEdit = React.useCallback(() => {\n if (!canEdit) return\n setEditDraft(content)\n setIsEditing(true)\n }, [canEdit, content])\n\n const handleSave = React.useCallback(() => {\n const trimmed = editDraft.trim()\n if (trimmed && trimmed !== content) {\n onSave(trimmed)\n }\n setIsEditing(false)\n }, [editDraft, content, onSave])\n\n const handleCancel = React.useCallback(() => {\n setIsEditing(false)\n setEditDraft(content)\n onCancel?.()\n }, [content, onCancel])\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault()\n handleSave()\n } else if (e.key === 'Escape') {\n e.preventDefault()\n handleCancel()\n }\n },\n [handleSave, handleCancel],\n )\n\n if (isEditing) {\n return (\n <div className=\"text-[13px] leading-relaxed\">\n <textarea\n ref={textareaRef}\n value={editDraft}\n onChange={(e) => setEditDraft(e.target.value)}\n onKeyDown={handleKeyDown}\n onBlur={handleSave}\n className=\"w-full resize-none rounded-control-inner border border-surface-border-strong bg-surface-raised-hover px-ds-02 py-ds-01 text-[13px] leading-relaxed text-surface-fg focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9\"\n rows={2}\n />\n <div className=\"mt-ds-01 text-ds-xs text-surface-fg-subtle/50\">\n Enter to save · Escape to cancel\n </div>\n </div>\n )\n }\n\n return (\n <div\n className={cn(\n 'text-[13px] leading-relaxed text-surface-fg whitespace-pre-wrap',\n canEdit && 'cursor-pointer hover:bg-surface-raised-hover rounded-control-inner transition-colors',\n )}\n onClick={handleStartEdit}\n role={canEdit ? 'button' : undefined}\n tabIndex={canEdit ? 0 : undefined}\n onKeyDown={\n canEdit\n ? (e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault()\n handleStartEdit()\n }\n }\n : undefined\n }\n >\n {renderContent ? renderContent(content) : content}\n </div>\n )\n}\nMessageEditableBody.displayName = 'Message.EditableBody'\n\n// ── Reactions ────────────────────────────────────────────────────────────\n\nexport interface MessageReactionsProps {\n reactions: { emoji: string; count: number; reacted: boolean }[]\n onReact: (emoji: string) => void\n}\n\nfunction MessageReactions({ reactions, onReact }: MessageReactionsProps) {\n if (reactions.length === 0) return null\n\n return (\n <div className=\"flex flex-wrap gap-ds-02 mt-ds-03\">\n {reactions.map((r) => (\n <button\n key={r.emoji}\n type=\"button\"\n onClick={() => onReact(r.emoji)}\n aria-label={`${r.emoji} ${r.count} reaction${r.count !== 1 ? 's' : ''}${r.reacted ? ', you reacted' : ''}`}\n className={cn(\n 'inline-flex items-center gap-ds-01 rounded-pill px-ds-02 py-ds-01 text-ds-xs transition-colors',\n r.reacted\n ? 'bg-accent-3 ring-1 ring-accent-6'\n : 'bg-surface-raised-hover hover:bg-surface-raised-active',\n )}\n >\n <span>{r.emoji}</span>\n <span>{r.count}</span>\n </button>\n ))}\n </div>\n )\n}\nMessageReactions.displayName = 'Message.Reactions'\n\n// ── Actions (floating toolbar) ───────────────────────────────────────────\n\nexport interface MessageActionsProps {\n children: React.ReactNode\n delay?: number\n}\n\nfunction MessageActions({ children, delay = 100 }: MessageActionsProps) {\n return (\n <div\n className={cn(\n 'absolute -top-2 right-0 z-10',\n 'flex items-center gap-ds-01 rounded-control border border-surface-border bg-surface-raised px-ds-01 py-ds-01 shadow-raised',\n 'opacity-0 group-hover/message:opacity-100 group-focus-within/message:opacity-100 transition-opacity duration-150',\n )}\n style={{ transitionDelay: `${delay}ms` }}\n >\n {children}\n </div>\n )\n}\nMessageActions.displayName = 'Message.Actions'\n\n// ── Action (single icon button) ──────────────────────────────────────────\n\nexport interface MessageActionProps {\n icon: IconProps['icon']\n label: string\n onClick: () => void\n variant?: 'default' \| 'danger'\n}\n\nfunction MessageAction({\n icon,\n label,\n onClick,\n variant = 'default',\n}: MessageActionProps) {\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={label}\n className={cn(\n 'p-ds-02 rounded-control-inner transition-colors',\n variant === 'default' &&\n 'text-surface-fg-subtle hover:text-surface-fg hover:bg-surface-raised-hover',\n variant === 'danger' &&\n 'text-surface-fg-subtle hover:text-error-11 hover:bg-surface-raised-hover',\n )}\n >\n <Icon icon={icon} size=\"xs\" />\n </button>\n </TooltipTrigger>\n <TooltipContent>{label}</TooltipContent>\n </Tooltip>\n )\n}\nMessageAction.displayName = 'Message.Action'\n\n// ── Compound Export ──────────────────────────────────────────────────────\n\nexport const Message = Object.assign(MessageRoot, {\n Avatar: MessageAvatar,\n Content: MessageContent,\n Author: MessageAuthor,\n Body: MessageBody,\n EditableBody: MessageEditableBody,\n Reactions: MessageReactions,\n Actions: MessageActions,\n Action: MessageAction,\n})\n\nexport {\n type MessageContextValue,\n useMessageContext,\n}\n","'use client'\n\nimport { IconSend, IconSquare } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Button } from '../button'\nimport { Icon } from '../icon'\nimport { cn } from '../lib/utils'\n\nexport interface MessageInputProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSubmit'> {\n onSubmit: (text: string) => void\n placeholder?: string\n disabled?: boolean\n isStreaming?: boolean\n onCancel?: () => void\n leadingSlot?: React.ReactNode\n trailingSlot?: React.ReactNode\n disclaimer?: string\n sendIcon?: React.ReactNode\n}\n\nconst MessageInput = React.forwardRef<HTMLDivElement, MessageInputProps>(\n (\n {\n onSubmit,\n placeholder = 'Type a message...',\n disabled = false,\n isStreaming = false,\n onCancel,\n leadingSlot,\n trailingSlot,\n disclaimer,\n sendIcon,\n className,\n ...props\n },\n ref,\n ) => {\n const [text, setText] = React.useState('')\n const textareaRef = React.useRef<HTMLTextAreaElement>(null)\n\n const resize = React.useCallback(() => {\n const el = textareaRef.current\n if (!el) return\n el.style.height = 'auto'\n el.style.height = `${Math.min(el.scrollHeight, 160)}px`\n }, [])\n\n const handleChange = React.useCallback(\n (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setText(e.target.value)\n resize()\n },\n [resize],\n )\n\n const handleSend = React.useCallback(() => {\n const trimmed = text.trim()\n if (!trimmed \|\| isStreaming) return\n onSubmit(trimmed)\n setText('')\n // Reset height after clearing\n if (textareaRef.current) {\n textareaRef.current.style.height = 'auto'\n }\n }, [text, isStreaming, onSubmit])\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault()\n if (!isStreaming) {\n handleSend()\n }\n }\n },\n [isStreaming, handleSend],\n )\n\n const isEmpty = text.trim().length === 0\n\n return (\n <div\n ref={ref}\n className={cn(\n 'border-t border-surface-border-subtle px-ds-05 py-ds-04',\n className,\n )}\n {...props}\n >\n <div className=\"flex items-end gap-ds-02 rounded-overlay-lg border border-surface-border bg-surface-base p-ds-03\">\n {leadingSlot}\n <textarea\n ref={textareaRef}\n value={text}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n aria-label={placeholder \|\| 'Type a message'}\n disabled={disabled}\n rows={1}\n className=\"flex-1 resize-none bg-transparent px-ds-02 py-ds-01 text-ds-sm text-surface-fg placeholder:text-surface-fg-subtle/50 focus:outline-hidden disabled:opacity-50\"\n style={{ maxHeight: 160 }}\n />\n {isStreaming ? (\n <Button\n variant=\"ghost\"\n size=\"icon-sm\"\n color=\"error\"\n onClick={onCancel}\n aria-label=\"Stop\"\n >\n <Icon icon={IconSquare} size=\"sm\" />\n </Button>\n ) : (\n <Button\n variant=\"ghost\"\n size=\"icon-sm\"\n onClick={handleSend}\n disabled={isEmpty \|\| disabled}\n aria-label=\"Send\"\n >\n {sendIcon ?? <Icon icon={IconSend} size=\"sm\" />}\n </Button>\n )}\n {trailingSlot}\n </div>\n {disclaimer && (\n <p className=\"mt-ds-02 text-center text-ds-xs text-surface-fg-subtle/50\">\n {disclaimer}\n </p>\n )}\n </div>\n )\n },\n)\nMessageInput.displayName = 'MessageInput'\n\nexport { MessageInput }\n","'use client'\n\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { tweens } from '../lib/motion'\nimport { cn } from '../lib/utils'\nimport { Spinner } from '../spinner'\n\nexport interface MessageListProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode\n /** Auto-scroll to bottom when new content arrives (default true) /\n autoScroll?: boolean\n /* Number of new messages to show in the floating pill /\n newMessageCount?: number\n /* Called when user clicks the \"N new\" pill /\n onScrollToBottom?: () => void\n /* Called when user scrolls near the top — triggers load-more /\n onLoadMore?: () => void\n /* Whether more messages are currently being loaded /\n loadingMore?: boolean\n /* Content to render when there are no children /\n emptySlot?: React.ReactNode\n /* Custom scroll-to-bottom button (unused slot for future override) /\n scrollToBottomSlot?: React.ReactNode\n /* Content rendered above the scroll container (e.g. channel name) /\n headerSlot?: React.ReactNode\n}\n\nconst MessageList = React.forwardRef<HTMLDivElement, MessageListProps>(\n (\n {\n children,\n autoScroll = true,\n newMessageCount = 0,\n onScrollToBottom,\n onLoadMore,\n loadingMore = false,\n emptySlot,\n scrollToBottomSlot,\n headerSlot,\n className,\n ...props\n },\n ref,\n ) => {\n const scrollRef = React.useRef<HTMLDivElement>(null)\n const isAtBottomRef = React.useRef(true)\n const [isAtBottom, setIsAtBottom] = React.useState(true)\n const loadingMoreRef = React.useRef(false)\n const prevScrollHeightRef = React.useRef(0)\n\n const isEmpty = React.Children.count(children) === 0 && !loadingMore\n\n // ── Scroll handler ────────────────────────────────────────────\n const handleScroll = React.useCallback(() => {\n const el = scrollRef.current\n if (!el) return\n\n const atBottom = el.scrollHeight - el.scrollTop - el.clientHeight < 40\n isAtBottomRef.current = atBottom\n setIsAtBottom(atBottom)\n\n // Load more when near top\n if (el.scrollTop < 100 && onLoadMore && !loadingMoreRef.current) {\n loadingMoreRef.current = true\n prevScrollHeightRef.current = el.scrollHeight\n onLoadMore()\n }\n }, [onLoadMore])\n\n // ── Auto-scroll to bottom when children change ────────────────\n React.useLayoutEffect(() => {\n const el = scrollRef.current\n if (!el) return\n\n // Scroll preservation after load-more\n if (loadingMoreRef.current) {\n const newScrollHeight = el.scrollHeight\n el.scrollTop = newScrollHeight - prevScrollHeightRef.current\n loadingMoreRef.current = false\n return\n }\n\n // Auto-scroll if user was at bottom\n if (autoScroll && isAtBottomRef.current) {\n el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' })\n }\n }, [children, autoScroll])\n\n // ── Reset loading flag when loadingMore goes false ──────────\n React.useEffect(() => {\n if (!loadingMore) {\n loadingMoreRef.current = false\n }\n }, [loadingMore])\n\n // ── \"N new\" pill visibility ───────────────────────────────────\n const showNewPill = newMessageCount > 0 && !isAtBottom\n\n const handleScrollToBottom = React.useCallback(() => {\n const el = scrollRef.current\n if (el) {\n el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' })\n }\n onScrollToBottom?.()\n }, [onScrollToBottom])\n\n return (\n <div\n ref={ref}\n className={cn('relative flex flex-1 flex-col overflow-hidden', className)}\n {...props}\n >\n {headerSlot}\n <div\n ref={scrollRef}\n role=\"log\"\n aria-live=\"polite\"\n aria-relevant=\"additions\"\n className=\"flex-1 overflow-y-auto px-ds-05 py-ds-04\"\n style={{\n scrollbarWidth: 'thin',\n scrollbarColor: 'var(--color-surface-border) transparent',\n }}\n onScroll={handleScroll}\n >\n {loadingMore && (\n <div className=\"flex justify-center py-ds-03\">\n <Spinner size=\"sm\" />\n </div>\n )}\n {isEmpty ? (\n emptySlot\n ) : (\n <div className=\"flex flex-col gap-ds-04\">\n <AnimatePresence initial={false}>{children}</AnimatePresence>\n </div>\n )}\n </div>\n\n {/ \"N new\" floating pill /}\n <AnimatePresence>\n {showNewPill && (\n <motion.button\n initial={{ opacity: 0, y: 10 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 10 }}\n transition={tweens.fade}\n onClick={handleScrollToBottom}\n className=\"absolute bottom-ds-04 left-1/2 z-10 -translate-x-1/2 rounded-pill bg-accent-9 px-ds-04 py-ds-02 text-ds-xs font-medium text-accent-fg shadow-raised transition-colors hover:bg-accent-10\"\n >\n {newMessageCount} new\n </motion.button>\n )}\n </AnimatePresence>\n </div>\n )\n },\n)\nMessageList.displayName = 'MessageList'\n\nexport { MessageList }\n","'use client'\n\nimport { IconAlertCircle } from '@tabler/icons-react'\nimport as React from 'react'\n\nimport { Icon } from '../icon'\nimport { cn } from '../lib/utils'\n\nexport interface SystemMessageProps extends React.HTMLAttributes<HTMLDivElement> {\n icon?: React.ReactNode\n timestamp?: string\n variant?: 'event' \| 'alert'\n children: React.ReactNode\n}\n\nfunction formatTime(ts: string): string {\n return new Date(ts).toLocaleTimeString('en-US', {\n hour: 'numeric',\n minute: '2-digit',\n })\n}\n\nconst SystemMessage = React.forwardRef<HTMLDivElement, SystemMessageProps>(\n ({ icon, timestamp, variant = 'event', children, className, ...props }, ref) => {\n if (variant === 'alert') {\n return (\n <div\n ref={ref}\n role=\"alert\"\n className={cn('flex justify-center', className)}\n {...props}\n >\n <div className=\"flex items-center gap-ds-03 rounded-surface bg-error-3 px-ds-04 py-ds-03\">\n {icon ?? <Icon icon={IconAlertCircle} size=\"sm\" />}\n <span className=\"text-ds-sm text-error-11\">{children}</span>\n {timestamp && (\n <span className=\"text-ds-sm text-error-11/60\">\n {formatTime(timestamp)}\n </span>\n )}\n </div>\n </div>\n )\n }\n\n // event variant (default)\n return (\n <div\n ref={ref}\n className={cn(\n 'flex items-center gap-ds-02 rounded-control-inner bg-surface-raised-hover/30 px-ds-02 py-ds-01 -mx-ds-02 text-ds-sm text-surface-fg-subtle/60',\n className,\n )}\n {...props}\n >\n {icon}\n <span className=\"flex-1\">{children}</span>\n {timestamp && <span>{formatTime(timestamp)}</span>}\n </div>\n )\n },\n)\nSystemMessage.displayName = 'SystemMessage'\n\nexport { SystemMessage }\n","'use client'\n\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport interface TypingIndicatorProps {\n users: { name: string; image?: string }[]\n className?: string\n}\n\nfunction formatTypingText(users: { name: string }[]): string {\n if (users.length === 1) return `${users[0].name} is typing...`\n if (users.length === 2) return `${users[0].name} and ${users[1].name} are typing...`\n return 'Several people are typing...'\n}\n\nfunction TypingIndicator({ users, className }: TypingIndicatorProps) {\n return (\n <div className={cn('min-h-[24px] px-ds-05', className)} role=\"status\" aria-live=\"polite\">\n <AnimatePresence>\n {users.length > 0 && (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n className=\"flex items-center gap-ds-02 text-ds-xs text-surface-fg-subtle\"\n >\n <span className=\"flex items-center gap-ds-01\">\n {[0, 1, 2].map((i) => (\n <motion.span\n key={i}\n className=\"h-1 w-1 rounded-pill bg-surface-fg-subtle\"\n animate={{ y: [0, -3, 0] }}\n transition={{\n duration: 0.5,\n repeat: Infinity,\n delay: i * 0.15,\n }}\n />\n ))}\n </span>\n <span>{formatTypingText(users)}</span>\n </motion.div>\n )}\n </AnimatePresence>\n </div>\n )\n}\nTypingIndicator.displayName = 'TypingIndicator'\n\nexport { TypingIndicator }\n","import * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport interface UnreadSeparatorProps {\n label?: string\n count?: number\n className?: string\n}\n\nfunction UnreadSeparator({\n label = 'NEW',\n count,\n className,\n}: UnreadSeparatorProps) {\n return (\n <div className={cn('relative flex items-center py-ds-02', className)}>\n <div className=\"flex-1 border-t-2 border-accent-7\" />\n <span className=\"px-ds-03 text-ds-xs font-semibold text-accent-11\">\n {count ? `${count} ${label}` : label}\n </span>\n <div className=\"flex-1 border-t-2 border-accent-7\" />\n </div>\n )\n}\nUnreadSeparator.displayName = 'UnreadSeparator'\n\nexport { UnreadSeparator }\n"],"mappings":"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"}