import React from "@rbxts/react";
import { PrismContext, PrismContextValue } from "./prism-context";
import { ChromaProvider, DefaultPalettes } from "@rbxts/chroma";
import { createConfig, DEFAULT_PRISM_CONFIG, PrismConfig } from "./config";
interface PrismProviderProps {
theme: keyof typeof DefaultPalettes;
config?: Partial<PrismConfig>;
children: React.ReactNode;
}
export const PrismProvider = ({ children, theme, config }: PrismProviderProps) => {
// React.useEffect(() => {
// setCurrentTheme(initialTheme);
// }, [initialTheme, theme]);
return (
<ChromaProvider theme={DefaultPalettes} currentTheme={theme}>
<PrismContext.Provider
value={{ config: config ? createConfig(DEFAULT_PRISM_CONFIG, config) : DEFAULT_PRISM_CONFIG }}
>
{children}
</PrismContext.Provider>
</ChromaProvider>
);
};
export function usePrism() {
const context = React.useContext(PrismContext) as PrismContextValue | undefined;
if (context === undefined) error("useChroma must be used within a PrismaProvider!");
return context;
}
import React from "@rbxts/react";
import { PrismContext, PrismContextValue } from "./prism-context";
import { ChromaProvider, DefaultPalettes } from "@rbxts/chroma";
import { createConfig, DEFAULT_PRISM_CONFIG, PrismConfig } from "./config";
interface PrismProviderProps {
theme: keyof typeof DefaultPalettes;
config?: Partial<PrismConfig>;
children: React.ReactNode;
}
export const PrismProvider = ({ children, theme, config }: PrismProviderProps) => {
// React.useEffect(() => {
// setCurrentTheme(initialTheme);
// }, [initialTheme, theme]);
return (
<ChromaProvider theme={DefaultPalettes} currentTheme={theme}>
<PrismContext.Provider
value={{ config: config ? createConfig(DEFAULT_PRISM_CONFIG, config) : DEFAULT_PRISM_CONFIG }}
>
{children}
</PrismContext.Provider>
</ChromaProvider>
);
};
export function usePrism() {
const context = React.useContext(PrismContext) as PrismContextValue | undefined;
if (context === undefined) error("useChroma must be used within a PrismaProvider!");
return context;
}