import type { Accessor } from "solid-js";
import { createContext, useContext } from "solid-js";

/** Context shared between all Tabs parts. */
export interface TabsContextValue {
  activeTab: Accessor<string | undefined>;
  setActiveTab: (value: string) => void;
  baseId: string;
  orientation: Accessor<"horizontal" | "vertical">;
  activationMode: Accessor<"automatic" | "manual">;
}

const TabsContext = createContext<TabsContextValue>();

/**
 * Returns the Tabs context. Throws if used outside <Tabs>.
 */
export function useTabsContext(): TabsContextValue {
  const ctx = useContext(TabsContext);
  if (!ctx) {
    throw new Error(
      "[PettyUI] Tabs parts must be used inside <Tabs>.\n" +
        "  Fix: Wrap Tabs.List, Tabs.Tab, and Tabs.Panel inside <Tabs>.",
    );
  }
  return ctx;
}

export const TabsContextProvider = TabsContext.Provider;
