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

interface AvatarContextValue {
  imageLoadingStatus: () => "idle" | "loading" | "loaded" | "error";
  setImageLoadingStatus: (status: "idle" | "loading" | "loaded" | "error") => void;
}

const AvatarContext = createContext<AvatarContextValue>();

/** Returns the Avatar context. Throws if used outside <Avatar>. */
export function useAvatarContext(): AvatarContextValue {
  const context = useContext(AvatarContext);
  if (!context) {
    throw new Error(
      "[PettyUI] Avatar parts must be used within <Avatar>. Fix: Wrap Avatar.Image and Avatar.Fallback inside <Avatar>.",
    );
  }
  return context;
}

export { AvatarContext };
