useModeController

Verwenden Sie diesen Hook, um den aktuellen Themenmodus (light, dark oder system) abzurufen und zu steuern.

Hinweis

Bitte beachten Sie, dass Sie diesen Hook nur innerhalb einer Komponente verwenden können, die ein Kind der FireCMS-Komponente ist.

Props

{
    mode: "light" | "dark";
    setMode: (mode: "light" | "dark") => void;
}

Beispiel

import React from "react";
import { useModeController } from "@firecms/core";
import { Button } from "@firecms/ui";

export function ThemeToggle() {
    const modeController = useModeController();

    const toggleMode = () => {
        modeController.setMode(modeController.mode === "light" ? "dark" : "light");
    };

    return (
        <Button onClick={toggleMode}>
            Aktueller Modus: {modeController.mode}
        </Button>
    );
}