{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"memory-suggestion","type":"registry:ui","title":"Memory Suggestion","description":"The prompt an assistant shows before saving something about you — the fact it noticed, and your choice to keep or dismiss it.","author":"Scrim UI (https://scrimui.dev)","categories":["memory"],"docs":"https://scrimui.dev/components/memory-suggestion","dependencies":[],"registryDependencies":[],"files":[{"path":"src/showcase/memory-suggestion/memory-suggestion.tsx","content":"\"use client\";\n\nimport * as React from \"react\";\n\n/* ------------------------------------------------------------------ */\n/* Types                                                               */\n/* ------------------------------------------------------------------ */\n\nexport type MemorySuggestionProps = {\n  fact: string;\n  saved?: boolean;\n  onSave?: () => void;\n  onDismiss?: () => void;\n  onUndo?: () => void;\n  className?: string;\n};\n\n/* ------------------------------------------------------------------ */\n/* Icons                                                               */\n/* ------------------------------------------------------------------ */\n\nfunction SparkleIcon(props: React.SVGProps<SVGSVGElement>) {\n  return (\n    <svg\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      width=\"14\"\n      height=\"14\"\n      {...props}\n    >\n      <path d=\"M12 3l1.9 5.8a2 2 0 0 0 1.3 1.3L21 12l-5.8 1.9a2 2 0 0 0-1.3 1.3L12 21l-1.9-5.8a2 2 0 0 0-1.3-1.3L3 12l5.8-1.9a2 2 0 0 0 1.3-1.3z\" />\n    </svg>\n  );\n}\n\nfunction CheckIcon(props: React.SVGProps<SVGSVGElement>) {\n  return (\n    <svg\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      width=\"12\"\n      height=\"12\"\n      {...props}\n    >\n      <path d=\"M20 6 9 17l-5-5\" />\n    </svg>\n  );\n}\n\n/* ------------------------------------------------------------------ */\n/* MemorySuggestion                                                    */\n/* ------------------------------------------------------------------ */\n\nexport function MemorySuggestion({\n  fact,\n  saved = false,\n  onSave,\n  onDismiss,\n  onUndo,\n  className = \"\",\n}: MemorySuggestionProps) {\n  if (saved) {\n    return (\n      <div\n        className={`flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 dark:border-emerald-900/50 dark:bg-emerald-900/20 ${className}`}\n      >\n        <span className=\"flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-emerald-500 text-white\">\n          <CheckIcon />\n        </span>\n        <p className=\"min-w-0 flex-1 text-[13px] font-medium text-emerald-800 dark:text-emerald-300\">\n          Saved to memory\n        </p>\n        {onUndo && (\n          <button\n            type=\"button\"\n            onClick={onUndo}\n            className=\"shrink-0 text-xs font-medium text-emerald-700 hover:underline dark:text-emerald-300\"\n          >\n            Undo\n          </button>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className={`flex items-start gap-3 rounded-xl border border-zinc-200 bg-white p-4 dark:border-zinc-800 dark:bg-zinc-900 ${className}`}\n    >\n      <span className=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-violet-100 text-violet-600 dark:bg-violet-900/40 dark:text-violet-400\">\n        <SparkleIcon />\n      </span>\n\n      <div className=\"min-w-0 flex-1\">\n        <p className=\"text-[13px] leading-5 text-zinc-600 dark:text-zinc-400\">\n          Want me to remember this?{\" \"}\n          <span className=\"font-medium text-zinc-900 dark:text-zinc-100\">“{fact}”</span>\n        </p>\n        <div className=\"mt-2.5 flex items-center gap-2\">\n          <button\n            type=\"button\"\n            onClick={onSave}\n            className=\"inline-flex h-8 items-center gap-1.5 rounded-lg bg-violet-600 px-3 text-xs font-medium text-white transition-opacity hover:opacity-90\"\n          >\n            <CheckIcon />\n            Save to memory\n          </button>\n          {onDismiss && (\n            <button\n              type=\"button\"\n              onClick={onDismiss}\n              className=\"inline-flex h-8 items-center rounded-lg border border-zinc-200 px-3 text-xs font-medium text-zinc-600 transition-colors hover:bg-zinc-100 dark:border-zinc-700 dark:text-zinc-300 dark:hover:bg-zinc-800\"\n            >\n              Not now\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n","type":"registry:ui","target":"components/ui/memory-suggestion.tsx"}]}