{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "demo-primitives-effects-theme-toggler",
  "title": "Theme Toggler Demo",
  "description": "Demo showing a theme toggler.",
  "registryDependencies": [
    "@odysseyui/primitives-effects-theme-toggler"
  ],
  "files": [
    {
      "path": "registry/demo/primitives/effects/theme-toggler/index.tsx",
      "content": "import React from 'react';\nimport { useTheme } from 'next-themes';\nimport { Monitor, Moon, Sun } from 'lucide-react';\n\nimport {\n  ThemeToggler,\n  type ThemeSelection,\n  type Resolved,\n  type Direction,\n} from '@/components/odyssey/primitives/effects/theme-toggler';\n\ninterface ThemeTogglerDemoProps {\n  direction: Direction;\n}\n\nexport const ThemeTogglerDemo = ({ direction }: ThemeTogglerDemoProps) => {\n  const { theme, resolvedTheme, setTheme } = useTheme();\n\n  return (\n    <ThemeToggler\n      theme={theme as ThemeSelection}\n      resolvedTheme={resolvedTheme as Resolved}\n      setTheme={setTheme}\n      direction={direction}\n    >\n      {({ effective, toggleTheme }) => {\n        const nextTheme =\n          effective === 'dark'\n            ? 'light'\n            : effective === 'system'\n              ? 'dark'\n              : 'system';\n\n        return (\n          <button onClick={() => toggleTheme(nextTheme)}>\n            {effective === 'system' ? (\n              <Monitor />\n            ) : effective === 'dark' ? (\n              <Moon />\n            ) : (\n              <Sun />\n            )}\n          </button>\n        );\n      }}\n    </ThemeToggler>\n  );\n};\n",
      "type": "registry:ui",
      "target": "components/odysseyui/demo/primitives/effects/theme-toggler.tsx"
    }
  ],
  "meta": {
    "demoProps": {
      "ThemeToggler": {
        "direction": {
          "value": "ltr",
          "options": {
            "btt": "btt",
            "ttb": "ttb",
            "ltr": "ltr",
            "rtl": "rtl"
          }
        }
      }
    }
  },
  "type": "registry:ui"
}