{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "memory-chips",
  "title": "Memory Chips",
  "description": "What the assistant remembers, as removable chips.",
  "dependencies": [
    "lucide-react"
  ],
  "files": [
    {
      "path": "components/spectrumui/blocks/ai-assistants/memory-chips.tsx",
      "content": "'use client';\n\nimport { useState } from 'react';\nimport { Brain, Plus, X } from 'lucide-react';\nimport { cn } from '@/lib/utils';\n\nconst KEYFRAMES = `\n@keyframes su-msg-in { from { opacity: 0; transform: translateY(4px) } to { opacity: 1; transform: none } }\n`;\n\nexport interface MemoryItem {\n  id: string;\n  fact: string;\n}\n\nexport type MemoryChipsVariant = 'Panel' | 'Row';\n\nexport interface MemoryChipsProps {\n  memories: MemoryItem[];\n  title?: string;\n  onRemove?: (id: string) => void;\n  onAdd?: () => void;\n  variant?: MemoryChipsVariant;\n  className?: string;\n}\n\nexport function MemoryChips({\n  memories: memoriesProp,\n  title = 'Assistant memory',\n  onRemove,\n  onAdd,\n  variant = 'Panel',\n  className,\n}: MemoryChipsProps) {\n  const [removed, setRemoved] = useState<Set<string>>(new Set());\n  const memories = memoriesProp.filter((memory) => !removed.has(memory.id));\n\n  function remove(id: string) {\n    setRemoved((previous) => new Set(previous).add(id));\n    onRemove?.(id);\n  }\n\n  const chips = (\n    <ul className=\"flex flex-wrap gap-1.5\">\n      {memories.map((memory, index) => (\n        <li\n          key={memory.id}\n          className=\"motion-safe:animate-[su-msg-in_240ms_cubic-bezier(0.23,1,0.32,1)_both]\"\n          style={{ animationDelay: `${Math.min(index, 5) * 40}ms` }}\n        >\n          <span className=\"flex items-center gap-1.5 rounded-full border border-black/[0.08] bg-white py-1 pl-2.5 pr-1 text-[12px] text-neutral-700 dark:border-white/[0.1] dark:bg-white/[0.03] dark:text-neutral-300\">\n            {memory.fact}\n            <button\n              type=\"button\"\n              aria-label={`Forget: ${memory.fact}`}\n              onClick={() => remove(memory.id)}\n              className=\"grid size-4 place-items-center rounded-full text-neutral-400 transition-[color,background-color,transform] duration-150 hover:bg-black/[0.06] hover:text-neutral-700 active:scale-[0.85] focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-neutral-400 dark:hover:bg-white/[0.1] dark:hover:text-neutral-200\"\n            >\n              <X className=\"size-2.5\" />\n            </button>\n          </span>\n        </li>\n      ))}\n      {onAdd && (\n        <li>\n          <button\n            type=\"button\"\n            onClick={onAdd}\n            className=\"flex items-center gap-1 rounded-full border border-dashed border-black/[0.14] px-2.5 py-1 text-[12px] text-neutral-400 transition-[color,border-color,transform] duration-150 hover:border-black/[0.24] hover:text-neutral-700 active:scale-[0.96] focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-neutral-400 dark:border-white/[0.16] dark:text-neutral-500 dark:hover:border-white/[0.28] dark:hover:text-neutral-300\"\n          >\n            <Plus className=\"size-3\" />\n            Add\n          </button>\n        </li>\n      )}\n    </ul>\n  );\n\n  if (variant === 'Row') {\n    return (\n      <div className={cn('w-full max-w-[500px]', className)}>\n        <style dangerouslySetInnerHTML={{ __html: KEYFRAMES }} />\n        {chips}\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className={cn(\n        'w-full max-w-[440px] rounded-2xl border border-black/[0.08] bg-white p-4 shadow-xs dark:border-white/[0.09] dark:bg-[#0B0B0D]',\n        className,\n      )}\n    >\n      <style dangerouslySetInnerHTML={{ __html: KEYFRAMES }} />\n      <div className=\"mb-3 flex items-center justify-between gap-3\">\n        <span className=\"flex items-center gap-2\">\n          <Brain className=\"size-3.5 text-neutral-400 dark:text-neutral-500\" />\n          <h3 className=\"text-[13px] font-semibold tracking-[-0.1px] text-neutral-900 dark:text-neutral-50\">\n            {title}\n          </h3>\n        </span>\n        <span className=\"font-mono text-[10.5px] tabular-nums text-neutral-400 dark:text-neutral-600\">\n          {memories.length} saved\n        </span>\n      </div>\n      {memories.length > 0 ? (\n        chips\n      ) : (\n        <p className=\"py-2 text-[12.5px] text-neutral-400 dark:text-neutral-500\">\n          Nothing saved yet — the assistant remembers facts you confirm.\n        </p>\n      )}\n    </div>\n  );\n}\n\nexport default MemoryChips;\n",
      "type": "registry:block",
      "target": "components/spectrumui/blocks/ai-assistants/memory-chips.tsx"
    }
  ],
  "type": "registry:block"
}