import { createContext, use } from 'react';

export type NavMenuContextValue = {
  activeId: string | null;
  openedIds: string[];
  hiddenItemCount: number;
  mode: 'horizontal' | 'vertical' | 'inline';
  textColor: string;
  activeTextColor: string;
  bgColor: string;
  activate: (id: string) => void;
  open: (id: string) => void;
  close: (id: string) => void;
};

const NavMenuContext = createContext<NavMenuContextValue | null>(null);

export function NavMenuProvider({ value, children }: { value: NavMenuContextValue; children: React.ReactNode }) {
  return <NavMenuContext value={value}>{children}</NavMenuContext>;
}

export function useNavMenuContext() {
  const context = use(NavMenuContext);

  if (!context) {
    throw new Error('NavMenuContext is not found');
  }

  return context;
}
