Theme Provider Component

A theme provider component that wraps next-themes for theme management.

Theme Provider wraps your app for theme support.

Installation

pnpm dlx shadcn@latest add https://ui.vllnt.com/r/theme-provider.json

bash

Usage

import { ThemeProvider } from '@vllnt/ui'

export function ThemeProviderExample() {
return (
  <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
    <div>Your app content</div>
  </ThemeProvider>
)
}

tsx

Code

"use client";

import {
  ThemeProvider as NextThemesProvider,
  type ThemeProviderProps,
} from "next-themes";

export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
  return <NextThemesProvider {...props}>{children}</NextThemesProvider>;
}

typescript