import { createContext, createSignal, useContext } from "solid-js";
import { SNAPSHOT_KEYS, snapshotKeys } from "../internals/observability/snapshot.jsx";

/**
 * Public api returned by {@link createAvatar}. Exposes the live
 * image-loading status and the setter that `<Avatar.Image>` calls from its
 * `load` / `error` handlers.
 */

const AvatarContext = createContext(null);

/**
 * Read the nearest {@link AvatarApi} provided by `c.Provider`. Throws if
 * called outside a Provider.
 */
export function useAvatar() {
  const ctx = useContext(AvatarContext);
  if (ctx == null) {
    throw new Error("Base UI: useAvatar() must be called inside a <c.Provider>.");
  }
  return ctx;
}

/**
 * Solid-native headless avatar primitive. Owns the `imageLoadingStatus`
 * signal that consumers (or `<Avatar.Image>`) write into from their
 * `load`/`error` handlers; exposes derived `showFallback` / `isLoaded`
 * accessors for the typical avatar UI flow.
 */
export function createAvatar() {
  // Status writes happen from DOM event handlers (`<img>` load/error),
  // outside any tracking scope — a plain createSignal is correct here.
  const [imageLoadingStatus, setImageLoadingStatus] = createSignal("idle");
  const showFallback = () => imageLoadingStatus() !== "loaded";
  const isLoaded = () => imageLoadingStatus() === "loaded";
  const api = {
    imageLoadingStatus,
    setImageLoadingStatus,
    showFallback,
    isLoaded,
    Provider: props => <AvatarContext value={api}>{props.children}</AvatarContext>
  };
  api[SNAPSHOT_KEYS] = AVATAR_SNAPSHOT_KEYS;
  return api;
}
const AVATAR_SNAPSHOT_KEYS = snapshotKeys("imageLoadingStatus", "showFallback", "isLoaded");
//# sourceMappingURL=create-avatar.jsx.map
