"use client";

import { createContext, useContext, type ReactNode } from "react";
import type { TopoSectionTone } from "@/content/topo-patterns";

const TopoSectionContext = createContext<TopoSectionTone>("light");

export function TopoSectionProvider({
  tone,
  children,
}: {
  tone: TopoSectionTone;
  children: ReactNode;
}) {
  return (
    <TopoSectionContext.Provider value={tone}>{children}</TopoSectionContext.Provider>
  );
}

export function useTopoSectionTone(): TopoSectionTone {
  return useContext(TopoSectionContext);
}